<?php
$bp = defined('BASE_PATH') ? BASE_PATH : '/gmind';
$exam = $exam ?? [];
$questions = $questions ?? [];
$lang = $exam['language'] ?? 'en';
$needsHindi = in_array($lang, ['hi','both'], true);
?>
<div class="admin-section">
    <div style="margin-bottom:14px;"><a href="<?= $bp ?>/branch/exams" style="color:#16a085;text-decoration:none;font-size:0.85rem;">← Back to Exams</a></div>

    <div style="background:linear-gradient(135deg,#16a085,#117a65);color:#fff;border-radius:12px;padding:16px;margin-bottom:16px;">
        <h2 style="margin:0;font-size:1.05rem;"><?= htmlspecialchars($exam['title'] ?? '', ENT_QUOTES, 'UTF-8') ?>
            <?php if (!empty($exam['title_hindi'])): ?>
                <span style="font-weight:400;opacity:0.9;font-family:'Noto Sans Devanagari',sans-serif;"> · <?= htmlspecialchars($exam['title_hindi'], ENT_QUOTES, 'UTF-8') ?></span>
            <?php endif; ?>
        </h2>
        <p style="margin:4px 0 0;opacity:0.9;font-size:0.82rem;">
            <?= (int)($exam['total_marks'] ?? 100) ?> marks · <?= (int)($exam['duration_minutes'] ?? 60) ?> min · <?= count($questions) ?> question(s) ·
            Lang: <strong><?= strtoupper($lang) ?></strong>
        </p>
    </div>

    <?php
    // Count how many questions have Hindi text filled in
    $hindiFilledCount = 0;
    foreach ($questions as $q) {
        if (!empty($q['question_text_hindi'])) $hindiFilledCount++;
    }
    $hindiMissingCount = count($questions) - $hindiFilledCount;
    ?>

    <?php if ($needsHindi): ?>
    <!-- Hindi translation status banner -->
    <div style="background:<?= $hindiMissingCount > 0 ? '#fff5e6' : '#eafaf1' ?>;border-left:4px solid <?= $hindiMissingCount > 0 ? '#f39c12' : '#27ae60' ?>;padding:12px 16px;border-radius:8px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;">
        <div style="font-size:0.84rem;color:<?= $hindiMissingCount > 0 ? '#b8731a' : '#1a7a4f' ?>;">
            <strong>🌐 Hindi Translation Status:</strong>
            <?php if ($hindiMissingCount > 0): ?>
                <?= $hindiFilledCount ?> of <?= count($questions) ?> questions have Hindi text. <strong><?= $hindiMissingCount ?> question(s) still need Hindi translation.</strong>
                <br><span style="font-size:0.78rem;color:#999;">Students switching to हि mode will see English as fallback for untranslated questions.</span>
            <?php else: ?>
                ✅ All <?= count($questions) ?> questions have Hindi translations. Students can fully switch to हि mode.
            <?php endif; ?>
        </div>
        <a href="<?= $bp ?>/branch/exams/<?= (int)$exam['id'] ?>/bulk-hindi" style="background:linear-gradient(135deg,#16a085,#117a65);color:#fff;text-decoration:none;padding:9px 18px;border-radius:8px;font-size:0.82rem;font-weight:600;white-space:nowrap;">
            🌐 <?= $hindiMissingCount > 0 ? 'Add Hindi Translations' : 'Edit Hindi Translations' ?>
        </a>
    </div>
    <?php endif; ?>

    <div style="display:grid;grid-template-columns:1fr 360px;gap:16px;">

        <!-- LEFT: Questions list + CSV upload -->
        <div>
            <h3 style="margin:0 0 12px;font-size:0.95rem;color:#0d3b3b;">Questions (<?= count($questions) ?>)</h3>

            <?php if (empty($questions)): ?>
                <p style="color:#999;text-align:center;padding:20px 0;background:#fff;border-radius:8px;">No questions yet. Add using the form → or upload a CSV below.</p>
            <?php else: foreach ($questions as $i => $q): ?>
                <div style="background:#fff;border-radius:8px;padding:14px;margin-bottom:8px;box-shadow:0 1px 4px rgba(0,0,0,0.05);">
                    <div style="display:flex;justify-content:space-between;align-items:start;">
                        <div style="flex:1;">
                            <div style="font-weight:600;color:#0d3b3b;font-size:0.86rem;">
                                <?= $i+1 ?>. <?= htmlspecialchars($q['question_text'] ?? '', ENT_QUOTES, 'UTF-8') ?>
                                <span style="background:#eaf0fb;color:#1a4fa0;padding:1px 6px;border-radius:4px;font-size:0.7rem;"><?= (int)$q['marks'] ?> mark(s)</span>
                            </div>
                            <?php if (!empty($q['question_text_hindi'])): ?>
                                <div style="font-size:0.8rem;color:#555;margin-top:3px;font-family:'Noto Sans Devanagari',sans-serif;"><?= htmlspecialchars($q['question_text_hindi'], ENT_QUOTES, 'UTF-8') ?></div>
                            <?php endif; ?>
                            <div style="font-size:0.78rem;color:#666;margin-top:4px;">
                                A. <?= htmlspecialchars($q['option_a'] ?? '', ENT_QUOTES, 'UTF-8') ?> ·
                                B. <?= htmlspecialchars($q['option_b'] ?? '', ENT_QUOTES, 'UTF-8') ?>
                                <?= !empty($q['option_c']) ? ' · C. ' . htmlspecialchars($q['option_c'], ENT_QUOTES, 'UTF-8') : '' ?>
                                <?= !empty($q['option_d']) ? ' · D. ' . htmlspecialchars($q['option_d'], ENT_QUOTES, 'UTF-8') : '' ?>
                            </div>
                            <?php if ($needsHindi && (!empty($q['option_a_hindi']) || !empty($q['option_b_hindi']))): ?>
                                <div style="font-size:0.74rem;color:#888;margin-top:2px;font-family:'Noto Sans Devanagari',sans-serif;">
                                    A. <?= htmlspecialchars($q['option_a_hindi'] ?? '', ENT_QUOTES, 'UTF-8') ?> ·
                                    B. <?= htmlspecialchars($q['option_b_hindi'] ?? '', ENT_QUOTES, 'UTF-8') ?>
                                    <?= !empty($q['option_c_hindi']) ? ' · C. ' . htmlspecialchars($q['option_c_hindi'], ENT_QUOTES, 'UTF-8') : '' ?>
                                    <?= !empty($q['option_d_hindi']) ? ' · D. ' . htmlspecialchars($q['option_d_hindi'], ENT_QUOTES, 'UTF-8') : '' ?>
                                </div>
                            <?php endif; ?>
                            <div style="font-size:0.76rem;color:#27ae60;margin-top:4px;">✓ Correct: <?= strtoupper($q['correct_answer'] ?? 'a') ?></div>
                        </div>
                        <form method="POST" action="<?= $bp ?>/branch/exams/<?= (int)$exam['id'] ?>/questions/<?= (int)$q['id'] ?>/delete" onsubmit="return confirm('Delete this question?');">
                            <input type="hidden" name="csrf_token" value="<?= htmlspecialchars($csrfToken ?? '', ENT_QUOTES, 'UTF-8') ?>">
                            <button type="submit" style="background:none;border:none;color:#e84118;cursor:pointer;font-size:1rem;">✕</button>
                        </form>
                    </div>
                </div>
            <?php endforeach; endif; ?>

            <!-- CSV Upload Block -->
            <div style="background:#fff;border:2px dashed #16a085;border-radius:10px;padding:18px;margin-top:20px;">
                <h3 style="margin:0 0 6px;font-size:0.92rem;color:#0d3b3b;">📤 Bulk Import via CSV</h3>
                <p style="margin:0 0 12px;font-size:0.78rem;color:#666;">Upload a CSV with columns: <code>question_text, question_text_hindi, option_a, option_a_hindi, option_b, option_b_hindi, option_c, option_c_hindi, option_d, option_d_hindi, correct_answer (a/b/c/d), marks</code>. Hindi fields are optional.</p>
                <div style="display:flex;gap:10px;align-items:center;flex-wrap:wrap;">
                    <a href="<?= $bp ?>/branch/exams/download-template" style="background:#7f8c8d;color:#fff;text-decoration:none;padding:8px 14px;border-radius:6px;font-size:0.78rem;font-weight:600;">⬇ Download Template</a>
                    <form method="POST" action="<?= $bp ?>/branch/exams/<?= (int)$exam['id'] ?>/import" enctype="multipart/form-data" style="display:flex;gap:8px;align-items:center;flex:1;min-width:260px;">
                        <input type="hidden" name="csrf_token" value="<?= htmlspecialchars($csrfToken ?? '', ENT_QUOTES, 'UTF-8') ?>">
                        <input type="file" name="import_file" accept=".csv" required style="flex:1;font-size:0.78rem;padding:6px;border:1px solid #ddd;border-radius:6px;">
                        <button type="submit" style="background:#16a085;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:0.78rem;font-weight:600;cursor:pointer;">⬆ Upload &amp; Import</button>
                    </form>
                </div>
            </div>
        </div>

        <!-- RIGHT: Add-question form -->
        <div style="background:#fff;border-radius:12px;padding:18px;box-shadow:0 2px 8px rgba(0,0,0,0.06);height:fit-content;">
            <h3 style="margin:0 0 12px;font-size:0.95rem;color:#0d3b3b;">+ Add Question</h3>
            <form method="POST" action="<?= $bp ?>/branch/exams/<?= (int)$exam['id'] ?>/questions">
                <input type="hidden" name="csrf_token" value="<?= htmlspecialchars($csrfToken ?? '', ENT_QUOTES, 'UTF-8') ?>">
                <div style="margin-bottom:8px;">
                    <label style="display:block;font-size:0.76rem;font-weight:600;color:#0d3b3b;margin-bottom:3px;">Question (English) *</label>
                    <textarea name="question_text" required rows="2" placeholder="Question text" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;font-size:0.82rem;resize:vertical;"></textarea>
                </div>
                <?php if ($needsHindi): ?>
                <div style="margin-bottom:8px;">
                    <label style="display:block;font-size:0.76rem;font-weight:600;color:#0d3b3b;margin-bottom:3px;">Question (Hindi) <?= $lang === 'hi' ? '*' : '(optional)' ?></label>
                    <textarea name="question_text_hindi" rows="2" placeholder="प्रश्न हिंदी में" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;font-size:0.82rem;resize:vertical;font-family:'Noto Sans Devanagari',sans-serif;"></textarea>
                </div>
                <?php endif; ?>
                <div style="margin-bottom:6px;">
                    <label style="display:block;font-size:0.76rem;font-weight:600;color:#0d3b3b;margin-bottom:3px;">Option A (English) *</label>
                    <input type="text" name="option_a" required placeholder="Option A" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;">
                </div>
                <?php if ($needsHindi): ?>
                <div style="margin-bottom:6px;"><input type="text" name="option_a_hindi" placeholder="विकल्प A (Hindi)" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;font-family:'Noto Sans Devanagari',sans-serif;"></div>
                <?php endif; ?>
                <div style="margin-bottom:6px;">
                    <label style="display:block;font-size:0.76rem;font-weight:600;color:#0d3b3b;margin-bottom:3px;">Option B (English) *</label>
                    <input type="text" name="option_b" required placeholder="Option B" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;">
                </div>
                <?php if ($needsHindi): ?>
                <div style="margin-bottom:6px;"><input type="text" name="option_b_hindi" placeholder="विकल्प B (Hindi)" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;font-family:'Noto Sans Devanagari',sans-serif;"></div>
                <?php endif; ?>
                <div style="margin-bottom:6px;">
                    <label style="display:block;font-size:0.76rem;font-weight:600;color:#999;margin-bottom:3px;">Option C (optional)</label>
                    <input type="text" name="option_c" placeholder="Option C" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;">
                </div>
                <?php if ($needsHindi): ?>
                <div style="margin-bottom:6px;"><input type="text" name="option_c_hindi" placeholder="विकल्प C (Hindi)" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;font-family:'Noto Sans Devanagari',sans-serif;"></div>
                <?php endif; ?>
                <div style="margin-bottom:6px;">
                    <label style="display:block;font-size:0.76rem;font-weight:600;color:#999;margin-bottom:3px;">Option D (optional)</label>
                    <input type="text" name="option_d" placeholder="Option D" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;">
                </div>
                <?php if ($needsHindi): ?>
                <div style="margin-bottom:8px;"><input type="text" name="option_d_hindi" placeholder="विकल्प D (Hindi)" style="width:100%;padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;font-family:'Noto Sans Devanagari',sans-serif;"></div>
                <?php endif; ?>
                <div style="display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px;">
                    <div>
                        <label style="display:block;font-size:0.76rem;font-weight:600;color:#0d3b3b;margin-bottom:3px;">Correct</label>
                        <select name="correct_answer" style="padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;width:100%;">
                            <option value="a">A</option><option value="b">B</option><option value="c">C</option><option value="d">D</option>
                        </select>
                    </div>
                    <div>
                        <label style="display:block;font-size:0.76rem;font-weight:600;color:#0d3b3b;margin-bottom:3px;">Marks</label>
                        <input type="number" name="marks" value="1" min="1" style="padding:7px;border:1px solid #ddd;border-radius:6px;font-size:0.8rem;width:100%;text-align:center;">
                    </div>
                </div>
                <button type="submit" style="width:100%;padding:10px;background:#27ae60;color:#fff;border:none;border-radius:6px;font-size:0.82rem;cursor:pointer;font-weight:600;">+ Add Question</button>
            </form>
        </div>
    </div>
</div>
