<div class="min-h-screen flex flex-col justify-center items-center">
    <!-- SVG QR Code Art on Top -->
    <div class="mb-8">
        <!-- Simple QR code SVG (static, for illustration) -->
        <svg width="96" height="96" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
            <rect width="96" height="96" rx="16" fill="#F3F4F6"/>
            <rect x="12" y="12" width="20" height="20" fill="#111827"/>
            <rect x="64" y="12" width="20" height="20" fill="#111827"/>
            <rect x="12" y="64" width="20" height="20" fill="#111827"/>
            <rect x="40" y="40" width="8" height="8" fill="#111827"/>
            <rect x="56" y="56" width="8" height="8" fill="#111827"/>
            <rect x="72" y="40" width="8" height="8" fill="#111827"/>
            <rect x="40" y="72" width="8" height="8" fill="#111827"/>
        </svg>
    </div>
    <h1 class="text-3xl font-bold text-center mb-2">ESN Scanner App</h1>
    <h2 class="text-lg text-gray-600 text-center mb-8">Make entrance to your events a breeze.</h2>
    <div class="flex space-x-4 w-full justify-center">
        <a href="/auth/login" class="w-32 py-2 bg-blue-600 text-white rounded text-center hover:bg-blue-700 transition">Login</a>
        <a href="/auth/signup" class="w-32 py-2 bg-gray-200 text-blue-700 rounded text-center hover:bg-gray-300 transition">Signup</a>
    </div>
</div>
