@php
    use App\Models\TreasuryOutboundObligation;
    use App\Support\Treasury\Outbound\TreasuryOutboundPayoutStatusService;

    $payoutStatus = app(TreasuryOutboundPayoutStatusService::class);
    $activeView = $view ?? 'queue';
    $canBatchRelease = auth()->user()?->hasLoanPermission('disbursements.batch_release');
    $dispatchableOnPage = collect($rows->items())->filter(
        fn ($row) => $row instanceof TreasuryOutboundObligation && $payoutStatus->isDispatchable($row)
    )->count();
    $phoneColspan = ($canPhoneVerify ?? false) ? 2 : 0;
@endphp

@if ($activeView === 'phone_verification')
    @include('loan.treasury.outbound.partials.phone_verification_workspace')
@else
    <div class="mb-3 rounded-xl border border-slate-200 bg-slate-50 px-4 py-3 text-sm text-slate-700">
        Accounting already verified these payments. Select rows to <strong>Batch release</strong> (OTP + Secret PIN gate, same as Finance Release), or <strong>Reverse</strong> / <strong>Reject</strong> individually.
    </div>

    @if ($dispatchBlocked ?? false)
        <div class="mb-4 rounded-xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-900">
            {{ $dispatchReadiness['message'] ?? 'Dispatch blocked until Secret PIN / custodian is configured.' }}
        </div>
    @elseif (($dispatchPinRequired ?? false) && ($pinHolderName ?? null) && ! ($viewerIsPinHolder ?? false))
        <div class="mb-4 rounded-xl border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-950">
            Batch release Secret PIN must be entered by custodian PIN actor: <strong>{{ $pinHolderName }}</strong>.
        </div>
    @endif

    @if ($canBatchRelease)
        <form method="post" action="{{ route('loan.treasury.outbound.batch') }}" id="outbound-batch-form" class="hidden"
            data-dispatch-otp-required="{{ ($dispatchOtpRequired ?? false) ? '1' : '0' }}"
            data-dispatch-pin-required="{{ ($dispatchPinRequired ?? false) ? '1' : '0' }}"
            data-dispatch-blocked="{{ ($dispatchBlocked ?? false) ? '1' : '0' }}"
            data-dispatch-blocked-message="{{ e($dispatchReadiness['message'] ?? '') }}"
            data-dispatch-otp-url="{{ route('loan.treasury.outbound.dispatch_otp') }}"
            data-pin-holder-name="{{ e($pinHolderName ?? '') }}"
            data-viewer-is-pin-holder="{{ ($viewerIsPinHolder ?? false) ? '1' : '0' }}">
            @csrf
            <input type="hidden" name="otp" id="outbound-batch-otp" value="">
            <input type="hidden" name="secret_pin" id="outbound-batch-pin" value="">
        </form>
    @endif

    <div class="overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm">
        <div class="overflow-x-auto">
            <table class="min-w-full divide-y divide-slate-200 text-sm">
                <thead class="bg-slate-50 text-left text-xs uppercase text-slate-500">
                    <tr>
                        <th class="px-3 py-2 w-10">#</th>
                        <th class="px-4 py-2">Payout status</th>
                        <th class="px-4 py-2">Client</th>
                        <th class="px-4 py-2">Mobile</th>
                        <th class="px-4 py-2">
                            <div class="flex items-center justify-between gap-2">
                                <span>Amount</span>
                                @if ($canBatchRelease)
                                    <input
                                        type="checkbox"
                                        class="outbound-batch-select-all h-4 w-4 rounded border-slate-300 text-indigo-600 focus:ring-indigo-500"
                                        title="Select all ready to dispatch on this page"
                                        @disabled($dispatchableOnPage === 0)
                                        aria-label="Select all dispatchable rows on this page"
                                    >
                                @endif
                            </div>
                        </th>
                        <th class="px-4 py-2">Source</th>
                        <th class="px-4 py-2">Approval date</th>
                        <th class="px-4 py-2">Method</th>
                        <th class="px-4 py-2">Approvals</th>
                        @if ($canPhoneVerify ?? false)
                            <th class="px-4 py-2">Safaricom name</th>
                            <th class="px-4 py-2">Verification</th>
                        @endif
                        <th class="px-4 py-2"></th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 bg-white text-slate-700">
                    @forelse ($rows as $row)
                        @php
                            $open = $payoutStatus->isDispatchable($row);
                            $isMpesa = $row->isMpesaPayout();
                            $rowStatus = $payoutStatus->forObligation($row);
                            $approvalAt = $row->approved_at ?? $row->created_at;
                        @endphp
                        <tr class="hover:bg-slate-50/60 {{ $isMpesa ? 'bg-indigo-50/10' : '' }}">
                            <td class="px-3 py-2 text-xs tabular-nums text-slate-500">{{ ($rows->firstItem() ?? 1) + $loop->index }}</td>
                            <td class="px-4 py-2">
                                @include('loan.treasury.outbound.partials.payout_status_badge', ['status' => $rowStatus])
                            </td>
                            <td class="px-4 py-2 text-slate-800">
                                <span>{{ $row->beneficiary_name ?? '—' }}</span>
                            </td>
                            <td class="px-4 py-2">
                                @if ($open && $canBatchRelease)
                                    <form method="post" action="{{ route('loan.treasury.outbound.payee', $row) }}" class="min-w-[11rem] space-y-1">
                                        @csrf
                                        <input type="hidden" name="beneficiary_name" value="{{ $row->beneficiary_name }}">
                                        <x-phone-input
                                            name="beneficiary_phone"
                                            :value="old('beneficiary_phone', $row->beneficiary_phone)"
                                            wrapper-class=""
                                            input-class="flex-1 min-w-0 w-full rounded-md border-0 bg-transparent py-1.5 pl-2 pr-2 text-xs"
                                        />
                                        <div class="flex items-center gap-1">
                                            <select name="payment_method" class="h-8 min-w-0 flex-1 rounded-md border-slate-200 text-[11px]">
                                                <option value="mpesa" @selected(($row->payment_method ?? 'mpesa') === 'mpesa')>M-Pesa</option>
                                                <option value="manual_settlement" @selected(($row->payment_method ?? '') === 'manual_settlement')>Manual</option>
                                            </select>
                                            <button type="submit" class="h-8 shrink-0 rounded-md bg-slate-800 px-2 text-[11px] font-semibold text-white hover:bg-slate-900">Save</button>
                                        </div>
                                    </form>
                                @else
                                    <span class="font-mono text-xs text-slate-700">{{ $row->beneficiary_phone ?: '—' }}</span>
                                @endif
                            </td>
                            <td class="px-4 py-2">
                                <div class="flex items-start justify-between gap-3">
                                    <span class="font-semibold tabular-nums text-slate-900">{{ $row->currency }} {{ number_format((float) $row->amount, 2) }}</span>
                                    @if ($open && $canBatchRelease)
                                        <input
                                            type="checkbox"
                                            form="outbound-batch-form"
                                            name="obligation_ids[]"
                                            value="{{ $row->id }}"
                                            data-amount="{{ number_format((float) $row->amount, 2, '.', '') }}"
                                            data-dispatchable="1"
                                            data-mpesa="{{ $isMpesa ? '1' : '0' }}"
                                            class="outbound-batch-select mt-0.5 h-4 w-4 rounded border-slate-300 text-indigo-600 focus:ring-indigo-500"
                                            title="Select for batch release"
                                        >
                                    @endif
                                </div>
                            </td>
                            <td class="px-4 py-2 text-xs">
                                @php
                                    $sourceLabel = $sourceLabels[$row->source_type] ?? $row->source_type;
                                    $sourceFilterHref = \App\Support\Navigation\WorkspaceEmbed::routeUrl('loan.treasury.outbound.index', [
                                        'view' => 'queue',
                                        'source' => $row->source_type,
                                    ]) ?? route('loan.treasury.outbound.index', ['view' => 'queue', 'source' => $row->source_type]);
                                @endphp
                                <a
                                    href="{{ $sourceFilterHref }}"
                                    class="inline-flex rounded-full bg-slate-100 px-2 py-0.5 text-[11px] font-semibold text-slate-700 hover:bg-slate-200"
                                    title="Filter by {{ $sourceLabel }}"
                                >{{ $sourceLabel }}</a>
                            </td>
                            <td class="px-4 py-2 text-xs tabular-nums text-slate-700">{{ $approvalAt ? $approvalAt->format('Y-m-d H:i') : '—' }}</td>
                            <td class="px-4 py-2 text-slate-800">{{ str_replace('_', ' ', (string) ($row->payment_method ?? '—')) }}</td>
                            <td class="px-4 py-2 text-xs text-slate-600">
                                <ul class="space-y-0.5">
                                    @if ($row->approvedByUser)
                                        <li><span class="text-slate-400">Accounting:</span> {{ $row->approvedByUser->name }}</li>
                                    @elseif ($row->createdByUser)
                                        <li><span class="text-slate-400">Sent:</span> {{ $row->createdByUser->name }}</li>
                                    @else
                                        <li class="text-slate-400">—</li>
                                    @endif
                                </ul>
                            </td>
                            @if ($canPhoneVerify ?? false)
                                @include('loan.treasury.outbound.partials.phone_verification_queue_cells', [
                                    'obligation' => $row,
                                    'open' => $open,
                                    'canPhoneVerify' => $canPhoneVerify,
                                ])
                            @else
                                <td class="px-4 py-2 text-right">
                                    <span class="font-mono text-xs text-slate-500">{{ $row->obligation_reference }}</span>
                                </td>
                            @endif
                        </tr>
                    @empty
                        <tr>
                            <td colspan="{{ 9 + $phoneColspan }}" class="px-4 py-12 text-center text-slate-500">No outbound payment obligations.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if ($canBatchRelease)
            <div class="flex flex-wrap items-center justify-between gap-3 border-t border-slate-200 px-4 py-3">
                <p class="text-sm text-slate-600">
                    <span class="outbound-batch-summary font-semibold text-slate-900">0 selected · KES 0.00</span>
                    <span class="ml-2 text-xs text-slate-500 outbound-batch-mpesa-hint"></span>
                </p>
                <button type="button" id="outbound-batch-release-trigger" class="rounded-lg bg-indigo-600 px-4 py-2 text-sm font-semibold text-white hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-40" disabled>
                    Batch release selected
                </button>
            </div>
        @endif

        @if ($rows->hasPages())
            <div class="border-t px-4 py-3"><x-loan.workspace-pagination :paginator="$rows" /></div>
        @endif
    </div>
@endif