<?php
require_once __DIR__ . '/../config/database.php';
require_once __DIR__ . '/../classes/User.php';

if (isLoggedIn()) {
    $role = $_SESSION['role'] ?? 'student';
    if (in_array($role, ['admin', 'super_admin'], true)) {
        redirect('../cms/dashboard.php');
    } elseif ($role === 'regional_admin') {
        redirect('dashboards/regional_admin.php');
    } elseif ($role === 'instructor') {
        redirect('dashboards/instructor.php');
    } else {
        redirect('dashboard.php');
    }
}

$user = new User();
$error = null;
$success = getFlashMessage('success');
$flashError = getFlashMessage('error');
if ($flashError) {
    $error = $flashError;
}

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $username = trim($_POST['username'] ?? '');
    $password = $_POST['password'] ?? '';
    $remember = isset($_POST['remember']);

    try {
        $userData = $user->login($username, $password, $remember);
        $role = $_SESSION['role'] ?? 'student';
        if (in_array($role, ['admin', 'super_admin'], true)) {
            redirect('../cms/dashboard.php');
        } elseif ($role === 'regional_admin') {
            redirect('dashboards/regional_admin.php');
        } elseif ($role === 'instructor') {
            redirect('dashboards/instructor.php');
        } else {
            redirect('dashboard.php');
        }
    } catch (Exception $e) {
        $error = $e->getMessage();
    }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Login - SmartThink</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        body {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: radial-gradient(circle at top, #1d4ed8, #020617);
            font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
        }
        .auth-card {
            background: rgba(15, 23, 42, 0.96);
            border-radius: 1rem;
            box-shadow: 0 24px 80px rgba(15, 23, 42, 0.7);
            overflow: hidden;
            max-width: 900px;
            width: 100%;
            color: #e5e7eb;
        }
        .auth-left {
            background: radial-gradient(circle at top left, #3b82f6, #1e293b);
            padding: 2.5rem;
            color: white;
        }
        .auth-right {
            padding: 2.5rem;
            background: #020617;
        }
        .brand {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            margin-bottom: 2rem;
        }
        .brand-logo {
            width: 40px;
            height: 40px;
            border-radius: 999px;
            background: rgba(15, 23, 42, 0.9);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .brand-logo i {
            color: #3b82f6;
        }
        .form-control, .form-check-input {
            background-color: rgba(15, 23, 42, 0.9);
            border-color: #1f2937;
            color: #e5e7eb;
        }
        .form-control:focus {
            border-color: #3b82f6;
            box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.6);
            background-color: rgba(15, 23, 42, 0.95);
            color: #e5e7eb;
        }
        .btn-primary {
            background: linear-gradient(to right, #2563eb, #4f46e5);
            border: none;
        }
        .btn-primary:hover {
            background: linear-gradient(to right, #1d4ed8, #4338ca);
        }
        .text-muted-link {
            color: #9ca3af;
            text-decoration: none;
        }
        .text-muted-link:hover {
            color: #e5e7eb;
        }
        .alert {
            border-radius: 0.75rem;
        }
    </style>
</head>
<body>
<div class="container px-3 px-md-0">
    <div class="auth-card row g-0">
        <div class="col-lg-5 auth-left d-none d-lg-flex flex-column justify-content-between">
            <div>
                <div class="brand">
                    <div class="brand-logo">
                        <i class="fas fa-graduation-cap"></i>
                    </div>
                    <div>
                        <div class="fw-bold">SmartThink</div>
                        <small class="text-white-50">Global Learning Platform</small>
                    </div>
                </div>

                <h2 class="mb-3">Welcome back</h2>
                <p class="mb-4 text-white-75">Sign in to continue your learning journey, track progress, and access your courses.</p>

                <ul class="list-unstyled small text-white-75">
                    <li class="mb-2"><i class="fas fa-check-circle me-2"></i>Access regional content for USA, Europe and Africa</li>
                    <li class="mb-2"><i class="fas fa-check-circle me-2"></i>Track certificates, achievements and progress</li>
                    <li class="mb-2"><i class="fas fa-check-circle me-2"></i>Personalised course recommendations</li>
                </ul>
            </div>
            <div class="small text-white-50 mt-4">
                &copy; <?php echo date('Y'); ?> SmartThink3 LMS. All rights reserved.
            </div>
        </div>
        <div class="col-lg-7 auth-right">
            <h3 class="mb-1">Login</h3>
            <p class="text-muted mb-4">Enter your credentials to access the LMS.</p>

            <?php if (!empty($success)): ?>
                <div class="alert alert-success py-2 mb-3" role="alert">
                    <?php echo htmlspecialchars($success); ?>
                </div>
            <?php endif; ?>

            <?php if (!empty($error)): ?>
                <div class="alert alert-danger py-2 mb-3" role="alert">
                    <?php echo htmlspecialchars($error); ?>
                </div>
            <?php endif; ?>

            <form method="post" novalidate>
                <div class="mb-3">
                    <label for="username" class="form-label">Username or Email</label>
                    <input type="text" class="form-control" id="username" name="username" required autofocus>
                </div>

                <div class="mb-3">
                    <label for="password" class="form-label">Password</label>
                    <input type="password" class="form-control" id="password" name="password" required>
                </div>

                <div class="d-flex justify-content-between align-items-center mb-4">
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1" id="remember" name="remember">
                        <label class="form-check-label" for="remember">
                            Remember me
                        </label>
                    </div>
                    <a href="#" class="text-muted-link small">Forgot password?</a>
                </div>

                <button type="submit" class="btn btn-primary w-100 mb-3">
                    <i class="fas fa-sign-in-alt me-2"></i>Login
                </button>

                <div class="text-center small text-muted">
                    Don't have an account?
                    <a href="register.php" class="text-muted-link">Create one</a>
                </div>
            </form>
        </div>
    </div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
