@php
    $employee = $employee ?? ($formEmployee ?? null);
    $isEdit = filled($employee);
    $formAction = $isEdit ? route('masters.employees.update', $employee) : route('masters.employees.store');
    $opts = $formOptions ?? \App\Support\EmployeeFormOptions::class;

    $val = fn (string $field, $default = '') => old($field, $employee?->{$field} ?? $default);
    $dateVal = fn (string $field) => old($field, $employee && $employee->{$field} ? $employee->{$field}->format('Y-m-d') : '');

    $lineRows = function (string $type, int $count) use ($employee) {
        $existing = $employee
            ? $employee->salaryLines->where('line_type', $type)->values()
            : collect();
        $rows = [];
        for ($i = 0; $i < $count; $i++) {
            $rows[] = $existing[$i] ?? null;
        }
        return $rows;
    };

    $earningRows = $lineRows('earning', 10);
    $deductionRows = $lineRows('deduction', 10);
    $irregularRows = $lineRows('irregular', 4);
@endphp

<div class="modal fade" id="employeeFormModal" tabindex="-1" aria-labelledby="employeeFormModalLabel" aria-hidden="true">
    <div class="modal-dialog employee-form-modal">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="employeeFormModalLabel">{{ $isEdit ? 'Edit Employee' : 'New Employee' }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <form method="POST" action="{{ $formAction }}" enctype="multipart/form-data" id="employeeForm" class="employee-form-shell">
                @csrf
                @if($isEdit) @method('PUT') @endif

                <div class="modal-body">
                    @if($errors->any())
                    <div class="alert alert-danger">
                        @foreach($errors->all() as $e)<div>{{ $e }}</div>@endforeach
                    </div>
                    @endif

                    <ul class="nav nav-tabs employee-form-tabs" id="employeeFormTabs" role="tablist">
                        <li class="nav-item" role="presentation">
                            <button class="nav-link active" id="tab-personal-btn" data-bs-toggle="tab" data-bs-target="#tab-personal" type="button" role="tab">Personal Info</button>
                        </li>
                        <li class="nav-item" role="presentation">
                            <button class="nav-link" id="tab-employment-btn" data-bs-toggle="tab" data-bs-target="#tab-employment" type="button" role="tab">Employment Info</button>
                        </li>
                        <li class="nav-item" role="presentation">
                            <button class="nav-link" id="tab-payroll-btn" data-bs-toggle="tab" data-bs-target="#tab-payroll" type="button" role="tab">Payroll Info</button>
                        </li>
                    </ul>

                    <div class="tab-content" id="employeeFormTabContent">
                        @include('masters.employees._tab-personal')
                        @include('masters.employees._tab-employment')
                        @include('masters.employees._tab-payroll')
                    </div>
                </div>

                <div class="modal-footer justify-content-between">
                    <div class="form-check mb-0">
                        <input class="form-check-input" type="checkbox" name="is_inactive" value="1" id="empInactive"
                               {{ old('is_inactive', $employee && !$employee->is_active) ? 'checked' : '' }}>
                        <label class="form-check-label" for="empInactive">Inactive</label>
                    </div>
                    <div class="d-flex gap-2">
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn btn-primary">Save</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>