{{define "title"}}Two-Factor Authentication{{end}}
{{define "content"}}
<div class="flex items-center justify-center min-h-screen -mt-6">
  <div style="width:22rem">
    <div class="text-center mb-8">
      <div class="text-2xl font-bold text-white">mailgosend</div>
      <div class="text-gray-400 text-sm mt-1">Admin — Two-Factor Authentication</div>
    </div>
    <div class="card">
      {{if .Error}}<div class="alert alert-error mb-4">{{.Error}}</div>{{end}}
      {{if .Flash}}<div class="alert alert-success mb-4">{{.Flash}}</div>{{end}}
      <p style="color:#9ca3af;font-size:.8125rem;margin-bottom:1.25rem">
        Enter the 6-digit code from your authenticator app, or an 8-character backup code.
      </p>
      <form method="POST" action="/admin/login/mfa" autocomplete="off">
        <div class="field">
          <label for="code">Authentication Code</label>
          <input type="text" id="code" name="code" required
                 minlength="6" maxlength="64" autofocus
                 autocomplete="one-time-code" inputmode="numeric"
                 placeholder="000000"
                 style="letter-spacing:.15em;text-align:center;font-size:1.25rem">
        </div>
        <button type="submit" class="btn btn-primary mt-2" style="width:100%">Verify</button>
      </form>
      <div class="text-center mt-4">
        <a href="/admin/login" style="font-size:.8rem;color:#4b5563">Back to login</a>
      </div>
    </div>
  </div>
</div>
{{end}}