@extends('frontend.layout.layout')
@section('title', '419 - Page Expired')
@section('main')
    <main class="flex-grow flex items-center justify-center py-20 px-6 md:px-14 text-center">
        <div class="max-w-2xl">
            <p class="text-9xl font-extrabold text-orange-500 mb-8 animate-pulse">419</p>
            <h1 class="text-4xl md:text-5xl font-bold text-gray-900 mb-6">Page Expired</h1>
            <p class="text-lg md:text-xl text-gray-700 mb-8">It looks like your session has expired. For security reasons,
                please refresh the page and try again.</p>
            <div class="flex flex-col sm:flex-row items-center justify-center gap-4">
                <a href="{{ route('home') }}"
                    class="bg-primary text-white px-8 py-4 !rounded-button text-lg font-medium hover:bg-primary/90 transition-colors shadow-lg shadow-primary/20">Go
                    to Homepage</a>
                <button onclick="location.reload()"
                    class="border border-primary text-primary px-8 py-4 !rounded-button text-lg font-medium hover:bg-primary hover:text-white transition-colors">Refresh
                    Page</button>
            </div>
        </div>
    </main>
@endsection