<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{% block title %}Association E-Cosplay{% endblock %}</title>
    <!--[if mso]>
    <style type="text/css">
    body, table, td { font-family: Arial, Helvetica, sans-serif !important; }
    </style>
    <![endif]-->
</head>
<body style="margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 0; padding-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; background-color: #f5f5f0; font-family: Arial, Helvetica, sans-serif; color: #111827; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;">
    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 0; padding-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; background-color: #f5f5f0; font-family: Arial, Helvetica, sans-serif; color: #111827; width: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;">
        <tr>
            <td align="center" style="padding-top: 40px; padding-bottom: 40px; padding-left: 16px; padding-right: 16px;">

                <!-- Lien voir en ligne -->
                <table role="presentation" width="580" cellpadding="0" cellspacing="0" border="0" style="max-width: 580px; width: 100%;">
                    <tr>
                        <td align="center" style="padding-bottom: 16px; font-size: 11px; color: #888888; font-weight: 700;">
                            Cet email ne s'affiche pas correctement ? <a href="__VIEW_URL__" style="color: #111827; text-decoration: underline; font-weight: 800;">Voir en ligne</a>
                        </td>
                    </tr>
                </table>

                <!-- Container principal -->
                <table role="presentation" width="580" cellpadding="0" cellspacing="0" border="0" style="max-width: 580px; width: 100%; background-color: #ffffff; border: 3px solid #111827;">

                    <!-- Header gold -->
                    <tr>
                        <td align="center" style="background-color: #fabf04; padding-top: 24px; padding-bottom: 24px; padding-left: 24px; padding-right: 24px; border-bottom: 3px solid #111827;">
                            <img src="https://crm.e-cosplay.fr/logo.jpg" alt="CRM E-Cosplay" width="120" style="display: block; width: 120px; height: auto; border: 0;" />
                        </td>
                    </tr>

                    <!-- Contenu -->
                    <tr>
                        <td style="padding-top: 32px; padding-bottom: 32px; padding-left: 32px; padding-right: 32px; font-size: 14px; mso-line-height-rule: exactly; line-height: 22px; color: #111827;">
                            {% block content %}{% endblock %}
                        </td>
                    </tr>

                    <!-- Footer dark -->
                    <tr>
                        <td align="center" style="background-color: #111827; color: #ffffff; padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; border-top: 3px solid #111827;">
                            &copy; {{ "now"|date("Y") }} Association E-Cosplay
                        </td>
                    </tr>

                </table>

                <!-- Adresse sous le container -->
                <table role="presentation" width="580" cellpadding="0" cellspacing="0" border="0" style="max-width: 580px; width: 100%;">
                    <tr>
                        <td align="center" style="padding-top: 16px; font-size: 10px; color: #999999;">
                            42 rue de Beautor, 02800 Beautor &#8226; <a href="https://www.e-cosplay.fr" style="color: #999999; text-decoration: underline;">e-cosplay.fr</a>
                        </td>
                    </tr>
                </table>

            </td>
        </tr>
    </table>
</body>
</html>
