@extends('layouts.guest')
@section('title', 'Login')
@section('page-title', 'Sign in')
@section('content')
<div class="flex justify-center">
    <div class="w-full max-w-md">
        <form method="POST" action="{{ url('login') }}" class="space-y-6 rounded-xl border border-slate-200 bg-white p-6 shadow-sm">
            @csrf
            <div>
                <h2 class="text-lg font-semibold text-slate-900">Admin sign in</h2>
                <p class="mt-1 text-sm text-slate-600">Use your email and password to access the admin dashboard.</p>
            </div>
            <div class="space-y-4">
                <div>
                    <label for="email" class="block text-sm font-medium text-slate-700">Email</label>
                    <input type="email" name="email" id="email" value="{{ old('email', 'admin@tailorshop.com') }}" required autofocus class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                    @error('email')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
                </div>
                <div>
                    <label for="password" class="block text-sm font-medium text-slate-700">Password</label>
                    <input type="password" name="password" id="password" required class="mt-1 block w-full rounded-lg border border-slate-300 shadow-sm sm:text-sm">
                    @error('password')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
                </div>
                <div class="flex items-center justify-between">
                    <label class="inline-flex items-center gap-2 text-sm text-slate-700">
                        <input type="checkbox" name="remember" class="h-4 w-4 rounded border-slate-300 text-slate-800 focus:ring-slate-500">
                        <span>Remember me</span>
                    </label>
                </div>
            </div>
            <div class="flex items-center justify-between">
                <button type="submit" class="btn-primary">Sign in</button>
            </div>
        </form>
    </div>
</div>
@endsection