{{--
=====================================================
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 shop detail: an info tab (sales, wallet, recent
     transactions) and an edit tab that sets the merchant
     fee, identity and status.
=====================================================
--}}

@extends('layouts.admin')

@section('title', $shop->name)

@php use App\Support\Format; @endphp

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

@section('page')
    @php $canManage = auth('admin')->user()->allowed('shops.manage'); @endphp

    <a href="{{ route('admin.shops.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-4" 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.shops_manage.back_to_list') }}
    </a>

    <div class="overflow-hidden rounded-2xl border border-line bg-white" x-data="{ tab: 'info' }">
        {{-- Header --}}
        <div class="flex items-center gap-4 border-b border-line px-6 py-5">
            <span class="flex size-14 shrink-0 items-center justify-center overflow-hidden rounded-2xl bg-gradient-to-bl from-[#e9e5f9] to-[#d9d1f4] text-[17px] font-bold text-primary-600">
                @if ($shop->logo_path)
                    <img src="{{ route('media.shop-logo', $shop) }}" alt="{{ $shop->name }}" class="size-full object-cover">
                @else
                    {{ mb_substr($shop->name, 0, 2) }}
                @endif
            </span>
            <div class="min-w-0 flex-1">
                <div class="text-[18px] font-bold">{{ $shop->name }}</div>
                <div class="text-right text-[13px] text-ink-faint"><span dir="ltr">{{ $shop->slug }}</span></div>
            </div>
            @if ($shop->isApproved())
                <span class="rounded-2xl bg-[#e7f7ee] px-3 py-1.5 text-[12.5px] font-bold text-green-600">{{ __('admin.shops_manage.statuses.approved') }}</span>
            @else
                <span class="rounded-2xl bg-[#f1f0f5] px-3 py-1.5 text-[12.5px] font-bold text-ink-muted">{{ __('admin.shops_manage.statuses.rejected') }}</span>
            @endif
        </div>

        {{-- Tabs --}}
        <div class="flex gap-1 border-b border-line px-6">
            @foreach (['info', 'edit'] as $key)
                @if ($key === 'edit' && ! $canManage) @continue @endif
                <button type="button" x-on:click="tab = @js($key)"
                        x-bind:class="tab === @js($key) ? 'border-primary-600 text-primary-600' : 'border-transparent text-ink-muted hover:text-ink'"
                        class="border-b-2 px-4 py-3 text-[13.5px] font-bold transition">{{ __('admin.shops_manage.tabs.'.$key) }}</button>
            @endforeach
        </div>

        <div class="p-6">
            {{-- ===== Info tab ===== --}}
            <div x-show="tab === 'info'">
                <div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
                    <x-admin.stat-tile :label="__('admin.shops_manage.stats.sales_total')" :amount="$salesTotal" />
                    <div class="rounded-2xl border border-line bg-white px-5 py-4.5">
                        <div class="text-[12.5px] font-medium text-ink-muted">{{ __('admin.shops_manage.stats.settled') }}</div>
                        <div class="mt-2 flex items-baseline gap-1.5"><span class="text-[22px] font-black leading-none tracking-tight text-green-600" dir="ltr">@toman($settledTotal)</span><span class="text-[12px] font-bold text-ink-faint">{{ __('admin.toman') }}</span></div>
                    </div>
                    <div class="rounded-2xl border border-line bg-white px-5 py-4.5">
                        <div class="text-[12.5px] font-medium text-ink-muted">{{ __('admin.shops_manage.stats.wallet') }}</div>
                        <div class="mt-2 flex items-baseline gap-1.5"><span class="text-[22px] font-black leading-none tracking-tight text-primary-700" dir="ltr">@toman($walletBalance)</span><span class="text-[12px] font-bold text-ink-faint">{{ __('admin.toman') }}</span></div>
                    </div>
                </div>

                <div class="mt-4 grid grid-cols-2 gap-4 sm:grid-cols-4">
                    <div class="rounded-xl border border-line bg-[#faf9fd] p-4">
                        <div class="text-[12px] text-ink-faint">{{ __('admin.shops_manage.stats.customers') }}</div>
                        <div class="mt-1.5 text-[15px] font-bold">@fa($customers)</div>
                    </div>
                    <div class="rounded-xl border border-line bg-[#faf9fd] p-4">
                        <div class="text-[12px] text-ink-faint">{{ __('admin.shops_manage.stats.fee') }}</div>
                        <div class="mt-1.5 text-[15px] font-bold" dir="ltr">@fa(Format::percentFromBp($shop->fee_percent))٪ — @toman((int) $shop->fee_cap)</div>
                    </div>
                    <div class="rounded-xl border border-line bg-[#faf9fd] p-4">
                        <div class="text-[12px] text-ink-faint">{{ __('admin.shops_manage.owner') }}</div>
                        <div class="mt-1.5 text-[15px] font-bold">
                            @if ($shop->user)
                                <a href="{{ route('admin.users.show', $shop->user) }}" target="_blank" class="transition hover:text-primary-600">{{ $shop->user->fullName() }}</a>
                            @else
                                —
                            @endif
                        </div>
                    </div>
                    <div class="rounded-xl border border-line bg-[#faf9fd] p-4">
                        <div class="text-[12px] text-ink-faint">{{ __('admin.shops_manage.member_since') }}</div>
                        <div class="mt-1.5 text-[15px] font-bold">@jalali($shop->created_at)</div>
                    </div>
                </div>

                @php
                    $loc = implode('، ', array_filter([$shop->province, $shop->city]));
                    $fullAddress = $shop->address ? ($loc ? $loc.' — '.$shop->address : $shop->address) : $loc;
                @endphp
                @if ($fullAddress !== '')
                    <div class="mt-4 rounded-xl border border-line bg-[#faf9fd] p-4">
                        <div class="text-[12px] text-ink-faint">{{ __('admin.shops_manage.address') }}</div>
                        <div class="mt-1.5 text-[13.5px] font-bold leading-7">{{ $fullAddress }}</div>
                    </div>
                @endif

                <div class="mb-3 mt-7 flex items-center justify-between gap-3">
                    <h3 class="text-[14px] font-bold">{{ __('admin.shops_manage.recent_sales') }}</h3>
                    <a href="{{ route('admin.transactions.index', ['shop' => $shop->id]) }}"
                       class="inline-flex shrink-0 items-center gap-1 rounded-lg border border-primary-200 bg-primary-50 px-3 py-1.5 text-[11.5px] font-bold text-primary-600 transition hover:bg-primary-100">
                        {{ __('admin.actions.see_all') }}
                        <svg class="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 6l-6 6 6 6"/></svg>
                    </a>
                </div>
                <div class="overflow-hidden rounded-xl border border-line">
                    @forelse ($transactions as $transaction)
                        @php $incoming = $transaction->isIncoming(); @endphp
                        <div @class(['flex items-center justify-between gap-3 px-4 py-3', 'border-t border-line' => ! $loop->first])>
                            <div class="min-w-0">
                                <div class="text-[13px] font-bold">{{ $transaction->primaryEntry()?->reasonLabel('admin.wallet_reasons') ?? __('admin.wallet_reasons.other') }}</div>
                                <div class="text-[11.5px] text-ink-faint" dir="ltr">
                                    @if ($transaction->order)<span class="text-primary-600">{{ $transaction->order->code }}</span> • @endif{{ \App\Support\Format::jalaliDateTimeFa($transaction->created_at) }}
                                </div>
                            </div>
                            <span @class(['shrink-0 text-[13px] font-bold', 'text-green-600' => $incoming, 'text-secondary-500' => ! $incoming]) dir="ltr">{{ $incoming ? '+' : '−' }}@toman($transaction->amount)</span>
                        </div>
                    @empty
                        <p class="px-4 py-8 text-center text-sm text-ink-muted">{{ __('admin.shops_manage.no_transactions') }}</p>
                    @endforelse
                </div>

                {{-- ===== Orders ===== --}}
                <div class="mb-3 mt-7 flex items-center justify-between gap-3">
                    <h3 class="text-[14px] font-bold">{{ __('admin.shops_manage.orders.title') }}</h3>
                    <a href="{{ route('admin.orders.index', ['q' => $shop->name]) }}"
                       class="inline-flex shrink-0 items-center gap-1 rounded-lg border border-primary-200 bg-primary-50 px-3 py-1.5 text-[11.5px] font-bold text-primary-600 transition hover:bg-primary-100">
                        {{ __('admin.actions.see_all') }}
                        <svg class="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 6l-6 6 6 6"/></svg>
                    </a>
                </div>
                <div class="overflow-x-auto rounded-xl border border-line">
                    <table class="w-full min-w-[560px] text-right text-[13px]">
                        <thead class="bg-[#faf9fd] text-[12px] text-ink-muted">
                            <tr>
                                <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.orders.code') }}</th>
                                <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.orders.customer') }}</th>
                                <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.orders.amount') }}</th>
                                <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.orders.status') }}</th>
                                <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.orders.date') }}</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-line">
                            @forelse ($orders as $order)
                                <tr>
                                    <td class="px-4 py-3">
                                        <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-3 text-ink-soft">{{ $order->user?->fullName() ?? '—' }}</td>
                                    <td class="px-4 py-3 font-bold" dir="ltr">@toman($order->amount) {{ __('admin.toman') }}</td>
                                    <td class="px-4 py-3">
                                        <span @class([
                                            'rounded-lg px-2.5 py-1 text-[11.5px] font-bold',
                                            'bg-[#e7f7ee] text-green-600' => $order->isPaid(),
                                            'bg-[#fff5e6] text-amber-600' => $order->isPending(),
                                            'bg-secondary-50 text-secondary-500' => ! $order->isPaid() && ! $order->isPending(),
                                        ])>{{ __('admin.orders.statuses.'.$order->status) }}</span>
                                    </td>
                                    <td class="px-4 py-3 text-ink-soft">@jalaliDateTime($order->created_at)</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="5" class="px-4 py-8 text-center text-sm text-ink-muted">{{ __('admin.shops_manage.orders.empty') }}</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                {{-- ===== Settlement requests ===== --}}
                <div id="settlements" x-data="payoutReview(@js([
                    'rejectLabel' => __('admin.settlements.reject_reason_label'),
                    'rejectPlaceholder' => '',
                ]))">
                    <div class="mb-3 mt-7 flex items-center justify-between gap-3">
                        <h3 class="text-[14px] font-bold">{{ __('admin.shops_manage.settlement.title') }}</h3>
                        <a href="{{ route('admin.settlements.index', ['shop' => $shop->id]) }}"
                           class="inline-flex shrink-0 items-center gap-1 rounded-lg border border-primary-200 bg-primary-50 px-3 py-1.5 text-[11.5px] font-bold text-primary-600 transition hover:bg-primary-100">
                            {{ __('admin.actions.see_all') }}
                            <svg class="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 6l-6 6 6 6"/></svg>
                        </a>
                    </div>
                    <div class="overflow-x-auto rounded-xl border border-line">
                        <table class="w-full min-w-[640px] border-collapse text-right text-[13px]">
                            <thead>
                                <tr class="bg-[#faf9fd] text-ink-muted">
                                    <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.settlement.code') }}</th>
                                    <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.settlement.amount') }}</th>
                                    <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.settlement.destination') }}</th>
                                    <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.settlement.status') }}</th>
                                    <th class="px-4 py-3 font-bold">{{ __('admin.shops_manage.settlement.date') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($settlements as $settlement)
                                    @php
                                        $account = $settlement->bankAccount;
                                        $card = $settlement->card_number ?: ($account?->card_number ?? '');
                                        $sheba = $settlement->sheba ?: ($account?->sheba ?? '');
                                        $payload = [
                                            'code' => Format::persianDigits($settlement->code),
                                            'amount' => Format::tomanFa($settlement->amount),
                                            'requester' => $shop->name,
                                            'requesterUrl' => route('admin.shops.show', $shop),
                                            'extras' => array_values(array_filter([
                                                $shop->user ? ['label' => __('admin.settlements.owner'), 'value' => $shop->user->fullName(), 'ltr' => false, 'url' => route('admin.users.show', $shop->user)] : null,
                                            ])),
                                            'bank' => $account?->bankName() ?? '',
                                            'cardRaw' => $card,
                                            'shebaRaw' => 'IR'.$sheba,
                                            'accounts' => ($shop->user?->bankAccounts ?? collect())
                                                ->where('status', \App\Models\BankAccount::STATUS_APPROVED)
                                                ->sortByDesc(fn ($a) => (int) ($a->id === $settlement->bank_account_id))
                                                ->map(fn ($a) => ['card' => $a->card_number, 'sheba' => $a->sheba, 'label' => $a->bankName().' — '.Format::persianDigits($a->maskedCard())])
                                                ->values()->all(),
                                            'filedAt' => Format::jalaliDateTimeFa($settlement->created_at),
                                            'decidedAt' => $settlement->decided_at === null ? '' : Format::jalaliDateTimeFa($settlement->decided_at),
                                            'settledAt' => $settlement->settled_at === null ? '' : Format::jalaliDateTimeFa($settlement->settled_at),
                                            'decidedBy' => $settlement->decidedBy?->name ?? '',
                                            'reference' => Format::persianDigits($settlement->reference ?? ''),
                                            'rejectReason' => $settlement->reject_reason ?? '',
                                            'status' => $settlement->status,
                                            'statusLabel' => __("admin.settlements.statuses.{$settlement->status}"),
                                            'isPending' => $settlement->isPending(),
                                            'isApproved' => $settlement->isApproved(),
                                            'manageable' => $canManage,
                                            'approveUrl' => route('admin.settlements.approve', $settlement),
                                            'settleUrl' => route('admin.settlements.settle', $settlement),
                                            'rejectUrl' => route('admin.settlements.reject', $settlement),
                                            'confirmApprove' => __('admin.settlements.confirm_approve', ['code' => Format::persianDigits($settlement->code)]),
                                            'confirmSettle' => __('admin.settlements.confirm_settle', ['code' => Format::persianDigits($settlement->code)]),
                                            'confirmReject' => __('admin.settlements.confirm_reject', [
                                                'code' => Format::persianDigits($settlement->code),
                                                'amount' => Format::persianDigits(Format::tomanFa($settlement->amount)),
                                            ]),
                                        ];
                                        $badge = [
                                            'pending' => 'bg-[#fff5e6] text-amber-600',
                                            'approved' => 'bg-[#eaf1ff] text-blue-600',
                                            'settled' => 'bg-[#e7f7ee] text-green-600',
                                            'rejected' => 'bg-[#f1f0f5] text-ink-muted',
                                        ][$settlement->status];
                                    @endphp
                                    <tr class="cursor-pointer border-t border-[#f0eff5] transition hover:bg-[#faf9fd]" x-on:click='open(@json($payload))'>
                                        <td class="px-4 py-3 font-bold text-secondary-500" dir="ltr">{{ $settlement->code }}</td>
                                        <td class="px-4 py-3 font-bold" dir="ltr">@toman($settlement->amount)</td>
                                        <td class="px-4 py-3 text-ink-soft">
                                            {{ $account?->bankName() ?? '—' }}
                                            <span class="block text-[11.5px] text-ink-faint" dir="ltr">@fa($account?->maskedCard())</span>
                                        </td>
                                        <td class="px-4 py-3"><span @class(['inline-block rounded-lg px-2.5 py-1 text-[11.5px] font-bold', $badge])>{{ __("admin.shops_manage.settlement.statuses.{$settlement->status}") }}</span></td>
                                        <td class="px-4 py-3 text-ink-soft">@jalaliDateTime($settlement->created_at)</td>
                                    </tr>
                                @empty
                                    <tr class="border-t border-[#f0eff5]">
                                        <td colspan="5" class="px-4 py-8 text-center text-sm text-ink-muted">{{ __('admin.shops_manage.settlement.empty') }}</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    {{-- ===== Two-phase review modal (shared) ===== --}}
                    @include('admin.partials.payout-modal', ['lang' => 'admin.settlements'])
                </div>
            </div>

            {{-- ===== Edit tab ===== --}}
            @if ($canManage)
                <div x-show="tab === 'edit'" x-cloak>
                    <form method="POST" action="{{ route('admin.shops.update', $shop) }}" enctype="multipart/form-data" x-data="{ busy: false, logoPreview: '' }"
                          x-on:submit.prevent="$store.confirm.ask({ message: @js(__('admin.shops_manage.confirm_save')), onConfirm: () => { busy = true; $el.submit(); } })">
                        @csrf
                        @method('PUT')
                        <div class="grid grid-cols-1 gap-5 lg:grid-cols-[1fr_240px]">
                            <div class="flex flex-col gap-4">
                                <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
                                    <div>
                                        <label for="shop-name" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.name') }}</label>
                                        <input id="shop-name" name="name" value="{{ old('name', $shop->name) }}" required class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 text-sm outline-none transition focus:border-primary-600 focus:bg-white">
                                    </div>
                                    <div>
                                        <label for="shop-slug" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.slug') }}</label>
                                        <input id="shop-slug" name="slug" value="{{ old('slug', $shop->slug) }}" required dir="ltr" x-on:input="$el.value = $el.value.toLowerCase().replace(/[^a-z0-9-]/g, '')" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 text-left text-sm outline-none transition focus:border-primary-600 focus:bg-white">
                                    </div>
                                </div>
                                <div>
                                    <label for="shop-status" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.status') }}</label>
                                    <select id="shop-status" name="status" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 text-sm outline-none transition focus:border-primary-600 focus:bg-white">
                                        <option value="approved" @selected(old('status', $shop->status) === 'approved')>{{ __('admin.shops_manage.statuses.approved') }}</option>
                                        <option value="rejected" @selected(old('status', $shop->status) === 'rejected')>{{ __('admin.shops_manage.statuses.rejected') }}</option>
                                    </select>
                                </div>
                                <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
                                    <div>
                                        <label for="shop-fee-percent" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.fee_percent') }}</label>
                                        {{-- Shown as a percent, stored as basis points (percent * 100). --}}
                                        <div class="relative" x-data="{ pct: @js((int) old('fee_percent', $shop->fee_percent) / 100) }">
                                            <input type="number" min="0" max="100" step="0.01" x-model.number="pct"
                                                   class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 pl-9 text-right text-sm outline-none transition focus:border-primary-600 focus:bg-white" style="direction:rtl">
                                            <input type="hidden" name="fee_percent" x-bind:value="Math.round((pct || 0) * 100)">
                                            <span class="pointer-events-none absolute left-3.5 top-1/2 -translate-y-1/2 text-[13px] font-bold text-ink-faint">٪</span>
                                        </div>
                                    </div>
                                    <div x-data="moneyField(@js((string) (int) old('fee_cap', $shop->fee_cap)))">
                                        <label for="shop-fee-cap" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.fee_cap') }}</label>
                                        <div class="relative">
                                            <input id="shop-fee-cap" type="text" inputmode="numeric" dir="ltr" x-init="$el.value = grouped" x-on:input="onInput($event)" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 pl-16 text-right text-sm outline-none transition focus:border-primary-600 focus:bg-white" style="direction:rtl">
                                            <input type="hidden" name="fee_cap" x-bind:value="raw">
                                            <span class="pointer-events-none absolute left-3.5 top-1/2 -translate-y-1/2 text-[12px] font-bold text-ink-faint">{{ __('admin.toman') }}</span>
                                        </div>
                                    </div>
                                </div>
                                <div x-data="supportPhone(@js(old('support_phone', $shop->support_phone)))">
                                    <label for="shop-support-phone" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.support_phone') }}</label>
                                    <input id="shop-support-phone" name="support_phone" value="{{ old('support_phone', $shop->support_phone) }}" dir="ltr" inputmode="tel" x-on:input="onInput($event)"
                                           x-bind:class="filled && ! valid ? 'border-secondary-500 bg-white' : (filled && valid ? 'border-green-500 bg-white' : 'border-[#e3e1ec] bg-[#fbfbfd] focus:border-primary-600 focus:bg-white')"
                                           class="w-full rounded-xl border-[1.5px] px-3.5 py-3 text-left text-sm outline-none transition">
                                    <p x-show="filled && ! valid" x-cloak class="mt-1.5 text-[11.5px] text-secondary-500">{{ __('front.shop.info.support_phone_invalid') }}</p>
                                </div>
                                <x-form.province-city province-name="province" city-name="city" :province="$shop->province" :city="$shop->city" accent="primary" />
                                <div>
                                    <label for="shop-address" class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.address') }}</label>
                                    <textarea id="shop-address" name="address" rows="2" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 text-sm outline-none transition focus:border-primary-600 focus:bg-white">{{ old('address', $shop->address) }}</textarea>
                                </div>
                                <div>
                                    <label for="shop-website" class="mb-1.5 block text-[13px] font-bold">
                                        {{ __('admin.shops_manage.fields.website') }}
                                        @if ($shop->website_status)
                                            <span class="mr-1 rounded-lg px-2 py-0.5 text-[11px] font-bold {{ $shop->websiteApproved() ? 'bg-[#e7f7ee] text-green-600' : ($shop->websitePending() ? 'bg-[#fff5e6] text-amber-600' : 'bg-secondary-50 text-secondary-500') }}">{{ __("front.shop.info.website_statuses.{$shop->website_status}") }}</span>
                                        @endif
                                    </label>
                                    <input id="shop-website" name="website_url" value="{{ old('website_url', $shop->website_url) }}" dir="ltr" inputmode="url" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-3 text-left text-[13.5px] outline-none transition focus:border-primary-600 focus:bg-white">
                                    <p class="mt-1.5 text-[11.5px] text-ink-faint">{{ __('admin.shops_manage.fields.website_hint') }}</p>
                                </div>
                                <div class="flex justify-end">
                                    <button type="submit" x-bind:disabled="busy" class="inline-flex items-center gap-2 rounded-xl bg-primary-600 px-6 py-3 text-sm font-bold text-white shadow-lg shadow-primary-600/25 transition hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-70">
                                        <span x-show="busy" x-cloak class="size-4 animate-spin rounded-full border-2 border-white/30 border-t-white"></span>
                                        {{ __('admin.shops_manage.save') }}
                                    </button>
                                </div>
                            </div>
                            <div>
                                <label class="mb-1.5 block text-[13px] font-bold">{{ __('admin.shops_manage.fields.logo') }}</label>
                                <label for="shop-logo" class="block cursor-pointer rounded-2xl border-[1.5px] border-dashed border-[#cfc9e6] bg-[#faf9fd] p-5 text-center transition hover:border-primary-600 hover:bg-[#f4f1fc]">
                                    <span class="mx-auto mb-2.5 flex size-16 items-center justify-center overflow-hidden rounded-2xl bg-gradient-to-bl from-[#e9e5f9] to-[#d9d1f4] text-[17px] font-bold text-primary-600">
                                        <template x-if="logoPreview"><img x-bind:src="logoPreview" alt="" class="size-full object-cover"></template>
                                        <template x-if="! logoPreview">
                                            <span class="flex size-full items-center justify-center">
                                                @if ($shop->logo_path)<img src="{{ route('media.shop-logo', $shop) }}" alt="" class="size-full object-cover">@else{{ mb_substr($shop->name, 0, 2) }}@endif
                                            </span>
                                        </template>
                                    </span>
                                    <span class="text-[12.5px] font-bold text-primary-600">{{ __('admin.shops_manage.fields.logo_upload') }}</span>
                                </label>
                                <input id="shop-logo" name="logo" type="file" accept="image/jpeg,image/png" class="hidden" x-on:change="logoPreview = $event.target.files[0] ? URL.createObjectURL($event.target.files[0]) : ''">
                            </div>
                        </div>
                    </form>
                </div>
            @endif
        </div>
    </div>
@endsection