<?php
session_start();
$projectRoot = dirname(__DIR__);
require_once $projectRoot . '/config/database.php';

// Security: Admin and Sub-Admin only
if (!isset($_SESSION['role']) || !in_array($_SESSION['role'], ['admin', 'subadmin'])) {
    header("Location: ../auth/login.php");
    exit();
}

$exam_id = $_GET['id'] ?? null;
if (!$exam_id) die("Invalid Exam ID");

// Handle Delete Question (Optional Safety)
if (isset($_GET['delete_q'])) {
    $q_id = $_GET['delete_q'];
    $pdo->prepare("DELETE FROM questions WHERE id = ?")->execute([$q_id]);
    header("Location: review_questions.php?id=$exam_id&msg=Deleted");
    exit();
}

// Fetch Exam Details
$stmt = $pdo->prepare("SELECT e.*, c.class_name, s.subject_name FROM exams e 
                       JOIN classes c ON e.class_id = c.id 
                       JOIN subjects s ON e.subject_id = s.id 
                       WHERE e.id = ?");
$stmt->execute([$exam_id]);
$exam = $stmt->fetch();

// Fetch All Questions
$q_stmt = $pdo->prepare("SELECT * FROM questions WHERE exam_id = ?");
$q_stmt->execute([$exam_id]);
$questions = $q_stmt->fetchAll();
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Review Questions | CBT</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        :root { --primary: #2c3e50; --accent: #3498db; --success: #27ae60; --danger: #e74c3c; --bg: #f8f9fa; }
        body { font-family: 'Inter', sans-serif; background: var(--bg); margin: 0; padding: 20px; }
        
        .container { max-width: 900px; margin: 0 auto; }
        .header-card { background: white; padding: 25px; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.05); margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; }
        
        .question-card { background: white; padding: 20px; border-radius: 10px; margin-bottom: 15px; border-left: 5px solid var(--accent); position: relative; }
        .q-text { font-weight: 600; font-size: 16px; margin-bottom: 15px; display: block; }
        
        .options-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
        .opt { padding: 8px 12px; background: #f1f3f5; border-radius: 5px; font-size: 14px; }
        .opt.correct { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; font-weight: bold; }
        
        .q-image { max-width: 200px; border-radius: 8px; margin-top: 10px; display: block; }
        
        .btn { padding: 10px 18px; border-radius: 6px; text-decoration: none; font-weight: bold; font-size: 14px; transition: 0.3s; cursor: pointer; border: none; }
        .btn-approve { background: var(--success); color: white; }
        .btn-delete { color: var(--danger); font-size: 18px; position: absolute; top: 20px; right: 20px; }
        
        .badge { background: #eef2f7; color: #555; padding: 4px 10px; border-radius: 4px; font-size: 12px; }
    </style>
</head>
<body>

<div class="container">
    <div class="header-card">
        <div>
            <h2 style="margin:0;"><?= htmlspecialchars($exam['exam_title']) ?></h2>
            <p style="margin:5px 0 0 0; color:#666;">
                <span class="badge"><?= $exam['class_name'] ?></span> 
                <span class="badge"><?= $exam['subject_name'] ?></span>
                <span class="badge"><?= count($questions) ?> Questions</span>
            </p>
        </div>
        <div style="display:flex; gap:10px;">
            <a href="cbt_approval.php" class="btn" style="background:#95a5a6; color:white;">Go Back</a>
            <a href="cbt_approval.php?approve_id=<?= $exam_id ?>" class="btn btn-approve">
                <i class="fa fa-check-circle"></i> Approve & Activate
            </a>
        </div>
    </div>

    <?php if(empty($questions)): ?>
        <p style="text-align:center; color:#999; margin-top:50px;">This exam has no questions yet.</p>
    <?php endif; ?>

    <?php foreach($questions as $index => $q): ?>
        <div class="question-card">
            <a href="?id=<?= $exam_id ?>&delete_q=<?= $q['id'] ?>" class="btn-delete" onclick="return confirm('Delete this question?')">
                <i class="fa fa-trash-alt"></i>
            </a>
            
            <span class="q-text">Q<?= $index + 1 ?>. <?= htmlspecialchars($q['question_text']) ?></span>

            <?php if($q['image_path']): ?>
                <img src="../assets/img/cbt/<?= $q['image_path'] ?>" class="q-image" alt="Question Diagram">
            <?php endif; ?>

            <div class="options-grid">
                <div class="opt <?= $q['correct_option'] == 'A' ? 'correct' : '' ?>">A) <?= htmlspecialchars($q['option_a']) ?></div>
                <div class="opt <?= $q['correct_option'] == 'B' ? 'correct' : '' ?>">B) <?= htmlspecialchars($q['option_b']) ?></div>
                <div class="opt <?= $q['correct_option'] == 'C' ? 'correct' : '' ?>">C) <?= htmlspecialchars($q['option_c']) ?></div>
                <div class="opt <?= $q['correct_option'] == 'D' ? 'correct' : '' ?>">D) <?= htmlspecialchars($q['option_d']) ?></div>
            </div>
            
            <div style="margin-top:15px; font-size:12px; color:var(--accent);">
                <i class="fa fa-edit"></i> <a href="edit_single_question.php?id=<?= $q['id'] ?>" style="color:inherit;">Edit this question</a>
            </div>
        </div>
    <?php endforeach; ?>
</div>

</body>
</html>