@php
    $level = $level ?? request('level', 'alle');
    $q = $q ?? request('q', '');
    $stationId = $stationId ?? (int) request('station_id', 0);
    $stations = $stations ?? collect();
    $grouped = $grouped ?? collect();

    $levels = [
        'alle' => 'Alle',
        'warn' => 'Warnung',
        'kritisch' => 'Kritisch',
    ];

    $pill = fn($lvl) => match ($lvl) {
        'kritisch' => 'bg-red-50 text-red-700 border-red-200',
        'warn' => 'bg-amber-50 text-amber-700 border-amber-200',
        default => 'bg-neutral-100 text-rk-slate border-rk',
    };
@endphp

<x-layouts.app title="Report · Mindestbestand/Warnungen"
    userRole="{{ auth()->user()->isDistrictUser() ? 'Bezirksstelle' : 'Ortstelle' }}">
    <div class="flex flex-col gap-4">

        <div class="flex flex-col sm:flex-row sm:items-end sm:justify-between gap-3">
            <div>
                <div class="text-xl font-semibold">Report: Mindestbestand / Warnungen</div>
                <div class="mt-1 text-sm text-rk-slate">
                    Gesamt: <span class="font-semibold text-rk-charcoal">{{ $kpis['total'] ?? 0 }}</span>
                    <span class="mx-2 text-rk-slate/60">·</span>
                    Warnung: <span class="font-semibold text-rk-charcoal">{{ $kpis['warn'] ?? 0 }}</span>
                    <span class="mx-2 text-rk-slate/60">·</span>
                    Kritisch: <span class="font-semibold text-red-600">{{ $kpis['kritisch'] ?? 0 }}</span>
                </div>
            </div>

            <div class="flex items-center gap-2">
                <a href="{{ route('reports.index') }}" class="btn-rk-soft">
                    Zurück
                </a>

                <a href="{{ route('reports.warnings.export.csv', request()->query()) }}" class="btn-rk-soft">
                    Export CSV
                </a>
                <a href="{{ route('reports.warnings.export.xlsx', request()->query()) }}" class="btn-rk-soft">
                    Export XLSX
                </a>
            </div>
        </div>

        <form method="GET" action="{{ route('reports.warnings') }}"
            class="rounded-3xl bg-white border border-rk p-4 shadow-sm">
            <div class="grid grid-cols-1 lg:grid-cols-12 gap-3 lg:items-end">

                <div class="lg:col-span-5">
                    <label class="text-xs font-semibold text-rk-slate/80 uppercase tracking-wider">Suche</label>
                    <input name="q" value="{{ $q }}"
                        class="mt-2 w-full rounded-2xl border border-rk bg-white px-4 py-3 text-sm focus:ring-2 ring-rk focus:border-transparent"
                        placeholder="Artikel, Variante…">
                </div>

                <div class="lg:col-span-2">
                    <label class="text-xs font-semibold text-rk-slate/80 uppercase tracking-wider">Level</label>
                    <select name="level" class="mt-2 w-full rounded-2xl border border-rk bg-white px-4 py-3 text-sm">
                        @foreach ($levels as $k => $lbl)
                            <option value="{{ $k }}" @selected($level === $k)>{{ $lbl }}
                            </option>
                        @endforeach
                    </select>
                </div>

                @if (auth()->user()->isDistrictUser())
                    <div class="lg:col-span-4">
                        <label class="text-xs font-semibold text-rk-slate/80 uppercase tracking-wider">Ortstelle</label>
                        <select name="station_id"
                            class="mt-2 w-full rounded-2xl border border-rk bg-white px-4 py-3 text-sm">
                            <option value="0">Alle</option>
                            @foreach ($stations as $s)
                                <option value="{{ $s->id }}" @selected((int) $stationId === (int) $s->id)>{{ $s->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                @else
                    <input type="hidden" name="station_id" value="0">
                @endif

                <div class="lg:col-span-1 flex gap-2">
                    <a href="{{ route('reports.warnings') }}"
                        class="w-full rounded-2xl border border-rk bg-white px-4 py-3 text-sm font-semibold hover:bg-neutral-50 text-center transition-rk hover:shadow-button">
                        Reset
                    </a>
                </div>

                <div class="lg:col-span-12">
                    <button
                        class="rounded-2xl bg-rk-red px-4 py-2.5 text-sm font-semibold text-white hover:bg-rk-red-dark transition-rk hover:shadow-button">
                        Filtern
                    </button>
                </div>

            </div>
        </form>

        @forelse($grouped as $stationName => $items)
            <div class="rounded-3xl bg-white border border-rk shadow-sm overflow-hidden">
                <div class="px-5 py-4 flex items-center justify-between gap-3 border-b border-rk bg-neutral-50">
                    <div class="text-sm font-semibold">{{ $stationName }}</div>
                    <div class="text-xs text-rk-slate">
                        {{ $items->count() }} Position(en)
                    </div>
                </div>

                <div class="overflow-x-auto">
                    <table class="w-full text-sm">
                        <thead class="text-xs text-rk-slate/80 uppercase tracking-wider bg-white">
                            <tr class="border-b border-rk">
                                <th class="py-3 px-5 text-left">Level</th>
                                <th class="py-3 px-5 text-left">Artikel</th>
                                <th class="py-3 px-5 text-left">Variante</th>
                                <th class="py-3 px-5 text-right">Ist</th>
                                <th class="py-3 px-5 text-right">Mindest</th>
                                <th class="py-3 px-5 text-right">Differenz</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-[color:var(--rk-border)]">
                            @foreach ($items as $r)
                                @php
                                    $qty = (int) $r->quantity;
                                    $min = (int) $r->minimum_quantity;
                                    $diff = $min - $qty;
                                @endphp
                                <tr class="hover:bg-neutral-50">
                                    <td class="py-4 px-5">
                                        <span
                                            class="inline-flex items-center rounded-full px-3 py-1 text-xs font-semibold border {{ $pill($r->level) }}">
                                            {{ $r->level }}
                                        </span>
                                    </td>
                                    <td class="py-4 px-5 font-medium">{{ $r->product?->name ?? '—' }}</td>
                                    <td class="py-4 px-5 text-rk-slate">{{ $r->variant?->name ?? '—' }}</td>
                                    <td class="py-4 px-5 text-right font-semibold">{{ $qty }}</td>
                                    <td class="py-4 px-5 text-right text-rk-slate">{{ $min }}</td>
                                    <td class="py-4 px-5 text-right text-rk-slate">{{ $diff }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        @empty
            <div class="rounded-3xl bg-white border border-rk p-6 shadow-sm text-rk-slate">
                Keine Warnungen/Kritisch-Einträge gefunden.
            </div>
        @endforelse

    </div>
</x-layouts.app>