<?php
require_once __DIR__ . '/config.php';

if (isset($_SESSION['logged_in']) && $_SESSION['logged_in'] === true) {
    header('Location: ' . BASE_URL . '/index.php');
    exit;
}

$error = '';

$google_error = $_SESSION['google_login_error'] ?? '';
unset($_SESSION['google_login_error']);

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

    if ($username === ADMIN_USER && $password === ADMIN_PASS) {
        $_SESSION['logged_in'] = true;
        $_SESSION['username'] = $username;
        $_SESSION['role'] = 'admin';
        $_SESSION['user_id'] = null;
        $_SESSION['curriculum_id'] = null;
        header('Location: ' . BASE_URL . '/index.php');
        exit;
    }

    require_once __DIR__ . '/includes/functions.php';
    $user = authenticateUser($username, $password);
    if ($user) {
        $_SESSION['logged_in'] = true;
        $_SESSION['username'] = $user['name'];
        $_SESSION['user_id'] = $user['id'];
        $_SESSION['staff_code'] = $user['staff_code'];
        $_SESSION['role'] = $user['role'] ?? 'advisor';
        $_SESSION['curriculum_id'] = $user['curriculum_id'];
        header('Location: ' . BASE_URL . '/index.php');
        exit;
    }

    $error = 'ชื่อผู้ใช้หรือรหัสผ่านไม่ถูกต้อง';
}
?>
<!DOCTYPE html>
<html lang="th">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>เข้าสู่ระบบ - ระบบใบควบคุมผลการเรียน</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <script>
    tailwind.config = {
        theme: {
            extend: {
                fontFamily: { 'thai': ['"Noto Sans Thai"', 'sans-serif'] },
                colors: {
                    primary: { 50:'#eff6ff',100:'#dbeafe',200:'#bfdbfe',300:'#93c5fd',400:'#60a5fa',500:'#3b82f6',600:'#2563eb',700:'#1d4ed8',800:'#1e40af',900:'#1e3a8a' }
                }
            }
        }
    }
    </script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    <style>
        * { font-family: 'Noto Sans Thai', sans-serif; }
        .fade-in { animation: fadeIn 0.6s ease-in; }
        @keyframes fadeIn { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
        input:focus { outline: none; border-color: #fbbf24 !important; box-shadow: 0 0 0 3px rgba(251,191,36,0.3) !important; }
    </style>
</head>
<body class="font-thai min-h-screen flex flex-col bg-gradient-to-br from-slate-50 via-blue-50 to-indigo-100">

    <!-- Navbar -->
    <nav class="bg-gradient-to-r from-blue-900 via-blue-800 to-blue-700 shadow-xl">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="flex items-center justify-between h-16">
                <div class="flex items-center gap-3">
                    <a href="<?= BASE_URL ?>/login.php" class="flex items-center gap-3">
                        <img src="<?= BASE_URL ?>/pic/Logo DIT.png" alt="DIT Logo" class="h-10 w-10 rounded-full bg-white p-0.5 shadow-md">
                        <div class="hidden sm:block">
                            <h1 class="text-white font-bold text-sm leading-tight">คณะนวัตกรรมดิจิทัลเทคโนโลยี</h1>
                            <p class="text-blue-200 text-xs">มหาวิทยาลัยตาปี</p>
                        </div>
                    </a>
                </div>
                <div>
                    <span class="text-white/70 text-sm"><i class="fas fa-journal-text mr-1"></i> ระบบใบควบคุมผลการเรียนนักศึกษา</span>
                </div>
            </div>
        </div>
    </nav>
    <div class="h-1 bg-gradient-to-r from-yellow-300 via-yellow-400 to-yellow-500"></div>

    <main class="flex-1 flex items-center justify-center py-12 px-4">
        <div class="w-full max-w-md fade-in">
            <!-- Logo row -->
            <div class="text-center mb-8">
                <div class="flex items-center justify-center gap-6 mb-5">
                    <img src="<?= BASE_URL ?>/pic/logo.png">
                    <img src="<?= BASE_URL ?>/pic/Logo DIT.png" >
                </div>
                <h1 class="text-2xl font-bold text-gray-800">มหาวิทยาลัยตาปี</h1>
                <p class="text-gray-500">คณะนวัตกรรมดิจิทัลเทคโนโลยี</p>
                <div class="flex items-center justify-center gap-2 mt-4">
                    <div class="h-px w-12 bg-gradient-to-r from-transparent via-yellow-400 to-transparent"></div>
                    <span class="inline-flex items-center gap-2 bg-blue-50 text-blue-700 text-base font-bold px-6 py-2.5 rounded-full border border-blue-200 shadow-sm">
                        <i class="fas fa-journal-text text-blue-500"></i> ระบบใบควบคุมผลการเรียนนักศึกษา
                    </span>
                    <div class="h-px w-12 bg-gradient-to-r from-transparent via-yellow-400 to-transparent"></div>
                </div>
            </div>

            <!-- Login Card -->
            <div class="bg-white rounded-2xl shadow-xl p-8 border-t-4 border-yellow-400">
                <h2 class="text-2xl font-bold text-gray-800 mb-1">เข้าสู่ระบบ</h2>
                <p class="text-gray-400 text-sm mb-6">กรุณาใส่ชื่อผู้ใช้และรหัสผ่าน</p>

                <?php if ($error): ?>
                    <div class="bg-red-50 border-l-4 border-red-500 text-red-700 px-4 py-3 rounded-lg mb-4 text-sm flex items-center gap-2">
                        <i class="fas fa-exclamation-circle"></i>
                        <?= htmlspecialchars($error) ?>
                    </div>
                <?php endif; ?>
                <?php if ($google_error): ?>
                    <div class="bg-red-50 border-l-4 border-red-500 text-red-700 px-4 py-3 rounded-lg mb-4 text-sm flex items-center gap-2">
                        <i class="fas fa-exclamation-circle"></i>
                        <?= htmlspecialchars($google_error) ?>
                    </div>
                <?php endif; ?>

                <form method="POST">
                    <div class="mb-4">
                        <label class="block text-sm font-medium text-gray-700 mb-1"><i class="fas fa-user text-gray-400 mr-1"></i> ชื่อผู้ใช้</label>
                        <input type="text" name="username" class="w-full px-4 py-3 border-2 border-gray-200 rounded-xl text-gray-700 focus:border-yellow-400 focus:ring-4 focus:ring-yellow-100 transition-all duration-300" required autofocus>
                    </div>
                    <div class="mb-6">
                        <label class="block text-sm font-medium text-gray-700 mb-1"><i class="fas fa-lock text-gray-400 mr-1"></i> รหัสผ่าน</label>
                        <input type="password" name="password" class="w-full px-4 py-3 border-2 border-gray-200 rounded-xl text-gray-700 focus:border-yellow-400 focus:ring-4 focus:ring-yellow-100 transition-all duration-300" required>
                    </div>
                    <button type="submit" class="w-full bg-gradient-to-r from-blue-600 to-blue-700 hover:from-blue-700 hover:to-blue-800 text-white font-semibold py-3 px-6 rounded-xl transition-all duration-300 shadow-md hover:shadow-lg flex items-center justify-center gap-2">
                        <i class="fas fa-sign-in-alt"></i> เข้าสู่ระบบ
                    </button>
                </form>

                <div class="relative my-6">
                    <div class="absolute inset-0 flex items-center">
                        <div class="w-full border-t border-gray-200"></div>
                    </div>
                    <div class="relative flex justify-center text-sm">
                        <span class="px-3 bg-white text-gray-400 font-medium">หรือ</span>
                    </div>
                </div>

                <a href="<?= BASE_URL ?>/login-google.php"
                   class="w-full flex items-center justify-center gap-3 bg-white hover:bg-gray-50 text-gray-700 font-medium py-3 px-6 rounded-xl border-2 border-gray-200 transition-all duration-300 shadow-sm hover:shadow-md">
                    <svg class="w-5 h-5" viewBox="0 0 24 24">
                        <path fill="#4285F4" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z"/>
                        <path fill="#34A853" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/>
                        <path fill="#FBBC05" d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"/>
                        <path fill="#EA4335" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"/>
                    </svg>
                    เข้าสู่ระบบด้วยอีเมลมหาวิทยาลัยตาปี
                </a>
            </div>

            <p class="text-center text-gray-400 text-xs mt-6">
                <i class="fas fa-journal-text mr-1"></i> ระบบใบควบคุมผลการเรียน มหาวิทยาลัยตาปี
            </p>
        </div>
    </main>

    <!-- Footer -->
    <footer class="bg-gradient-to-r from-blue-900 via-blue-800 to-blue-700 text-white mt-auto">
        <div class="h-1 bg-gradient-to-r from-yellow-300 via-yellow-400 to-yellow-500"></div>
        <div class="max-w-7xl mx-auto px-4 py-6">
            <div class="flex flex-col md:flex-row items-center justify-between gap-4">
                <div class="flex items-center gap-3">
                    <img src="<?= BASE_URL ?>/pic/Logo DIT.png" alt="Logo" class="h-10 w-10 rounded-full bg-white p-0.5" onerror="this.style.display='none'">
                    <div>
                        <p class="font-semibold text-sm">คณะนวัตกรรมดิจิทัลเทคโนโลยี</p>
                        <p class="text-blue-200 text-xs">มหาวิทยาลัยตาปี</p>
                    </div>
                </div>
                <p class="text-blue-300 text-xs">&copy; 2569 มหาวิทยาลัยตาปี</p>
            </div>
        </div>
    </footer>

</body>
</html>
