@extends('layouts.app', ['title' => 'Verificacion 2FA'])

@section('content')
<div class="card" style="max-width:440px;margin:60px auto;text-align:center;padding:30px">
    <i class="fa-solid fa-shield-halved text-gold" style="font-size:48px"></i>
    <h2 style="font-family:var(--display);margin:16px 0 6px">Verificacion en dos pasos</h2>
    <div class="sub" style="margin-bottom:18px">Ingresa el codigo de 6 digitos de tu app autenticadora o un codigo de recuperacion.</div>
    @if($errors->any())<div class="alert bad"><i class="fa-solid fa-triangle-exclamation"></i><span>{{ $errors->first() }}</span></div>@endif
    <form method="post" action="{{ route('2fa.verify') }}">
        @csrf
        <input name="code" placeholder="123456" inputmode="numeric" maxlength="9" autofocus autocomplete="one-time-code" required style="text-align:center;letter-spacing:.2em;font-size:18px;font-weight:600;font-family:var(--mono)">
        <button class="btn btn-primary" type="submit" style="margin-top:14px;width:100%"><i class="fa-solid fa-check"></i>Verificar</button>
    </form>
</div>
@endsection