<?php
/**
 * Practice Test Result Page — Gmind Institute
 *
 * Result display with pass/fail indicator, score circle,
 * stats breakdown, expandable answer review section, and
 * print result button.
 *
 * Shows user name prominently, attempt number (1st, 2nd, 3rd),
 * and remaining attempts count.
 *
 * Expected PHP variables:
 *   $attempt            — attempt record with score details
 *   $set                — practice set with questions (only if show_correct_answers)
 *   $reviewQuestions    — array of questions with selected, is_correct, earned fields
 *   $csrfToken          — CSRF token string
 *   $currentPage        — string 'practice'
 *   $title              — page title
 *   $userName           — logged-in user's name
 *   $attemptNumber      — which attempt this is (1, 2, 3...)
 *   $maxAttempts        — max attempts allowed (0 = unlimited)
 *   $totalAttempts      — total attempts used so far
 *   $remainingAttempts  — remaining attempts (-1 = unlimited)
 */

$attempt            = $attempt            ?? [];
$set                = $set                ?? [];
$reviewQuestions    = $reviewQuestions    ?? [];
$csrfToken          = $csrfToken          ?? '';
$basePath           = defined('BASE_PATH') ? BASE_PATH : '/gmind';
$currentPage        = $currentNav ?? 'practice';
$userName           = $userName ?? '';
$attemptNumber      = $attemptNumber ?? 0;
$maxAttempts        = $maxAttempts ?? 0;
$totalAttempts      = $totalAttempts ?? 0;
$remainingAttempts  = $remainingAttempts ?? -1;

$totalObtained   = (float) ($attempt['total_obtained'] ?? 0);
$totalMarks      = (int) ($attempt['total_marks'] ?? 0);
$percentage      = $totalMarks > 0 ? round(($totalObtained / $totalMarks) * 100, 1) : 0;
$correctCount    = (int) ($attempt['correct_count'] ?? 0);
$wrongCount      = (int) ($attempt['wrong_count'] ?? 0);
$unansweredCount = (int) ($attempt['unanswered_count'] ?? 0);
$status          = $attempt['status'] ?? 'fail';
$isPassed        = ($status === 'pass');
$passMarks       = (int) ($set['pass_marks'] ?? 0);
$negativeMarks   = (float) ($set['negative_marks'] ?? 0);
$showReview      = !empty($set['show_correct_answers']) && !empty($reviewQuestions);

// Format attempt number with ordinal suffix
$attemptLabel = '';
if ($attemptNumber > 0) {
    $suffix = ($attemptNumber === 1) ? 'st' : (($attemptNumber === 2) ? 'nd' : (($attemptNumber === 3) ? 'rd' : 'th'));
    $attemptLabel = $attemptNumber . $suffix . ' ' . __('practice.attempt');
}
include __DIR__ . '/../layouts/header.php';

?>
<!-- Practice Result Styles -->
<style>
/* Result Section */
.practice-result-section { background-color: #f4f7fc; padding: 48px 0; min-height: 60vh; }
.result-wrapper { max-width: 700px; margin: 0 auto; }

/* Result Header */
.result-header { text-align: center; padding: 32px 24px; border-radius: 12px; margin-bottom: 20px; }
.result-pass { background: linear-gradient(135deg, #27ae60, #2ecc71); color: #ffffff; }
.result-fail { background: linear-gradient(135deg, #e84118, #c0392b); color: #ffffff; }
.result-icon { margin-bottom: 12px; }
.result-header h1 { color: #ffffff; font-size: 1.8rem; margin-bottom: 6px; }
.result-status { font-size: 0.95rem; opacity: 0.9; margin-bottom: 0; }
.result-test-name { font-size: 0.85rem; opacity: 0.8; margin-bottom: 0; margin-top: 6px; }

/* User Name Display in Result */
.result-user-name { font-size: 1.05rem; font-weight: 600; opacity: 0.95; margin-top: 8px; margin-bottom: 0; display: inline-flex; align-items: center; gap: 6px; }
.result-user-name svg { flex-shrink: 0; }

/* Attempt Info Bar */
.result-attempt-bar { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 12px; flex-wrap: wrap; }
.result-attempt-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 0.82rem; font-weight: 600; padding: 4px 14px; border-radius: 50px; background-color: rgba(255,255,255,0.25); color: #ffffff; }
.result-remaining-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 0.82rem; font-weight: 600; padding: 4px 14px; border-radius: 50px; background-color: rgba(255,255,255,0.15); color: rgba(255,255,255,0.9); }

/* Score Card */
.result-score-card { background-color: #ffffff; border-radius: 12px; padding: 28px; box-shadow: 0 4px 20px rgba(26,79,160,0.10); display: flex; align-items: center; gap: 24px; margin-bottom: 20px; }
.score-circle { width: 110px; height: 110px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; border: 4px solid rgba(255,255,255,0.3); }
.score-pass { background-color: #27ae60; color: #ffffff; }
.score-fail { background-color: #e84118; color: #ffffff; }
.score-percentage { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.8rem; }
.score-details { flex: 1; }
.score-item { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 0.88rem; }
.score-item:last-child { border-bottom: none; }
.score-label { color: #666666; }
.score-value { font-weight: 600; color: #0d2b6e; }
.text-pass { color: #27ae60 !important; }
.text-fail { color: #e84118 !important; }

/* Breakdown */
.result-breakdown { background-color: #ffffff; border-radius: 12px; padding: 24px; box-shadow: 0 4px 20px rgba(26,79,160,0.10); margin-bottom: 20px; }
.result-breakdown h2 { font-size: 1.15rem; margin-bottom: 16px; }
.breakdown-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.breakdown-item { text-align: center; padding: 16px; border-radius: 8px; }
.breakdown-correct { background-color: #eafaf1; }
.breakdown-wrong { background-color: #fff5f5; }
.breakdown-unanswered { background-color: #f4f7fc; }
.breakdown-number { display: block; font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.5rem; margin-bottom: 4px; }
.breakdown-correct .breakdown-number { color: #27ae60; }
.breakdown-wrong .breakdown-number { color: #e84118; }
.breakdown-unanswered .breakdown-number { color: #1a4fa0; }
.breakdown-label { font-size: 0.78rem; color: #666666; }

/* Negative Marks Info */
.negative-marks-info { background-color: #fff8e1; border: 1px solid #f39c12; border-radius: 8px; padding: 14px 18px; margin-bottom: 20px; font-size: 0.88rem; color: #8a6d3b; display: flex; align-items: center; gap: 8px; }
.negative-marks-info svg { color: #f39c12; flex-shrink: 0; }

/* Review Answers Section */
.result-answers-section { margin-bottom: 20px; }
.result-answers-toggle { border: 1px solid #e8e8e8; border-radius: 8px; overflow: hidden; }
.result-answers-toggle summary { padding: 16px 20px; font-weight: 600; color: #0d2b6e; cursor: pointer; background-color: #f4f7fc; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.result-answers-toggle summary::-webkit-details-marker { display: none; }
.result-answers-toggle .faq-chevron { width: 20px; height: 20px; transition: transform 0.25s; }
.result-answers-toggle[open] .faq-chevron { transform: rotate(180deg); }
.result-answers-list { padding: 16px 20px; }
.answer-item { padding: 14px 0; border-bottom: 1px solid #f0f0f0; }
.answer-item:last-child { border-bottom: none; }
.answer-item.answer-correct { background-color: transparent; }
.answer-item.answer-incorrect { background-color: transparent; }
.answer-header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; flex-wrap: wrap; }
.answer-q-num { font-weight: 600; color: #1a4fa0; font-size: 0.88rem; }
.answer-status-badge { font-size: 0.72rem; font-weight: 600; padding: 2px 10px; border-radius: 50px; }
.badge-correct { background-color: #eafaf1; color: #27ae60; }
.badge-wrong { background-color: #fff5f5; color: #e84118; }
.badge-skipped { background-color: #f4f7fc; color: #999999; }
.answer-marks-badge { font-size: 0.72rem; font-weight: 600; padding: 2px 10px; border-radius: 50px; background-color: #e8f0fe; color: #1a4fa0; }
.answer-question { font-size: 0.88rem; color: #333333; margin-bottom: 4px; line-height: 1.6; }
.answer-question-hindi { font-size: 0.85rem; color: #777777; margin-bottom: 8px; line-height: 1.6; border-left: 3px solid #f39c12; padding-left: 10px; }
.answer-options-mini { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.answer-option { font-size: 0.82rem; color: #555555; padding: 4px 8px; border-radius: 4px; }
.answer-option .option-hindi { font-size: 0.78rem; color: #999999; margin-left: 6px; }
.option-correct { background-color: #eafaf1; color: #27ae60; }
.option-wrong { background-color: #fff5f5; color: #e84118; text-decoration: line-through; }
.answer-correct-note { font-size: 0.82rem; color: #27ae60; font-weight: 500; margin-bottom: 0; }

/* Retake Info Card */
.result-retake-card { background-color: #ffffff; border-radius: 12px; padding: 20px; box-shadow: 0 4px 20px rgba(26,79,160,0.10); margin-bottom: 20px; text-align: center; }
.result-retake-card.retake-available { border: 1px solid #27ae60; }
.result-retake-card.retake-exhausted { border: 1px solid #e84118; }
.result-retake-card h3 { font-size: 1rem; margin-bottom: 8px; }
.result-retake-card p { font-size: 0.88rem; color: #666666; margin-bottom: 12px; }
.result-retake-card.retake-available h3 { color: #27ae60; }
.result-retake-card.retake-exhausted h3 { color: #e84118; }

/* Result Actions */
.result-actions { text-align: center; margin-top: 1.5rem; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.btn-back-practice { display: inline-flex; align-items: center; gap: 6px; padding: 12px 24px; background-color: #1a4fa0; color: #ffffff; border-radius: 6px; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 0.92rem; text-decoration: none; transition: background-color 0.25s, transform 0.25s; border: none; cursor: pointer; }
.btn-back-practice:hover { background-color: #0d2b6e; transform: translateY(-1px); color: #ffffff; }
.btn-print-result { display: inline-flex; align-items: center; gap: 6px; padding: 12px 24px; background-color: #ffffff; color: #1a4fa0; border: 2px solid #1a4fa0; border-radius: 6px; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 0.92rem; text-decoration: none; transition: background-color 0.25s, color 0.25s, transform 0.25s; cursor: pointer; }
.btn-print-result:hover { background-color: #1a4fa0; color: #ffffff; transform: translateY(-1px); }
.btn-retake-test { display: inline-flex; align-items: center; gap: 6px; padding: 12px 24px; background-color: #e84118; color: #ffffff; border-radius: 6px; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 0.92rem; text-decoration: none; transition: background-color 0.25s, transform 0.25s; border: none; cursor: pointer; }
.btn-retake-test:hover { background-color: #c73510; transform: translateY(-1px); color: #ffffff; }

/* Print styles */
@media print {
  .btn-back-practice, .btn-print-result, .btn-retake-test, .site-header, .site-footer, .page-banner, .result-retake-card { display: none !important; }
  .practice-result-section { background-color: #ffffff; padding: 20px 0; }
  .result-header { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .score-circle { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .breakdown-item { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .option-correct { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .option-wrong { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .badge-correct, .badge-wrong, .badge-skipped { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Responsive */
@media (max-width: 576px) {
  .result-score-card { flex-direction: column; text-align: center; }
  .breakdown-grid { grid-template-columns: 1fr; }
  .result-attempt-bar { flex-direction: column; gap: 8px; }
}
</style>

<!-- ============================================================
     Practice Result Section
     ============================================================ -->
<section class="practice-result-section section-offwhite" aria-label="<?= __('practice.result') ?>">
    <div class="container">
        <div class="result-wrapper">
            <!-- Result Header with User Name + Attempt Info -->
            <div class="result-header <?= $isPassed ? 'result-pass' : 'result-fail' ?>">
                <div class="result-icon" aria-hidden="true">
                    <?php if ($isPassed): ?>
                    <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 11-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
                    <?php else: ?>
                    <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/></svg>
                    <?php endif; ?>
                </div>
                <h1><?= $isPassed ? __('practice.congratulations_passed') : __('practice.keep_trying') ?></h1>
                <p class="result-status"><?= $isPassed ? __('practice.passed_message') : __('practice.failed_message') ?></p>

                <!-- User Name (prominent) -->
                <?php if (!empty($userName)): ?>
                <p class="result-user-name">
                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 00-3-3.87"/><path d="M4 21v-2a4 4 0 013-3.87"/><circle cx="12" cy="7" r="4"/></svg>
                    <?= htmlspecialchars($userName, ENT_QUOTES, 'UTF-8') ?>
                </p>
                <?php endif; ?>

                <?php if (!empty($set['title'])): ?>
                <p class="result-test-name"><?= htmlspecialchars(getBilingual($set, 'title'), ENT_QUOTES, 'UTF-8') ?></p>
                <?php endif; ?>

                <!-- Attempt Info Bar -->
                <div class="result-attempt-bar">
                    <?php if (!empty($attemptLabel)): ?>
                    <span class="result-attempt-badge">
                        <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 11 12 14 22 4"/><path d="M21 12v7a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h11"/></svg>
                        <?= htmlspecialchars($attemptLabel, ENT_QUOTES, 'UTF-8') ?>
                    </span>
                    <?php endif; ?>
                    <?php if ($maxAttempts > 0): ?>
                    <span class="result-remaining-badge">
                        <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
                        <?= $remainingAttempts > 0 ? $remainingAttempts . ' ' . __('practice.attempt') . ($remainingAttempts !== 1 ? 's' : '') . ' ' . __('practice.remaining') : __('practice.no_attempts_remaining') ?>
                    </span>
                    <?php endif; ?>
                </div>
            </div>

            <!-- Score Display -->
            <div class="result-score-card">
                <div class="score-circle <?= $isPassed ? 'score-pass' : 'score-fail' ?>">
                    <span class="score-percentage"><?= $percentage ?>%</span>
                </div>
                <div class="score-details">
                    <div class="score-item">
                        <span class="score-label"><?= __('practice.obtained_marks') ?></span>
                        <span class="score-value"><?= number_format($totalObtained, 1) ?> / <?= $totalMarks ?></span>
                    </div>
                    <div class="score-item">
                        <span class="score-label"><?= __('practice.pass_marks_label') ?></span>
                        <span class="score-value"><?= $passMarks ?></span>
                    </div>
                    <div class="score-item">
                        <span class="score-label"><?= __('practice.status') ?></span>
                        <span class="score-value <?= $isPassed ? 'text-pass' : 'text-fail' ?>"><?= $isPassed ? __('practice.pass_status') : __('practice.fail_status') ?></span>
                    </div>
                </div>
            </div>

            <!-- Negative Marks Info -->
            <?php if ($negativeMarks > 0): ?>
            <div class="negative-marks-info">
                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
                <span><?= __('practice.negative_marking_info', ['negative' => htmlspecialchars($negativeMarks, ENT_QUOTES, 'UTF-8'), 'deducted' => number_format($wrongCount * $negativeMarks, 1)]) ?></span>
            </div>
            <?php endif; ?>

            <!-- Breakdown -->
            <div class="result-breakdown">
                <h2><?= __('practice.score_breakdown') ?></h2>
                <div class="breakdown-grid">
                    <div class="breakdown-item breakdown-correct">
                        <span class="breakdown-number"><?= $correctCount ?></span>
                        <span class="breakdown-label"><?= __('practice.correct_answers') ?></span>
                    </div>
                    <div class="breakdown-item breakdown-wrong">
                        <span class="breakdown-number"><?= $wrongCount ?></span>
                        <span class="breakdown-label"><?= __('practice.wrong_answers') ?></span>
                    </div>
                    <div class="breakdown-item breakdown-unanswered">
                        <span class="breakdown-number"><?= $unansweredCount ?></span>
                        <span class="breakdown-label"><?= __('practice.unanswered') ?></span>
                    </div>
                </div>
            </div>

            <!-- Retake Info Card -->
            <?php if ($maxAttempts > 0): ?>
            <?php if ($remainingAttempts > 0): ?>
            <div class="result-retake-card retake-available">
                <h3>
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:middle;margin-right:4px;"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 11-2.12-9.36L23 10"/></svg>
                    <?= __('practice.can_retake') ?>
                </h3>
                <p><?= __('practice.remaining_attempts_msg', ['remaining' => $remainingAttempts, 'attempt_word' => $remainingAttempts !== 1 ? __('practice.attempts') : __('practice.attempt'), 'max' => $maxAttempts]) ?></p>
                <a href="<?= $basePath ?>/practice/<?= (int) ($set['id'] ?? 0) ?>" class="btn-retake-test" style="margin-top:4px;">
                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 11-2.12-9.36L23 10"/></svg>
                    <?= __('practice.retake_test') ?>
                </a>
            </div>
            <?php else: ?>
            <div class="result-retake-card retake-exhausted">
                <h3>
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:middle;margin-right:4px;"><circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/></svg>
                    <?= __('practice.no_attempts_remaining') ?>
                </h3>
                <p><?= __('practice.all_attempts_used_msg', ['max' => $maxAttempts]) ?></p>
            </div>
            <?php endif; ?>
            <?php endif; ?>

            <!-- Review Answers (Expandable) -->
            <?php if ($showReview): ?>
            <div class="result-answers-section">
                <details class="result-answers-toggle">
                    <summary>
                        <?= __('practice.review_answers') ?>
                        <span class="faq-chevron" aria-hidden="true">
                            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>
                        </span>
                    </summary>
                    <div class="result-answers-list">
                        <?php foreach ($reviewQuestions as $index => $question): ?>
                            <?php
                            $userAnswer    = $question['selected'] ?? null;
                            $correctAnswer = $question['correct_answer'] ?? '';
                            $isCorrect     = !empty($question['is_correct']);
                            $earned        = (float) ($question['earned'] ?? 0);
                            $questionText  = $question['question_text'] ?? '';
                            $questionHindi = $question['question_text_hindi'] ?? '';
                            $marks         = (int) ($question['marks'] ?? 1);
                            ?>
                            <div class="answer-item <?= $isCorrect ? 'answer-correct' : 'answer-incorrect' ?>">
                                <div class="answer-header">
                                    <span class="answer-q-num"><?= __('practice.question') ?> <?= $index + 1 ?></span>
                                    <span class="answer-status-badge <?= $isCorrect ? 'badge-correct' : ($userAnswer ? 'badge-wrong' : 'badge-skipped') ?>">
                                        <?= $isCorrect ? __('practice.correct') : ($userAnswer ? __('practice.wrong') : __('practice.skipped')) ?>
                                    </span>
                                    <span class="answer-marks-badge"><?= number_format($earned, 1) ?> / <?= $marks ?> <?= __('practice.marks') ?></span>
                                </div>
                                <p class="answer-question"><?= htmlspecialchars($questionText, ENT_QUOTES, 'UTF-8') ?></p>
                                <?php if (!empty($questionHindi)): ?>
                                <p class="answer-question-hindi"><?= htmlspecialchars($questionHindi, ENT_QUOTES, 'UTF-8') ?></p>
                                <?php endif; ?>
                                <div class="answer-options-mini">
                                    <?php
                                    $optionKeys = ['a', 'b', 'c', 'd'];
                                    $optionFields = [];
                                    foreach ($optionKeys as $key) {
                                        $optionFields[$key] = [
                                            'text' => $question['option_' . $key] ?? '',
                                            'text_hindi' => $question['option_' . $key . '_hindi'] ?? '',
                                        ];
                                    }
                                    ?>
                                    <?php foreach ($optionFields as $key => $optionData): ?>
                                    <?php if (!empty($optionData['text'])): ?>
                                    <span class="answer-option <?= $key === $correctAnswer ? 'option-correct' : '' ?><?= $key === $userAnswer && $key !== $correctAnswer ? 'option-wrong' : '' ?>">
                                        <strong><?= strtoupper($key) ?>.</strong> <?= htmlspecialchars($optionData['text'], ENT_QUOTES, 'UTF-8') ?>
                                        <?php if (!empty($optionData['text_hindi'])): ?>
                                        <span class="option-hindi">(<?= htmlspecialchars($optionData['text_hindi'], ENT_QUOTES, 'UTF-8') ?>)</span>
                                        <?php endif; ?>
                                    </span>
                                    <?php endif; ?>
                                    <?php endforeach; ?>
                                </div>
                                <?php if (!$isCorrect && !empty($correctAnswer)): ?>
                                <p class="answer-correct-note"><?= __('practice.correct_answer') ?>: <strong><?= strtoupper($correctAnswer) ?></strong></p>
                                <?php endif; ?>
                            </div>
                        <?php endforeach; ?>
                    </div>
                </details>
            </div>
            <?php endif; ?>

            <!-- Actions -->
            <div class="result-actions">
                <a href="<?= $basePath ?>/practice" class="btn-back-practice">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="15 18 9 12 15 6"/></svg>
                    <?= __('practice.back_to_list') ?>
                </a>
                <a href="<?= $basePath ?>/practice/history" class="btn-print-result" style="border-color:#27ae60;color:#27ae60;">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
                    <?= __('practice.my_test_history') ?>
                </a>
                <button type="button" class="btn-print-result" onclick="window.print();">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="6 9 6 2 18 2 18 9"/><path d="M6 18H4a2 2 0 01-2-2v-5a2 2 0 012-2h16a2 2 0 012 2v5a2 2 0 01-2 2h-2"/><rect x="6" y="14" width="12" height="8"/></svg>
                    <?= __('practice.print_result') ?>
                </button>
            </div>
        </div>
    </div>
</section>

<?php include __DIR__ . '/../layouts/footer.php'; ?>
