@php $pageName = 'Verify Email' @endphp
@extends('layouts.auth_app')

@section('content')
<div class="container h-p100">
    <div class="row align-items-center justify-content-md-center h-p100">
        <div class="col-lg-5 col-md-8 col-12">
            <div class="login-box shadow-lg rounded bg-white p-4">
                <div class="login-box-body text-center">
                    <h3 class="text-success fw-bold mb-3">Verify Your Email</h3>
                    <p class="text-muted mb-4">
                        {{ __('Thanks for signing up! Please verify your email address by clicking on the link we just
                        emailed you. If you didn\'t receive the email, you can request another one below.') }}
                    </p>

                    @if (session('status') == 'verification-link-sent')
                    <div class="alert alert-success rounded">
                        {{ __('A new verification link has been sent to the email address you provided during
                        registration.') }}
                    </div>
                    @endif

                    <!-- Resend Verification Email -->
                    <form method="POST" action="{{ route('verification.send') }}">@csrf
                        <div class="row">
                            <div class="col-12 text-center mb-3">
                                <button type="submit" class="btn btn-primary w-100 fw-bold py-2">
                                    {{ __('Resend Verification Email') }}
                                </button>
                            </div>
                        </div>
                    </form>

                    <!-- Logout -->
                    <form method="POST" action="{{ route('logout') }}">
                        @csrf
                        <button type="submit" class="btn btn-danger w-100 fw-bold py-2">
                            {{ __('Log Out') }}
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection