
<div class="flex justify-center items-center min-h-screen bg-gray-100">
    <div class="w-full max-w-md bg-white p-8 rounded shadow">
        <h2 class="text-2xl font-bold mb-6 text-center">Login</h2>

        @if(session('error'))
            <div class="bg-red-100 text-red-700 p-2 rounded mb-4">
                {{ session('error') }}
            </div>
        @endif

        <form method="POST" action="{{ route('auth') }}">
            @csrf

            <div class="mb-4">
                <label for="email" class="block mb-1">Username</label>
                <input type="text" name="username" id="email" value="{{ old('username') }}" required autofocus class="w-full p-2 border rounded">
                @error('username')
                    <span class="text-red-500 text-sm">{{ $message }}</span>
                @enderror
            </div>

            <div class="mb-4">
                <label for="password" class="block mb-1">Password</label>
                <input type="password" name="password" id="password" required class="w-full p-2 border rounded">
                @error('password')
                    <span class="text-red-500 text-sm">{{ $message }}</span>
                @enderror
            </div>

            <div class="mb-4 flex items-center justify-between">
                <label>
                    <input type="checkbox" name="remember"> Remember Me
                </label>
                {{-- <a href="{{ route('password.request') }}" class="text-blue-500 text-sm">Forgot Password?</a> --}}
            </div>

            <button type="submit" class="w-full bg-blue-500 text-white p-2 rounded hover:bg-blue-600">Login</button>
        </form>
    </div>
</div>

