{% extends "base.html" %}{% block title %}2FA{% endblock %}
{% block content %}<div class="card" style="max-width:400px;margin:3rem auto">
<div class="card-header"><h2> Weryfikacja dwuskładnikowa</h2></div>
<form method="POST"><input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
 <p class="text-muted" style="margin-bottom:1rem">Wpisz 6-cyfrowy kod z aplikacji 2FA (Google Authenticator, Authy).</p>
 <input name="code" placeholder="000000" maxlength="6" pattern="[0-9]{6}" style="width:100%;padding:0.5rem;margin-bottom:0.5rem;background:#0d1117;border:1px solid var(--border);color:#fff;border-radius:var(--radius-sm);font-size:1.2rem;text-align:center;letter-spacing:0.3em" autofocus>
 <label style="display:flex;align-items:center;gap:0.5rem;font-size:0.85rem;color:var(--muted);margin-bottom:0.75rem"><input type="checkbox" name="trust_device" value="1"> Zapamiętaj to urządzenie (30 dni)</label>
 <button class="btn btn-primary" style="width:100%">Zweryfikuj</button>
</form>
<hr style="margin:1rem 0;border-color:var(--border)">
<details style="font-size:0.82rem;color:var(--muted)">
 <summary style="cursor:pointer;margin-bottom:0.5rem"> Użyj kodu zapasowego</summary>
 <form method="POST"><input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
 <input name="recovery" placeholder="Kod zapasowy (10 znaków)" style="width:100%;padding:0.5rem;margin-bottom:0.5rem;background:#0d1117;border:1px solid var(--border);color:#fff;border-radius:var(--radius-sm);font-family:monospace;text-transform:uppercase">
 <button class="btn btn-sm" style="width:100%">Użyj kodu zapasowego</button>
 </form>
</details>
</div>{% endblock %}