@php
    $record = $recordable;
    $recordType = $recordRequest->record_type;

    $recordName = match ($recordType) {
        'car', 'bike' => (string) data_get($record, 'vehicle_name', '-'),
        default => (string) data_get($record, 'device_name', '-'),
    };

    $identifier = match ($recordType) {
        'internet_device' => (string) data_get($record, 'mac_address', '-'),
        'mobile_phone' => (string) data_get($record, 'imei', '-'),
        default => (string) data_get($record, 'engine_number', '-'),
    };
@endphp

<x-app-layout>
    <x-slot name="header">
        <div class="flex items-center justify-between gap-3">
            <h2 class="text-2xl font-semibold text-[var(--theme-text)]">{{ __('messages.request_details') }}</h2>
            <div class="flex items-center gap-2">
                <a href="{{ route('admin.requests.rejected.index') }}" class="theme-btn-outline">{{ __('messages.rejected_requests') }}</a>
                <a href="{{ route('admin.requests.my.index') }}" class="theme-btn-outline">{{ __('messages.back_to_list') }}</a>
            </div>
        </div>
    </x-slot>

    <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 space-y-4">
        <section class="theme-surface-panel p-5">
            <div class="grid grid-cols-1 md:grid-cols-3 gap-3">
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.request_number') }}</p>
                    <p class="font-mono mt-1">{{ $recordRequest->request_number }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.type') }}</p>
                    <p class="mt-1">{{ __('messages.record_type_'.$recordRequest->record_type) }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.status') }}</p>
                    <p class="mt-1"><span class="theme-chip">{{ __('messages.record_request_status_'.$recordRequest->status) }}</span></p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.submission_mode') }}</p>
                    <p class="mt-1">{{ __('messages.record_request_mode_'.$recordRequest->submission_mode) }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.price_snapshot') }}</p>
                    <p class="mt-1 font-semibold">{{ number_format((float) $recordRequest->price_snapshot, 2) }} {{ $recordRequest->currency_code }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.created_at') }}</p>
                    <p class="mt-1">{{ $recordRequest->created_at?->format('Y-m-d H:i') }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.reviewed_by') }}</p>
                    <p class="mt-1">{{ $recordRequest->reviewer?->name ?? $recordRequest->reviewer?->username ?? '-' }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.reviewed_at') }}</p>
                    <p class="mt-1">{{ $recordRequest->reviewed_at?->format('Y-m-d H:i') ?? '-' }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.rejection_reason') }}</p>
                    <p class="mt-1">{{ $recordRequest->rejection_reason ?: '-' }}</p>
                </div>
                <div class="md:col-span-3">
                    <p class="theme-inline-muted text-xs">{{ __('messages.rejection_notes') }}</p>
                    <p class="mt-1">{{ $recordRequest->rejection_notes ?: __('messages.no_additional_notes') }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.appeal_count') }}</p>
                    <p class="mt-1">{{ (int) $recordRequest->appeal_count }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.appealed_at') }}</p>
                    <p class="mt-1">{{ $recordRequest->appealed_at?->format('Y-m-d H:i') ?? '-' }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.appeal_note') }}</p>
                    <p class="mt-1">{{ $recordRequest->appeal_note ?: '-' }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.last_rejection_reason') }}</p>
                    <p class="mt-1">{{ $recordRequest->last_rejection_reason ?: '-' }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.last_rejected_at') }}</p>
                    <p class="mt-1">{{ $recordRequest->last_rejected_at?->format('Y-m-d H:i') ?? '-' }}</p>
                </div>
                <div>
                    <p class="theme-inline-muted text-xs">{{ __('messages.rejected_by') }}</p>
                    <p class="mt-1">{{ $recordRequest->lastRejecter?->name ?? $recordRequest->lastRejecter?->username ?? $recordRequest->reviewer?->name ?? $recordRequest->reviewer?->username ?? '-' }}</p>
                </div>
            </div>
        </section>

        @if ($record)
            <section class="theme-surface-panel p-5">
                <div class="mb-3 flex items-center justify-between gap-2">
                    <h3 class="font-semibold">{{ __('messages.record_details') }}</h3>
                    @if (! empty($editRecordRoute))
                        <a href="{{ $editRecordRoute }}" class="theme-btn-outline !px-3 !py-1.5 text-xs">{{ __('messages.edit') }}</a>
                    @endif
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.reference_number') }}</p>
                        <p class="mt-1 font-mono">{{ (string) data_get($record, 'reference_number', '-') }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.device_name') }}</p>
                        <p class="mt-1">{{ $recordName }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.details') }}</p>
                        <p class="mt-1 font-mono">{{ $identifier }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.stolen_address') }}</p>
                        <p class="mt-1">{{ (string) data_get($record, 'stolen_address', '-') }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.owner_phone') }}</p>
                        <p class="mt-1">{{ (string) data_get($record, 'owner_phone', '-') }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.status') }}</p>
                        <p class="mt-1">{{ __('messages.status_'.(string) data_get($record, 'status', 'stolen')) }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.review_status') }}</p>
                        <p class="mt-1">{{ __('messages.review_status_'.(string) data_get($record, 'review_status', 'pending_review')) }}</p>
                    </div>
                    <div>
                        <p class="theme-inline-muted text-xs">{{ __('messages.stolen_at') }}</p>
                        <p class="mt-1">{{ data_get($record, 'stolen_at') ? data_get($record, 'stolen_at')->format('Y-m-d H:i') : '-' }}</p>
                    </div>
                    <div class="md:col-span-2">
                        <p class="theme-inline-muted text-xs">{{ __('messages.notes') }}</p>
                        <p class="mt-1">{{ (string) data_get($record, 'notes', '-') ?: '-' }}</p>
                    </div>
                </div>
            </section>
        @endif

        @if ($canAppeal)
            <section class="theme-surface-panel p-5" id="appeal-form">
                <h3 class="font-semibold mb-3">{{ __('messages.submit_appeal') }}</h3>
                <form method="POST" action="{{ route('admin.requests.my.appeal', $recordRequest) }}" class="space-y-3">
                    @csrf
                    @method('PATCH')
                    <div>
                        <x-input-label for="appeal_note" :value="__('messages.appeal_note')" />
                        <textarea
                            id="appeal_note"
                            name="appeal_note"
                            rows="4"
                            required
                            class="mt-1 block w-full rounded-md theme-ring-brand"
                            placeholder="{{ __('messages.appeal_note_placeholder') }}"
                        >{{ old('appeal_note') }}</textarea>
                        <p class="mt-1 text-xs theme-inline-muted">{{ __('messages.appeal_note_hint') }}</p>
                        @error('appeal_note')
                            <p class="mt-1 text-xs text-red-500">{{ $message }}</p>
                        @enderror
                    </div>
                    <button type="submit" class="theme-btn-primary">{{ __('messages.submit_appeal') }}</button>
                </form>
            </section>
        @endif
    </div>
</x-app-layout>