@php
    use App\Models\CutoverConfirmation;

    $tz = config('app.display_timezone');

    $typeBadge = [
        'bank' => 'indigo', 'cash' => 'emerald', 'mobile_money' => 'sky',
        'director' => 'amber', 'other' => 'slate',
    ];

    $outstandingCount = collect($outstandingRows)->sum(fn (array $r): int => $r['accounts']->count());
    $peopleCount = count($outstandingRows);

    $tabMeta = [
        'outstanding' => ['label' => __('Still to declare'), 'icon' => 'users', 'count' => $peopleCount],
        'signoff'     => ['label' => __('Needs sign-off'),   'icon' => 'shield-check', 'count' => $signOffQueue->count()],
        'adjustments' => ['label' => __('Change requests'),  'icon' => 'pencil-square', 'count' => $adjustments->count()],
    ];

    $metrics = [
        [
            'label' => __('People outstanding'),
            'value' => number_format($peopleCount),
            'icon' => 'users',
            'accent' => $peopleCount === 0 ? '#10b981' : '#f59e0b',
            'sub' => $peopleCount === 0 ? __('Everybody has counted') : trans_choice('{1} :count float undeclared|[2,*] :count floats undeclared', $outstandingCount, ['count' => $outstandingCount]),
        ],
        [
            'label' => __('Awaiting sign-off'),
            'value' => number_format($signOffQueue->count()),
            'icon' => 'shield-check',
            'accent' => '#0ea5e9',
            'sub' => __('Declared, but the books disagreed'),
        ],
        [
            'label' => __('Change requests'),
            'value' => number_format($adjustments->count()),
            'icon' => 'pencil-square',
            'accent' => '#8b5cf6',
            'sub' => __('Agreed figures somebody wants moved'),
        ],
        [
            'label' => __('Deadline'),
            'value' => $cutover?->due_at ? $cutover->due_at->timezone($tz)->format('j M Y') : __('Not open'),
            'icon' => 'clock',
            'accent' => $cutover?->isOverdue() ? '#f43f5e' : '#124a61',
            'sub' => $cutover?->isOverdue() ? __('Past due') : __('Workspace cut-over'),
        ],
    ];
@endphp

<div class="px-4 py-8 sm:px-6 lg:px-8">
    <div class="mx-auto max-w-7xl space-y-6">

        <x-page-header :title="__('Float confirmations')"
            :subtitle="__('Who has not yet said what they are holding, whose figure needs your signature, and who is asking to change one that is already agreed.')">
            <a href="{{ route('treasury.punch_in') }}" wire:navigate>
                <x-secondary-button type="button">
                    <x-icon name="wallet" class="mr-1 h-4 w-4" />
                    {{ __('My punch-in') }}
                </x-secondary-button>
            </a>
        </x-page-header>

        @if ($cutover === null)
            <x-card class="p-6">
                <x-empty-state icon="flag" class="border-0 bg-transparent py-6"
                    :title="__('No punch-in is running')"
                    :message="__('There is nothing to chase. When the company moves to a fresh workspace, open the punch-in and everybody holding cash, a director float or a mobile-money wallet is asked to declare what they have.')" />
            </x-card>
        @else

            <section class="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4">
                @foreach ($metrics as $m)
                    <x-card class="group relative flex flex-col overflow-hidden p-5 ring-slate-200/70 transition hover:-translate-y-0.5 hover:shadow-lg hover:shadow-slate-300/40">
                        <div class="flex items-start justify-between gap-2">
                            <p class="truncate text-[11px] font-semibold uppercase tracking-wider text-slate-400" title="{{ $m['label'] }}">{{ $m['label'] }}</p>
                            <span class="flex items-center justify-center rounded-xl text-white shadow-sm ring-1 ring-white/40"
                                  style="height: 2rem; width: 2rem; background: linear-gradient(135deg, {{ $m['accent'] }}, {{ $m['accent'] }}bb)">
                                <x-icon :name="$m['icon']" class="h-4 w-4" />
                            </span>
                        </div>
                        <p class="mt-3 font-bold leading-none tracking-tight text-slate-900 tabular-nums" style="font-size: 19px;">{{ $m['value'] }}</p>
                        <span class="mt-2.5 inline-flex w-fit items-center gap-1 rounded-full bg-slate-100 px-2 py-1 text-[11px] font-semibold text-slate-500">
                            {{ $m['sub'] }}
                        </span>
                    </x-card>
                @endforeach
            </section>

            <div class="flex flex-wrap items-center gap-1 rounded-xl border border-slate-200 bg-slate-50 p-1 text-sm font-medium">
                @foreach ($tabMeta as $key => $meta)
                    <button type="button" wire:click="switchTab('{{ $key }}')"
                        class="flex items-center gap-1.5 rounded-lg px-3.5 py-1.5 transition {{ $tab === $key ? 'bg-white text-indigo-600 shadow-sm ring-1 ring-slate-200' : 'text-slate-500 hover:text-slate-700' }}">
                        <x-icon :name="$meta['icon']" class="h-4 w-4" />
                        {{ $meta['label'] }}
                        @if ($meta['count'] > 0)
                            <span class="rounded-full bg-slate-200 px-1.5 text-[11px] font-semibold text-slate-600">{{ $meta['count'] }}</span>
                        @endif
                    </button>
                @endforeach
            </div>

            {{-- ── Still to declare ───────────────────────────────────────── --}}
            @if ($tab === 'outstanding')
                <x-card class="overflow-hidden">
                    <div class="border-b border-slate-100 p-4 sm:p-5">
                        <h2 class="text-base font-semibold text-slate-900">{{ __('Still to declare') }}</h2>
                        <p class="text-xs text-slate-400">
                            {{ __('Each person gets :days days of daily reminders from their own first login. Somebody who has never signed in has no clock and has never been nudged, which is exactly why they are listed here.', ['days' => $windowDays]) }}
                        </p>
                    </div>

                    <div class="overflow-x-auto">
                        <table class="min-w-full divide-y divide-slate-100">
                            <thead>
                                <tr class="bg-slate-50/80 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-500">
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Holder') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Undeclared floats') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Their week') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Last reminded') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Actions') }}</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y divide-slate-100 bg-white">
                                @forelse ($outstandingRows as $row)
                                    @php $campaign = $row['campaign']; @endphp
                                    <tr wire:key="owing-{{ $row['holder']->id }}" class="align-top transition hover:bg-slate-50/70">
                                        <td class="px-3 py-4 text-sm font-medium text-slate-900 lg:px-4">{{ $row['holder']->name }}</td>

                                        <td class="px-3 py-4 text-sm text-slate-600 lg:px-4">
                                            <div class="flex flex-wrap items-center gap-1.5">
                                                @foreach ($row['accounts'] as $account)
                                                    <x-badge :color="$typeBadge[$account->type] ?? 'slate'">{{ $account->name }}</x-badge>
                                                @endforeach
                                            </div>
                                        </td>

                                        <td class="whitespace-nowrap px-3 py-4 text-sm lg:px-4">
                                            @if ($campaign)
                                                <span class="font-medium text-slate-900">{{ __('Day :day of :total', ['day' => $campaign->dayNumber(), 'total' => $windowDays]) }}</span>
                                                <p class="mt-1 text-[11px] text-slate-400">
                                                    {{ __('Started :when', ['when' => $campaign->started_at->timezone($tz)->format('j M')]) }}
                                                </p>
                                            @else
                                                <x-badge color="rose">{{ __('Never signed in') }}</x-badge>
                                            @endif
                                        </td>

                                        <td class="whitespace-nowrap px-3 py-4 text-sm text-slate-500 lg:px-4">
                                            @if ($campaign?->last_reminded_on)
                                                {{ $campaign->last_reminded_on->format('j M Y') }}
                                                <p class="mt-1 text-[11px] text-slate-400">
                                                    {{ trans_choice('{1} :count reminder|[2,*] :count reminders', $campaign->reminders_sent, ['count' => $campaign->reminders_sent]) }}
                                                </p>
                                            @else
                                                <span class="text-slate-300">{{ __('Not yet') }}</span>
                                            @endif
                                        </td>

                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-medium lg:px-4">
                                            <button type="button" wire:click="remind({{ $row['holder']->id }})"
                                                    class="text-indigo-600 transition hover:text-indigo-800">
                                                {{ __('Remind now') }}
                                            </button>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="5" class="px-6 py-12">
                                            <x-empty-state icon="check-circle" class="border-0 bg-transparent py-0"
                                                :title="__('Everybody has counted')"
                                                :message="__('Every float in the workspace has been declared by the person holding it.')" />
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </x-card>
            @endif

            {{-- ── Needs sign-off ─────────────────────────────────────────── --}}
            @if ($tab === 'signoff')
                <x-card class="overflow-hidden">
                    <div class="border-b border-slate-100 p-4 sm:p-5">
                        <h2 class="text-base font-semibold text-slate-900">{{ __('Waiting on a signature') }}</h2>
                        <p class="text-xs text-slate-400">{{ __('Declarations the books could not corroborate. The money is already on the books; this is the signature on the figure.') }}</p>
                    </div>

                    <div class="overflow-x-auto">
                        <table class="min-w-full divide-y divide-slate-100">
                            <thead>
                                <tr class="bg-slate-50/80 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-500">
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Holder') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Account') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Declared') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Variance') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Note') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Actions') }}</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y divide-slate-100 bg-white">
                                @forelse ($signOffQueue as $item)
                                    <tr wire:key="signoff-{{ $item->id }}" class="transition hover:bg-slate-50/70">
                                        <td class="whitespace-nowrap px-3 py-4 text-sm font-medium text-slate-900 lg:px-4">{{ $item->user?->name ?? '—' }}</td>
                                        <td class="px-3 py-4 text-sm text-slate-600 lg:px-4">{{ $item->fundAccount?->name ?? '—' }}</td>
                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-semibold tabular-nums text-slate-900 lg:px-4">
                                            {{ $item->fundAccount?->currency_code }} {{ number_format((float) $item->declared_amount, 2) }}
                                        </td>
                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-semibold tabular-nums lg:px-4 {{ (float) $item->variance >= 0 ? 'text-emerald-600' : 'text-rose-600' }}">
                                            {{ number_format((float) $item->variance, 2) }}
                                        </td>
                                        <td class="px-3 py-4 text-sm text-slate-500 lg:px-4">{{ $item->note ?: '—' }}</td>
                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-medium lg:px-4">
                                            <button type="button" wire:click="signOff({{ $item->id }})"
                                                    wire:confirm="{{ __('Sign off this opening balance?') }}"
                                                    class="text-indigo-600 transition hover:text-indigo-800">
                                                {{ __('Sign off') }}
                                            </button>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="6" class="px-6 py-12">
                                            <x-empty-state icon="shield-check" class="border-0 bg-transparent py-0"
                                                :title="__('Nothing to sign off')"
                                                :message="__('Every declaration so far has agreed with the books.')" />
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </x-card>
            @endif

            {{-- ── Change requests ────────────────────────────────────────── --}}
            @if ($tab === 'adjustments')
                <x-card class="overflow-hidden">
                    <div class="border-b border-slate-100 p-4 sm:p-5">
                        <h2 class="text-base font-semibold text-slate-900">{{ __('Requests to change an agreed figure') }}</h2>
                        <p class="text-xs text-slate-400">
                            {{ __('These have already been counted and agreed once, so the number below is where the account\'s books currently begin. Approving moves that starting line; nothing has changed until you do.') }}
                        </p>
                    </div>

                    <div class="overflow-x-auto">
                        <table class="min-w-full divide-y divide-slate-100">
                            <thead>
                                <tr class="bg-slate-50/80 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-500">
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Asked by') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Account') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Opens on') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Asked for') }}</th>
                                    <th class="px-3 py-3.5 lg:px-4">{{ __('Reason') }}</th>
                                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Actions') }}</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y divide-slate-100 bg-white">
                                @forelse ($adjustments as $item)
                                    @php
                                        $delta = (float) $item->adjustment_amount - (float) $item->declared_amount;
                                    @endphp
                                    <tr wire:key="adjustment-{{ $item->id }}" class="align-top transition hover:bg-slate-50/70">
                                        <td class="px-3 py-4 text-sm lg:px-4">
                                            <p class="font-medium text-slate-900">{{ $item->adjustmentRequester?->name ?? '—' }}</p>
                                            <p class="mt-1 whitespace-nowrap text-[11px] text-slate-400">
                                                {{ $item->adjustment_requested_at?->timezone($tz)->format('j M Y, H:i') }}
                                            </p>
                                        </td>
                                        <td class="px-3 py-4 text-sm text-slate-600 lg:px-4">
                                            {{ $item->fundAccount?->name ?? '—' }}
                                            <p class="mt-1 text-[11px] text-slate-400">{{ __('Held by :who', ['who' => $item->user?->name ?? '—']) }}</p>
                                        </td>
                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm tabular-nums text-slate-500 lg:px-4">
                                            {{ $item->fundAccount?->currency_code }} {{ number_format((float) $item->declared_amount, 2) }}
                                        </td>
                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-semibold tabular-nums text-slate-900 lg:px-4">
                                            {{ $item->fundAccount?->currency_code }} {{ number_format((float) $item->adjustment_amount, 2) }}
                                            <p class="mt-1 text-[11px] font-semibold {{ $delta >= 0 ? 'text-emerald-600' : 'text-rose-600' }}">
                                                {{ $delta >= 0 ? '+' : '−' }}{{ number_format(abs($delta), 2) }}
                                            </p>
                                        </td>
                                        <td class="px-3 py-4 text-sm text-slate-500 lg:px-4">{{ $item->adjustment_reason ?: '—' }}</td>
                                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-medium lg:px-4">
                                            <div class="flex items-center justify-end gap-3">
                                                <button type="button" wire:click="openDecision({{ $item->id }}, 'approve')"
                                                        class="text-indigo-600 transition hover:text-indigo-800">{{ __('Approve') }}</button>
                                                <button type="button" wire:click="openDecision({{ $item->id }}, 'decline')"
                                                        class="text-rose-600 transition hover:text-rose-800">{{ __('Decline') }}</button>
                                            </div>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="6" class="px-6 py-12">
                                            <x-empty-state icon="pencil-square" class="border-0 bg-transparent py-0"
                                                :title="__('No change requests')"
                                                :message="__('Nobody is asking to move an opening balance that has already been agreed.')" />
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </x-card>
            @endif
        @endif

        {{-- ── Approve / decline ──────────────────────────────────────────── --}}
        <x-dialog-modal wire:model.live="showDecision" maxWidth="lg">
            <x-slot name="title">
                {{ $decisionAction === 'decline' ? __('Decline this change') : __('Approve this change') }}
            </x-slot>

            <x-slot name="content">
                @if ($deciding)
                    <div class="rounded-2xl border border-slate-200 bg-slate-50 p-4 text-sm">
                        <div class="flex items-center justify-between gap-3">
                            <span class="text-slate-500">{{ $deciding->fundAccount?->name }}</span>
                            <span class="whitespace-nowrap font-semibold tabular-nums text-slate-900">
                                {{ $deciding->fundAccount?->currency_code }} {{ number_format((float) $deciding->declared_amount, 2) }}
                                <x-icon name="arrow-right" class="mx-1 inline h-3.5 w-3.5 text-slate-400" />
                                {{ number_format((float) $deciding->adjustment_amount, 2) }}
                            </span>
                        </div>
                        <p class="mt-2 text-xs text-slate-500">
                            {{ __(':who asked, holding for :holder. They said: ":reason"', [
                                'who' => $deciding->adjustmentRequester?->name ?? __('Somebody'),
                                'holder' => $deciding->user?->name ?? __('themselves'),
                                'reason' => $deciding->adjustment_reason,
                            ]) }}
                        </p>
                    </div>
                @endif

                <p class="mt-4 text-sm text-slate-500">
                    {{ $decisionAction === 'decline'
                        ? __('The account keeps the figure it already opens on, and the person who asked is told why. Say something they can act on.')
                        : __('The account\'s opening balance moves to the new figure straight away, posted against Opening Balances so no sale and no cost is invented.') }}
                </p>

                <div class="mt-4">
                    <x-label for="cf-decision-note" :value="$decisionAction === 'decline' ? __('Why you are refusing') : __('Note (optional)')" />
                    <textarea id="cf-decision-note" rows="3" wire:model="decisionNote"
                              class="mt-1 block w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500"></textarea>
                    <x-input-error for="decisionNote" class="mt-2" />
                </div>
            </x-slot>

            <x-slot name="footer">
                <x-secondary-button wire:click="closeDecision" wire:loading.attr="disabled">{{ __('Cancel') }}</x-secondary-button>
                <x-button class="ms-3" wire:click="decide" wire:loading.attr="disabled" wire:target="decide">
                    <span wire:loading.remove wire:target="decide">{{ $decisionAction === 'decline' ? __('Decline') : __('Approve') }}</span>
                    <span wire:loading wire:target="decide">{{ __('Saving…') }}</span>
                </x-button>
            </x-slot>
        </x-dialog-modal>
    </div>
</div>