@php
    $case = $urgentCase;
    $recipient = $case->recipient;
    $primaryNationalId = $recipient?->nationalIds?->first();
@endphp

<div class="space-y-4">
    <form method="POST" action="{{ route('hospital.urgentCases.update', $case->case_id) }}" enctype="multipart/form-data" class="space-y-5">
        @csrf
        @method('PUT')

        <div class="rounded-sm border border-neutral-200 p-4 text-sm text-neutral-700 dark:border-neutral-700 dark:text-neutral-200">
            <div class="flex flex-wrap items-start justify-between gap-2">
                <div>
                    <div class="mt-1 text-xs opacity-80">
                        Hospital: {{ $case->hospital?->hospital_name ?? '—' }}
                    </div>
                </div>
                <div class="text-xs opacity-80">
                    Last hospital submission: {{ $case->hospital_submitted_at?->format('Y-m-d H:i') ?? '—' }}
                </div>
            </div>

            <div class="mt-3 grid gap-3 md:grid-cols-2">
                <div>
                    <div class="mb-1 text-xs font-semibold text-neutral-900 dark:text-neutral-100">Recipient info :</div>
                    <div class="space-y-1 text-xs">
                        <div><span class="font-medium">Full name:</span> {{ trim(($recipient?->first_name ?? '') . ' ' . ($recipient?->second_name ?? '') . ' ' . ($recipient?->third_name ?? '') . ' ' . ($recipient?->last_name ?? '')) ?: '—' }}</div>
                        <div><span class="font-medium">Recipient ID:</span> {{ $recipient?->id ?? '—' }}</div>
                        <div><span class="font-medium">City / District:</span> {{ ($recipient?->city ?? '—') }} / {{ ($recipient?->district ?? '—') }}</div>
                        <div><span class="font-medium">Phones:</span>
                            @if($recipient && $recipient->phoneNumbers->count())
                                {{ $recipient->phoneNumbers->pluck('phone_number')->join(' - ') }}
                            @else
                                —
                            @endif
                        </div>
                        <div><span class="font-medium">National ID number:</span> {{ $primaryNationalId?->national_id_number ?? '—' }}</div>
                    </div>
                </div>

                <div>
                    <div class="mb-1 text-xs font-semibold text-neutral-900 dark:text-neutral-100">Case description</div>
                    <div class="whitespace-pre-wrap text-xs">{{ $case->case_description ?: '—' }}</div>
                </div>
            </div>
        </div>

        <div>
            <label class="mb-1 block text-xs font-medium text-neutral-600 dark:text-neutral-300">Required amount</label>
            <input
                type="number"
                step="0.01"
                name="required_amount"
                value="{{ old('required_amount', $case->required_amount) }}"
                class="block w-full rounded-sm border border-gray-300 bg-white px-3 py-2 text-sm text-gray-700 focus:border-blue-500 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:focus:border-blue-400 dark:focus:ring-blue-400"
                required
            />
            @error('required_amount')
                <div class="mt-1 text-xs text-red-600">{{ $message }}</div>
            @enderror
        </div>

        <div class="rounded-sm border border-neutral-200 p-4 dark:border-neutral-700">
            <div class="mb-3 text-sm font-semibold text-neutral-900 dark:text-neutral-100">Current attachments</div>
            <div class="grid gap-4 md:grid-cols-2">
                <div class="rounded-sm border border-neutral-200 p-3 text-xs dark:border-neutral-700">
                    <div class="font-semibold text-neutral-900 dark:text-neutral-100">RFQ</div>
                    @if($case->RFQ)
                        <a class="mt-2 inline-flex items-center rounded-sm bg-blue-600 px-3 py-2 text-xs font-semibold text-white hover:bg-blue-700" href="{{ asset('storage/' . $case->RFQ) }}" target="_blank" rel="noopener">View current file</a>
                    @else
                        <div class="mt-2 text-neutral-500">No file</div>
                    @endif
                </div>
                <div class="rounded-sm border border-neutral-200 p-3 text-xs dark:border-neutral-700">
                    <div class="font-semibold text-neutral-900 dark:text-neutral-100">Document</div>
                    @if($case->document)
                        <a class="mt-2 inline-flex items-center rounded-sm bg-blue-600 px-3 py-2 text-xs font-semibold text-white hover:bg-blue-700" href="{{ asset('storage/' . $case->document) }}" target="_blank" rel="noopener">View current file</a>
                    @else
                        <div class="mt-2 text-neutral-500">No file</div>
                    @endif
                </div>
            </div>
        </div>

        <div class="rounded-sm border border-neutral-200 p-4 dark:border-neutral-700">
            <div class="mb-3 text-sm font-semibold text-neutral-900 dark:text-neutral-100">Upload / update attachments</div>
            <div class="grid gap-4 md:grid-cols-2">
                <div class="rounded-sm border border-neutral-200 p-3 text-xs dark:border-neutral-700">
                    <label class="mb-1 block text-xs font-medium text-neutral-600 dark:text-neutral-300">RFQ (PDF/PNG/JPG)</label>
                    <input id="rfqFileInput" type="file" name="RFQ" accept=".pdf,.jpg,.jpeg,.png,.webp" class="hidden" data-file-name-target="#rfqFileName" />
                    <div class="flex items-center gap-3">
                        <button
                            type="button"
                            class="rounded-sm bg-blue-600 px-3 py-2 text-xs font-semibold text-white hover:bg-blue-700"
                            data-file-input-trigger="#rfqFileInput"
                        >
                            Choose file
                        </button>
                        <span id="rfqFileName" class="text-xs text-neutral-600 dark:text-neutral-300">No file chosen</span>
                    </div>
                    @error('RFQ')
                        <div class="mt-1 text-xs text-red-600">{{ $message }}</div>
                    @enderror
                </div>

                <div class="rounded-sm border border-neutral-200 p-3 text-xs dark:border-neutral-700">
                    <label class="mb-1 block text-xs font-medium text-neutral-600 dark:text-neutral-300">Document (PDF/PNG/JPG)</label>
                    <input id="documentFileInput" type="file" name="document" accept=".pdf,.jpg,.jpeg,.png,.webp" class="hidden" data-file-name-target="#documentFileName" />
                    <div class="flex items-center gap-3">
                        <button
                            type="button"
                            class="rounded-sm bg-blue-600 px-3 py-2 text-xs font-semibold text-white hover:bg-blue-700"
                            data-file-input-trigger="#documentFileInput"
                        >
                            Choose file
                        </button>
                        <span id="documentFileName" class="text-xs text-neutral-600 dark:text-neutral-300">No file chosen</span>
                    </div>
                    @error('document')
                        <div class="mt-1 text-xs text-red-600">{{ $message }}</div>
                    @enderror
                </div>
            </div>
        </div>

        <div>
            <label class="mb-1 block text-xs font-medium text-neutral-600 dark:text-neutral-300">Hospital notes</label>
            <textarea
                name="hospital_notes"
                rows="4"
                class="block w-full rounded-sm border border-gray-300 bg-white px-3 py-2 text-sm text-gray-700 focus:border-blue-500 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:focus:border-blue-400 dark:focus:ring-blue-400"
            >{{ old('hospital_notes', $case->hospital_notes) }}</textarea>
            @error('hospital_notes')
                <div class="mt-1 text-xs text-red-600">{{ $message }}</div>
            @enderror
        </div>

        <div class="flex items-center justify-end gap-2">
            <button type="submit" class="rounded-sm bg-blue-600 px-4 py-2 text-white text-sm hover:bg-blue-700">Save</button>
        </div>
    </form>
</div>