{{--
=====================================================
Etebarit - by Gisoo Web Solutions
------------------------------------------------------
Gisoo.net
------------------------------------------------------
Copyright (c) 2026 Gisoo Web Solutions
=====================================================
This code is protected by copyright
=====================================================
File: show.blade.php
------------------------------------------------------
Use: Admin user detail: the two-tab pattern (info /
     edit). The edit tab holds the national-ID images
     with the enlarge modal, the review decision and
     the identity fields.
=====================================================
--}}

@extends('layouts.admin')

@section('title', $user->fullName().' - '.__('admin.users.title'))

@section('breadcrumb')
    <x-ui.breadcrumb :items="[
        ['label' => __('admin.breadcrumb.home'), 'url' => route('admin.users.index')],
        ['label' => __('admin.users.breadcrumb'), 'url' => route('admin.users.index')],
        ['label' => $user->fullName()],
    ]" />
@endsection

@section('page')
    @php
        $panelAdmin = auth('admin')->user();
        $canEdit = $panelAdmin->allowed('users.edit');
        $canReview = $panelAdmin->allowed('users.review');
        $canBlock = $panelAdmin->allowed('users.block');
        $canWallet = $panelAdmin->allowed('users.wallet');
        $hasEditTab = $canEdit || $canReview || $canBlock || $canWallet;
    @endphp

    <a href="{{ route('admin.users.index') }}" class="mb-4 inline-flex items-center gap-1.5 text-[13.5px] font-bold text-ink-muted transition hover:text-primary-600">
        <svg class="size-[17px]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 6l6 6-6 6"/></svg>
        {{ __('admin.users.back_to_list') }}
    </a>

    <div class="overflow-hidden rounded-2xl border border-line bg-white" x-data="{ tab: 'info' }">

        {{-- ===== Identity header ===== --}}
        <div class="flex flex-wrap items-center gap-4 border-b border-line p-6">
            <span class="flex size-[60px] shrink-0 items-center justify-center rounded-full bg-gradient-to-bl from-[#e9e5f9] to-[#d9d1f4] text-lg font-bold text-primary-600">
                {{ mb_substr($user->first_name, 0, 1) }}.{{ mb_substr($user->last_name, 0, 1) }}
            </span>
            <div class="min-w-0 flex-1">
                <div class="text-lg font-bold">{{ $user->fullName() }}</div>
                {{-- Right-aligned so the number sits directly under the name. --}}
                <div class="text-right! text-[13px] text-ink-faint" dir="ltr">@fa($user->mobile)</div>
            </div>
            <div class="flex items-center gap-2">
                <span @class([
                    'rounded-2xl px-3 py-1.5 text-[12.5px] font-bold',
                    'bg-[#eef0f4] text-ink-soft' => $user->verification_status === \App\Models\User::VERIFICATION_UNVERIFIED,
                    'bg-[#fff5e6] text-amber-600' => $user->verification_status === \App\Models\User::VERIFICATION_PENDING,
                    'bg-[#e7f7ee] text-green-600' => $user->verification_status === \App\Models\User::VERIFICATION_APPROVED,
                    'bg-secondary-50 text-secondary-500' => $user->verification_status === \App\Models\User::VERIFICATION_REJECTED,
                ])>
                    {{ __("admin.users.statuses.{$user->verification_status}") }}
                </span>
                @if ($user->isBlocked())
                    <span class="rounded-2xl bg-secondary-500 px-3 py-1.5 text-[12.5px] font-bold text-white">
                        {{ __('admin.users.blocked_badge') }}
                    </span>
                @endif
            </div>
        </div>

        {{-- Quick verification decision, right under the header so an operator
             can approve/reject a pending account without opening the edit tab.
             Self-contained forms (no dependency on the edit-tab refs). --}}
        @if ($canReview && $user->verification_status === \App\Models\User::VERIFICATION_PENDING)
            <form method="POST" action="{{ route('admin.users.approve', $user) }}" x-ref="topApproveForm" class="hidden">@csrf</form>
            <form method="POST" action="{{ route('admin.users.reject', $user) }}" x-ref="topRejectForm" class="hidden">@csrf</form>
            <div class="flex flex-wrap items-center justify-between gap-3 border-b border-line bg-[#fff9ee] px-6 py-4">
                <div class="flex items-center gap-2 text-[13px] font-bold text-amber-700">
                    <svg class="size-4 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z"/><path d="M14 3v5h5M9 13h6M9 17h4"/></svg>
                    {{ __('admin.users.review.pending_hint') }}
                </div>
                <div class="flex shrink-0 gap-2.5">
                    <button type="button"
                            x-on:click="$store.confirm.ask({ message: @js(__('admin.users.review.confirm_approve')), onConfirm: () => $refs.topApproveForm.submit() })"
                            class="inline-flex items-center gap-1.5 rounded-xl bg-green-600 px-5 py-2.5 text-[13px] font-bold text-white transition hover:bg-green-700">
                        <svg class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
                        {{ __('admin.users.review.approve') }}
                    </button>
                    <button type="button"
                            x-on:click="$store.confirm.ask({ message: @js(__('admin.users.review.confirm_reject')), onConfirm: () => $refs.topRejectForm.submit() })"
                            class="inline-flex items-center gap-1.5 rounded-xl bg-secondary-500 px-5 py-2.5 text-[13px] font-bold text-white transition hover:bg-secondary-600">
                        <svg class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round"><path d="M6 6l12 12M18 6 6 18"/></svg>
                        {{ __('admin.users.review.reject') }}
                    </button>
                </div>
            </div>
        @endif

        {{-- ===== Tabs ===== --}}
        <div class="flex gap-1 border-b border-line px-6">
            <button
                type="button"
                class="-mb-px border-b-2 px-4.5 py-3.5 text-sm font-bold transition"
                x-bind:class="tab === 'info' ? 'border-primary-600 text-primary-600' : 'border-transparent text-ink-muted hover:text-primary-600'"
                x-on:click="tab = 'info'"
            >{{ __('admin.users.tab_info') }}</button>
            @if ($hasEditTab)
                <button
                    type="button"
                    class="-mb-px border-b-2 px-4.5 py-3.5 text-sm font-bold transition"
                    x-bind:class="tab === 'edit' ? 'border-primary-600 text-primary-600' : 'border-transparent text-ink-muted hover:text-primary-600'"
                    x-on:click="tab = 'edit'"
                >{{ __('admin.users.tab_edit') }}</button>
            @endif
        </div>

        {{-- ===== Info tab ===== --}}
        <div class="p-6" x-show="tab === 'info'">
            {{-- Wallet balances (cash is withdrawable, installment is not). --}}
            <div class="mb-6 grid gap-4 sm:grid-cols-2">
                <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.wallet.cash_balance') }}</div>
                    <div class="text-[15px] font-bold text-green-600">
                        @toman($cashBalance)
                        <span class="text-xs font-normal text-ink-faint">{{ __('admin.users.wallet.toman') }}</span>
                    </div>
                </div>
                <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.wallet.installment_balance') }}</div>
                    <div class="text-[15px] font-bold text-primary-600">
                        @toman($installmentBalance)
                        <span class="text-xs font-normal text-ink-faint">{{ __('admin.users.wallet.toman') }}</span>
                    </div>
                </div>
            </div>

            {{-- Good-standing: the user's level, score and how it was reached. --}}
            <div class="mb-6 rounded-[14px] border border-[#f0eff5] bg-white p-5">
                <div class="mb-3 flex flex-wrap items-center justify-between gap-3">
                    <span class="text-[13.5px] font-bold">{{ __('admin.users.standing.section') }}</span>
                    <div class="flex items-center gap-2.5">
                        <span class="rounded-lg bg-[#faf9fd] px-2.5 py-1.5 text-[12.5px] font-bold" dir="ltr">{{ \App\Support\Format::persianDigits((string) $standing['score']) }} / {{ \App\Support\Format::persianDigits((string) \App\Support\GoodStanding::MAX_SCORE) }}</span>
                        <x-standing.explainer :breakdown="$standing" :self="false" />
                    </div>
                </div>
                <x-standing.bar :score="$standing['score']" :level="$standing['level']" :heading="__('front.standing.user_level')" />
            </div>

            <div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
                <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.fields.national_id') }}</div>
                    <div class="text-right! text-sm font-bold" dir="ltr">@fa($user->national_id)</div>
                </div>
                <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.fields.registered_at') }}</div>
                    <div class="text-sm font-bold">@jalaliDateTime($user->created_at)</div>
                </div>
                <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.fields.type') }}</div>
                    <div class="text-sm font-bold">{{ __("admin.users.types.{$user->type}") }}</div>
                </div>
                <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.fields.status') }}</div>
                    <div class="text-sm font-bold">{{ __("admin.users.statuses.{$user->verification_status}") }}</div>
                </div>
            </div>

            {{-- Virtual credit card --}}
            <x-admin.section-head :title="__('admin.users.wallet.card_section')" :href="route('admin.requests.cards', ['q' => $user->mobile])" />
            @if ($card)
                <div class="flex flex-wrap items-center gap-3.5 rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] px-4 py-3.5">
                    <span class="flex size-11 shrink-0 items-center justify-center rounded-[11px] bg-gradient-to-bl from-primary-600 to-primary-400">
                        <svg class="size-[22px] text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><rect x="2.5" y="5.5" width="19" height="13" rx="2.5"/><line x1="2.5" y1="9.5" x2="21.5" y2="9.5"/></svg>
                    </span>
                    <div class="min-w-0 flex-1">
                        <div class="text-right! text-sm font-bold tracking-wide" dir="ltr">@fa($card->formattedNumber())</div>
                        <div class="text-xs text-ink-faint">
                            {{ __('admin.users.wallet.card_expiry') }} @jalali($card->expires_at, 'Y/m')
                            &bull; CVV2 @fa($card->cvv2)
                        </div>
                    </div>
                    <span class="rounded-2xl bg-[#e7f7ee] px-3 py-1.5 text-xs font-bold text-green-600">
                        {{ __('admin.users.wallet.card_active') }}
                    </span>
                </div>
            @else
                <p class="rounded-[14px] border border-dashed border-[#d9d6e6] px-4 py-5 text-center text-xs leading-6 text-ink-muted">
                    {{ __('admin.users.wallet.no_card') }}
                </p>
            @endif

            {{-- Recent ledger movement, signs always explicit --}}
            <x-admin.section-head :title="__('admin.users.wallet.recent_entries')" :href="route('admin.transactions.index', ['q' => $user->mobile])" />
            @if ($recentEntries->isEmpty())
                <p class="rounded-[14px] border border-dashed border-[#d9d6e6] px-4 py-5 text-center text-xs leading-6 text-ink-muted">
                    {{ __('admin.users.wallet.no_entries') }}
                </p>
            @else
                <div class="overflow-hidden rounded-[14px] border border-[#f0eff5]">
                    @foreach ($recentEntries as $entry)
                        <div @class(['flex flex-wrap items-center justify-between gap-2 px-4 py-3', 'border-t border-[#f5f4f9]' => ! $loop->first])>
                            <div class="min-w-0">
                                <span class="text-[12.5px] font-bold">{{ $entry->reasonLabel('admin.wallet_reasons') }}</span>
                                @if ($entry->bucket === \App\Models\WalletEntry::BUCKET_INSTALLMENT)
                                    {{-- Installment-bucket movements carry this badge everywhere. --}}
                                    <span class="mr-1 rounded-md bg-[#efeafb] px-1.5 py-0.5 text-[10.5px] font-normal text-primary-600">{{ __('admin.users.wallet.bucket_installment') }}</span>
                                @endif
                                @if ($entry->transaction)
                                    <span class="mr-1.5 text-[11px] text-ink-faint">{{ __('admin.users.wallet.tracking') }} @fa($entry->transaction->code)</span>
                                @endif
                                <span class="mr-1.5 text-[11px] text-ink-faint">@jalaliDateTime($entry->created_at)</span>
                            </div>
                            {{-- RTL reading order: the figure first, the unit after it.
                                 Only the signed number itself is an LTR run. --}}
                            <span @class([
                                'text-[12.5px] font-bold',
                                'text-green-600' => $entry->isCredit(),
                                'text-secondary-500' => ! $entry->isCredit(),
                            ])>
                                <span dir="ltr">{{ $entry->isCredit() ? '+' : '−' }}@toman($entry->amount)</span>
                                {{ __('admin.toman') }}
                            </span>
                        </div>
                    @endforeach
                </div>
            @endif

            <div class="mb-3 mt-6 text-[13.5px] font-bold">{{ __('admin.users.bank_accounts.section') }}</div>
            @if ($bankAccounts->isEmpty())
                <p class="rounded-[14px] border border-dashed border-[#d9d6e6] px-4 py-5 text-center text-xs leading-6 text-ink-muted">
                    {{ __('admin.users.bank_accounts.empty') }}
                </p>
            @else
                <div class="overflow-hidden rounded-[14px] border border-[#f0eff5]">
                    @foreach ($bankAccounts as $account)
                        <div @class(['flex flex-wrap items-center justify-between gap-3 px-4 py-3', 'border-t border-[#f5f4f9]' => ! $loop->first])>
                            <div class="flex min-w-0 items-center gap-2.5">
                                <x-ui.bank-mark :account="$account" />
                                <div class="min-w-0">
                                    <div class="text-[12.5px] font-bold">
                                        {{ $account->bankName() }}
                                        @if ($account->is_default)
                                            <span class="mr-1 rounded-md bg-[#efeafb] px-1.5 py-0.5 text-[10.5px] font-normal text-primary-600">{{ __('admin.bank_accounts.default') }}</span>
                                        @endif
                                    </div>
                                    {{-- Full number, ASCII digits, click to copy. --}}
                                    <x-ui.copyable :value="$account->card_number" :display="$account->formattedCard()" class="mt-0.5 block text-[11.5px] font-normal! text-ink-faint" />
                                    @if ($account->sheba)
                                        <div class="mt-0.5 flex items-center gap-1 text-[11px] text-ink-faint">
                                            <span class="shrink-0 text-ink-faint/70">{{ __('admin.users.bank_accounts.sheba') }}</span>
                                            <x-ui.copyable :value="'IR'.$account->sheba" :display="$account->formattedSheba()" class="font-normal!" />
                                        </div>
                                    @endif
                                </div>
                            </div>
                            <span @class([
                                'rounded-2xl px-2.5 py-1 text-[11px] font-bold',
                                'bg-[#fff5e6] text-amber-600' => $account->isPending(),
                                'bg-[#e7f7ee] text-green-600' => $account->isApproved(),
                                'bg-secondary-50 text-secondary-500' => $account->status === \App\Models\BankAccount::STATUS_REJECTED,
                            ])>{{ __("admin.bank_accounts.statuses.{$account->status}") }}</span>
                        </div>
                    @endforeach
                </div>
            @endif

            {{-- Credit the user has received --}}
            <x-admin.section-head :title="__('admin.users.credits.section')" :href="route('admin.requests.index', ['q' => $user->mobile])" />
            @if ($creditRequests->isEmpty())
                <p class="rounded-[14px] border border-dashed border-[#d9d6e6] px-4 py-5 text-center text-xs leading-6 text-ink-muted">{{ __('admin.users.credits.empty') }}</p>
            @else
                <div class="overflow-hidden rounded-[14px] border border-[#f0eff5]">
                    @foreach ($creditRequests as $creditRequest)
                        <div @class(['flex flex-wrap items-center justify-between gap-3 px-4 py-3', 'border-t border-[#f5f4f9]' => ! $loop->first])>
                            <div class="min-w-0">
                                <div class="text-[12.5px] font-bold">
                                    {{ $creditRequest->plan?->name ?? '—' }}
                                    <span class="mr-1 text-[11px] font-normal text-ink-faint" dir="ltr">{{ $creditRequest->code }}</span>
                                </div>
                                <div class="mt-0.5 text-[11px] text-ink-faint"><span dir="ltr">@toman($creditRequest->amount)</span> {{ __('admin.toman') }} • @jalaliDateTime($creditRequest->created_at)</div>
                            </div>
                            <span @class([
                                'rounded-2xl px-2.5 py-1 text-[11px] font-bold',
                                'bg-[#e7f7ee] text-green-600' => $creditRequest->status === \App\Models\CreditRequest::STATUS_ACTIVE,
                                'bg-[#fff5e6] text-amber-600' => in_array($creditRequest->status, [\App\Models\CreditRequest::STATUS_PENDING, \App\Models\CreditRequest::STATUS_APPROVED], true),
                                'bg-secondary-50 text-secondary-500' => $creditRequest->status === \App\Models\CreditRequest::STATUS_REJECTED,
                                'bg-[#f1f0f5] text-ink-muted' => $creditRequest->status === \App\Models\CreditRequest::STATUS_EXPIRED,
                            ])>{{ __('admin.requests.statuses.'.$creditRequest->status) }}</span>
                        </div>
                    @endforeach
                </div>
            @endif

            {{-- Installments that came out of that credit --}}
            <x-admin.section-head :title="__('admin.users.installments.section')" :href="route('admin.installments.index', ['q' => $user->mobile])" />
            @if ($installments->isEmpty())
                <p class="rounded-[14px] border border-dashed border-[#d9d6e6] px-4 py-5 text-center text-xs leading-6 text-ink-muted">{{ __('admin.users.installments.empty') }}</p>
            @else
                <div class="overflow-x-auto rounded-[14px] border border-[#f0eff5]">
                    <table class="w-full min-w-[520px] text-right text-[12.5px]">
                        <thead class="bg-[#faf9fd] text-[11px] text-ink-faint">
                            <tr>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.installments.columns.plan') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.installments.columns.amount') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.installments.columns.penalty') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.installments.columns.due_at') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.installments.columns.status') }}</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-[#f5f4f9]">
                            @foreach ($installments as $installment)
                                <tr>
                                    <td class="px-4 py-2.5">
                                        <span class="font-bold">{{ $installment->creditRequest?->plan?->name ?? '—' }}</span>
                                        <span class="text-[10.5px] text-ink-faint" dir="ltr">{{ $installment->creditRequest?->code }}</span>
                                    </td>
                                    <td class="px-4 py-2.5 font-bold" dir="ltr">@toman($installment->amount)</td>
                                    <td class="px-4 py-2.5" dir="ltr">
                                        @if ($installment->penalty_amount > 0)
                                            <span class="font-bold text-secondary-500">@toman($installment->penalty_amount)</span>
                                        @else
                                            <span class="text-ink-faint">—</span>
                                        @endif
                                    </td>
                                    <td class="px-4 py-2.5 text-ink-soft">@jalali($installment->due_at)</td>
                                    <td class="px-4 py-2.5">
                                        <span @class([
                                            'rounded-xl px-2 py-0.5 text-[10.5px] font-bold',
                                            'bg-[#e7f7ee] text-green-600' => $installment->status === \App\Models\Installment::STATUS_PAID,
                                            'bg-secondary-50 text-secondary-500' => $installment->status === \App\Models\Installment::STATUS_OVERDUE,
                                            'bg-[#fff5e6] text-amber-600' => $installment->status === \App\Models\Installment::STATUS_DUE,
                                            'bg-[#eef2fb] text-[#3b6bd8]' => $installment->status === \App\Models\Installment::STATUS_UPCOMING,
                                        ])>{{ __('admin.installments.statuses.'.$installment->status) }}</span>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @endif

            {{-- Orders the user placed through the gateway --}}
            <x-admin.section-head :title="__('admin.users.orders.section')" :href="route('admin.orders.index', ['q' => $user->mobile])" />
            @if ($orders->isEmpty())
                <p class="rounded-[14px] border border-dashed border-[#d9d6e6] px-4 py-5 text-center text-xs leading-6 text-ink-muted">{{ __('admin.users.orders.empty') }}</p>
            @else
                <div class="overflow-x-auto rounded-[14px] border border-[#f0eff5]">
                    <table class="w-full min-w-[520px] text-right text-[12.5px]">
                        <thead class="bg-[#faf9fd] text-[11px] text-ink-faint">
                            <tr>
                                <th class="px-4 py-2.5 font-bold">{{ __('front.shop.sales.order') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.users.orders.shop') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('front.shop.sales.total') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('front.shop.sales.date') }}</th>
                                <th class="px-4 py-2.5 font-bold">{{ __('admin.installments.columns.status') }}</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-[#f5f4f9]">
                            @foreach ($orders as $order)
                                <tr>
                                    <td class="px-4 py-2.5">
                                        <a href="{{ route('admin.orders.index', ['q' => $order->code]) }}" target="_blank" class="font-bold text-primary-600 transition hover:text-primary-700" dir="ltr">{{ $order->code }}</a>
                                    </td>
                                    <td class="px-4 py-2.5">{{ $order->shop?->name ?? '—' }}</td>
                                    <td class="px-4 py-2.5 font-bold" dir="ltr">@toman($order->amount)</td>
                                    <td class="px-4 py-2.5 text-ink-soft">@jalali($order->paid_at ?? $order->created_at)</td>
                                    <td class="px-4 py-2.5">
                                        <span @class([
                                            'rounded-xl px-2 py-0.5 text-[10.5px] font-bold',
                                            'bg-[#e7f7ee] text-green-600' => $order->status === \App\Models\Order::STATUS_PAID,
                                            'bg-[#fff5e6] text-amber-600' => $order->status === \App\Models\Order::STATUS_PENDING,
                                            'bg-secondary-50 text-secondary-500' => in_array($order->status, [\App\Models\Order::STATUS_FAILED, \App\Models\Order::STATUS_EXPIRED], true),
                                        ])>{{ __('admin.users.orders.statuses.'.$order->status) }}</span>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @endif

            @if ($user->shop)
                <div class="mb-3 mt-6 text-[13.5px] font-bold">{{ __('admin.users.shop.section') }}</div>
                <div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
                    <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                        <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.shop.name') }}</div>
                        <a href="{{ route('admin.shops.show', $user->shop) }}" target="_blank" class="text-sm font-bold transition hover:text-primary-600">{{ $user->shop->name }}</a>
                    </div>
                    <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                        <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.shop.slug') }}</div>
                        <a href="{{ route('admin.shops.show', $user->shop) }}" target="_blank" class="block text-right text-sm font-bold transition hover:text-primary-600"><span dir="ltr">{{ $user->shop->slug }}</span></a>
                    </div>
                    <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4">
                        <div class="mb-1.5 text-xs text-ink-faint">{{ __('admin.users.shop.status') }}</div>
                        <div class="text-sm font-bold">{{ __("admin.users.shop.statuses.{$user->shop->status}") }}</div>
                    </div>
                </div>
            @endif
        </div>

        {{-- ===== Edit tab (each block gated by its own ability) ===== --}}
        @if ($hasEditTab)
        <div class="p-6" x-show="tab === 'edit'" x-cloak>
            <div class="grid items-start gap-6 lg:grid-cols-2">

                {{-- Editable identity + decisions --}}
                <div class="flex flex-col gap-5">
                    @if ($canEdit)
                    <form method="POST" action="{{ route('admin.users.update', $user) }}" x-ref="saveForm"
                          x-on:submit.prevent="$store.confirm.ask({ message: @js(__('admin.users.confirm_save')), onConfirm: () => $refs.saveForm.submit() })"
                          class="flex flex-col gap-4">
                        @csrf
                        @method('PUT')

                        <div class="grid gap-4 sm:grid-cols-2">
                            <div>
                                <x-ui.input name="first_name" :label="__('admin.users.fields.first_name')" :value="$user->first_name" required />
                                @error('first_name')<p class="mt-1.5 text-xs leading-6 text-secondary-500">{{ $message }}</p>@enderror
                            </div>
                            <div>
                                <x-ui.input name="last_name" :label="__('admin.users.fields.last_name')" :value="$user->last_name" required />
                                @error('last_name')<p class="mt-1.5 text-xs leading-6 text-secondary-500">{{ $message }}</p>@enderror
                            </div>
                        </div>

                        <div>
                            <x-ui.input name="national_id" :label="__('admin.users.fields.national_id')" :value="$user->national_id" dir="ltr" class="text-left" required />
                            @error('national_id')<p class="mt-1.5 text-xs leading-6 text-secondary-500">{{ $message }}</p>@enderror
                        </div>

                        <p class="flex items-center gap-2 text-xs leading-6 text-ink-faint">
                            <svg class="size-3.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="10" width="18" height="11" rx="2.5"/><path d="M7 10V7a5 5 0 0 1 10 0v3"/></svg>
                            {{ __('admin.users.mobile_note') }}
                        </p>

                        <div class="flex justify-end">
                            <x-ui.button type="submit">
                                {{ __('admin.users.save') }}
                            </x-ui.button>
                        </div>
                    </form>
                    @endif

                    {{-- Review decision --}}
                    @if ($canReview)
                    <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4.5">
                        <div class="mb-1.5 text-[13.5px] font-bold">{{ __('admin.users.review.section') }}</div>
                        @if ($user->verification_status === \App\Models\User::VERIFICATION_PENDING)
                            <p class="mb-4 text-xs leading-6 text-ink-muted">{{ __('admin.users.review.pending_hint') }}</p>
                            <div class="flex flex-wrap gap-2.5">
                                <form method="POST" action="{{ route('admin.users.approve', $user) }}" x-ref="approveForm" class="hidden">@csrf</form>
                                <form method="POST" action="{{ route('admin.users.reject', $user) }}" x-ref="rejectForm" class="hidden">@csrf</form>

                                <button
                                    type="button"
                                    class="inline-flex items-center gap-2 rounded-xl bg-[#e7f7ee] px-5 py-2.5 text-sm font-bold text-green-700 transition hover:bg-[#d5f0e0]"
                                    x-on:click="$store.confirm.ask({ message: @js(__('admin.users.review.confirm_approve')), onConfirm: () => $refs.approveForm.submit() })"
                                >
                                    <svg class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
                                    {{ __('admin.users.review.approve') }}
                                </button>

                                <button
                                    type="button"
                                    class="inline-flex items-center gap-2 rounded-xl bg-secondary-50 px-5 py-2.5 text-sm font-bold text-secondary-500 transition hover:bg-[#fbd5d9]"
                                    x-on:click="$store.confirm.ask({ message: @js(__('admin.users.review.confirm_reject')), onConfirm: () => $refs.rejectForm.submit() })"
                                >
                                    <svg class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round"><path d="M6 6l12 12M18 6 6 18"/></svg>
                                    {{ __('admin.users.review.reject') }}
                                </button>
                            </div>
                        @else
                            <p class="text-xs leading-6 text-ink-muted">{{ __('admin.users.review.not_pending_hint') }}</p>
                        @endif
                    </div>
                    @endif

                    {{-- Support-made wallet adjustment (cash bucket) --}}
                    @if ($canWallet)
                    <div class="rounded-[14px] border border-[#f0eff5] bg-[#faf9fd] p-4.5"
                         x-data="walletAdjust({
                            invalid: @js(__('admin.users.wallet.invalid_amount')),
                            confirmTopup: @js(__('admin.users.wallet.confirm_topup')),
                            confirmDeduct: @js(__('admin.users.wallet.confirm_deduct')),
                         })">
                        <div class="mb-1 text-[13.5px] font-bold">{{ __('admin.users.wallet.adjust_section') }}</div>
                        <div class="mb-3.5 text-xs leading-6 text-ink-muted">
                            {{ __('admin.users.wallet.current') }}
                            <span class="font-bold text-ink">@toman($cashBalance)</span>
                            {{ __('admin.users.wallet.toman') }}
                        </div>

                        <form x-ref="topupForm" method="POST" action="{{ route('admin.users.wallet.topup', $user) }}" class="hidden">
                            @csrf
                            <input type="hidden" name="amount">
                        </form>
                        <form x-ref="deductForm" method="POST" action="{{ route('admin.users.wallet.deduct', $user) }}" class="hidden">
                            @csrf
                            <input type="hidden" name="amount">
                        </form>

                        <div class="flex flex-wrap gap-2">
                            {{-- Unit-bearing numeric input: RTL and right-aligned per the constitution. --}}
                            <input
                                type="text"
                                inputmode="numeric"
                                placeholder="{{ __('admin.users.wallet.amount_placeholder') }}"
                                x-on:input="onAmount($event)"
                                class="min-w-[140px] flex-1 rounded-[11px] border-[1.5px] border-[#e3e1ec] bg-white px-3.5 py-2.5 text-right text-sm outline-none transition focus:border-primary-600 focus:shadow-[0_0_0_3px_rgba(86,59,177,0.12)]"
                            >
                            <button
                                type="button"
                                class="inline-flex items-center gap-1.5 rounded-[11px] bg-[#e7f7ee] px-4 text-[13px] font-bold text-green-700 transition hover:bg-[#d5f0e0]"
                                x-on:click="confirmAdjust('topup')"
                            >
                                <svg class="size-[15px]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
                                {{ __('admin.users.wallet.topup') }}
                            </button>
                            <button
                                type="button"
                                class="inline-flex items-center gap-1.5 rounded-[11px] bg-secondary-50 px-4 text-[13px] font-bold text-secondary-500 transition hover:bg-[#fbd5d9]"
                                x-on:click="confirmAdjust('deduct')"
                            >
                                <svg class="size-[15px]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round"><line x1="5" y1="12" x2="19" y2="12"/></svg>
                                {{ __('admin.users.wallet.deduct') }}
                            </button>
                        </div>

                        @error('amount')
                            <p class="mt-2.5 text-xs leading-6 text-secondary-500">{{ $message }}</p>
                        @enderror
                    </div>
                    @endif

                    {{-- Block / unblock --}}
                    @if ($canBlock)
                    <div class="flex justify-start">
                        <form method="POST" action="{{ route('admin.users.toggle-block', $user) }}" x-ref="blockForm" class="hidden">@csrf</form>
                        <button
                            type="button"
                            @class([
                                'inline-flex items-center gap-2 rounded-xl px-5 py-2.5 text-sm font-bold transition',
                                'bg-secondary-50 text-secondary-500 hover:bg-[#fbd5d9]' => ! $user->isBlocked(),
                                'bg-[#e7f7ee] text-green-700 hover:bg-[#d5f0e0]' => $user->isBlocked(),
                            ])
                            x-on:click="$store.confirm.ask({ message: @js($user->isBlocked() ? __('admin.users.block.confirm_unblock') : __('admin.users.block.confirm_block')), onConfirm: () => $refs.blockForm.submit() })"
                        >
                            {{ $user->isBlocked() ? __('admin.users.block.unblock') : __('admin.users.block.block') }}
                        </button>
                    </div>
                    @endif
                </div>

                {{-- National-ID images (private disk, review ability only) --}}
                @if ($canReview)
                <div class="rounded-2xl border border-[#f0eff5] bg-[#faf9fd] p-4">
                    <div class="mb-1 text-[13.5px] font-bold">{{ __('admin.users.documents.section') }}</div>
                    <p class="mb-4 text-xs leading-6 text-ink-muted">{{ __('admin.users.documents.hint') }}</p>

                    <div class="flex flex-col gap-4">
                        @foreach ([['side' => 'front', 'document' => $front], ['side' => 'back', 'document' => $back]] as $item)
                            <div>
                                <div class="mb-2 flex items-center justify-between text-xs text-ink-faint">
                                    <span>{{ __("admin.users.documents.{$item['side']}") }}</span>
                                    @if ($item['document'])
                                        <span>{{ __('admin.users.documents.uploaded_at') }} @jalaliDateTime($item['document']->created_at)</span>
                                    @endif
                                </div>

                                @if ($item['document'])
                                    @php
                                        $viewUrl = route('admin.users.document', [$user, $item['document']]);
                                        $downloadUrl = route('admin.users.document', [$user, $item['document'], 'download' => 1]);
                                    @endphp
                                    <button
                                        type="button"
                                        class="block w-full overflow-hidden rounded-xl border border-[#e9e7f2] bg-white transition hover:border-primary-600/50 hover:shadow-lg hover:shadow-primary-600/10"
                                        x-on:click="$store.imageViewer.show(@js($viewUrl), @js($downloadUrl), @js(__("admin.users.documents.{$item['side']}").' - '.$user->fullName()))"
                                    >
                                        <img src="{{ $viewUrl }}" alt="{{ __("admin.users.documents.{$item['side']}") }}" loading="lazy" class="h-[170px] w-full object-contain">
                                    </button>
                                @else
                                    <div class="flex h-[120px] items-center justify-center rounded-xl border border-dashed border-[#d9d6e6] text-xs text-ink-faint">
                                        {{ __('admin.users.documents.missing') }}
                                    </div>
                                @endif
                            </div>
                        @endforeach
                    </div>
                </div>
                @endif

            </div>
        </div>
        @endif
    </div>
@endsection