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

{% block content %}
    {# --- Section Header (Alerte Nouveau Don) --- #}
    <mj-section background-color="#ff9900" padding-bottom="20px">
        <mj-column>
            <mj-text align="center" font-size="28px" color="#ffffff" font-family="Helvetica Neue, Arial" font-weight="bold">
                🚨 NOUVEAU DON ARRIVÉ ! 🚨
            </mj-text>
        </mj-column>
    </mj-section>

    {# --- Section Détails Clés --- #}
    <mj-section background-color="#ffffff" padding-top="20px">
        <mj-column>
            <mj-text font-size="16px" color="#333333" font-family="Helvetica Neue, Arial" padding-bottom="10px">
                Un nouvel acte de générosité a été enregistré. Voici les détails :
            </mj-text>

            {# Montant du Don (Mis en évidence) #}
            <mj-text font-size="20px" font-weight="bold" color="#ff9900" font-family="Helvetica Neue, Arial" align="center">
                Montant : {{ datas.don.amount|format_currency('EUR', locale='fr') }}
            </mj-text>

            <mj-divider border-color="#e0e0e0" border-width="1px" padding="10px 20px"></mj-divider>

            {# Informations du Donateur #}
            <mj-table font-size="15px" color="#555555" font-family="Helvetica Neue, Arial" padding-top="10px">
                <tr>
                    <td style="width: 150px; padding-bottom: 5px; font-weight: bold;">Donateur :</td>
                    <td style="padding-bottom: 5px;">{% if datas.don.name %}{{ datas.don.name }}{% else %}Anonyme / Non spécifié{% endif %}</td>
                </tr>
                <tr>
                    <td style="width: 150px; padding-bottom: 5px; font-weight: bold;">E-mail :</td>
                    <td style="padding-bottom: 5px; color: #4f46e5;">{{ datas.don.email }}</td>
                </tr>
            </mj-table>

            {# Message facultatif #}
            {% if datas.don.message %}
                <mj-text font-size="16px" font-weight="bold" color="#333333" font-family="Helvetica Neue, Arial" padding-top="20px">
                    Message laissé par le donateur :
                </mj-text>
                <mj-text font-size="15px" color="#555555" font-family="Helvetica Neue, Arial" border="1px solid #e0e0e0" padding="10px" background-color="#fafafa" border-radius="4px">
                    "{{ datas.don.message }}"
                </mj-text>
            {% endif %}
        </mj-column>
    </mj-section>
{% endblock %}
