{% extends "base.html" %}
{% block title %}Quizzes – {{ app_title }}{% endblock %}

{% block content %}
<section class="quiz-list">
  <h1>Quizzes</h1>
  {% if quizzes %}
  <ul class="quiz-grid">
    {% for q in quizzes %}
    <li
      class="quiz-card {% if q.id in completed_ids %}completed{% elif q.id in in_progress_ids %}in-progress{% endif %}">
      {% if q.id in completed_ids %}
      <a href="{{ request.url_for('quiz_results', quiz_id=q.id, attempt_id=completed_ids[q.id]) }}">
        <span class="quiz-name">{{ q.name }}</span>
        <span class="badge badge-done">Completed</span>
      </span>
      {% elif q.id in in_progress_ids %}
      <a href="{{ request.url_for('quiz_start', quiz_id=q.id) }}">
        <span class="quiz-name">{{ q.name }}</span>
        <span class="badge badge-progress">In Progress</span>
      </a>
      {% else %}
      <a href="{{ request.url_for('quiz_start', quiz_id=q.id) }}">
        <span class="quiz-name">{{ q.name }}</span>
        <span class="badge badge-new">New</span>
      </a>
      {% endif %}
    </li>
    {% endfor %}
  </ul>
  {% else %}
  <p class="empty-state">No quizzes available yet.</p>
  {% endif %}
</section>
{% endblock %}