{% load vergabe_tags %}
{% if grouped %}
  {% for los, anforderungen in grouped.items %}
  <div x-data="{ open: true }" class="card mb-4">
    <button @click="open = !open"
            class="w-full flex items-center justify-between text-left">
      <h3 class="text-sm font-semibold text-slate-700">
        {% if los %}Los {{ los.losnummer }}: {{ los.lostitel }}{% else %}Allgemein{% endif %}
        <span class="text-slate-400 font-normal ml-1">({{ anforderungen|length }})</span>
      </h3>
      <span x-text="open ? '▲' : '▼'" class="text-xs text-slate-400"></span>
    </button>

    <div x-show="open" class="mt-3">
      <table class="w-full text-sm">
        <thead>
          <tr class="border-b border-slate-200 text-left text-xs text-slate-500">
            <th class="pb-2 pr-4">Titel</th>
            <th class="pb-2 pr-4">Verbindlichkeit</th>
            <th class="pb-2 pr-4">Status</th>
            <th class="pb-2">Zuständig</th>
          </tr>
        </thead>
        <tbody class="divide-y divide-slate-100">
          {% for a in anforderungen %}
          <tr class="hover:bg-slate-50
                     {% if a.ausschlusskriterium and a.erfuellungsstatus == 'nicht_erfuellbar' %}bg-red-50 border-l-2 border-red-400{% endif %}">
            <td class="py-2 pr-4">
              <a href="{% url 'ausschreibungen:lose:anforderung_detail' ausschreibung.pk a.pk %}"
                 class="text-brand-600 hover:underline">{{ a.titel }}</a>
              {% if a.ausschlusskriterium %}
                <span class="ml-1 text-xs text-red-600 font-medium">⚠ AK</span>
              {% endif %}
            </td>
            <td class="py-2 pr-4">{% status_badge a.verbindlichkeit a.get_verbindlichkeit_display %}</td>
            <td class="py-2 pr-4">{% status_badge a.erfuellungsstatus a.get_erfuellungsstatus_display %}</td>
            <td class="py-2 text-slate-500">{{ a.zustaendiger|default:"—" }}</td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
  {% endfor %}
{% else %}
<div class="card text-center text-sm text-slate-500 py-8">
  Keine Anforderungen gefunden.
</div>
{% endif %}