{% extends 'base.html.twig' %}
{% block title %}{{ setting.siteName }} : contactez-nous{% endblock %}
{% block body %}
<section class="container py-5">
<div class="row pt-3">
<div class="col">
{# Breadcrumbs #}
<div class="row">
<div class="col small">
<nav style="--bs-breadcrumb-divider: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill='%236c757d'/%3E%3C/svg%3E");"
aria-label="breadcrumb">
<ol class="breadcrumb small">
<li class="breadcrumb-item"><a href="{{ path('app_home') }}"
class="text-decoration-none text-dark">Accueil</a></li>
<li class="breadcrumb-item active" aria-current="page">Contact</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
<div class="row d-flex justify-content-center pt-3">
<div class="col-lg-8 col-sm-12">
<h1 class="text-center mb-2 color1 fw-700 text-uppercase" data-aos="fade-down" data-aos-duration="3000">
Contactez-nous
</h1>
<p class="lead pt-5 text-center">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M4 20q-.825 0-1.413-.588T2 18V6q0-.825.588-1.413T4 4h16q.825 0 1.413.588T22 6v12q0 .825-.588 1.413T20 20H4Zm8-7L4 8v10h16V8l-8 5Zm0-2l8-5H4l8 5ZM4 8V6v12V8Z"/></svg>
{{ setting.siteEmail }}
</p>
<p class="lead pb-5 text-center">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="currentColor"><path d="m29.631 12.63l.33 1.47c.05.223.05.444.008.652A1 1 0 0 1 29 16h-2.255l-1.483-1.977v-.002A2.544 2.544 0 0 0 23.22 13H23v-1.69c0-.722-.588-1.31-1.31-1.31h-1.38c-.722 0-1.31.588-1.31 1.31v1.68h-6v-1.68c0-.722-.588-1.31-1.31-1.31h-1.38C9.588 10 9 10.588 9 11.31V13h-.22c-.808 0-1.563.381-2.05 1.03L5.254 16H3a1 1 0 0 1-.969-1.248a1.544 1.544 0 0 1 .008-.652l.32-1.47A7.199 7.199 0 0 1 9.379 7h13.242a7.18 7.18 0 0 1 7.01 5.63Z"/><path d="m24.46 14.62l3.66 4.88A9.366 9.366 0 0 1 30 25.13v3.31c0 .86-.7 1.56-1.56 1.56H3.56C2.7 30 2 29.3 2 28.44v-3.31c0-2.03.66-4.01 1.88-5.63l3.65-4.87c.3-.4.76-.63 1.25-.63h.91c.17 0 .31-.14.31-.31v-2.38c0-.17.14-.31.31-.31h1.38c.17 0 .31.14.31.31v2.38c0 .17.14.31.31.31h7.38c.17 0 .31-.14.31-.31v-2.38c0-.17.14-.31.31-.31h1.38c.17 0 .31.14.31.31v2.38c0 .17.14.31.31.31h.91c.49 0 .95.23 1.24.62ZM13.698 19c.17 0 .311-.14.301-.312v-1.376a.313.313 0 0 0-.311-.312h-1.377c-.17 0-.311.14-.311.312v1.376c0 .171.14.312.322.312h1.376Zm3 0a.3.3 0 0 0 .302-.312v-1.376a.314.314 0 0 0-.312-.312h-1.376a.313.313 0 0 0-.312.312v1.376c0 .171.14.312.322.312h1.376Zm1.623 0h1.377a.3.3 0 0 0 .302-.312v-1.376a.314.314 0 0 0-.312-.312h-1.377c-.17 0-.311.14-.311.312v1.376c0 .171.14.312.322.312Zm-4.623 3c.17 0 .311-.14.301-.312v-1.376a.313.313 0 0 0-.311-.312h-1.377c-.17 0-.311.14-.311.312v1.376c0 .171.14.312.322.312h1.376Zm1.623 0h1.377a.3.3 0 0 0 .302-.312v-1.376a.314.314 0 0 0-.312-.312h-1.376a.313.313 0 0 0-.312.312v1.376c0 .171.14.312.322.312Zm4.377 0a.3.3 0 0 0 .302-.312v-1.376a.314.314 0 0 0-.312-.312h-1.377c-.17 0-.311.14-.311.312v1.376c0 .171.14.312.322.312h1.376Zm-7.377 3h1.377c.17 0 .311-.14.301-.312v-1.376a.313.313 0 0 0-.311-.312h-1.377c-.17 0-.311.14-.311.312v1.376c0 .171.14.312.322.312Zm4.377 0a.3.3 0 0 0 .302-.312v-1.376a.314.314 0 0 0-.312-.312h-1.376a.313.313 0 0 0-.312.312v1.376c0 .171.14.312.322.312h1.376Zm1.623 0h1.377a.3.3 0 0 0 .302-.312v-1.376a.314.314 0 0 0-.312-.312h-1.377c-.17 0-.311.14-.311.312v1.376c0 .171.14.312.322.312Z"/></g></svg>
{{ setting.siteTelephone }}
</p>
<p class="text-center mb-5 contact-info" data-aos="flip-left" data-aos-duration="1500">
Nos études sont ouvertes du lundi au vendredi<br>de 09h00 à 12h30 et de 14h00 à 18h00.
</p>
<p class="text-center small mb-5" data-aos="flip-left" data-aos-duration="1500">
Remplissez le formulaire de contact ci-dessous,<br>
nous reviendrons vers vous dans les meilleurs délais
</p>
{{ form_start(form) }}
{# {% for message in app.flashes('success') %}
<div class="alert alert-success">
{{ message }}
</div>
{% endfor %} #}
{% for message in app.flashes('success') %}
<!-- Button trigger modal -->
{# <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
Launch demo modal
</button> #}
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body pb-5">
<img src="{{ asset('assets/img/logo.webp') }}" alt="Laroche et Associés" class="img-fluid">
<br>
<p class="text-success mt-4">{{ message }}</p>
</div>
</div>
</div>
</div>
{% endfor %}
<div class="bg-danger">
{{ form_errors(form) }}
</div>
<div class="row">
<div class="col-lg-6 col-sm-12 form-group mb-5">
{{ form_row(form.prenom) }}
</div>
<div class="col-lg-6 col-sm-12 form-group mb-5">
{{ form_row(form.nom) }}
</div>
</div>
<div class="row">
<div class="col-lg-6 col-sm-12 form-group mb-5">
{{ form_row(form.email) }}
</div>
<div class="col-lg-6 col-sm-12 form-group mb-5">
{{ form_row(form.telephone) }}
</div>
</div>
{# <div class="row">
<div class="col-lg-6 col-sm-12 form-group mb-5">
{{ form_row(form.objet) }}
</div>
<div class="col-lg-6 col-sm-12 form-group mb-5">
{{ form_row(form.rappel) }}
</div>
</div> #}
<div class="row">
<div class="col form-group mb-5">
{{ form_row(form.message) }}
</div>
</div>
<div class="form-group mb-3 text-center">
<p>Veuillez recopier le code anti-spam :</p>
{{ form_row(form.captcha, {'label': false}) }}
</div>
<div class="row">
<div class="col text-center">
<div class="form-group mb-0">
{{ form_row(form.envoyer) }}
</div>
</div>
</div>
{{ form_end(form) }}
</div>
</div>
<div class="row py-5">
<div class="col mt-5 lh-1">
{{ setting.siteRgpd|raw }}
</div>
</div>
</section>
<script>
let selectform = document.querySelector('.select-color');
selectform.firstElementChild.setAttribute('disabled', true);
selectform.firstElementChild.setAttribute('hidden', true);
</script>
{% endblock %}