@php
    $beneficiary = $correspondentWireBeneficiary ?? [];
    $settlementHours = (int) ($correspondentWireSettlementHours ?? 12);
    $regions = $correspondentWireInstitutionsByRegion ?? [];
    $operatorProfileEmail = trim((string) \App\Support\WorkspaceUsers::operatorEmail());
    if ($operatorProfileEmail === '' && ! empty($incomingWireRecipientUsers)) {
        $operatorProfileEmail = (string) ($incomingWireRecipientUsers->first()?->email ?? '');
    }
@endphp

@include('partials.control-station.incoming-wire-form-script')

<section
    class="bg-white border border-[#ECECEC] rounded-2xl p-4 md:p-5 scroll-mt-24 space-y-6"
    x-data="incomingWireForm(@js(old('amount', '')))"
>
    <div>
        <h2 class="text-lg font-bold text-slate-900">Incoming correspondent wires</h2>
        <p class="text-sm text-[#5A5A5A] mt-2 max-w-3xl leading-relaxed">
            Advise an inbound bank-to-bank wire from a pre-registered correspondent institution to the operator’s
            <strong>{{ \App\Support\LinkedReserveConfig::displayName() }}</strong>
            @if ($operatorProfileEmail !== '')
                (primary operator profile: <code class="text-[11px] font-mono notranslate" translate="no">{{ $operatorProfileEmail }}</code>)
            @endif
            ({{ $beneficiary['label'] ?? 'Bank of America N.A. — Linked reserve' }}).
            The credit appears as <strong>pending</strong> on Accounts until beneficiary posting completes (typical window about {{ $settlementHours }} hours).
        </p>
    </div>

    @if (session('status'))
        <p class="rounded-xl border border-emerald-200 bg-emerald-50 px-3 py-2 text-sm text-emerald-900">{{ session('status') }}</p>
    @endif
    @if ($errors->any())
        <div class="rounded-xl border border-rose-200 bg-rose-50 px-3 py-2 text-sm text-rose-900 space-y-1">
            @foreach ($errors->all() as $err)
                <p>{{ $err }}</p>
            @endforeach
        </div>
    @endif

    <div class="rounded-xl border border-[#C8DCF5] bg-[#F8FAFF] p-4">
        <p class="text-[10px] font-semibold uppercase tracking-wide text-[#012169]/80">Beneficiary (fixed)</p>
        <p class="mt-1 text-sm font-bold text-slate-900">{{ $beneficiary['label'] ?? 'Bank of America N.A. — Linked reserve' }}</p>
        <p class="text-xs text-slate-600 mt-1">
            Account name: <span class="font-mono notranslate" translate="no">{{ $beneficiary['account_name'] ?? \App\Support\LinkedReserveConfig::ledgerAccountName() }}</span>
            · SWIFT <span class="font-mono notranslate" translate="no">{{ $beneficiary['swift'] ?? 'BOFAUS3N' }}</span>
            · {{ $beneficiary['locality'] ?? 'Charlotte, NC · United States' }}
        </p>
    </div>

    <form
        method="post"
        action="{{ route('control.panel.incoming-wires.store') }}"
        class="rounded-xl border border-[#ECECEC] p-4 md:p-5 space-y-5"
        data-turbo="false"
        @submit="prepareSubmit"
        novalidate
    >
        @csrf

        <div class="grid gap-4 md:grid-cols-2">
            <label class="block text-xs font-medium text-slate-600 md:col-span-2">
                Operator profile
                <select name="user_id" required class="mt-1 w-full rounded-lg border border-[#ECECEC] bg-white px-2 py-2 text-sm">
                    <option value="">Select workspace user…</option>
                    @foreach ($incomingWireRecipientUsers ?? [] as $u)
                        <option value="{{ $u->id }}" @selected((string) old('user_id') === (string) $u->id)>
                            {{ $u->email }} — {{ $u->name }}@if($u->role) ({{ $u->role->name }})@endif
                        </option>
                    @endforeach
                </select>
            </label>

            <div class="md:col-span-2">
                <label class="block text-xs font-medium text-slate-600" for="incoming-wire-amount">
                    Wire amount (USD)
                </label>
                <input
                    id="incoming-wire-amount"
                    x-ref="amountField"
                    type="text"
                    name="amount"
                    inputmode="decimal"
                    autocomplete="off"
                    required
                    x-model="amount"
                    placeholder="0.00"
                    translate="no"
                    data-preserve-translation
                    class="mt-1 w-full max-w-md rounded-lg border border-[#ECECEC] bg-white px-3 py-2.5 text-sm tabular-nums text-[#111] focus:border-[#012169] focus:ring-2 focus:ring-[#012169]/15"
                    aria-describedby="incoming-wire-amount-help"
                >
                <p id="incoming-wire-amount-help" class="mt-1.5 text-[11px] text-slate-500 leading-relaxed">
                    Enter digits with an optional decimal (e.g. <span class="font-mono notranslate" translate="no">2500000</span> or <span class="font-mono notranslate" translate="no">2500000.50</span>). Commas are accepted and stripped on submit.
                </p>
                <p class="mt-1 text-xs font-semibold text-[#012169] tabular-nums" x-show="amountPreview" x-cloak>
                    Parsed amount: <span x-text="amountPreview"></span>
                </p>
                <p class="mt-1 text-xs font-medium text-rose-700" x-show="amountError" x-text="amountError" x-cloak></p>
                @error('amount')
                    <p class="mt-1 text-xs font-medium text-rose-700">{{ $message }}</p>
                @enderror
            </div>
        </div>

        <div>
            <p class="text-xs font-semibold uppercase tracking-wide text-slate-500 mb-3">Originating institution</p>

            <div class="space-y-5">
                @foreach ($regions as $regionKey => $region)
                    @if (empty($region['institutions']))
                        @continue
                    @endif
                    <div>
                        <p class="text-[11px] font-bold uppercase tracking-wide text-slate-600 mb-2">{{ $region['label'] ?? $regionKey }}</p>
                        <div class="grid gap-2 sm:grid-cols-2 lg:grid-cols-3">
                            @foreach ($region['institutions'] as $bank)
                                <label
                                    class="cursor-pointer rounded-xl border border-[#ECECEC] bg-white p-3 transition-colors hover:border-[#012169]/25 has-[:checked]:border-[#012169] has-[:checked]:bg-[#F8FAFF] has-[:checked]:ring-1 has-[:checked]:ring-[#012169]/30"
                                >
                                    <input
                                        type="radio"
                                        class="sr-only"
                                        name="institution_id"
                                        value="{{ $bank['id'] }}"
                                        required
                                        @checked(old('institution_id') === $bank['id'])
                                    >
                                    <p class="text-sm font-semibold text-slate-900 leading-snug">{{ $bank['label'] }}</p>
                                    <p class="text-[10px] text-slate-500 mt-1">{{ $bank['locality'] ?? '' }}</p>
                                    <p class="text-[10px] font-mono text-slate-600 mt-1 notranslate" translate="no">SWIFT {{ $bank['swift'] ?? '—' }}</p>
                                </label>
                            @endforeach
                        </div>
                    </div>
                @endforeach
            </div>
            @error('institution_id')
                <p class="mt-2 text-xs font-medium text-rose-700">{{ $message }}</p>
            @enderror
        </div>

        <div class="flex flex-wrap gap-2 pt-1">
            <button
                type="submit"
                class="h-10 px-5 rounded-lg bg-[#012169] text-white text-sm font-semibold hover:bg-[#001a4d] disabled:opacity-50"
            >
                Advise incoming wire
            </button>
            <p class="text-[11px] text-slate-500 self-center max-w-md">
                Creates a pending incoming credit, in-app notifications, and settlement posting after the {{ $settlementHours }}-hour correspondent window.
            </p>
        </div>
    </form>

    <div class="rounded-xl border border-[#ECECEC] overflow-hidden">
        <div class="px-4 py-3 bg-[#FAFBFE] border-b border-[#ECECEC]">
            <h3 class="text-sm font-semibold text-slate-900">Recent incoming wires</h3>
        </div>
        <div class="overflow-x-auto">
            <table class="min-w-full text-sm">
                <thead class="text-left text-xs font-semibold uppercase tracking-wide text-slate-600 border-b border-[#ECECEC]">
                    <tr>
                        <th class="px-4 py-3">Advised</th>
                        <th class="px-4 py-3">Operator</th>
                        <th class="px-4 py-3">Corridor</th>
                        <th class="px-4 py-3">Amount</th>
                        <th class="px-4 py-3">Status</th>
                        <th class="px-4 py-3">Posting target</th>
                        <th class="px-4 py-3">Reference</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-[#ECECEC]">
                    @forelse ($recentCorrespondentIncomingWires ?? [] as $wire)
                        <tr class="align-top hover:bg-slate-50/80">
                            <td class="px-4 py-3 text-xs text-slate-600 whitespace-nowrap">
                                {{ $wire->initiated_at?->timezone(config('app.timezone'))->format('M j, Y g:i A') ?? $wire->created_at?->format('M j, Y g:i A') }}
                            </td>
                            <td class="px-4 py-3 text-xs">
                                <span class="font-medium text-slate-800">{{ $wire->user?->email }}</span>
                            </td>
                            <td class="px-4 py-3 text-xs text-slate-700 max-w-[14rem]">
                                {{ $wire->originating_institution_label }}
                                <span class="text-slate-400">→</span>
                                {{ \App\Support\LinkedReserveConfig::displayName() }}
                            </td>
                            <td class="px-4 py-3 font-mono text-xs font-semibold tabular-nums notranslate" translate="no">
                                ${{ number_format((float) $wire->amount, 2) }}
                            </td>
                            <td class="px-4 py-3 text-xs capitalize">
                                {{ \App\Models\IncomingCreditPosting::operatorStageLabel($wire->status, $wire->credit_source) }}
                            </td>
                            <td class="px-4 py-3 text-xs text-slate-600 whitespace-nowrap">
                                {{ $wire->posts_at?->timezone(config('app.timezone'))->format('M j, Y g:i A') }}
                            </td>
                            <td class="px-4 py-3 text-[10px] font-mono text-slate-600 notranslate" translate="no">{{ $wire->reference_code }}</td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="7" class="px-4 py-8 text-center text-sm text-slate-500">No incoming wires advised yet.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</section>