<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Bienvenido a WEBMoney</title>
    <!--[if mso]>
    <style type="text/css">
        body, table, td {font-family: Arial, Helvetica, sans-serif !important;}
    </style>
    <![endif]-->
</head>
<body style="margin: 0; padding: 0; background-color: #f4f4f4; font-family: Arial, Helvetica, sans-serif;">
    <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="background-color: #f4f4f4;">
        <tr>
            <td style="padding: 20px 0;">
                <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="600" style="margin: 0 auto; background-color: #ffffff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
                    <!-- Header -->
                    <tr>
                        <td style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 40px 30px; text-align: center; border-radius: 8px 8px 0 0;">
                            <h1 style="margin: 0; color: #ffffff; font-size: 28px; font-weight: 700;">
                                🎉 ¡Bienvenido a WEBMoney!
                            </h1>
                        </td>
                    </tr>

                    <!-- Content -->
                    <tr>
                        <td style="padding: 40px 30px;">
                            <p style="margin: 0 0 20px; color: #333333; font-size: 16px; line-height: 1.6;">
                                Hola <strong>{{ $userName }}</strong>,
                            </p>

                            <p style="margin: 0 0 20px; color: #555555; font-size: 16px; line-height: 1.6;">
                                ¡Gracias por registrarte en <strong>WEBMoney</strong>! Tu cuenta ha sido creada exitosamente y ya puedes comenzar a gestionar tus finanzas personales de manera fácil y segura.
                            </p>

                            <div style="background-color: #f8f9fa; border-left: 4px solid #667eea; padding: 20px; margin: 30px 0; border-radius: 4px;">
                                <p style="margin: 0 0 10px; color: #333333; font-size: 14px; font-weight: 600;">
                                    📧 Cuenta registrada:
                                </p>
                                <p style="margin: 0; color: #667eea; font-size: 16px; font-weight: 700;">
                                    {{ $userEmail }}
                                </p>
                            </div>

                            <h3 style="margin: 30px 0 15px; color: #333333; font-size: 18px; font-weight: 600;">
                                ¿Qué puedes hacer ahora?
                            </h3>

                            <ul style="margin: 0 0 30px; padding-left: 20px; color: #555555; font-size: 15px; line-height: 1.8;">
                                <li>📊 Registrar tus ingresos y gastos</li>
                                <li>📈 Visualizar reportes y gráficos</li>
                                <li>💰 Gestionar tu presupuesto mensual</li>
                                <li>📄 Exportar datos en múltiples formatos</li>
                            </ul>

                            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: 30px 0;">
                                <tr>
                                    <td style="text-align: center;">
                                        <a href="https://webmoney.cnxifly.com/login" style="display: inline-block; padding: 15px 40px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #ffffff; text-decoration: none; border-radius: 6px; font-size: 16px; font-weight: 600;">
                                            Iniciar Sesión Ahora
                                        </a>
                                    </td>
                                </tr>
                            </table>

                            <p style="margin: 30px 0 10px; color: #666666; font-size: 14px; line-height: 1.6;">
                                Si tienes alguna pregunta o necesitas ayuda, no dudes en contactarnos respondiendo a este email.
                            </p>

                            <p style="margin: 0; color: #666666; font-size: 14px; line-height: 1.6;">
                                ¡Gracias por confiar en nosotros!
                            </p>
                        </td>
                    </tr>

                    <!-- Footer -->
                    <tr>
                        <td style="background-color: #f8f9fa; padding: 30px; text-align: center; border-radius: 0 0 8px 8px;">
                            <p style="margin: 0 0 10px; color: #666666; font-size: 14px;">
                                <strong>WEBMoney</strong> - Tu gestor financiero personal
                            </p>
                            <p style="margin: 0 0 15px; color: #999999; font-size: 12px;">
                                ConneXiFly · webmoney.cnxifly.com
                            </p>
                            <p style="margin: 0; color: #999999; font-size: 11px;">
                                Este es un correo automático. Por favor, no respondas directamente a este mensaje.
                                <br>
                                Para soporte, escríbenos a: <a href="mailto:support@cnxifly.com" style="color: #667eea; text-decoration: none;">support@cnxifly.com</a>
                            </p>
                        </td>
                    </tr>
                </table>

                <!-- Email Footer (outside box) -->
                <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="600" style="margin: 20px auto 0;">
                    <tr>
                        <td style="text-align: center; padding: 20px;">
                            <p style="margin: 0; color: #999999; font-size: 11px; line-height: 1.6;">
                                © 2025 ConneXiFly. Todos los derechos reservados.
                                <br>
                                Si no solicitaste esta cuenta, ignora este correo.
                            </p>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>
