{# base.twig - Modèle d'e-mail MJML #}
<mjml>
    <mj-head>
        <mj-title>{{ system.subject }}</mj-title>
        <mj-attributes>
            <mj-all font-family="Inter, Helvetica, Arial, sans-serif"></mj-all>
            <mj-text font-size="16px" line-height="24px" color="#333333"></mj-text>
            <mj-button background-color="#4A90E2" color="#ffffff" border-radius="4px" font-size="16px" padding="10px 25px"></mj-button>
        </mj-attributes>
        <mj-style inline="inline">
            .link-style {
            color: #4A90E2;
            text-decoration: none;
            }
            .footer-text {
            font-size: 12px;
            color: #888888;
            }
        </mj-style>
    </mj-head>
    <mj-body background-color="#F2F2F2">
        {# Section d'en-tête #}
        <mj-section background-color="#ffffff" padding-bottom="0px">
            <mj-column>
                {# Logo mis à jour pour SARL SITECONSEIL #}
                <mj-image src="{{ system.path }}{{ asset('assets/images/logo.jpg') }}" alt="Logo E-COSPLAY" align="center" width="150px" padding-bottom="20px"></mj-image>
            </mj-column>
        </mj-section>

        {# Section de contenu #}
        <mj-section background-color="#ffffff" padding-top="0px" padding-bottom="0px">
            {# Titre dynamique ajouté avant le bloc de contenu, directement dans la section #}
            <mj-text font-size="20px" font-weight="bold" align="center" padding-bottom="20px">{{ system.subject }}</mj-text>
            <mj-column width="100%">
                {% block content %}
                {% endblock %}
            </mj-column>
        </mj-section>

        {# Section d'espacement #}
        <mj-section background-color="#ffffff" padding-top="0px" padding-bottom="20px">
            <mj-column>
                <mj-spacer height="20px"></mj-spacer>
            </mj-column>
        </mj-section>

        {# Section de pied de page #}
        <mj-section background-color="#F2F2F2" padding-top="20px" padding-bottom="20px">
            <mj-column>
                <mj-text align="center" css-class="footer-text">
                    &copy; {{ "now"|date("Y") }} E-COSPLAY. Tous droits réservés.
                </mj-text>
                <mj-text align="center" css-class="footer-text" padding-top="10px">
                    E-COSPLAY, 42 rue de saint-quentin, 02800 Beautor, France
                    <br/>
                    Association loi 1901 à but non lucratif. - RNA N°W022006988

                </mj-text>
                <mj-social font-size="15px" icon-size="24px" mode="horizontal" padding-top="10px">
                    <mj-social-element name="facebook" href="https://www.facebook.com/assocationecosplay/" background-color="#3B5998"></mj-social-element>
                    <mj-social-element name="instagram" href="https://www.instagram.com/asso_ecosplay/" background-color="#0077B5"></mj-social-element>
                </mj-social>
            </mj-column>
        </mj-section>
    </mj-body>
</mjml>
