{% extends 'mails/base.twig' %}

{% block content %}
    <mj-section background-color="#ffffff" padding="40px 20px" border-radius="20px">
        <mj-column>
            {# En-tête de rappel J-3 #}
            <mj-text font-size="22px" font-weight="bold" color="#27ae60" align="center">
                ✨ J-3 : Votre événement approche !
            </mj-text>

            <mj-divider border-width="2px" border-color="#27ae60" width="50px" />

            <mj-text font-size="14px" color="#555555" padding-top="20px">
                Bonjour {{ datas.customer.name }} {{ datas.customer.surname }},
            </mj-text>

            <mj-text font-size="14px" color="#555555" line-height="22px">
                Nous sommes ravis de vous accompagner pour votre événement du <strong>{{ datas.contrat.dateStart|date('d/m/Y') }}</strong> (Contrat n°{{ datas.contrat.numReservation }}). Nos équipes préparent actuellement votre matériel.
            </mj-text>

            {% if data.isSolde == false%}
            {# Bloc Attention Solde #}
            <mj-section background-color="#fff9f0" border="1px solid #f39c12" border-radius="10px" padding="15px">
                <mj-column>
                    <mj-text font-size="16px" color="#d35400" font-weight="bold" align="center">
                        ⚠️ Point sur votre règlement
                    </mj-text>
                    <mj-text font-size="14px" color="#555555" line-height="20px">
                        À ce jour, le solde de votre réservation n'est pas encore réglé.
                    </mj-text>
                    <mj-text font-size="14px" color="#555555" font-weight="bold" line-height="20px">
                        Deux options s'offrent à vous :
                    </mj-text>
                    <mj-text font-size="13px" color="#555555">
                        1. <strong>Payer dès maintenant :</strong> Gagnez du temps le jour J en réglant par carte bancaire depuis votre espace client.
                        <br>
                        2. <strong>Payer à la livraison :</strong> Si le solde n'est pas réglé d'ici là, notre livreur vous demandera le paiement directement sur place (le jour même).
                    </mj-text>
                </mj-column>
            </mj-section>
            {% endif %}

            {# Bouton Espace Client #}
            <mj-button background-color="#2c3e50" color="white" href="https://reservation.ludikevent.fr" font-family="Helvetica" padding-top="25px">
                Accéder à mon espace client
            </mj-button>

            <mj-divider border-color="#f4f4f4" padding-top="20px" />

            {# Récapitulatif #}
            <mj-text font-size="15px" color="#333333">
                <strong>Reste à régler :</strong> {{ datas.contrat|resteAPayer }} €
            </mj-text>

            <mj-text font-size="12px" color="#999999" padding-top="30px" align="center">
                À très vite pour un moment inoubliable ! L'équipe reste à votre disposition pour toute question.
            </mj-text>
        </mj-column>
    </mj-section>


{% endblock %}
