{% extends 'emails/base.html.twig' %}

{% block email_title %}Un nouveau mot de passe pour Magic{% endblock %}
{% block preheader %}Retrouve ton espace Magic : ton lien de réinitialisation est valable 1 heure.{% endblock %}

{% block email_content %}
<tr><td class="mail-pad" align="center" style="padding:27px 34px 0;">
  <img class="mail-robot" src="{{ email.image('emails/images/magic-robot.png', 'image/png') }}" alt="Le petit robot de Magic te donne un coup de main." width="164" height="164" style="display:block;width:164px;height:164px;margin:0 auto;" />
  <p style="margin:18px 0 11px;font-size:10px;line-height:17px;font-weight:700;letter-spacing:2px;color:#d4a3f4;">UN PETIT COUP DE MAIN</p>
  <h1 class="mail-title" style="margin:0;font-size:32px;line-height:41px;font-weight:700;letter-spacing:-0.6px;text-align:center;color:#f7efff;">Un nouveau mot de passe,<br />et c’est reparti.</h1>
  <p style="margin:14px 0 0;font-size:14px;line-height:23px;text-align:center;color:#c7b3d7;">Un oubli, ça arrive. On t’aide à retrouver ton espace.</p>
</td></tr>
<tr><td class="mail-pad" style="padding:27px 34px 0;">
  <p style="margin:0;font-size:15px;line-height:25px;color:#ecddf8;">Bonjour{% if pseudo|default('') %} <strong style="color:#f2b6e2;">{{ pseudo }}</strong>{% endif %},</p>
  <p style="margin:8px 0 0;font-size:14px;line-height:24px;color:#c7b3d7;">Tu as demandé à réinitialiser ton mot de passe pour accéder à Magic. Choisis-en un nouveau grâce au bouton ci-dessous.</p>
</td></tr>
<tr><td class="mail-pad" style="padding:23px 34px 0;">
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr>
    <td align="center" bgcolor="#a54bd5" style="background-color:#a54bd5;border:1px solid #c37bea;border-radius:13px;mso-padding-alt:16px 14px;">
      <a href="{{ resetUrl }}" style="display:block;padding:16px 14px;border-radius:13px;font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:21px;font-weight:700;text-align:center;text-decoration:none;color:#ffffff;">Choisir mon nouveau mot de passe</a>
    </td>
  </tr></table>
</td></tr>
<tr><td class="mail-pad" style="padding:15px 34px 0;">
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr>
    <td bgcolor="#211330" style="padding:13px 16px;background-color:#211330;border:1px solid #432857;border-left:3px solid #d891e8;border-radius:10px;">
      <p style="margin:0;font-size:12px;line-height:20px;color:#e5d0f3;"><strong>Valable 1 heure.</strong> Ce lien ne peut être utilisé qu’une seule fois.</p>
    </td>
  </tr></table>
</td></tr>
<tr><td class="mail-pad" style="padding:24px 34px 0;">
  <p style="margin:0;font-size:11px;line-height:19px;color:#bba6cc;">Le bouton ne s’ouvre pas ? Copie ce lien dans ton navigateur :</p>
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;table-layout:fixed;margin-top:9px;"><tr><td bgcolor="#10091b" style="padding:12px 14px;background-color:#10091b;border:1px solid #33213f;border-radius:10px;word-wrap:break-word;overflow-wrap:anywhere;word-break:break-all;">
    <a href="{{ resetUrl }}" style="font-family:Arial,Helvetica,sans-serif;font-size:11px;line-height:18px;color:#d3acf1;text-decoration:underline;word-wrap:break-word;overflow-wrap:anywhere;word-break:break-all;">{{ resetUrl }}</a>
  </td></tr></table>
</td></tr>
<tr><td class="mail-pad" style="padding:23px 34px 28px;">
  <p style="margin:0;font-size:12px;line-height:21px;color:#bba6cc;">Tu n’es pas à l’origine de cette demande ? Tu peux ignorer ce message : ton mot de passe reste inchangé.</p>
  <p style="margin:9px 0 0;font-size:11px;line-height:19px;color:#a48db7;">Ce lien est personnel. Garde-le pour toi.</p>
</td></tr>
{% endblock %}