{% 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-book"></i> Subjects
    </h4>

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

  <table class="table table-bordered table-striped">
    <thead class="table-dark">
      <tr>
        <th>Code</th>
        <th>Name (EN)</th>
        <th>Name (SW)</th>
        <th>Status</th>
        <th width="150">Actions</th>
      </tr>
    </thead>

    <tbody>
      {% for s in subjects %}
      <tr>
        <td>{{ s.subject_code }}</td>
        <td>{{ s.subject_name_eng }}</td>
        <td>{{ s.subject_name_sw }}</td>
        <td>
          {% if s.is_active %}
            <span class="badge bg-success">Active</span>
          {% else %}
            <span class="badge bg-secondary">Inactive</span>
          {% endif %}
        </td>
        <td>
          <a href="{% url 'exams:subject_edit' s.subject_id %}"
             class="btn btn-sm btn-info">
            <i class="fas fa-edit"></i>
          </a>

          <a href="{% url 'exams:subject_delete' s.subject_id %}"
             class="btn btn-sm btn-danger"
             onclick="return confirm('Delete this subject?');">
            <i class="fas fa-trash"></i>
          </a>
        </td>
      </tr>
      {% empty %}
      <tr>
        <td colspan="5" class="text-center text-muted">
          No subjects found
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

</div>

{% endblock %}