@extends('layouts.auth')

@section('title', 'Verify your email')

@section('content')

    <div class="flex h-12 w-12 items-center justify-center rounded-full bg-brand-50 text-brand-700">
        <svg class="h-6 w-6" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" aria-hidden="true">
            <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.24a2.25 2.25 0 0 1-1.07 1.91l-7.5 4.62a2.25 2.25 0 0 1-2.36 0L3.32 8.9a2.25 2.25 0 0 1-1.07-1.91v-.24" />
        </svg>
    </div>

    <h1 class="mt-6 font-display text-3xl tracking-tight text-slate-900">Verify your email</h1>

    <p class="mt-3 text-sm leading-relaxed text-slate-600">
        We have sent a verification link to
        <strong class="text-slate-900">{{ auth()->user()->email }}</strong>.
        Click the link in that email to activate your account and start your application.
    </p>

    <p class="mt-3 text-sm text-slate-600">
        Not in your inbox? Check your spam or promotions folder before requesting another.
    </p>

    <form method="POST" action="{{ route('verification.send') }}" class="mt-8">
        @csrf
        <x-button type="submit" class="w-full" size="lg">Resend verification email</x-button>
    </form>

    <form method="POST" action="{{ route('logout') }}" class="mt-3">
        @csrf
        <x-button type="submit" variant="ghost" class="w-full">Sign out</x-button>
    </form>

@endsection
