{{-- resources/views/superadmin/login.blade.php --}}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Super Admin — {{ config('app.name') }}</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
    <style>
        body {
            min-height:100vh; background:linear-gradient(135deg,#0D2E54 0%,#1B4F8A 100%);
            display:flex; align-items:center; justify-content:center;
            font-family:'Segoe UI',system-ui,sans-serif; padding:20px;
        }
        .card { border:none; border-radius:16px; box-shadow:0 20px 60px rgba(0,0,0,.3); max-width:420px; width:100%; }
        .card-header { background:linear-gradient(135deg,#0D2E54,#1B4F8A); border-radius:16px 16px 0 0 !important; padding:28px 32px; text-align:center; color:#fff; }
        .badge-sa { background:rgba(255,255,255,.15); color:#fff; padding:4px 12px; border-radius:20px; font-size:11px; letter-spacing:1px; }
        .card-body { padding:28px 32px 32px; }
        .form-control { border-radius:8px; padding:10px 14px; font-size:14px; border:1.5px solid #dee2e6; }
        .form-control:focus { border-color:#1B4F8A; box-shadow:0 0 0 3px rgba(27,79,138,.12); }
        .btn-login { background:#1B4F8A; color:#fff; border:none; border-radius:8px; padding:11px; font-size:14px; font-weight:600; width:100%; }
        .btn-login:hover { background:#0D2E54; color:#fff; }
        .form-label { font-weight:600; font-size:13px; }
    </style>
</head>
<body>
<div class="card">
    <div class="card-header">
        <div class="mb-2"><i class="bi bi-shield-lock" style="font-size:36px"></i></div>
        <h1 style="font-size:20px;font-weight:700;margin:0">Super Admin</h1>
        <div class="mt-2"><span class="badge-sa">SYSTEM ADMINISTRATION</span></div>
    </div>
    <div class="card-body">
        @if($errors->any())
            <div class="alert alert-danger alert-sm mb-3" style="font-size:13px">
                <i class="bi bi-exclamation-triangle me-1"></i>{{ $errors->first() }}
            </div>
        @endif

        <form method="POST" action="{{ route('sadmin.login.post') }}" id="loginForm">
            @csrf
            <div class="mb-3">
                <label class="form-label">Email Address</label>
                <input type="email" name="email" class="form-control" value="{{ old('email') }}"
                       placeholder="admin@yourdomain.com" autofocus required>
            </div>
            <div class="mb-4">
                <label class="form-label">Password</label>
                <input type="password" name="password" class="form-control"
                       placeholder="Enter password" required>
            </div>
            <button type="submit" class="btn-login" id="loginBtn">
                <i class="bi bi-shield-check me-2"></i>Sign In as Super Admin
            </button>
        </form>
    </div>
</div>
<script>
document.getElementById('loginForm').addEventListener('submit', function() {
    const btn = document.getElementById('loginBtn');
    btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span>Authenticating...';
    btn.disabled = true;
});
</script>
</body>
</html>
