<article class="quiz-review-item{% if _question.answer and _question.answer.is_correct %} quiz-review-correct{% else %} quiz-review-wrong{% endif %}">
    <header class="quiz-question-head">
        <span class="quiz-question-index">{{ _question.position + 1 }}</span>
        <span class="quiz-question-kind">{{ _question.kind_label }}</span>
        <span class="quiz-question-points">{{ format_number(_question.answer.awarded_points if _question.answer else 0) }} / {{ _question.points }} points</span>
    </header>

    <div class="quiz-question-prompt rendered-content">{{ render_content(_question.prompt) }}</div>

    {% if _question.answer and _question.answer.answer_text %}
    <p class="quiz-review-answer"><span class="quiz-review-label">Your answer</span> {{ _question.answer.answer_text }}</p>
    {% endif %}

    {% if _question.options %}
    <ul class="quiz-preview-options">
        {% for option in _question.options %}
        <li class="quiz-preview-option{% if option.is_correct %} quiz-preview-correct{% endif %}{% if _question.answer and option.uid in _question.answer.option_uids %} quiz-preview-chosen{% endif %}">
            <span>{{ option.label }}</span>
            {% if option.match_value %}<span class="quiz-preview-match">&rarr; {{ option.match_value }}</span>{% endif %}
        </li>
        {% endfor %}
    </ul>
    {% endif %}

    {% if _question.answer and _question.answer.feedback %}
    <p class="quiz-grade-feedback">{{ _question.answer.feedback }}</p>
    {% endif %}

    {% if _question.answer and _question.answer.graded_by == 'fallback' %}
    <p class="quiz-grade-fallback" role="status">Automatic review was unavailable, so this answer was scored on keyword overlap.</p>
    {% endif %}

    {% if _question.explanation %}
    <div class="quiz-explanation rendered-content">{{ render_content(_question.explanation) }}</div>
    {% endif %}
</article>
