<x-app-layout title="Edit display">
    <div class="mx-auto max-w-lg space-y-4">
        <div>
            <a href="{{ route('care.displays.show', $display) }}" class="text-sm text-slate-500 hover:text-slate-800">← {{ $display->name }}</a>
            <h1 class="mt-2 text-2xl font-semibold text-slate-900">Edit display</h1>
        </div>
        <form method="POST" action="{{ route('care.displays.update', $display) }}" class="space-y-4 rounded-2xl border border-slate-200 bg-white p-6">
            @csrf
            @method('PUT')
            <div>
                <label class="block text-sm font-medium text-slate-700">Name</label>
                <input name="name" value="{{ old('name', $display->name) }}" required class="mt-1 w-full rounded-lg border-slate-300 text-sm">
            </div>
            <div>
                <label class="block text-sm font-medium text-slate-700">Branch</label>
                <select name="branch_id" required class="mt-1 w-full rounded-lg border-slate-300 text-sm">
                    @foreach ($branches as $b)
                        <option value="{{ $b->id }}" @selected(old('branch_id', $display->branch_id) == $b->id)>{{ $b->name }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label class="block text-sm font-medium text-slate-700">Layout</label>
                <select name="layout" class="mt-1 w-full rounded-lg border-slate-300 text-sm">
                    @foreach ($layouts as $k => $l)
                        <option value="{{ $k }}" @selected(old('layout', $display->layout) === $k)>{{ $l }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label class="block text-sm font-medium text-slate-700">Queues</label>
                <select name="queue_ids[]" multiple class="mt-1 w-full rounded-lg border-slate-300 text-sm">
                    @foreach ($queues as $q)
                        <option value="{{ $q->id }}" @selected(in_array($q->id, old('queue_ids', $display->service_queue_ids ?? [])))>{{ $q->name }}</option>
                    @endforeach
                </select>
                <p class="mt-1 text-xs text-slate-500">Leave empty to show all active queues for the branch.</p>
            </div>
            <label class="flex items-center gap-2 text-sm text-slate-700">
                <input type="checkbox" name="is_active" value="1" @checked(old('is_active', $display->is_active))>
                Active
            </label>
            <div class="flex gap-2">
                <button type="submit" class="btn-primary flex-1">Save</button>
                <a href="{{ route('care.displays.show', $display) }}" class="rounded-lg border border-slate-200 px-4 py-2 text-sm text-slate-600">Cancel</a>
            </div>
        </form>
    </div>
</x-app-layout>
