<%- include('../../template_parts/head')%>

<body>

  <!-- ---------------------------------- -->
  <!-- HEADER -->
  <!-- ---------------------------------- -->
  <%- include('../../template_parts/header_tunnel')%>



  <main>

    <article>

      <!-- TITRE DE LA PAGE -->
      <%- include('../template_parts/envoie_message_titrepage')%>
      

      <!-- AFFICHAGE DES MESSAGES ERREURS RETOUR DE POST FORMULAIRE -->
      <% if (locals.affiche_err_1) { %>
        <div class="erreur">
          <p><%= affiche_err_1 %></p>
        </div>
      <% }; %>
      
      <!-- ---------------------------------- -->
      <!-- FORMULAIRE de don -->
      <!-- ---------------------------------- -->

      <form action="" method="post" class="form_don">

        <h2>Formulaire de contact :</h2>
        
        <section class="formulaire">

            <div class="input_box input_text input_box_gris">
              <label for="nom">Nom*</label>
              <input type="text" name="nom" id="nom" value="<% if (locals.nom) { %><%= nom %><% }; %>" required>
            </div>
            <div class="input_box input_text input_box_gris">
              <label for="prenom">Prénom*</label>
              <input type="text" name="prenom" id="prenom" required>
            </div>

            <div class="input_box input_text input_box_gris">
              <label for="mail">Adresse mail*</label>
              <input type="text" name="mail" id="mail" value="<% if (locals.mail) { %><%= mail %><% }; %>" required>
            </div>

            <section class="commentaire">
              <div class="input_box input_text input_box_gris">
                  <label class="labeltextarea" for="commentaire">Votre message*</label>
                  <textarea class="textarea_commentaire" id="commentaire" name="commentaire"rows="10" cols="40" required></textarea>
              </div>
          </section>

          <div class="space30"></div>

          <!-- CAPTCHA V3 -->
          <input type="hidden" id="g-recaptcha-response" name="g-recaptcha-response">
          
          <div class="space30"></div>

        </section>
        
        


        <!-- ---------------------------------- -->
        <!-- CLIQUEZ SUR BOUTON ADHÉRER -->
        <!-- ---------------------------------- -->

        <button type="submit" class="button_icone">
          <span class="btn_icone">+</span><span class="btn_texte">ENVOYER</span>
        </button>

      </form>

      <!-- ------------------------- -->
      <!-- Explication aux visiteurs -->
      <!-- ------------------------- -->

      <section class="savoirplus_accueil">

        <div id="savoirplus_button" class="savoirplus_button">
          <p>En savoir plus sur ce formulaire</p>
        </div>

      
        <div id="savoirplus_content" class="savoirplus_content hidden">
          <p>Cette page va vous permettre d'envoyer un message à l'Association Française pour la Pédagogie Suzuki.</p>
          <br>
          <p><span class="gras">UTILISATION DES DONNÉES PERSONNELLES</span></span></p>
          <p>Les informations recueillies dans le formulaire seront conservées par l'Association. Elles serviront uniquement à vous répondre.</p>
          <p>L'association ne transmettra jamais les informations à une autre personne ou organisme.</p>
          <p>Contacter l'Association pour toutes questions sur vos données : mise à jour, suppression.</p>
          <br>
          <p><span class="gras">COOKIE</span></span></p>
          <p>Ce site utilise 1 cookie qui servira pour garder votre session ouverte sur votre navigateur le temps de remplir le formulaire et de passer par la page paiement et la page finale.</p>
          <p>Ce cookie servira uniquement à des fins de navigation durant la même session, et ne sera en aucune manière transmis à un organisme tiers. Le cookie de session est automatiquement détruit par le navigateur lors de la fermeture de la page.</p>
          <p>Si vous n'acceptez pas ce cookie vous ne pourrez pas vous inscrire via ce formulaire car le processus ne fonctionnera pas. Vous pouvez dans ce cas simplement fermer la page et il partira.</p>
        </div>


      </section>



    </article>

  </main>



  <!-- ---------------------------------- -->
  <!-- FOOTER -->
  <!-- ---------------------------------- -->
  <%- include('../../template_parts/footer')%>

</body>
  <!-- JAVASCRIPT d'EXECUTION -->

  <script src="/public/js/adhesion/hidden_visible.js"></script>

  <!-- CAPTCHA V3 -->
  <script>
    grecaptcha.ready(function() {
        grecaptcha.execute('6Lc-4BYqAAAAAAq5HvfawQX8OjGlJ1NHdrYlK50B', {action: 'submit'}).then(function(token_captcha) {
            document.getElementById('g-recaptcha-response').value = token_captcha;
        });
    });
</script>


</html>