@extends('layouts.app')

@section('title', 'Admin Login')

@section('content')
<div class="row justify-content-center py-5">
    <div class="col-md-6 col-lg-4">
        <div class="glass-card p-4 p-lg-5 rounded-4 shadow">
            <div class="text-center mb-4">
                <div class="d-inline-flex align-items-center justify-content-center bg-primary-subtle text-primary rounded-circle mb-3" style="width: 64px; height: 64px;">
                    <i class="bi bi-shield-lock-fill fs-2"></i>
                </div>
                <h2 class="h4 fw-bold">Admin Portal</h2>
                <p class="text-muted small">Sign in to manage your application store</p>
            </div>

            <form method="POST" action="{{ route('admin.login.submit') }}">
                @csrf
                <div class="mb-3">
                    <label class="form-label fw-600 small">Email Address</label>
                    <div class="input-group">
                        <span class="input-group-text bg-light border-0"><i class="bi bi-envelope text-muted"></i></span>
                        <input type="email" name="email" class="form-control bg-light border-0 py-2" value="{{ old('email') }}" required placeholder="admin@example.com">
                    </div>
                    @error('email')<div class="text-danger small mt-1">{{ $message }}</div>@enderror
                </div>

                <div class="mb-4">
                    <label class="form-label fw-600 small">Password</label>
                    <div class="input-group">
                        <span class="input-group-text bg-light border-0"><i class="bi bi-key text-muted"></i></span>
                        <input type="password" name="password" class="form-control bg-light border-0 py-2" required placeholder="••••••••">
                    </div>
                    @error('password')<div class="text-danger small mt-1">{{ $message }}</div>@enderror
                </div>

                <button class="btn btn-primary w-100 py-3 shadow">
                    Access Dashboard <i class="bi bi-arrow-right ms-2"></i>
                </button>
            </form>

            <div class="mt-4 text-center">
                <a href="{{ route('home') }}" class="text-muted small text-decoration-none">
                    <i class="bi bi-chevron-left"></i> Return to Storefront
                </a>
            </div>
        </div>
    </div>
</div>
@endsection