{% extends "base.html.twig" %}

{% block title %}Nous contacter | La Tour{% endblock %}

{% block body %}
    <main role="main">
        <section class="contact">
            <div class="container">
                {% for message in app.flashes('success') %}
                    <div class="alert alert-success" role="alert">
                        <p class="title">Succès</p>
                        <p class="message">{{ message }}</p>
                    </div>
                {% endfor %}
                <div class="row align-center">
                    <div class="col-5">
                        <div class="title green">
                            <div class="picto">
                                <img src="{{ asset('images/icons/enveloppe.svg') }}" alt="Pictogramme enveloppe">
                            </div>
                            <h2>Nous contacter</h2>
                        </div>

                        <div data-controller="refractPhoneNumber">
                            {{ form_start(form) }}
                                <div class="form-group-check">
                                    <div class="form-check">
                                        {{ form_widget(form.subject[0], { attr: {class: 'form-check-input'} }) }}
                                        {{ form_label(form.subject[0]) }}
                                    </div>
                                    <div class="form-check">
                                        {{ form_widget(form.subject[1], { attr: {class: 'form-check-input'} }) }}
                                        {{ form_label(form.subject[1]) }}
                                    </div>
                                    <div class="form-check">
                                        {{ form_widget(form.subject[2], { attr: {class: 'form-check-input'} }) }}
                                        {{ form_label(form.subject[2]) }}
                                    </div>
                                </div>

                                {{ form_row(form.firstname) }}
                                {{ form_row(form.lastname) }}
                                {{ form_row(form.email) }}
                                {{ form_row(form.phone) }}
                                {{ form_row(form.message) }}
                                
                                <button type="submit" class="btn btn-purple">Envoyer</button>
                            {{ form_end(form) }}
                        </div>
                    </div>

                    <div class="col-7">
                        <img src="{{ asset('images/carte-la-tour.jpg') }}" class="map" alt="Google Map La Tour">
                    </div>
                </div>
            </div>
        </section>
    </main>
{% endblock %}