{% extends "management/base.html" %}
{% load i18n lucide %}

{% block heading %}{% trans "Referee levels" %}{% endblock heading %}
{% block topbar_context %}<span class="text-sm text-muted">{% trans "Which teams' home games each level qualifies a referee for." %}</span>{% endblock topbar_context %}

{% block actions %}
    {% if is_club_admin %}
        <a class="btn btn-primary gap-2" href="{% url 'management:referee_level_create' %}">{% lucide "plus" size=16 %} {% trans "New level" %}</a>
    {% endif %}
{% endblock actions %}

{% block panel %}
    <div class="card overflow-hidden">
        <table class="table">
            <thead>
                <tr>
                    <th>{% trans "Name" %}</th>
                    <th>{% trans "Inherits from" %}</th>
                    <th>{% trans "Qualifies for" %}</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                {% for level in levels %}
                    <tr>
                        <td class="font-semibold text-ink">{{ level.name }}</td>
                        <td>
                            {% if level.inherits_from %}
                                <span class="badge badge-info badge-sm">{{ level.inherits_from.name }}</span>
                            {% else %}
                                <span class="text-dim">—</span>
                            {% endif %}
                        </td>
                        <td>
                            {% for team in level.teams.all %}
                                <span class="badge badge-outline badge-sm">{{ team.name }}</span>
                            {% empty %}
                                {% if not level.inherits_from %}<span class="text-dim">—</span>{% endif %}
                            {% endfor %}
                            {% if level.inherits_from %}
                                <div class="mt-1 text-xs text-muted">{% blocktrans with name=level.inherits_from.name %}+ everything “{{ name }}” covers{% endblocktrans %}</div>
                            {% endif %}
                        </td>
                        <td class="text-right">
                            {% if is_club_admin %}
                                <a class="btn btn-outline btn-sm gap-2" href="{% url 'management:referee_level_update' level.pk %}">{% lucide "pencil" size=14 %} {% trans "Edit" %}</a>
                            {% endif %}
                        </td>
                    </tr>
                {% empty %}
                    <tr>
                        <td colspan="4" class="text-center text-muted">{% trans "No referee levels yet." %}</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
{% endblock panel %}