@props(['department' => null, 'types' => [], 'heads' => []])

@php
    $headOptions = $heads->mapWithKeys(fn ($head) => [
        $head->id => $head->designation ? "{$head->name} — {$head->designation}" : $head->name,
    ]);
@endphp

<div class="grid gap-6 lg:grid-cols-3">
    <div class="space-y-6 lg:col-span-2">
        <x-card title="Department details" icon="building">
            <div class="grid gap-5 sm:grid-cols-2">
                <x-form.input name="name" label="Department name" required
                              :value="$department?->name"
                              placeholder="e.g. Accident & Emergency" />

                <x-form.input name="code" label="Short code" required
                              :value="$department?->code"
                              hint="Used on requisitions and reports. Letters, numbers and dashes."
                              placeholder="e.g. A&amp;E" />

                <x-form.select name="type" label="Department type" required
                               :options="$types" :value="$department?->type" />

                <x-form.input name="location" label="Physical location"
                              :value="$department?->location"
                              placeholder="e.g. Ground floor, Block B" />

                <x-form.input name="phone" label="Extension / telephone"
                              :value="$department?->phone" />

                <x-form.input name="email" label="Department email" type="email"
                              :value="$department?->email" />

                <div class="sm:col-span-2">
                    <x-form.select name="head_staff_id" label="Department head"
                                   :options="$headOptions" :value="$department?->head_staff_id"
                                   placeholder="Not yet assigned" />
                </div>

                <div class="sm:col-span-2">
                    <x-form.textarea name="description" label="Description" :rows="3"
                                     :value="$department?->description"
                                     placeholder="Scope of service, catchment, referral notes…" />
                </div>
            </div>
        </x-card>
    </div>

    <div class="space-y-6">
        <x-card title="Status" icon="check">
            <div class="space-y-4">
                <input type="hidden" name="is_active" value="0">
                <x-form.checkbox name="is_active" label="Active"
                                 hint="Inactive departments stay on historical records but drop out of pickers."
                                 :checked="$department?->is_active ?? true" />

                <input type="hidden" name="is_clinical" value="0">
                <x-form.checkbox name="is_clinical" label="Clinical department"
                                 hint="Clinical departments can own clinic schedules, beds and encounters."
                                 :checked="$department?->is_clinical ?? false" />
            </div>
        </x-card>
    </div>
</div>

<div class="mt-6 flex flex-wrap items-center justify-end gap-3">
    <a href="{{ route('admin.departments.index') }}" class="hms-btn-secondary">Cancel</a>
    <button type="submit" class="hms-btn-primary">
        <x-icon name="check" size="sm" />
        {{ $department ? 'Save changes' : 'Create department' }}
    </button>
</div>