<?php
session_start();

// Already logged in → redirect to dashboard
if (isset($_SESSION['agent_id'])) {
    header("Location: index.php"); exit;
}

require_once '../config/db.php';
$error = '';

if (isset($_GET['error']) && $_GET['error'] === 'account_deactivated') {
    $error = "Your account has been deactivated. Please contact admin.";
}

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

    if (!empty($username) && !empty($password)) {
        $stmt = $pdo->prepare("SELECT * FROM sales_agents WHERE username = ? AND is_active = 1");
        $stmt->execute([$username]);
        $agent = $stmt->fetch();

        if ($agent && !empty($agent['password_hash']) && password_verify($password, $agent['password_hash'])) {
            $_SESSION['agent_id']   = $agent['id'];
            $_SESSION['agent_name'] = $agent['name'];
            header("Location: index.php"); exit;
        } else {
            $error = "Invalid username or password.";
        }
    } else {
        $error = "Please enter your username and password.";
    }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Agent Login — MK Construction</title>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        *{margin:0;padding:0;box-sizing:border-box;font-family:'Montserrat',sans-serif;}
        body{min-height:100vh;background:linear-gradient(135deg,#0f172a 0%,#1e293b 50%,#0f172a 100%);display:flex;align-items:center;justify-content:center;padding:20px;}
        .login-card{background:#fff;border-radius:20px;padding:44px 40px;width:100%;max-width:420px;box-shadow:0 30px 80px rgba(0,0,0,0.4);}
        .logo-area{text-align:center;margin-bottom:32px;}
        .logo-icon{width:64px;height:64px;background:linear-gradient(135deg,#18aadf,#0369a1);border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:1.6rem;color:#fff;}
        h1{font-size:1.5rem;font-weight:800;color:#0f172a;margin-bottom:4px;}
        .subtitle{font-size:0.85rem;color:#94a3b8;font-weight:500;}
        .form-group{margin-bottom:18px;}
        label{display:block;margin-bottom:7px;font-weight:700;font-size:0.82rem;color:#475569;text-transform:uppercase;letter-spacing:0.04em;}
        .input-wrap{position:relative;}
        .input-wrap i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#94a3b8;font-size:0.95rem;}
        input{width:100%;padding:12px 14px 12px 42px;border:2px solid #e2e8f0;border-radius:10px;font-family:inherit;font-size:0.95rem;transition:border-color 0.15s;outline:none;}
        input:focus{border-color:#18aadf;box-shadow:0 0 0 3px rgba(24,170,223,0.12);}
        .eye-btn{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#94a3b8;font-size:0.9rem;padding:4px;}
        .btn-login{width:100%;padding:14px;background:linear-gradient(135deg,#18aadf,#0369a1);color:#fff;border:none;border-radius:10px;font-weight:800;font-size:1rem;cursor:pointer;transition:opacity 0.2s;margin-top:6px;}
        .btn-login:hover{opacity:0.9;}
        .error-box{background:#fee2e2;color:#ef4444;padding:12px 16px;border-radius:10px;font-size:0.88rem;font-weight:600;margin-bottom:20px;border:1px solid #fecaca;display:flex;align-items:center;gap:8px;}
        .back-link{text-align:center;margin-top:20px;font-size:0.82rem;color:#94a3b8;}
        .back-link a{color:#18aadf;font-weight:600;text-decoration:none;}
    </style>
</head>
<body>
<div class="login-card">
    <div class="logo-area">
        <div class="logo-icon"><i class="fa-solid fa-user-tie"></i></div>
        <h1>Agent Portal</h1>
        <p class="subtitle">MK Construction — Sales Agent Login</p>
    </div>

    <?php if($error): ?>
    <div class="error-box"><i class="fa-solid fa-circle-exclamation"></i> <?= htmlspecialchars($error) ?></div>
    <?php endif; ?>

    <form method="POST">
        <div class="form-group">
            <label>Username</label>
            <div class="input-wrap">
                <i class="fa-solid fa-user"></i>
                <input type="text" name="username" value="<?= htmlspecialchars($_POST['username'] ?? '') ?>" placeholder="your.username" required autofocus>
            </div>
        </div>
        <div class="form-group">
            <label>Password</label>
            <div class="input-wrap">
                <i class="fa-solid fa-lock"></i>
                <input type="password" name="password" id="pwd" placeholder="••••••••" required>
                <button type="button" class="eye-btn" onclick="togglePwd()"><i class="fa-solid fa-eye" id="eyeIcon"></i></button>
            </div>
        </div>
        <button type="submit" class="btn-login"><i class="fa-solid fa-right-to-bracket" style="margin-right:8px;"></i>Login</button>
    </form>
    <div class="back-link">Contact your admin if you've forgotten your credentials.</div>
</div>
<script>
function togglePwd(){
    const p=document.getElementById('pwd'), e=document.getElementById('eyeIcon');
    p.type=p.type==='password'?'text':'password';
    e.className=p.type==='password'?'fa-solid fa-eye':'fa-solid fa-eye-slash';
}
</script>
</body>
</html>
