{% extends 'base.html' %}

{% block content %}
<div class="container py-5">
  <div class="col-lg-8 mx-auto">
    <div class="card shadow-sm">
      <div class="card-body">
        <h2 class="h4">Attempt by {{ attempt.user }}</h2>
        <p class="text-muted">Assessment: {{ attempt.assessment.title }}</p>
        <p class="mb-3">Score: <strong>{{ attempt.score }}</strong></p>

        <h3 class="h6">Answers</h3>
        <ul class="list-group mb-3">
          {% for ans in answers %}
          <li class="list-group-item d-flex justify-content-between align-items-start">
            <div>
              <div class="fw-semibold">Q: {{ ans.question.prompt }}</div>
              <div class="text-muted">Your answer: {{ ans.given_answer }}</div>
              <div class="text-muted">Correct: {{ ans.question.correct_answer }}</div>
            </div>
            <div>
              {% if ans.is_correct %}
              <span class="badge bg-success">Correct</span>
              {% else %}
              <span class="badge bg-danger">Incorrect</span>
              {% endif %}
            </div>
          </li>
          {% endfor %}
        </ul>

        <a class="btn btn-secondary" href="{% url 'cbt:admin_attempts_list' %}">Back to attempts</a>
      </div>
    </div>
  </div>
</div>
{% endblock %}