<?php
session_start();
include 'db_config.php';
include 'functions.php';
check_login();
check_role('employee');

$uid = $_SESSION['user_id'];
$msg = '';

$msg = '';

// Check User Status
$stmt = $conn->prepare("SELECT status FROM employee_details WHERE employee_nic = ?");
$stmt->bind_param("s", $uid);
$stmt->execute();
$stmt->bind_result($user_status);
$stmt->fetch();
$stmt->close();

// Handle Application
if(isset($_POST['apply'])) {
    if($user_status !== 'Approved') {
        $msg = "Your account is pending approval. You cannot apply for jobs yet.";
    } else {
        $jid = intval($_POST['job_id']);
    // Check if already applied
    $check = $conn->query("SELECT id FROM applications WHERE job_id = $jid AND employee_nic = '$uid'");
    if($check->num_rows == 0) {
        $conn->query("INSERT INTO applications (job_id, employee_nic) VALUES ($jid, '$uid')");
        $msg = "Application submitted!";
    } else {
        $msg = "You have already applied for this job.";
    }
    }
}

$jobs = $conn->query("SELECT j.*, ed.company_name FROM jobs j JOIN employer_details ed ON j.employer_id = ed.user_id WHERE j.status = 'Open' ORDER BY j.created_at DESC");
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Available Jobs | Work For Sri Lanka</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <script src="https://unpkg.com/lucide@latest"></script>
    <style>
        body { font-family: 'Inter', sans-serif; }
        .glass-panel {
            background: rgba(30, 41, 59, 0.4);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.05);
        }
        @keyframes pop {
            0% { transform: scale(0.95); opacity: 0; }
            70% { transform: scale(1.05); opacity: 1; }
            100% { transform: scale(1); opacity: 1; }
        }
        .brand-pop {
            transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
            display: inline-block;
        }
        .brand-pop:hover {
            transform: scale(1.15);
        }
    </style>
</head>
<body class="bg-slate-950 min-h-screen text-slate-200 selection:bg-indigo-500 selection:text-white">
    <!-- Navbar -->
    <nav class="bg-slate-900/50 backdrop-blur-md border-b border-slate-800 sticky top-0 z-50">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="flex justify-between h-16 items-center">
                <div class="flex-shrink-0 flex items-center gap-3">
                    <a href="<?= BASE_URL ?>/index.php" class="brand-pop block">
                        <img src="assets/images/logo_banner.png" alt="Department of Manpower and Employment" class="h-10 md:h-12 object-contain">
                    </a>
                    <div class="h-8 w-px bg-slate-700 mx-2 hidden md:block"></div>
                    <a href="<?= BASE_URL ?>/index.php" class="text-xl md:text-2xl font-bold italic tracking-tighter text-white brand-pop block origin-left">
                        Work For <span class="text-indigo-400">Sri Lanka</span>
                    </a>
                </div>
                <nav class="flex gap-4">
                    <a href="employee/dashboard.php" class="text-slate-400 hover:text-white transition font-medium">Dashboard</a>
                    <a href="logout.php" class="text-slate-400 hover:text-red-400 transition font-medium">Logout</a>
                </nav>
            </div>
        </div>
    </nav>

    <div class="max-w-7xl mx-auto px-4 py-8">
        <h1 class="text-3xl font-bold text-white mb-2">Available Jobs</h1>
        <p class="text-slate-400 mb-8">Browse and apply for opportunities.</p>
        
        <?php if($msg): ?>
            <div class="bg-indigo-500/20 text-indigo-300 p-4 rounded-xl border border-indigo-500/50 mb-6 flex items-center">
                <i data-lucide="info" class="w-5 h-5 mr-2"></i> <?=$msg?>
            </div>
        <?php endif; ?>

        <div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
            <?php while($j = $jobs->fetch_assoc()): ?>
                <div class="glass-panel p-6 rounded-2xl flex flex-col h-full hover:border-indigo-500/30 transition-colors group">
                    <div class="flex-1">
                        <h2 class="text-xl font-bold text-white mb-1 group-hover:text-indigo-400 transition-colors"><?=$j['title']?></h2>
                        <div class="flex items-center text-slate-300 text-sm mb-4 font-medium">
                            <i data-lucide="building-2" class="w-4 h-4 mr-1.5 text-indigo-500"></i> <?=$j['company_name']?>
                        </div>
                        
                        <div class="flex flex-wrap gap-2 mb-4 text-xs">
                            <span class="bg-slate-800 px-2.5 py-1 rounded-md text-slate-300 flex items-center border border-slate-700">
                                <i data-lucide="map-pin" class="w-3 h-3 mr-1.5 text-emerald-400"></i> <?=$j['location']?>
                            </span>
                            <span class="bg-slate-800 px-2.5 py-1 rounded-md text-slate-300 flex items-center border border-slate-700">
                                <i data-lucide="briefcase" class="w-3 h-3 mr-1.5 text-amber-400"></i> <?=$j['category']?>
                            </span>
                        </div>

                        <p class="text-slate-400 text-sm mb-6 line-clamp-4 leading-relaxed">
                            <?=nl2br($j['description'])?>
                        </p>
                    </div>

                    <form method="post" class="mt-auto pt-4 border-t border-slate-800">
                        <input type="hidden" name="job_id" value="<?=$j['id']?>">
                        <?php if($user_status === 'Approved'): ?>
                            <button type="submit" name="apply" class="w-full py-2.5 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl font-medium transition shadow-lg shadow-indigo-900/20 flex items-center justify-center">
                                Apply Now <i data-lucide="send" class="w-4 h-4 ml-2"></i>
                            </button>
                        <?php else: ?>
                            <button type="button" disabled class="w-full py-2.5 bg-slate-800 text-slate-500 rounded-xl cursor-not-allowed border border-slate-700 flex items-center justify-center">
                                <i data-lucide="lock" class="w-4 h-4 mr-2"></i> Account Pending
                            </button>
                        <?php endif; ?>
                    </form>
                </div>
            <?php endwhile; ?>
        </div>
    </div>
    <script>lucide.createIcons();</script>
</body>
</html>
