Rétractation en ligne

{%- comment -%}
  Section NAHNAH AI : formulaire de rétractation en ligne
  (« fonction de rétractation », directive (UE) 2023/2673, en vigueur depuis le 19 juin 2026).
  Utilise le formulaire de contact Shopify : la demande arrive par e-mail au marchand,
  qui doit envoyer un accusé de réception au client sur un support durable (e-mail).
{%- endcomment -%}
{{ 'nahnah-sections.css' | asset_url | stylesheet_tag }}

<div class="nahnah-retractation color-{{ section.settings.color_scheme }} gradient">
  <div class="page-width page-width--narrow nahnah-retractation__contenu">
    <h1 class="h1">{{ section.settings.titre | default: page.title | escape }}</h1>
    {%- if section.settings.intro != blank -%}
      <div class="rte">{{ section.settings.intro }}</div>
    {%- endif -%}

    {%- form 'contact', id: 'NahnahRetractation' -%}
      {%- if form.posted_successfully? -%}
        <p class="form-status form-status-list form__message" role="status">{{ 'nahnah.retractation.succes' | t }}</p>
      {%- elsif form.errors -%}
        <div class="form__message" role="alert">{{ form.errors | default_errors }}</div>
      {%- endif -%}

      <input type="hidden" name="contact[sujet]" value="Rétractation">
      <div class="field">
        <input class="field__input" type="text" id="Retractation-nom" name="contact[name]" autocomplete="name" placeholder="{{ 'nahnah.retractation.nom' | t }}" required>
        <label class="field__label" for="Retractation-nom">{{ 'nahnah.retractation.nom' | t }}</label>
      </div>
      <div class="field">
        <input class="field__input" type="email" id="Retractation-email" name="contact[email]" autocomplete="email" placeholder="{{ 'nahnah.retractation.email' | t }}" required>
        <label class="field__label" for="Retractation-email">{{ 'nahnah.retractation.email' | t }}</label>
      </div>
      <div class="field">
        <input class="field__input" type="text" id="Retractation-commande" name="contact[numero_commande]" placeholder="{{ 'nahnah.retractation.commande' | t }}" required>
        <label class="field__label" for="Retractation-commande">{{ 'nahnah.retractation.commande' | t }}</label>
      </div>
      <div class="field">
        <textarea class="field__input text-area" id="Retractation-articles" name="contact[body]" rows="4" placeholder="{{ 'nahnah.retractation.articles' | t }}"></textarea>
        <label class="field__label" for="Retractation-articles">{{ 'nahnah.retractation.articles' | t }}</label>
      </div>
      <button type="submit" class="button button--primary">{{ 'nahnah.retractation.bouton' | t }}</button>
    {%- endform -%}
  </div>
</div>

{% schema %}
{
  "name": "Rétractation en ligne",
  "tag": "section",
  "class": "section",
  "enabled_on": { "templates": ["page"] },
  "settings": [
    { "type": "text", "id": "titre", "label": "Titre (vide = titre de la page)" },
    {
      "type": "richtext",
      "id": "intro",
      "label": "Introduction",
      "default": "<p>Vous disposez de 14 jours à compter de la réception de votre commande pour vous rétracter. Remplissez ce formulaire : un accusé de réception vous sera envoyé par e-mail.</p>"
    },
    { "type": "color_scheme", "id": "color_scheme", "label": "Couleurs", "default": "scheme-1" }
  ],
  "presets": [{ "name": "Rétractation en ligne" }]
}
{% endschema %}