@extends('layouts.guest')

@section('title', 'Подтверждение почты — Placeo')

@section('content')
    <h1 class="mb-2 text-xl font-bold">Подтвердите почту</h1>
    <p class="mb-6 text-sm text-muted">Мы отправили код на <b>{{ $email }}</b>. Введите его ниже.</p>

    @if (session('status'))
        <div class="mb-4 rounded-lg bg-brand-50 px-4 py-3 text-sm text-brand-800">{{ session('status') }}</div>
    @endif

    @if ($errors->any())
        <div class="mb-4 rounded-lg bg-red-50 px-4 py-3 text-sm text-red-700">{{ $errors->first() }}</div>
    @endif

    <form method="POST" action="{{ route('verification.code.verify') }}" class="space-y-4">
        @csrf
        <input type="hidden" name="email" value="{{ $email }}">
        <div>
            <label class="mb-1 block text-sm font-medium text-gray-700">Код из письма</label>
            <input type="text" name="code" inputmode="numeric" autocomplete="one-time-code" maxlength="6" required autofocus
                   class="input text-center text-2xl tracking-[0.5em]" placeholder="000000">
        </div>
        <button type="submit" class="btn-brand w-full">Подтвердить</button>
    </form>

    <form method="POST" action="{{ route('verification.code.resend') }}" class="mt-4 text-center">
        @csrf
        <input type="hidden" name="email" value="{{ $email }}">
        <button type="submit" class="text-sm font-medium text-brand-600 hover:underline">Отправить код повторно</button>
    </form>
@endsection

@section('below')
    Указали не ту почту? <a href="{{ route('register') }}" class="font-medium text-brand-600 hover:underline">Начать заново</a>
@endsection