<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Reset Your Password</title>
</head>
<body style="font-family: Arial, Helvetica, sans-serif; background-color: #f5f5f5; margin: 0; padding: 20px; color: #333;">
    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="max-width: 560px; margin: 0 auto; background-color: #ffffff; border-radius: 6px;">
        <tr>
            <td style="padding: 32px;">
                <h1 style="font-size: 22px; margin: 0 0 16px;">Reset Your Password</h1>
                <p style="font-size: 15px; line-height: 1.6; margin: 0 0 16px;">Hi {{ user_name }},</p>
                <p style="font-size: 15px; line-height: 1.6; margin: 0 0 24px;">
                    We received a request to reset the password for your account. Click the button below to set a new password:
                </p>
                <p style="text-align: center; margin: 24px 0;">
                    <a href="{{ reset_link }}" target="_blank" rel="noopener noreferrer"
                       style="display: inline-block; background-color: #333; color: #fff; text-decoration: none; padding: 12px 24px; border-radius: 4px; font-size: 15px;">
                        Reset Password
                    </a>
                </p>
                <p style="font-size: 14px; line-height: 1.6; margin: 0 0 16px; color: #555;">
                    If the button doesn't work, copy and paste this link into your browser:<br>
                    <a href="{{ reset_link }}" style="color: #555; word-break: break-all;">{{ reset_link }}</a>
                </p>
                <p style="font-size: 14px; line-height: 1.6; margin: 0 0 16px; color: #555;">
                    This link will expire in 30 minutes.
                </p>
                <p style="font-size: 14px; line-height: 1.6; margin: 0; color: #555;">
                    If you did not request a password reset, you can safely ignore this email.
                </p>
            </td>
        </tr>
        <tr>
            <td style="padding: 16px 32px; font-size: 12px; color: #999; border-top: 1px solid #eee;">
                &copy; {{ current_year }} {{ site_name }}
            </td>
        </tr>
    </table>
</body>
</html>
