@component('emails.layout', ['subject' => 'Confirma tu correo en Fermenty', 'preview' => 'Un último paso: confirma tu correo y empieza a fermentar.'])
    <h1 style="margin:0 0 12px;font-family:'Comfortaa','Segoe UI',sans-serif;font-size:22px;color:#1B241D;">¡Bienvenido a Fermenty, {{ $user->name }}! 🫧</h1>
    <p style="margin:0 0 16px;">
        Nos alegra tenerte. Solo queda un pequeño paso para dejar tu cuenta lista: <strong>confirma que este correo es tuyo</strong> pulsando el botón de abajo.
    </p>

    <p style="margin:0 0 24px;text-align:center;">
        <a href="{{ $verifyUrl }}"
           style="display:inline-block;padding:14px 28px;background:#4B7A50;color:#FCFBF7;text-decoration:none;border-radius:999px;font-weight:700;font-size:15px;">
            Confirmar mi correo
        </a>
    </p>

    <p style="margin:0 0 16px;color:#56625A;font-size:14px;">
        ¿El botón no funciona? Copia y pega esta dirección en tu navegador:<br>
        <a href="{{ $verifyUrl }}" style="color:#4B7A50;word-break:break-all;">{{ $verifyUrl }}</a>
    </p>

    <p style="margin:0;color:#56625A;font-size:14px;">
        Si no creaste ninguna cuenta en Fermenty, puedes ignorar este correo sin problema.
    </p>
@endcomponent