<?php $locale = (string) ($participant['language'] ?? current_locale()); ?>
<section class="test-header">
    <div>
        <p class="eyebrow"><?= e(trans('common.participant', [], $locale)) ?></p>
        <h1><?= e($participant['full_name']) ?></h1>
    </div>
    <div class="progress-pill"><?= e(trans('participant.question_progress', ['step' => $currentStep, 'total' => $totalQuestions], $locale)) ?></div>
</section>

<section class="card question-card">
    <div class="question-meta">
        <span class="tag" style="--tag-accent: <?= e($area['color'] ?? '#333333') ?>">
            <?= e($question['area_code']) ?> - <?= e(area_name((string) $question['area_code'], $locale)) ?>
        </span>
        <div class="progress-bar" aria-hidden="true">
            <span style="width: <?= e((string) round(($currentStep / $totalQuestions) * 100)) ?>%"></span>
        </div>
    </div>

    <h2><?= e($question['statement']) ?></h2>
    <p class="support-copy"><?= e(trans('participant.test_support', [], $locale)) ?></p>

    <form method="post" action="<?= e(base_url('/participant/test')) ?>" class="stack-form answer-form">
        <input type="hidden" name="_csrf" value="<?= e(csrf_token()) ?>">
        <input type="hidden" name="step" value="<?= e((string) $currentStep) ?>">

        <div class="answer-grid">
            <label class="answer-option">
                <input type="radio" name="answer" value="1" <?= (string) $selectedAnswer === '1' ? 'checked' : '' ?> required>
                <span><?= e(trans('participant.answer_yes', [], $locale)) ?></span>
            </label>
            <label class="answer-option">
                <input type="radio" name="answer" value="0" <?= (string) $selectedAnswer === '0' ? 'checked' : '' ?> required>
                <span><?= e(trans('participant.answer_no', [], $locale)) ?></span>
            </label>
        </div>

        <div class="form-actions">
            <?php if ($previousStep !== null): ?>
                <a class="ghost-button" href="<?= e(base_url('/participant/test?step=' . $previousStep)) ?>"><?= e(trans('common.previous', [], $locale)) ?></a>
            <?php else: ?>
                <span></span>
            <?php endif; ?>

            <button class="primary-button" type="submit">
                <?= e($nextStep === null ? trans('common.finish_test', [], $locale) : trans('common.save_continue', [], $locale)) ?>
            </button>
        </div>
    </form>
</section>