{{-- Designation Form Fields --}}
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
    <div>
        <label for="name" class="form-label">Designation Name <span class="text-danger-500">*</span></label>
        <input type="text" id="name" name="name" value="{{ old('name', $designation->name ?? '') }}" class="form-input @error('name') form-input-error @enderror" required>
        @error('name') <p class="form-error">{{ $message }}</p> @enderror
    </div>

    <div>
        <label for="department_id" class="form-label">Department</label>
        <select id="department_id" name="department_id" class="form-select">
            <option value="">All Departments</option>
            @foreach($departments as $dept)
                <option value="{{ $dept->id }}" {{ old('department_id', $designation->department_id ?? '') == $dept->id ? 'selected' : '' }}>
                    {{ $dept->name }}
                </option>
            @endforeach
        </select>
        @error('department_id') <p class="form-error">{{ $message }}</p> @enderror
    </div>

    <div>
        <label for="level" class="form-label">Seniority Level</label>
        <input type="number" id="level" name="level" value="{{ old('level', $designation->level ?? 0) }}" min="0" max="100" class="form-input @error('level') form-input-error @enderror">
        <p class="text-xs text-gray-400 mt-1">Higher number = more senior (e.g. 10=Junior, 50=Manager, 90=Director)</p>
        @error('level') <p class="form-error">{{ $message }}</p> @enderror
    </div>
</div>

<div class="mt-4">
    <label class="flex items-center gap-2 cursor-pointer">
        <input type="hidden" name="is_active" value="0">
        <input type="checkbox" name="is_active" value="1" class="form-checkbox"
            {{ old('is_active', $designation->is_active ?? true) ? 'checked' : '' }}>
        <span class="text-sm text-gray-700">Active</span>
    </label>
</div>