@php
    $user = auth()->user();
    $filtered = request()->hasAny(['q', 'status', 'type', 'doctor', 'patient_id', 'scope']);
@endphp

<x-app-layout title="Encounters">
    <x-page-header
        title="Encounters"
        subtitle="Every clinical record opened at this facility — the visit it belongs to, what was found, and whether it is still live."
        icon="stethoscope">
        <x-slot:actions>
            <a href="{{ route('worklist.index') }}" class="hms-btn-secondary">
                <x-icon name="clipboard-list" size="sm" />
                My worklist
            </a>

            @can('encounters.create')
                <a href="{{ route('encounters.create') }}" class="hms-btn-primary">
                    <x-icon name="plus" size="sm" />
                    Open encounter
                </a>
            @endcan
        </x-slot:actions>
    </x-page-header>

    <div class="mb-6 grid grid-cols-2 gap-4 md:grid-cols-4">
        <x-stat-card label="Open encounters" :value="number_format($stats['open'])" icon="stethoscope" tone="amber" />
        <x-stat-card label="Mine, still open" :value="number_format($stats['mine'])" icon="clipboard-list" tone="brand" />
        <x-stat-card label="Closed today" :value="number_format($stats['closedToday'])" icon="check" tone="green" />
        <x-stat-card label="Closed in total" :value="number_format($stats['closedTotal'])" icon="document-check" tone="slate" />
    </div>

    <x-card flush>
        <div class="border-b border-slate-200 px-5 py-4">
            <form method="GET" class="flex flex-wrap items-end gap-3">
                <div class="min-w-[16rem] flex-1">
                    <x-form.input name="q" label="Search"
                                  placeholder="Encounter no, MRN or patient name…"
                                  :value="request('q')" autofocus />
                </div>

                <div class="w-44">
                    <x-form.select name="status" label="Status" :options="$statuses"
                                   :value="request('status')" placeholder="Any status" />
                </div>

                <div class="w-44">
                    <x-form.select name="type" label="Type" :options="$types"
                                   :value="request('type')" placeholder="Any type" />
                </div>

                <div class="w-48">
                    <x-form.select name="doctor" label="Consultant" :options="$doctors"
                                   :value="request('doctor')" placeholder="All consultants" />
                </div>

                <div class="w-44">
                    <x-form.select name="scope" label="Scope"
                                   :options="['mine' => 'Mine only']"
                                   :value="request('scope')" placeholder="Everyone's" />
                </div>

                <button type="submit" class="hms-btn-secondary">
                    <x-icon name="search" size="sm" />
                    Search
                </button>

                @if ($filtered)
                    <a href="{{ route('encounters.index') }}" class="hms-btn-ghost">Clear</a>
                @endif
            </form>
        </div>

        @if ($encounters->isEmpty())
            <x-empty-state icon="stethoscope" title="No encounters match">
                @if (request('q'))
                    Nothing in the clinical record matches “{{ request('q') }}”.
                @else
                    No clinical records on file for this filter. Open one from the queue board or a patient's chart.
                @endif

                <x-slot:actions>
                    @can('encounters.create')
                        <a href="{{ route('encounters.create') }}" class="hms-btn-primary">
                            <x-icon name="plus" size="sm" />
                            Open encounter
                        </a>
                    @endcan
                    @can('queue.view')
                        <a href="{{ route('queue.index') }}" class="hms-btn-secondary">
                            <x-icon name="queue" size="sm" />
                            Queue board
                        </a>
                    @endcan
                </x-slot:actions>
            </x-empty-state>
        @else
            <div class="overflow-x-auto">
                <table class="hms-table">
                    <thead>
                        <tr>
                            <th>Encounter</th>
                            <th>Patient</th>
                            <th>Type</th>
                            <th>Clinician</th>
                            <th class="text-center">Recorded</th>
                            <th>Status</th>
                            <th>Started</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($encounters as $encounter)
                            <tr>
                                <td>
                                    <a href="{{ route('encounters.show', $encounter) }}"
                                       class="font-mono text-xs font-medium text-slate-800 hover:text-brand-700">
                                        {{ $encounter->encounter_no }}
                                    </a>
                                    @if ($encounter->visit)
                                        <div class="text-xs text-slate-400">Visit {{ $encounter->visit->visit_no }}</div>
                                    @endif
                                </td>
                                <td>
                                    <div class="flex items-center gap-2">
                                        <div class="min-w-0">
                                            <a href="{{ route('encounters.show', $encounter) }}"
                                               class="block truncate font-medium text-slate-900 hover:text-brand-700">
                                                {{ $encounter->patient?->full_name ?? 'Unknown patient' }}
                                            </a>
                                            <div class="truncate font-mono text-xs text-slate-500">
                                                {{ $encounter->patient?->medical_record_number }}
                                                @if ($encounter->visit?->token_number)
                                                    · token {{ $encounter->visit->token_number }}
                                                @endif
                                            </div>
                                        </div>
                                        @if ($encounter->patient?->isRestricted())
                                            <x-icon name="lock" size="xs" class="shrink-0 text-amber-600" />
                                        @endif
                                    </div>
                                </td>
                                <td>
                                    <x-status-badge field="encounter_type" :value="$encounter->encounter_type" size="sm" />
                                    @if ($encounter->visit?->priority && $encounter->visit->priority !== 'routine')
                                        <div class="mt-0.5">
                                            <x-status-badge field="priority" :value="$encounter->visit->priority" size="sm" />
                                        </div>
                                    @endif
                                </td>
                                <td>
                                    <div class="text-sm text-slate-700">{{ $encounter->doctor?->name ?? 'Unassigned' }}</div>
                                    <div class="text-xs text-slate-400">{{ $encounter->department?->name ?? '—' }}</div>
                                </td>
                                <td>
                                    <div class="flex items-center justify-center gap-3 text-xs text-slate-600">
                                        <span title="Diagnoses recorded"><span class="font-medium">{{ $encounter->diagnoses_count }}</span> dx</span>
                                        <span title="Observation sets"><span class="font-medium">{{ $encounter->vitals_count }}</span> vit</span>
                                        <span title="Clinical notes"><span class="font-medium">{{ $encounter->notes_count }}</span> notes</span>
                                    </div>
                                </td>
                                <td>
                                    <x-status-badge field="encounter_status" :value="$encounter->status" size="sm" dot />
                                </td>
                                <td class="text-xs text-slate-500">
                                    <div>{{ $encounter->started_at?->format('d M Y H:i') }}</div>
                                    @if ($encounter->closed_at)
                                        <div class="text-slate-400">closed {{ $encounter->closed_at->format('d M Y H:i') }}</div>
                                    @endif
                                </td>
                                <td>
                                    <div class="flex justify-end">
                                        <a href="{{ route('encounters.show', $encounter) }}" class="hms-btn-secondary hms-btn-sm">Open</a>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            <div class="flex flex-wrap items-center justify-between gap-3 border-t border-slate-200 px-5 py-4">
                <p class="text-xs text-slate-500">
                    Showing {{ $encounters->firstItem() }}–{{ $encounters->lastItem() }} of {{ number_format($encounters->total()) }}
                </p>
                {{ $encounters->links() }}
            </div>
        @endif
    </x-card>
</x-app-layout>