@extends('layouts.auth')

@section('title', 'Columbus 17 | Verify Email')

@section('content')
    <div class="content w-full sm:w-96 m-auto mt-24 p-4 sm:p-0">
        <div class="flex flex-col">
            <div class="flex flex-col items-center space-y-4 mb-12">
                <p class="text-4xl sm:text-6xl">COLUMBUS17</p>
            </div>
            <div class="bg-white p-8 rounded-lg shadow-md w-full max-w-md">
                <h2 class="text-2xl font-semibold mb-4 text-gray-800">Verify Your Email Address</h2>

                <p class="text-gray-600 mb-4">
                    Thanks for signing up! Before getting started, please verify your email address by clicking the link we just emailed to you.
                    If you didn’t receive the email, we’ll gladly send you another.
                </p>

                @if (session('status') == 'verification-link-sent')
                    <div class="mb-4 text-sm text-green-600">
                        A new verification link has been sent to your email address.
                    </div>
                @endif

                <form method="POST" action="{{ route('verification.send') }}">
                    @csrf
                    <button type="submit"
                        class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
                        Resend Verification Email
                    </button>
                </form>
            </div>
        </div>
    </div>
@endsection