{% extends "base.html" %}
{% block title %}Result · {{ exam.title }}{% endblock %}
{% block content %}
<div class="card" style="max-width:720px;margin:0 auto;text-align:center">
  <div class="crumbs" style="text-align:left"><a href="{{ url_for('student_home') }}">My exams</a></div>
  <h1>{{ exam.title }}</h1>
  <p class="muted">Submitted {{ att.submitted_at|dt }}</p>
  {% if exam.show_result and pct is not none %}
    <div class="bigscore" style="color:{{ 'var(--ok)' if pct >= exam.pass_mark else 'var(--bad)' }}">{{ '%.0f'|format(pct) }}%</div>
    <p style="font-size:1.1rem">{{ att.score|num }} out of {{ att.total|num }} marks</p>
    <span class="badge {{ 'ok' if pct >= exam.pass_mark else 'bad' }}">{{ 'Passed' if pct >= exam.pass_mark else 'Below the pass mark (' ~ (exam.pass_mark|num) ~ '%)' }}</span>
  {% else %}
    <div class="bigscore">✓</div>
    <p style="font-size:1.1rem">Your answers have been submitted. Your teacher will share the result.</p>
  {% endif %}
  <p style="margin-top:22px"><a class="btn primary" href="{{ url_for('student_home') }}">Back to my exams</a></p>
</div>

{% if rows %}
<div style="max-width:720px;margin:24px auto 0">
  <h2>Review</h2>
  {% for r in rows %}
  <div class="rev {{ 'ok' if r.ok else 'bad' }}">
    <b><span class="qnum">{{ loop.index }}.</span>{{ r.q.text }}</b>{% if r.q.image %}<br><img class="qimg" src="{{ qimg(r.q.image) }}" alt="">{% endif %}
    <div class="small" style="margin-top:6px">Your answer: <b>{{ r.given_text }}</b></div>
    {% if not r.ok %}<div class="small">Correct answer: <b>{{ r.correct_text }}</b></div>{% endif %}
  </div>
  {% endfor %}
</div>
{% endif %}
{% endblock %}