<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SuperAdmin Login | TellerPro Platform</title>
    <meta name="csrf-token" content="<?= Security::generateCsrfToken() ?>">
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/app.css">
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/superadmin.css">
    <style>
        body { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: #000; }
        .sa-login-card { width: 100%; max-width: 420px; background: var(--sa-surface); border: 1px solid var(--sa-border); border-radius: 16px; padding: 40px; box-shadow: 0 40px 80px rgba(0,0,0,0.8); }
    </style>
</head>
<body class="superadmin">
    <div class="sa-login-card">
        <div class="text-center mb-8">
            <div style="background: var(--sa-primary); width: 48px; height: 48px; border-radius: 12px; display: flex; align-items:center; justify-content:center; color:white; font-weight:900; font-size: 1.5rem; margin: 0 auto 20px;">TP</div>
            <h1 class="text-2xl font-bold">Platform Admin</h1>
            <p class="text-muted mt-2">Enter credentials to manage SaaS operations.</p>
        </div>

        <?php if ($err = getFlash('error')): ?>
            <div class="alert alert-error mb-6"><?= e($err) ?></div>
        <?php endif; ?>

        <form action="<?= APP_URL ?>/superadmin/login" method="POST">
            <?= Security::csrfField() ?>
            <div class="form-group">
                <label class="form-label">Email or Username</label>
                <input type="text" name="email" class="form-control" placeholder="admin or admin@tellerpro.com" required autofocus>
            </div>
            <div class="form-group">
                <label class="form-label">Password</label>
                <input type="password" name="password" class="form-control" placeholder="••••••••" required>
            </div>
            <button type="submit" class="btn btn-sa-primary w-full mt-4" style="padding: 12px; font-size: 1rem;">
                Authorized Login
            </button>
        </form>

        <div class="text-center mt-6 pt-4" style="border-top: 1px solid var(--sa-border);">
            <p class="text-xs text-muted mb-2">New deployment?</p>
            <a href="<?= APP_URL ?>/superadmin/reset-password" class="text-xs" style="color: var(--sa-primary);">Register / Setup Admin</a>
        </div>
    </div>
</body>
</html>
