{% extends "authentication/email/base_email.html" %}

{% block content %}
<table width="100%" cellpadding="0" cellspacing="0">
  <tr>
    <td style="padding: 48px 0 32px 0; text-align:center;">
      <div style="display:inline-block; width:72px; height:72px; background:linear-gradient(135deg, #F5A623, #FDB835); border-radius:50%; line-height:72px; text-align:center; font-size:28px; margin-bottom:24px;">
        🔑
      </div>
      <h1 style="font-family:'Playfair Display','Georgia',serif; font-size:30px; font-weight:700; color:#1A4D3C; line-height:1.2; margin-bottom:12px;">
        Reset Your Password
      </h1>
      <p style="font-family:'Inter',Arial,sans-serif; font-size:16px; color:#555; line-height:1.6;">
        We received a request to reset the password for your Fashionistar account.
      </p>
    </td>
  </tr>

  <!-- CTA Button -->
  <tr>
    <td style="padding: 0 0 32px 0; text-align:center;">
      <table width="100%" cellpadding="0" cellspacing="0">
        <tr>
          <td style="background: linear-gradient(135deg, #1A4D3C 0%, #0D3327 100%); border-radius:16px; padding: 40px; text-align:center;">
            <p style="font-family:'Inter',Arial,sans-serif; font-size:14px; color:rgba(255,255,255,0.75); line-height:1.7; margin-bottom:28px; max-width:380px; margin-left:auto; margin-right:auto;">
              Click the secure button below to choose a new password.
              This link expires in <strong style="color:#F5A623;">15 minutes</strong>.
            </p>
            <a href="{{ reset_url }}"
               style="display:inline-block; padding:16px 48px; background:linear-gradient(135deg, #F5A623, #FDB835); color:#1A1A1A; font-family:'Inter',Arial,sans-serif; font-size:15px; font-weight:700; border-radius:50px; text-decoration:none; letter-spacing:0.5px; box-shadow: 0 4px 20px rgba(245,166,35,0.4);">
              Reset Password →
            </a>
            <p style="font-family:'Inter',Arial,sans-serif; font-size:11px; color:rgba(255,255,255,0.4); margin-top:20px;">
              Or copy this link: {{ reset_url }}
            </p>
          </td>
        </tr>
      </table>
    </td>
  </tr>

  <!-- Didn't request notice -->
  <tr>
    <td style="padding: 0 0 40px 0;">
      <table width="100%" cellpadding="0" cellspacing="0" style="background:#FFF8EC; border:1px solid #F5A623; border-radius:12px;">
        <tr>
          <td style="padding: 20px 24px;">
            <p style="font-family:'Inter',Arial,sans-serif; font-size:13px; color:#666; line-height:1.7;">
              ⚠️ <strong style="color:#1A4D3C;">Didn't request a password reset?</strong><br>
              You can safely ignore this email. Your password will not be changed unless you click the link above.
              If you're concerned, <a href="{{ SITE_URL }}/support/" style="color:#F5A623; font-weight:600;">contact our support team</a>.
            </p>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>
{% endblock %}