{% extends "base.html" %}

{% block title %}{{ t.auth_magic_title }} - {{ config.APP_NAME }}{% endblock %}

{% block content %}
<main class="container-page py-12">
  <div class="card max-w-sm mx-auto mt-8 text-center">
    <h1 class="text-2xl mb-4">{{ t.auth_magic_title }}</h1>

    <p class="text-slate-dark">{{ t.auth_magic_sent_to }}</p>
    <p class="font-semibold text-navy my-2">{{ email }}</p>

    <p class="text-slate text-sm">{{ t.auth_magic_instructions.replace('{minutes}', config.MAGIC_LINK_EXPIRY_MINUTES | string) }}</p>

    <hr>

    <details class="text-left">
      <summary class="cursor-pointer text-sm font-medium text-navy">{{ t.auth_magic_no_email }}</summary>
      <ul class="list-disc pl-6 mt-2 space-y-1 text-sm text-slate-dark">
        <li>{{ t.auth_magic_check_spam }}</li>
        <li>{{ t.auth_magic_correct_email }}</li>
        <li>{{ t.auth_magic_wait }}</li>
      </ul>

      <form method="post" action="{{ url_for('auth.resend') }}" class="mt-4">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <input type="hidden" name="email" value="{{ email }}">
        <button type="submit" class="btn-outline w-full">{{ t.auth_magic_resend_btn }}</button>
      </form>
    </details>
  </div>
</main>
{% endblock %}
