@php
    /**
     * @var \App\Domain\MasterData\Models\Category $category
     * @var \Illuminate\Support\Collection<int, string> $parentOptions
     */
@endphp

<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
    <div>
        <x-input-label for="name" :value="__('Name')" />
        <x-text-input
            id="name"
            name="name"
            type="text"
            class="mt-1 block w-full"
            :value="old('name', $category->name)"
            required
            autofocus
        />
        <x-input-error :messages="$errors->get('name')" class="mt-2" />
    </div>

    <div>
        <x-input-label for="slug" :value="__('Slug')" />
        <x-text-input
            id="slug"
            name="slug"
            type="text"
            class="mt-1 block w-full"
            :value="old('slug', $category->slug)"
            placeholder="{{ __('Leave blank to generate from the name') }}"
        />
        <x-input-error :messages="$errors->get('slug')" class="mt-2" />
    </div>

    <div>
        <x-input-label for="parent_id" :value="__('Parent category')" />
        <select
            id="parent_id"
            name="parent_id"
            class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-100 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
        >
            <option value="">{{ __('None (top level)') }}</option>
            @foreach ($parentOptions as $id => $name)
                <option value="{{ $id }}" @selected((int) old('parent_id', $category->parent_id) === $id)>
                    {{ $name }}
                </option>
            @endforeach
        </select>
        <x-input-error :messages="$errors->get('parent_id')" class="mt-2" />
    </div>

    <div>
        <x-input-label for="sort_order" :value="__('Sort order')" />
        <x-text-input
            id="sort_order"
            name="sort_order"
            type="number"
            min="0"
            class="mt-1 block w-full"
            :value="old('sort_order', $category->sort_order)"
        />
        <x-input-error :messages="$errors->get('sort_order')" class="mt-2" />
    </div>

    <div class="md:col-span-2">
        <x-input-label for="description" :value="__('Description')" />
        <textarea
            id="description"
            name="description"
            rows="3"
            class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-100 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
        >{{ old('description', $category->description) }}</textarea>
        <x-input-error :messages="$errors->get('description')" class="mt-2" />
    </div>

    <div class="md:col-span-2 flex items-center gap-2">
        <input
            id="is_active"
            name="is_active"
            type="checkbox"
            value="1"
            class="rounded border-gray-300 dark:border-gray-700 text-indigo-600 shadow-sm focus:ring-indigo-500"
            @checked(old('is_active', $category->exists ? $category->is_active : true))
        />
        <x-input-label for="is_active" :value="__('Active')" />
        <x-input-error :messages="$errors->get('is_active')" class="mt-2" />
    </div>
</div>