@php
    $ids = collect($rows->items())->pluck('id')->unique()->values()->all();
    $inr = fn ($v) => $v === null ? '—' : '₹'.number_format((float) $v, (float) $v == (int) $v ? 0 : 2);
    $tiles = [
        ['all', 'All accounts', 'heroicon-o-banknotes', 'gray'],
        ['not_allocated', 'Not allocated', 'heroicon-o-inbox', 'gray'],
        ['NEW DATA', 'New data', 'heroicon-o-sparkles', 'amber'],
        ['LIVE POSITIVE', 'Live positive', 'heroicon-o-arrow-trending-up', 'green'],
        ['LIVE NEGATIVE', 'Live negative', 'heroicon-o-arrow-trending-down', 'violet'],
        ['LOST', 'Lost', 'heroicon-o-x-circle', 'red'],
        ['PAID', 'Paid', 'heroicon-o-check-badge', 'blue'],
    ];
@endphp
<x-layouts.app title="ADI collection" subtitle="Loan-collection accounts — allocate them to ADI field users and track their status."
               :breadcrumbs="['ADI' => null, 'Collections' => null]">
    <x-slot:actions>
        <button type="button" class="btn btn-secondary" x-data @click="$dispatch('open-modal', 'import-collections')"><x-heroicon-m-arrow-up-tray class="h-4 w-4" /> Import CSV</button>
        <a href="{{ route('adi.collections.export', request()->query()) }}" class="btn btn-secondary"><x-heroicon-m-arrow-down-tray class="h-4 w-4" /> Export</a>
        <a href="{{ route('adi.users.index') }}" class="btn btn-brand"><x-heroicon-m-users class="h-4 w-4" /> ADI users</a>
    </x-slot:actions>

    <div class="mb-6 grid grid-cols-2 gap-3 md:grid-cols-4 xl:grid-cols-7">
        @foreach ($tiles as [$key, $label, $icon, $tone])
            <a href="{{ route('adi.collections.index', ['view' => $key]) }}"
               @class(['card p-4 transition hover:-translate-y-0.5 hover:shadow-md', 'ring-2 ring-brand-500' => $view === $key])>
                <div class="flex items-center justify-between">
                    <span class="text-[11px] font-medium tracking-wide text-ink-500 uppercase">{{ $label }}</span>
                    <x-dynamic-component :component="$icon" class="h-4 w-4 text-ink-400" />
                </div>
                <div class="mt-1 text-2xl font-semibold tabular-nums text-ink-900 dark:text-white">{{ number_format($counts[$key] ?? 0) }}</div>
            </a>
        @endforeach
    </div>
    @if (($counts['other'] ?? 0) > 0)
        <p class="-mt-3 mb-4 text-xs text-ink-500">
            {{ number_format($counts['other']) }} assigned account(s) carry a legacy status the app does not list (e.g. “In Progress”).
            <a class="text-brand-700 hover:underline dark:text-brand-400" href="{{ route('adi.collections.index', ['view' => 'other']) }}">Review them</a>.
        </p>
    @endif

    <x-card :padded="false" x-data="bulkSelect">
        <div class="space-y-3 border-b border-ink-100 p-4 dark:border-ink-800">
            <x-filter-bar placeholder="Search customer, mobile, loan no, area, city, reg no…">
                <x-select name="view" :options="\App\Http\Controllers\Adi\CollectionController::VIEWS" :value="$view" class="w-44" />
                <x-select name="user" :options="$users" :value="request('user')" placeholder="Any ADI user" class="w-52" />
                <x-select name="city" :options="$cities" :value="request('city')" placeholder="All cities" class="w-36" />
                <x-select name="bucket" :options="collect($buckets)->mapWithKeys(fn ($b) => [$b => 'Bucket '.$b])->all()" :value="request('bucket')" placeholder="Any bucket" class="w-36" />
            </x-filter-bar>

            <div x-cloak x-show="selected.length" x-transition class="flex flex-wrap items-center justify-between gap-3 rounded-xl bg-brand-50 px-4 py-2 text-sm dark:bg-brand-500/10">
                <span class="font-medium text-brand-800 dark:text-brand-300"><span x-text="selected.length"></span> account(s) selected</span>
                <div class="flex gap-2">
                    <button type="button" class="btn btn-primary btn-sm" @click="$dispatch('open-modal', 'assign-collections')"><x-heroicon-m-user-plus class="h-4 w-4" /> Assign</button>
                    <form method="POST" action="{{ route('adi.collections.destroy') }}" x-data="confirmSubmit('Delete the selected accounts and their activity history permanently?')" @submit="submit">
                        @csrf @method('DELETE')
                        <template x-for="id in selected" :key="id"><input type="hidden" name="ids[]" :value="id"></template>
                        <button class="btn btn-danger btn-sm"><x-heroicon-m-trash class="h-4 w-4" /> Delete</button>
                    </form>
                </div>
            </div>
        </div>

        @if ($rows->isEmpty())
            <x-empty-state title="No accounts found" message="Try another view or search, or import a collection file." icon="heroicon-o-banknotes" />
        @else
            <div class="table-wrap">
                <table class="table table-compact">
                    <thead>
                        <tr>
                            <th class="w-8"><input type="checkbox" class="form-checkbox" @click="toggleAll(@js($ids))" :checked="all" aria-label="Select all"></th>
                            <th><x-sort-link column="status" label="Status" /></th>
                            <th><x-sort-link column="customer" label="Customer" /></th>
                            <th><x-sort-link column="loan" label="Loan no" /></th>
                            <th class="text-right"><x-sort-link column="inst" label="Inst. O/S" /></th>
                            <th class="text-right"><x-sort-link column="dpd" label="DPD" /></th>
                            <th class="text-right"><x-sort-link column="bucket" label="Bucket" /></th>
                            <th class="text-right"><x-sort-link column="emi" label="EMI" /></th>
                            <th class="text-right"><x-sort-link column="pos" label="POS" /></th>
                            <th class="text-right"><x-sort-link column="due" label="Total due" /></th>
                            <th>Make</th>
                            <th><x-sort-link column="city" label="City / area" /></th>
                            <th>Assigned to</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-ink-100 dark:divide-ink-800">
                        @foreach ($rows as $r)
                            <tr>
                                <td><input type="checkbox" class="form-checkbox" value="{{ $r->id }}" x-model.number="selected" aria-label="Select account {{ $r->id }}"></td>
                                <td>
                                    @if ($r->activity_id)
                                        <span class="badge {{ \App\Models\AdiActivity::statusBadge($r->Status) }}">{{ \App\Models\AdiActivity::normaliseStatus($r->Status) ?: '—' }}</span>
                                    @else
                                        <span class="badge badge-gray">Not allocated</span>
                                    @endif
                                    @if ($r->Allocation_Date)<div class="mt-0.5 text-[11px] text-ink-400">{{ \Carbon\Carbon::parse($r->Allocation_Date)->format('d-m-Y') }}</div>@endif
                                </td>
                                <td class="max-w-[240px]">
                                    <a href="{{ route('adi.collections.show', $r->id) }}" class="block truncate font-medium text-ink-900 hover:text-brand-700 dark:text-white" title="{{ $r->CUSTOMER_NAME }}">{{ $r->CUSTOMER_NAME ?: '—' }}</a>
                                    <div class="truncate text-xs text-ink-500 tabular-nums">{{ $r->CUSTOMER_NO ?: '' }}</div>
                                </td>
                                <td>
                                    <a href="{{ route('adi.collections.show', $r->id) }}" class="font-mono text-xs text-brand-700 hover:underline dark:text-brand-400">{{ $r->LOAN_NO ?: '—' }}</a>
                                    @if ($r->Subject)<div class="text-[11px] text-ink-400">{{ trim($r->Subject) }}</div>@endif
                                </td>
                                <td class="text-right tabular-nums">{{ $r->TOT_INST_OS ?? '—' }}</td>
                                <td class="text-right tabular-nums {{ ($r->DPD ?? 0) > 90 ? 'font-medium text-rose-600' : '' }}">{{ $r->DPD ?? '—' }}</td>
                                <td class="text-right tabular-nums">{{ $r->BUCKET ?? '—' }}</td>
                                <td class="text-right tabular-nums">{{ $inr($r->LOAN_EMI) }}</td>
                                <td class="text-right tabular-nums">{{ $inr($r->POS) }}</td>
                                <td class="text-right font-medium tabular-nums">{{ $inr($r->TOTAL_AMOUNT_DUE) }}</td>
                                <td>{{ $r->MAKE ?: '—' }}</td>
                                <td>
                                    <div>{{ $r->LOCATION_CITY ?: '—' }}</div>
                                    @if ($r->AREA)<div class="text-[11px] text-ink-400">{{ $r->AREA }}</div>@endif
                                </td>
                                <td class="text-ink-500">{{ $r->assigned_user ?: ($r->User_id ? 'User #'.$r->User_id : '—') }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <x-pagination-bar :paginator="$rows" />
        @endif

        <x-modal name="assign-collections" title="Assign accounts to an ADI user" maxWidth="lg">
            <form method="POST" action="{{ route('adi.collections.assign') }}" id="assign-form" class="space-y-4">
                @csrf
                <template x-for="id in selected" :key="id"><input type="hidden" name="ids[]" :value="id"></template>
                @include('adi.collections._assign-fields')
            </form>
            <x-slot:footer>
                <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'assign-collections')">Cancel</button>
                <button form="assign-form" class="btn btn-brand"><x-heroicon-m-user-plus class="h-4 w-4" /> Assign</button>
            </x-slot:footer>
        </x-modal>
    </x-card>

    <x-modal name="import-collections" title="Import collection accounts" maxWidth="lg">
        <form method="POST" action="{{ route('adi.collections.import') }}" enctype="multipart/form-data" id="import-form" class="space-y-4">
            @csrf
            <p class="text-sm text-ink-500">Upload a CSV with a header row. <strong>LOAN_NO</strong> and <strong>CUSTOMER_NAME</strong> are required; accounts whose LOAN_NO already exists are skipped. Recognised columns:</p>
            <div class="flex flex-wrap gap-1">
                @foreach (\App\Models\AdiCollection::IMPORT_COLUMNS as $col)<span class="badge badge-gray font-mono">{{ $col }}</span>@endforeach
            </div>
            <input type="file" name="file" accept=".csv,text/csv" required class="form-input">
            <a href="{{ route('adi.collections.sample') }}" class="inline-flex items-center gap-1 text-sm text-brand-700 hover:underline dark:text-brand-400"><x-heroicon-m-document-arrow-down class="h-4 w-4" /> Download sample file</a>
        </form>
        <x-slot:footer>
            <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'import-collections')">Cancel</button>
            <button form="import-form" class="btn btn-brand">Import</button>
        </x-slot:footer>
    </x-modal>
</x-layouts.app>