{% extends "ui/templates/base/layout.html" %}
{% block content %}
{% include "modules/consultants/templates/consultants/_consultant_tabs.html" %}
<div class="space-y-6">
  <div class="flex flex-wrap items-start justify-between gap-4">
    <div>
      <h2 class="text-xl font-semibold text-slate-900">Shared Documents</h2>
      <p class="text-sm text-slate-500">Documents visible through your active client links. Internal firm-only documents are not listed.</p>
    </div>
  </div>

  <form method="get" class="rounded-2xl border border-slate-200 bg-white p-4 shadow-soft">
    <div class="grid gap-3 md:grid-cols-[1fr_auto]">
      <input name="q" value="{{ q or '' }}" placeholder="Search document title, code, category or type" class="rounded-xl border border-slate-300 px-3 py-2 text-sm">
      <button class="rounded-xl border border-slate-300 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50">Search</button>
    </div>
  </form>

  <div class="grid gap-6 xl:grid-cols-2">
    <div class="rounded-2xl border border-slate-200 bg-white shadow-soft">
      <div class="border-b border-slate-200 px-5 py-4"><h3 class="font-semibold text-slate-900">Engagement Documents</h3></div>
      <div class="divide-y divide-slate-100">
        {% for doc in docs.engagement_documents %}
        <div class="p-4">
          <div class="flex flex-wrap items-start justify-between gap-3">
            <div>
              <div class="font-semibold text-slate-900">{{ doc.title }}</div>
              <div class="text-xs text-slate-500">{{ doc.client.client_name if doc.client else 'Client' }} • {{ doc.document_type }} • {{ doc.financial_year }}</div>
            </div>
            <span class="rounded-full bg-slate-100 px-2 py-1 text-xs font-semibold text-slate-600">v{{ doc.current_version_no }}</span>
          </div>
          {% if doc.versions %}<div class="mt-2 text-xs text-slate-500">Latest file: {{ doc.versions[0].original_filename }}</div>{% endif %}
        </div>
        {% else %}<div class="p-6 text-sm text-slate-500">No engagement documents found.</div>{% endfor %}
      </div>
    </div>

    <div class="rounded-2xl border border-slate-200 bg-white shadow-soft">
      <div class="border-b border-slate-200 px-5 py-4"><h3 class="font-semibold text-slate-900">Permanent Documents</h3></div>
      <div class="divide-y divide-slate-100">
        {% for doc in docs.permanent_documents %}
        <div class="p-4">
          <div class="flex flex-wrap items-start justify-between gap-3">
            <div>
              <div class="font-semibold text-slate-900">{{ doc.title }}</div>
              <div class="text-xs text-slate-500">{{ doc.client.client_name if doc.client else 'Client' }} • {{ doc.category }}</div>
            </div>
            <span class="rounded-full bg-slate-100 px-2 py-1 text-xs font-semibold text-slate-600">v{{ doc.current_version_no }}</span>
          </div>
          {% if doc.versions %}<div class="mt-2 text-xs text-slate-500">Latest file: {{ doc.versions[0].original_filename }}</div>{% endif %}
        </div>
        {% else %}<div class="p-6 text-sm text-slate-500">No permanent documents found.</div>{% endfor %}
      </div>
    </div>
  </div>
</div>
{% endblock %}