{% extends "base.html" %}
{% load vergabe_tags %}
{% block title %}{{ dokument.dateiname }}{% endblock %}
{% block content %}

<div class="flex items-center justify-between mb-4">
  <h1 class="page-title">{{ dokument.dateiname|default:"Dokument" }}</h1>
  <a href="{% url 'ausschreibungen:dokumente:liste' ausschreibung.pk %}" class="btn-ghost text-xs">← Übersicht</a>
</div>

<div class="grid grid-cols-3 gap-4">
  <div class="col-span-2 space-y-4">

    <div class="card space-y-3">
      <div class="flex items-center gap-3">
        {% status_badge dokument.status dokument.get_status_display %}
        {% if dokument.finale_abgabeversion %}
        <span class="text-xs bg-green-100 text-green-700 px-2 py-0.5 rounded font-medium">Finale Abgabeversion</span>
        {% endif %}
        <span class="text-xs text-slate-500">v{{ dokument.version }}</span>
      </div>
      {% if dokument.datei %}
      <a href="{{ dokument.datei.url }}" target="_blank" class="btn-primary text-xs inline-block">↓ Herunterladen</a>
      {% endif %}
      {% if dokument.beschreibung %}
      <p class="text-sm text-slate-700 whitespace-pre-wrap">{{ dokument.beschreibung }}</p>
      {% endif %}
    </div>

    {% if versionen.count > 1 %}
    <div class="card">
      <p class="text-xs font-medium text-slate-500 uppercase tracking-wide mb-3">Versionshistorie</p>
      <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">Version</th>
            <th class="pb-2 pr-4">Status</th>
            <th class="pb-2">Datum</th>
          </tr>
        </thead>
        <tbody class="divide-y divide-slate-100">
          {% for v in versionen %}
          <tr class="{% if v.pk == dokument.pk %}bg-blue-50{% else %}hover:bg-slate-50{% endif %}">
            <td class="py-2 pr-4">
              <a href="{% url 'ausschreibungen:dokumente:detail' ausschreibung.pk v.pk %}"
                 class="{% if v.pk == dokument.pk %}font-semibold text-blue-700{% else %}text-slate-700 hover:text-blue-600{% endif %}">
                v{{ v.version }}
              </a>
            </td>
            <td class="py-2 pr-4">{% status_badge v.status v.get_status_display %}</td>
            <td class="py-2 text-xs text-slate-500">{{ v.upload_datum|date:"d.m.Y" }}</td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
    {% endif %}

    {% if freigaben %}
    <div class="card">
      <p class="text-xs font-medium text-slate-500 uppercase tracking-wide mb-3">Freigaben</p>
      <ul class="space-y-2">
        {% for fg in freigaben %}
        <li class="text-sm text-slate-700">
          {% status_badge fg.status fg.get_status_display %}
          <span class="ml-2 text-slate-500">{{ fg.freigebender }}</span>
          {% if fg.kommentar %}<span class="ml-2 text-slate-400 text-xs">— {{ fg.kommentar }}</span>{% endif %}
        </li>
        {% endfor %}
      </ul>
    </div>
    {% endif %}

  </div>

  <div class="space-y-4">

    <div class="card space-y-2">
      <p class="text-xs font-medium text-slate-500 uppercase tracking-wide">Details</p>
      <p class="text-xs text-slate-600">Kategorie: <span class="font-medium">{{ dokument.get_kategorie_display }}</span></p>
      <p class="text-xs text-slate-600">Hochgeladen: <span class="font-medium">{{ dokument.upload_datum|date:"d.m.Y H:i" }}</span></p>
      {% if dokument.verantwortlicher %}
      <p class="text-xs text-slate-600">Verantwortlicher: {{ dokument.verantwortlicher }}</p>
      {% endif %}
      {% if dokument.pruefer %}
      <p class="text-xs text-slate-600">Prüfer: {{ dokument.pruefer }}</p>
      {% endif %}
      {% if dokument.los %}
      <p class="text-xs text-slate-600">Los: {{ dokument.los }}</p>
      {% endif %}
      {% if dokument.quelle %}
      <p class="text-xs text-slate-600">Quelle: {{ dokument.quelle }}</p>
      {% endif %}
      {% if dokument.bibliothek_nachweis %}
      <div class="border-t border-slate-100 pt-2 mt-2">
        <p class="text-xs text-slate-500 mb-1">Aus Bibliothek</p>
        <p class="text-xs font-medium text-slate-700">{{ dokument.bibliothek_nachweis.titel }}</p>
        {% if dokument.bibliothek_nachweis.ist_abgelaufen %}
        <p class="text-xs text-red-600 mt-1">Nachweis abgelaufen!</p>
        {% elif dokument.bibliothek_nachweis.gueltig_bis %}
        <p class="text-xs text-slate-500">Gültig bis: {{ dokument.bibliothek_nachweis.gueltig_bis|date:"d.m.Y" }}</p>
        {% endif %}
      </div>
      {% endif %}
    </div>

    <div class="card space-y-2">
      <p class="text-xs font-medium text-slate-500 uppercase tracking-wide">Aktionen</p>
      {% if not dokument.finale_abgabeversion %}
      <a href="{% url 'ausschreibungen:dokumente:neue_version' ausschreibung.pk dokument.pk %}" class="btn-secondary text-xs w-full block text-center">Neue Version hochladen</a>
      <form method="post" action="{% url 'ausschreibungen:dokumente:finale_version' ausschreibung.pk dokument.pk %}">
        {% csrf_token %}
        <button type="submit" class="btn-primary text-xs w-full mt-2">Als finale Abgabeversion kennzeichnen</button>
      </form>
      {% endif %}
      <a href="{% url 'ausschreibungen:dokumente:bibliothek_zuordnen' ausschreibung.pk dokument.pk %}" class="btn-ghost text-xs w-full block text-center mt-1">Aus Bibliothek zuordnen</a>
    </div>

  </div>
</div>

{% endblock %}