@php $canManage = $canConsult ?? false; @endphp

<section class="rounded-2xl border border-slate-200 bg-white p-5">
    <h3 class="text-sm font-semibold text-slate-900">Treat today</h3>
    <p class="mt-0.5 text-xs text-slate-500">
        {{ $canManage ? 'Record a completed procedure. It posts to the visit bill automatically.' : 'Completed procedures for this visit.' }}
    </p>

    @if ($canManage && $dentalPlan?->items)
        <div class="mt-4">
            <p class="text-xs font-semibold uppercase tracking-wide text-slate-500">From plan</p>
            <ul class="mt-2 space-y-2">
                @foreach ($dentalPlan->items->whereIn('status', ['proposed', 'accepted']) as $item)
                    <li class="rounded-xl border border-slate-100 bg-slate-50 px-3 py-2">
                        <form method="POST" action="{{ route('care.specialty.dentistry.procedures', $workspaceVisit) }}" class="flex flex-wrap items-center justify-between gap-2">
                            @csrf
                            <input type="hidden" name="procedure_code" value="{{ $item->procedure_code }}">
                            <input type="hidden" name="tooth_code" value="{{ $item->tooth_code }}">
                            <input type="hidden" name="plan_item_id" value="{{ $item->id }}">
                            <input type="hidden" name="bill" value="1">
                            @foreach ($item->surfaces ?? [] as $surface)
                                <input type="hidden" name="surfaces[]" value="{{ $surface }}">
                            @endforeach
                            <div class="text-sm">
                                <p class="font-medium text-slate-800">{{ $item->label }} @if($item->tooth_code)<span class="text-slate-500">· {{ $item->tooth_code }}</span>@endif</p>
                                <p class="text-xs text-slate-500">{{ number_format($item->estimate_minor / 100, 2) }}</p>
                            </div>
                            <button type="submit" class="rounded-lg bg-indigo-600 px-3 py-1.5 text-xs font-semibold text-white hover:bg-indigo-700">Complete &amp; bill</button>
                        </form>
                    </li>
                @endforeach
            </ul>
        </div>
    @elseif (! $canManage && $dentalPlan?->items?->whereIn('status', ['proposed', 'accepted'])->isNotEmpty())
        <div class="mt-4">
            <p class="text-xs font-semibold uppercase tracking-wide text-slate-500">Open plan items</p>
            <ul class="mt-2 space-y-2 text-sm">
                @foreach ($dentalPlan->items->whereIn('status', ['proposed', 'accepted']) as $item)
                    <li class="rounded-xl border border-slate-100 bg-slate-50 px-3 py-2">
                        <p class="font-medium text-slate-800">{{ $item->label }} @if($item->tooth_code)<span class="text-slate-500">· {{ $item->tooth_code }}</span>@endif</p>
                        <p class="text-xs text-slate-500">{{ number_format($item->estimate_minor / 100, 2) }}</p>
                    </li>
                @endforeach
            </ul>
        </div>
    @endif

    @if ($canManage)
        <form method="POST" action="{{ route('care.specialty.dentistry.procedures', $workspaceVisit) }}" class="mt-6 space-y-3 border-t border-slate-100 pt-4">
            @csrf
            <h4 class="text-sm font-semibold text-slate-900">Ad-hoc procedure</h4>
            <input type="hidden" name="bill" value="1">
            <div class="grid gap-3 sm:grid-cols-2">
                <div>
                    <label class="block text-xs font-medium text-slate-600">Procedure</label>
                    <select name="procedure_code" required class="mt-1 w-full rounded-xl border border-slate-200 px-3 py-2 text-sm">
                        <option value="">Select…</option>
                        @foreach ($dentalCatalog as $service)
                            <option value="{{ $service['code'] }}">{{ $service['label'] }}</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="block text-xs font-medium text-slate-600">Tooth</label>
                    <select name="tooth_code" class="mt-1 w-full rounded-xl border border-slate-200 px-3 py-2 text-sm">
                        <option value="">—</option>
                        @foreach (array_merge($dentalRows['upper'] ?? [], $dentalRows['lower'] ?? []) as $code)
                            <option value="{{ $code }}">{{ $code }}</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="block text-xs font-medium text-slate-600">Anesthesia</label>
                    <select name="anesthesia" class="mt-1 w-full rounded-xl border border-slate-200 px-3 py-2 text-sm">
                        <option value="">—</option>
                        <option value="None">None</option>
                        <option value="Local">Local</option>
                        <option value="Sedation">Sedation</option>
                        <option value="GA">GA</option>
                    </select>
                </div>
                <div class="sm:col-span-2">
                    <p class="text-xs font-medium text-slate-600">Surfaces</p>
                    <div class="mt-2 flex flex-wrap gap-3">
                        @foreach ($dentalSurfaces as $surface)
                            <label class="inline-flex items-center gap-1.5 text-sm">
                                <input type="checkbox" name="surfaces[]" value="{{ $surface }}" class="rounded border-slate-300 text-indigo-600">
                                {{ $surface }}
                            </label>
                        @endforeach
                    </div>
                </div>
                <div class="sm:col-span-2">
                    <label class="block text-xs font-medium text-slate-600">Notes</label>
                    <input type="text" name="notes" class="mt-1 w-full rounded-xl border border-slate-200 px-3 py-2 text-sm">
                </div>
            </div>
            <button type="submit" class="btn-primary">Complete &amp; bill</button>
        </form>
    @endif

    <div class="mt-6 border-t border-slate-100 pt-4">
        <p class="text-xs font-semibold uppercase tracking-wide text-slate-500">Completed this visit</p>
        <ul class="mt-2 space-y-1 text-sm">
            @forelse ($dentalProcedures as $proc)
                <li class="flex justify-between gap-3">
                    <span>{{ $proc->label }} · {{ $proc->performed_at?->format('H:i') }}</span>
                    <span class="tabular-nums">{{ number_format($proc->amount_minor / 100, 2) }}</span>
                </li>
            @empty
                <li class="text-slate-500">No procedures yet.</li>
            @endforelse
        </ul>
    </div>
</section>