{% extends "exams/base.html" %}
{% block content %}

<div class="container mt-4">

  <div class="d-flex justify-content-between align-items-center mb-3">
    <h4>
      <i class="fas fa-layer-group"></i> Academic Levels
    </h4>

    <a href="{% url 'exams:academic_level_add' %}" class="btn btn-primary btn-sm">
      <i class="fas fa-plus"></i> Add Level
    </a>
  </div>

  <table class="table table-bordered table-striped">
    <thead class="table-dark">
      <tr>
        <th>Code</th>
        <th>Name</th>
        <th>Status</th>
      </tr>
    </thead>

    <tbody>
      {% for level in levels %}
      <tr>
        <td>{{ level.code }}</td>
        <td>{{ level.name }}</td>
        <td>
          {% if level.is_active %}
            <span class="badge bg-success">Active</span>
          {% else %}
            <span class="badge bg-secondary">Inactive</span>
          {% endif %}
        </td>
      </tr>
      {% empty %}
      <tr>
        <td colspan="3" class="text-center text-muted">
          No academic levels found
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

</div>

{% endblock %}