{% load vergabe_tags %}
<div class="fixed inset-0 bg-black/40 flex items-center justify-center z-50"
     x-data @click.self="$el.remove()">
  <div class="bg-white rounded-xl shadow-xl w-full max-w-lg p-6" @click.stop>
    <div class="flex items-center justify-between mb-4">
      <h2 class="text-sm font-semibold text-slate-800">Nachweis zuordnen</h2>
      <button @click="$el.closest('.fixed').remove()" class="text-slate-400 hover:text-slate-600 text-lg leading-none">&times;</button>
    </div>

    <form hx-get="{% url 'ausschreibungen:lose:nachweis_suche' ausschreibung_id anforderung.pk %}"
          hx-target="#nachweis-modal"
          hx-trigger="input delay:300ms"
          class="mb-4">
      <input type="text" name="q" value="{{ q }}"
             placeholder="Nachweis suchen…"
             class="form-input w-full" autofocus>
    </form>

    {% if nachweise %}
    <ul class="divide-y divide-slate-100 max-h-64 overflow-y-auto text-sm">
      {% for n in nachweise %}
      <li class="py-2 flex items-center justify-between">
        <div>
          <span class="font-medium">{{ n.titel }}</span>
          {% if n.gueltig_bis %}
          <span class="ml-2 text-xs {% if n.ist_abgelaufen %}text-red-600{% else %}text-slate-500{% endif %}">
            bis {{ n.gueltig_bis }}
          </span>
          {% endif %}
          {% status_badge n.freigabestatus n.get_freigabestatus_display %}
        </div>
        {% if n.pk in bereits_zugeordnet %}
          <span class="text-xs text-green-600 font-medium">Bereits zugeordnet</span>
        {% else %}
          <form method="post"
                action="{% url 'ausschreibungen:lose:nachweis_zuordnen' ausschreibung_id anforderung.pk %}"
                hx-post="{% url 'ausschreibungen:lose:nachweis_zuordnen' ausschreibung_id anforderung.pk %}"
                hx-target="#nachweise-liste"
                hx-swap="innerHTML"
                hx-on::after-request="$el.closest('.fixed').remove()">
            {% csrf_token %}
            <input type="hidden" name="nachweis_pk" value="{{ n.pk }}">
            <button type="submit" class="btn-ghost text-xs">Zuordnen</button>
          </form>
        {% endif %}
      </li>
      {% endfor %}
    </ul>
    {% else %}
    <p class="text-sm text-slate-500 text-center py-4">Keine Nachweise gefunden.</p>
    {% endif %}
  </div>
</div>