{{-- resources/views/documents/partials/_categories.blade.php --}}

<div class="rounded-2xl border border-gray-200 bg-white p-5">
    <div class="flex items-center justify-between">
        <h2 class="text-lg font-semibold">Kategorien</h2>

        @can('manage', \App\Models\DocumentCategory::class)
            <button class="rounded-xl border border-gray-200 bg-white px-3 py-2 text-sm font-semibold hover:bg-gray-50"
                @click="catOpen = true">
                Verwalten
            </button>
        @else
            <button class="rounded-xl border border-gray-200 bg-white px-3 py-2 text-sm font-semibold text-gray-400"
                disabled>
                Verwalten
            </button>
        @endcan
    </div>

    <div class="mt-4 space-y-1">
        {{-- Alle --}}
        <a href="{{ route('documents.index', array_filter(array_merge(request()->query(), ['category_id' => null]))) }}"
            class="w-full flex items-center justify-between rounded-xl px-3 py-2.5 text-sm font-semibold
            {{ empty($categoryId) ? 'bg-brand/10 text-brand ring-1 ring-brand/15' : 'text-gray-700 hover:bg-gray-100' }}">
            <span class="truncate">Alle</span>
            <span
                class="rounded-full px-2 py-0.5 text-xs font-semibold
                {{ empty($categoryId) ? 'bg-white text-brand ring-1 ring-brand/15' : 'bg-gray-100 text-gray-700 ring-1 ring-gray-200' }}">
                {{ $allCount }}
            </span>
        </a>

        {{-- Dynamische Kategorien --}}
        @foreach ($categories as $c)
            @php
                $active = (int) $categoryId === (int) $c->id;
                $count = (int) ($categoryCounts[$c->id] ?? 0);
            @endphp

            <a href="{{ route('documents.index', array_filter(array_merge(request()->query(), ['category_id' => $c->id]))) }}"
                class="w-full flex items-center justify-between rounded-xl px-3 py-2.5 text-sm font-semibold
                {{ $active ? 'bg-brand/10 text-brand ring-1 ring-brand/15' : 'text-gray-700 hover:bg-gray-100' }}">
                <span class="truncate">{{ $c->name }}</span>
                <span
                    class="rounded-full px-2 py-0.5 text-xs font-semibold
                    {{ $active ? 'bg-white text-brand ring-1 ring-brand/15' : 'bg-gray-100 text-gray-700 ring-1 ring-gray-200' }}">
                    {{ $count }}
                </span>
            </a>
        @endforeach
    </div>

    <div class="mt-5 rounded-2xl border border-gray-200 bg-gray-50 p-4">
        <div class="text-sm font-semibold">Hinweis</div>
        <div class="mt-2 text-sm text-gray-600">
            Dokumente sind pro RTW abgelegt und über Kategorien schnell auffindbar.
        </div>
    </div>
</div>