@php
    $isSuperAdmin = auth()->user()?->isSuperAdmin();
    $permit = $permit ?? null;
    $defaultBranchId = $permit->branch_id ?? session('current_branch_id', auth()->user()?->branch_id);
    $defaultCompanyId = $permit->company_id ?? request('company_id');
    $defaultCustomerId = $permit->customer_id ?? request('customer_id');
@endphp

@if(request()->filled('return_to'))
    <input type="hidden" name="return_to" value="{{ request('return_to') }}">
@endif

<div class="row g-3">
    <div class="col-md-4">
        <label class="form-label">الفرع</label>
        <select name="branch_id" class="form-select" {{ $isSuperAdmin ? '' : 'disabled' }}>
            @foreach($branches as $branch)
                <option value="{{ $branch->id }}" {{ (int) old('branch_id', $defaultBranchId) === $branch->id ? 'selected' : '' }}>
                    {{ $branch->name }}
                </option>
            @endforeach
        </select>
        @if(! $isSuperAdmin)
            <input type="hidden" name="branch_id" value="{{ old('branch_id', $defaultBranchId) }}">
        @endif
        @error('branch_id')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-4">
        <label class="form-label">الشركة (اختياري)</label>
        <select name="company_id" class="form-select">
            <option value="">غير تابع لشركة</option>
            @foreach($companies as $company)
                <option value="{{ $company->id }}" {{ (string) old('company_id', $defaultCompanyId) === (string) $company->id ? 'selected' : '' }}>
                    {{ $company->name }}
                </option>
            @endforeach
        </select>
        @error('company_id')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-4">
        <label class="form-label">العميل</label>
        <select name="customer_id" id="customer_select2" class="form-select" required style="width:100%">
            <option value="">اختر العميل</option>
            @foreach($customers as $customer)
                <option
                    value="{{ $customer->id }}"
                    data-phone="{{ $customer->phone ?? $customer->mobile ?? '' }}"
                    {{ (string) old('customer_id', $defaultCustomerId) === (string) $customer->id ? 'selected' : '' }}>
                    {{ $customer->full_name }}
                    @if(!empty($customer->phone) || !empty($customer->mobile))
                        — {{ $customer->phone ?? $customer->mobile }}
                    @endif
                </option>
            @endforeach
        </select>
        @error('customer_id')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-4">
        <label class="form-label">نوع التصريح</label>
        <select name="permit_type_id" class="form-select" required>
            <option value="">اختر النوع</option>
            @foreach($permitTypes as $type)
                <option value="{{ $type->id }}" {{ (string) old('permit_type_id', $permit->permit_type_id ?? '') === (string) $type->id ? 'selected' : '' }}>
                    {{ $type->name }}
                </option>
            @endforeach
        </select>
        @error('permit_type_id')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-4">
        <label class="form-label">رقم التصريح</label>
        <input type="text" name="permit_number" class="form-control" value="{{ old('permit_number', $permit->permit_number ?? '') }}" required>
        @error('permit_number')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-4">
        <label class="form-label">اسم الشخص</label>
        <input type="text" name="person_name" class="form-control" value="{{ old('person_name', $permit->person_name ?? '') }}" required>
        @error('person_name')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-3">
        <label class="form-label">الجنسية</label>
        <input type="text" name="nationality" class="form-control" value="{{ old('nationality', $permit->nationality ?? '') }}">
    </div>

    <div class="col-md-3">
        <label class="form-label">الوظيفة</label>
        <input type="text" name="job_title" class="form-control" value="{{ old('job_title', $permit->job_title ?? '') }}">
    </div>

    <div class="col-md-3">
        <label class="form-label">الرقم القومي</label>
        <input type="text" name="national_id" class="form-control" value="{{ old('national_id', $permit->national_id ?? '') }}">
    </div>

    <div class="col-md-3">
        <label class="form-label">رقم الجواز</label>
        <input type="text" name="passport_no" class="form-control" value="{{ old('passport_no', $permit->passport_no ?? '') }}">
    </div>

    <div class="col-md-3">
        <label class="form-label">درجة السائق</label>
        <input type="text" name="driver_grade" class="form-control" value="{{ old('driver_grade', $permit->driver_grade ?? '') }}">
    </div>

    <div class="col-md-3">
        <label class="form-label">شاهد النقل</label>
        <input type="text" name="transport_witness" class="form-control" value="{{ old('transport_witness', $permit->transport_witness ?? '') }}">
    </div>

    <div class="col-md-3">
        <label class="form-label">تاريخ البداية</label>
        <input type="date" name="start_date" class="form-control" value="{{ old('start_date', $permit?->start_date?->format('Y-m-d')) }}" required>
        @error('start_date')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-3">
        <label class="form-label">تاريخ النهاية</label>
        <input type="date" name="end_date" class="form-control" value="{{ old('end_date', $permit?->end_date?->format('Y-m-d')) }}" required>
        @error('end_date')<small class="text-danger">{{ $message }}</small>@enderror
    </div>

    <div class="col-md-12">
        <label class="form-label">القطاعات المسموح بها</label>
        <textarea name="allowed_sectors" class="form-control" rows="2">{{ old('allowed_sectors', $permit->allowed_sectors ?? '') }}</textarea>
    </div>

    <div class="col-md-3">
        <label class="form-label">الإجمالي</label>
        <input type="number" step="0.01" min="0" name="total_amount" id="total_amount" class="form-control" value="{{ old('total_amount', $permit->total_amount ?? 0) }}" required>
    </div>

    <div class="col-md-3">
        <label class="form-label">المدفوع</label>
        <input type="number" step="0.01" min="0" name="paid_amount" id="paid_amount" class="form-control" value="{{ old('paid_amount', $permit->paid_amount ?? 0) }}" required>
    </div>

    <div class="col-md-3">
        <label class="form-label">المتبقي (تلقائي)</label>
        <input type="number" step="0.01" min="0" id="remaining_amount_display" class="form-control" value="{{ old('remaining_amount', $permit->remaining_amount ?? 0) }}" readonly>
    </div>

    <div class="col-md-3">
        <label class="form-label">تاريخ الاستحقاق</label>
        <input type="date" name="due_date" class="form-control" value="{{ old('due_date', $permit?->due_date?->format('Y-m-d')) }}">
    </div>

    <div class="col-md-12">
        <label class="form-label">ملاحظات</label>
        <textarea name="notes" class="form-control" rows="3">{{ old('notes', $permit->notes ?? '') }}</textarea>
    </div>
</div>

<script>
(function () {
    const totalEl = document.getElementById('total_amount');
    const paidEl = document.getElementById('paid_amount');
    const remainingEl = document.getElementById('remaining_amount_display');

    function recalc() {
        const total = parseFloat(totalEl.value || 0);
        const paid = parseFloat(paidEl.value || 0);
        remainingEl.value = Math.max(total - paid, 0).toFixed(2);
    }

    totalEl.addEventListener('input', recalc);
    paidEl.addEventListener('input', recalc);
    recalc();
})();
</script>

@push('css')
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<style>
    /* مطابقة ارتفاع Select2 مع Bootstrap */
    .select2-container--default .select2-selection--single {
        height: calc(1.5em + 0.75rem + 2px) !important;
        padding: 0.375rem 0.75rem !important;
        border: 1px solid #ced4da !important;
        border-radius: 0.375rem !important;
        line-height: 1.5 !important;
    }
    .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 1.5 !important;
        padding: 0 !important;
        color: #212529 !important;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 100% !important;
    }
    .select2-dropdown {
        border: 1px solid #ced4da !important;
        border-radius: 0.375rem !important;
    }
    .select2-container--default .select2-search--dropdown .select2-search__field {
        border: 1px solid #ced4da !important;
        border-radius: 0.25rem !important;
        padding: 0.375rem 0.5rem !important;
    }
    /* دعم RTL */
    .select2-container {
        width: 100% !important;
    }
</style>
@endpush

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(document).ready(function () {
    function customerMatcher(params, data) {
        // إذا لم يكن هناك نص بحث، أعد كل العناصر
        if ($.trim(params.term) === '') return data;
        if (typeof data.text === 'undefined') return null;

        var term  = params.term.toLowerCase();
        var text  = data.text.toLowerCase();
        var phone = ($(data.element).data('phone') || '').toString().toLowerCase();

        if (text.indexOf(term) > -1 || phone.indexOf(term) > -1) {
            return data;
        }
        return null;
    }

    $('#customer_select2').select2({
        placeholder: 'ابحث باسم العميل أو رقم الهاتف...',
        allowClear: true,
        matcher: customerMatcher,
        language: {
            noResults: function () { return 'لا توجد نتائج'; },
            searching: function () { return 'جاري البحث...'; }
        },
        dir: 'rtl',
    });
});
</script>
@endpush