<x-app-layout title="Add care unit">
    <div class="mx-auto max-w-lg">
        <h1 class="text-xl font-semibold text-slate-900">Add care unit</h1>
        <p class="mt-1 text-sm text-slate-500">Place the unit under a department. Use Float pool for nurses without a permanent ward.</p>
        <form method="POST" action="{{ route('care.care-units.store') }}" class="mt-6 space-y-4 rounded-2xl border border-slate-200 bg-white p-6">
            @csrf
            <div>
                <label class="block text-sm font-medium">Department</label>
                <select name="department_id" required class="mt-1 w-full rounded-lg border-slate-300 text-sm">
                    <option value="">Select…</option>
                    @foreach ($departments as $department)
                        <option value="{{ $department->id }}" @selected((int) old('department_id', $selectedDepartmentId) === (int) $department->id)>
                            {{ $department->labelForSelect() }}
                        </option>
                    @endforeach
                </select>
                @error('department_id')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-medium">Name</label>
                <input type="text" name="name" value="{{ old('name') }}" required class="mt-1 w-full rounded-lg border-slate-300 text-sm" placeholder="e.g. Labour Ward, ANC Clinic">
                @error('name')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-medium">Code <span class="font-normal text-slate-400">(optional)</span></label>
                <input type="text" name="code" value="{{ old('code') }}" class="mt-1 w-full rounded-lg border-slate-300 text-sm" placeholder="LW, ANC">
            </div>
            <div>
                <label class="block text-sm font-medium">Kind</label>
                <select name="kind" class="mt-1 w-full rounded-lg border-slate-300 text-sm">
                    @foreach ($kinds as $value => $label)
                        <option value="{{ $value }}" @selected(old('kind', 'inpatient') === $value)>{{ $label }}</option>
                    @endforeach
                </select>
            </div>
            <button type="submit" class="btn-primary w-full">Create care unit</button>
        </form>
    </div>
</x-app-layout>
