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

{% block content %}
    <mj-section>
        <mj-column background-color="#ffffff" border-radius="24px" padding="40px" css-class="shadow">

            <mj-image width="64px" src="https://cdn-icons-png.flaticon.com/512/1162/1162235.png" padding-bottom="20px"></mj-image>

            <mj-text align="center" font-size="24px" font-weight="900" color="#1e293b" text-transform="uppercase" letter-spacing="1px">
                Sécurisez votre accès
            </mj-text>

            <mj-text align="center" color="#64748b" font-size="14px">
                Bonjour {{ datas.account.firstName }},<br/><br/>
                Pour protéger les données de <strong>Ludikevent</strong>, nous vous invitons à activer l'authentification à deux facteurs (2FA).
            </mj-text>

            <mj-button background-color="#4f46e5" color="#ffffff" border-radius="12px" font-weight="900" font-size="13px" padding-top="30px" inner-padding="16px 32px" href="{{ datas.setup_url }}" text-transform="uppercase" letter-spacing="1px">
                Configurer mon 2FA
            </mj-button>

            <mj-divider border-width="1px" border-color="#f1f5f9" padding="30px 0"></mj-divider>

            {# --- AJOUT DE L'AUTEUR DE L'ACTION --- #}
            <mj-text align="center" font-size="12px" color="#64748b" padding-bottom="10px">
                Cette invitation a été générée par l'administrateur :<br/>
                <span style="color: #4f46e5; font-weight: bold;">{{ datas.who.firstName }} {{ datas.who.name }}</span>
            </mj-text>

            <mj-text align="center" font-size="11px" color="#94a3b8">
                Ce lien est temporaire et expirera à <strong>{{ datas.expires_at }}</strong>.<br/>
                Une fois cliqué, vous devrez scanner un QR Code avec votre application (Google Authenticator ou FreeOTP).
            </mj-text>

        </mj-column>
    </mj-section>
{% endblock %}
