{% comment %}
M&EL Reports & Feedback surface — section tabs.

Include below the page ``<header>`` on report_list, template_list, feedback inbox,
and survey_list. Templates is role-gated (officers only).
{% endcomment %}
{% with ns=request.resolver_match.namespace url_name=request.resolver_match.url_name %}
<div class="border-b border-ruforum-border mb-6">
  <nav class="-mb-px flex flex-wrap gap-1" role="tablist" aria-label="MEL reports and feedback sections">
    <a href="{% url 'mel_reports:report_list' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_reports' and url_name|slice:':7' == 'report_' and url_name != 'report_builder' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_reports' and url_name|slice:':7' == 'report_' and url_name != 'report_builder' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Reports
    </a>
    <a href="{% url 'mel_feedback:inbox' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_feedback' and url_name == 'inbox' %}true{% elif ns == 'mel_feedback' and url_name == 'detail' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_feedback' and url_name == 'inbox' %}border-ruforum-primary text-ruforum-primary{% elif ns == 'mel_feedback' and url_name == 'detail' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Feedback inbox
    </a>
    <a href="{% url 'mel_feedback:survey_list' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_feedback' and url_name|slice:':6' == 'survey' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_feedback' and url_name|slice:':6' == 'survey' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Surveys
    </a>
    {% if user.role == 'mel_officer' or user.is_superuser or user.role == 'admin' or user.role == 'system_admin' %}
    <a href="{% url 'mel_reports:template_list' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_reports' and url_name|slice:':8' == 'template' %}true{% elif ns == 'mel_reports' and url_name == 'report_builder' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_reports' and url_name|slice:':8' == 'template' %}border-ruforum-primary text-ruforum-primary{% elif ns == 'mel_reports' and url_name == 'report_builder' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Templates
    </a>
    <a href="{% url 'mel_reports:scheduled_reports' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_reports' and url_name|slice:':9' == 'scheduled' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_reports' and url_name|slice:':9' == 'scheduled' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Schedules
    </a>
    <a href="{% url 'mel_reports:compliance_alerts' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_reports' and url_name|slice:':10' == 'compliance' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_reports' and url_name|slice:':10' == 'compliance' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Compliance
    </a>
    <a href="{% url 'mel_reports:webhooks_list' %}"
       role="tab"
       aria-selected="{% if ns == 'mel_reports' and url_name|slice:':8' == 'webhooks' %}true{% else %}false{% endif %}"
       class="rounded-t-md border-b-2 px-4 py-2 font-meta text-xs uppercase tracking-[0.10em] transition-colors
              {% if ns == 'mel_reports' and url_name|slice:':8' == 'webhooks' %}border-ruforum-primary text-ruforum-primary{% else %}border-transparent text-ruforum-text-muted hover:text-ruforum-text hover:border-ruforum-border{% endif %}">
      Webhooks
    </a>
    {% endif %}
  </nav>
</div>
{% endwith %}