<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $title; ?></title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="<?php echo $baseUrl; ?>/assets/css/style.css">
    <style>
        .login-bg {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: var(--surface-0);
            position: relative;
            overflow: hidden;
            padding: 20px;
        }
        .login-bg::before {
            content: '';
            position: absolute;
            width: 600px; height: 600px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(16,185,129,0.08) 0%, transparent 70%);
            top: -100px; left: -100px;
            pointer-events: none;
        }
        .login-bg::after {
            content: '';
            position: absolute;
            width: 500px; height: 500px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(59,130,246,0.06) 0%, transparent 70%);
            bottom: -100px; right: -100px;
            pointer-events: none;
        }
        .login-card {
            position: relative; z-index: 1;
            width: 100%; max-width: 420px;
            background: var(--surface-card);
            border: 1px solid var(--border);
            border-radius: 20px;
            padding: 48px 40px;
            box-shadow: 0 25px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.03);
        }
        .login-icon-wrap {
            width: 72px; height: 72px;
            background: linear-gradient(135deg, #10b981, #059669);
            border-radius: 18px;
            display: flex; align-items: center; justify-content: center;
            font-size: 28px; color: white;
            margin: 0 auto 28px;
            box-shadow: 0 8px 24px rgba(16, 185, 129, 0.4);
        }
        .login-card h2 { font-size: 24px; font-weight: 800; color: var(--text-1); text-align: center; margin-bottom: 6px; }
        .login-card p.subtitle { color: var(--text-3); font-size: 14px; text-align: center; margin-bottom: 32px; }
        .login-error {
            background: rgba(239,68,68,0.1); border: 1px solid rgba(239,68,68,0.3);
            color: #ef4444; padding: 12px 16px; border-radius: 10px;
            font-size: 13px; font-weight: 500; margin-bottom: 20px;
        }
        .login-submit {
            width: 100%; padding: 14px;
            background: linear-gradient(135deg, #10b981, #059669);
            color: white; border: none; border-radius: 10px;
            font-size: 15px; font-weight: 700; cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 4px 16px rgba(16, 185, 129, 0.35);
            margin-top: 8px;
        }
        .login-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(16, 185, 129, 0.5); }
        .login-back { display: block; text-align: center; margin-top: 24px; font-size: 13px; color: var(--text-3); text-decoration: none; transition: color 0.2s; }
        .login-back:hover { color: #10b981; }
    </style>
</head>
<body style="padding-bottom: 0; background: var(--surface-0);" class="superadmin-theme">
    <div class="login-bg">
        <div class="login-card">
            <div class="login-icon-wrap">
                <i class="fa fa-shield"></i>
            </div>
            <h2>Süper Yönetici</h2>
            <p class="subtitle">Sistem genelindeki bayileri yönetmek için giriş yapın</p>

            <?php if (isset($error)): ?>
                <div class="login-error">
                    <i class="fa fa-exclamation-circle" style="margin-right:6px;"></i> <?php echo $error; ?>
                </div>
            <?php endif; ?>

            <form action="<?php echo $baseUrl; ?>/superadmin/auth" method="POST" style="display: flex; flex-direction: column; gap: 16px;">
                <div class="admin-form-group" style="margin-bottom:0;">
                    <label for="username">Kullanıcı Adı</label>
                    <input type="text" id="username" name="username" required class="admin-input" placeholder="superadmin" autocomplete="username">
                </div>
                <div class="admin-form-group" style="margin-bottom:0;">
                    <label for="password">Şifre</label>
                    <input type="password" id="password" name="password" required class="admin-input" placeholder="••••••••" autocomplete="current-password">
                </div>
                <button type="submit" class="login-submit">
                    <i class="fa fa-sign-in" style="margin-right:8px;"></i> Sisteme Giriş Yap
                </button>
            </form>

            <a href="<?php echo $baseUrl; ?>/" class="login-back">
                <i class="fa fa-arrow-left" style="margin-right:6px;"></i> Mağazaya Dön
            </a>
        </div>
    </div>
</body>
</html>
