@php
    $financialYear = $taxFinancialYear ?? \App\Support\FinancialYear::forDate();
    $declarations = $taxDeclarations ?? collect();
    $statusColors = [
        'draft' => 'bg-slate-100 text-slate-700 ring-slate-200',
        'submitted' => 'bg-amber-100 text-amber-800 ring-amber-200',
        'verified' => 'bg-emerald-100 text-emerald-800 ring-emerald-200',
        'rejected' => 'bg-rose-100 text-rose-800 ring-rose-200',
    ];
@endphp

<div class="space-y-5">
    <div class="overflow-hidden rounded-2xl border border-slate-200/80 bg-white shadow-sm">
        <div class="flex flex-wrap items-start justify-between gap-4 border-b border-slate-100 bg-gradient-to-r from-sky-50/50 via-white to-teal-50/30 px-5 py-5">
            <div class="flex items-start gap-3">
                <span class="flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-sky-100 text-sky-700">
                    <i class="bi bi-file-earmark-text text-lg"></i>
                </span>
                <div>
                    <p class="text-xs font-semibold uppercase tracking-[0.18em] text-primary">Tax</p>
                    <h2 class="mt-0.5 text-lg font-semibold text-slate-900">Employee tax declarations</h2>
                    <p class="mt-1 text-sm text-slate-500">Review submitted declarations and open each employee for proof verification.</p>
                </div>
            </div>
            <a href="{{ route('payroll.index', ['tab' => 'advanced', 'sub' => 'declaration_settings']) }}"
               class="inline-flex items-center gap-1.5 rounded-full border border-slate-200 bg-white px-4 py-2 text-sm font-medium text-slate-700 transition hover:bg-slate-50">
                <i class="bi bi-sliders"></i> Declaration settings
            </a>
        </div>

        @if(session('success'))
            <div class="mx-5 mt-4 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-800">{{ session('success') }}</div>
        @endif
        @if(session('error'))
            <div class="mx-5 mt-4 rounded-xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-800">{{ session('error') }}</div>
        @endif

        <form method="get" class="flex flex-wrap items-end justify-end gap-3 border-b border-slate-100 px-5 py-4">
            <input type="hidden" name="tab" value="declaration">
            <div>
                <label class="block text-xs font-medium text-slate-500">Financial year</label>
                <input type="text" name="fy" value="{{ $financialYear }}" class="mt-1 rounded-full border border-slate-200 bg-slate-50/80 px-3 py-2 text-sm focus:border-primary focus:bg-white focus:outline-none focus:ring-0" placeholder="2025-26">
            </div>
            <div>
                <label class="block text-xs font-medium text-slate-500">Status</label>
                <select name="status" class="mt-1 rounded-full border border-slate-200 bg-slate-50/80 px-3 py-2 text-sm js-select2" style="width: 120px">
                    <option value="">All</option>
                    @foreach(['submitted', 'verified', 'rejected', 'draft'] as $st)
                        <option value="{{ $st }}" {{ request('status') === $st ? 'selected' : '' }}>{{ ucfirst($st) }}</option>
                    @endforeach
                </select>
            </div>
            <button type="submit" class="inline-flex items-center gap-1.5 rounded-full bg-slate-800 px-4 py-2 text-sm font-medium text-white transition hover:bg-slate-700">
                <i class="bi bi-funnel"></i> Filter
            </button>
        </form>

        <div class="overflow-x-auto">
            <table class="min-w-full divide-y divide-slate-100 text-sm">
                <thead class="bg-slate-50/80">
                    <tr>
                        <th class="px-5 py-3 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">Employee</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">Regime</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">Deductions</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">Monthly TDS</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">Proofs</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">Status</th>
                        <th class="px-5 py-3 text-right text-xs font-semibold uppercase tracking-wide text-slate-500">Action</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100">
                    @forelse($declarations as $decl)
                        @php
                            $itemsWithAmount = $decl->items->filter(fn ($i) => (float) $i->declared_amount > 0);
                            $proofsUploaded = $itemsWithAmount->filter(fn ($i) => $i->proof_path)->count();
                            $proofsTotal = $itemsWithAmount->count();
                        @endphp
                        <tr class="transition hover:bg-teal-50/30">
                            <td class="px-5 py-3.5">
                                <div class="font-medium text-slate-900">{{ $decl->user?->name ?? '—' }}</div>
                                <div class="text-xs text-slate-500">{{ $decl->user?->email }}</div>
                            </td>
                            <td class="px-4 py-3.5 uppercase text-slate-700">{{ $decl->regime }}</td>
                            <td class="px-4 py-3.5 tabular-nums text-slate-700">₹{{ number_format((float) $decl->total_deductions_declared, 0) }}</td>
                            <td class="px-4 py-3.5 tabular-nums text-slate-700">₹{{ number_format((float) $decl->monthly_tds, 0) }}</td>
                            <td class="px-4 py-3.5 text-slate-700">
                                @if($decl->regime === 'old' && $proofsTotal > 0)
                                    {{ $proofsUploaded }}/{{ $proofsTotal }}
                                @else
                                    —
                                @endif
                            </td>
                            <td class="px-4 py-3.5">
                                <span class="inline-flex rounded-full px-2.5 py-0.5 text-xs font-semibold ring-1 {{ $statusColors[$decl->status] ?? 'bg-slate-100 ring-slate-200' }}">
                                    {{ ucfirst($decl->status) }}
                                </span>
                            </td>
                            <td class="px-5 py-3.5 text-right">
                                <a href="{{ route('payroll.income-tax.admin.review', $decl) }}"
                                   class="inline-flex items-center gap-1 rounded-full border border-teal-200 bg-teal-50 px-2.5 py-1 text-xs font-medium text-teal-800 transition hover:bg-teal-100">
                                    Review
                                </a>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="7" class="px-5 py-12 text-center text-slate-500">No declarations found for this filter.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>