@csrf
@php $isEdit = isset($expense); $model = $isEdit ? $expense : null; @endphp

{{-- ─── قسم 1: بيانات المصروف الأساسية ─── --}}
<div class="form-section">
    <div class="form-section-title"><i class="ti ti-info-circle me-1"></i> بيانات المصروف الأساسية</div>
    <div class="row g-3">
        <div class="col-md-3">
            <label class="form-label">التاريخ <span class="required-star">*</span></label>
            <div class="input-group">
                <span class="input-group-text bg-white"><i class="ti ti-calendar-event text-warning"></i></span>
                <input type="date" name="expense_date" class="form-control @error('expense_date') is-invalid @enderror"
                       value="{{ old('expense_date', $model?->expense_date?->format('Y-m-d') ?? now()->format('Y-m-d')) }}" required>
                @error('expense_date')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>
        </div>

        <div class="col-md-9">
            <label class="form-label">البيان / وصف المصروف <span class="required-star">*</span></label>
            <input type="text" name="statement_ar" class="form-control @error('statement_ar') is-invalid @enderror"
                   placeholder="مثال: فاتورة إيجار شهر أبريل 2026..."
                   value="{{ old('statement_ar', $model?->statement_ar ?: $model?->description_ar) }}" required>
            @error('statement_ar')<div class="invalid-feedback">{{ $message }}</div>@enderror
        </div>
    </div>
</div>

{{-- ─── قسم 2: التصنيف والمبلغ ─── --}}
<div class="form-section">
    <div class="form-section-title"><i class="ti ti-tag me-1"></i> التصنيف والمبلغ</div>
    <div class="row g-3">
        <div class="col-md-4">
            <label class="form-label">فئة المصروف <span class="required-star">*</span></label>
            <select name="expense_category_id" class="form-select @error('expense_category_id') is-invalid @enderror" required>
                <option value="">-- اختر الفئة --</option>
                @foreach($categories as $category)
                    <option value="{{ $category->id }}"
                        @selected(old('expense_category_id', $model?->expense_category_id) == $category->id)>
                        {{ $category->name_ar }}
                    </option>
                @endforeach
            </select>
            @error('expense_category_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
        </div>

        <div class="col-md-4">
            <label class="form-label">القيمة (ج.م) <span class="required-star">*</span></label>
            <div class="input-group amount-input-group">
                <span class="input-group-text">ج.م</span>
                <input type="number" step="0.01" min="0.01" name="amount"
                       class="form-control @error('amount') is-invalid @enderror"
                       placeholder="0.00"
                       value="{{ old('amount', $model?->amount ?: $model?->total_amount) }}" required>
                @error('amount')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>
        </div>

        <div class="col-md-4">
            <label class="form-label">رقم المرجع / الفاتورة</label>
            <input type="text" name="reference_number" class="form-control"
                   placeholder="رقم الفاتورة أو المرجع..."
                   value="{{ old('reference_number', $model?->reference_number) }}">
        </div>
    </div>
</div>

{{-- ─── قسم 3: بيانات الدفع ─── --}}
<div class="form-section">
    <div class="form-section-title"><i class="ti ti-credit-card me-1"></i> بيانات الدفع</div>
    <div class="row g-3">
        <div class="col-md-6">
            <label class="form-label">وسيلة الدفع <span class="required-star">*</span></label>
            <select name="payment_method" class="form-select @error('payment_method') is-invalid @enderror" required>
                <option value="">-- اختر وسيلة الدفع --</option>
                @foreach(\App\Models\Expense::PAYMENT_METHODS as $key => $label)
                    <option value="{{ $key }}" @selected(old('payment_method', $model?->payment_method) === $key)>
                        {{ $label }}
                    </option>
                @endforeach
            </select>
            @error('payment_method')<div class="invalid-feedback">{{ $message }}</div>@enderror
        </div>

        <div class="col-md-6">
            <label class="form-label">حساب الدفع <span class="required-star">*</span></label>
            <select name="payment_account_id" class="form-select @error('payment_account_id') is-invalid @enderror" required>
                <option value="">-- اختر حساب الدفع --</option>
                @foreach($accounts as $account)
                    <option value="{{ $account->id }}"
                        @selected(old('payment_account_id', $model?->payment_account_id) == $account->id)>
                        {{ $account->name_ar }}
                    </option>
                @endforeach
            </select>
            @error('payment_account_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
        </div>
    </div>
</div>

{{-- ─── قسم 4: المرفقات والملاحظات ─── --}}
<div class="form-section">
    <div class="form-section-title"><i class="ti ti-paperclip me-1"></i> المرفقات والملاحظات</div>
    <div class="row g-3">
        <div class="col-md-6">
            <label class="form-label">المرفق (فاتورة / إيصال)</label>
            <div class="upload-zone" onclick="document.getElementById('attachment-input').click()">
                <i class="ti ti-upload text-warning mb-1" style="font-size:1.5rem;"></i>
                <div class="text-muted small">انقر لرفع ملف <span class="text-warning fw-semibold">PDF / JPG / PNG</span></div>
                <div id="file-name-preview" class="mt-1 small text-success fw-semibold"></div>
                @if($isEdit && $model?->attachment_path)
                    <div class="mt-1">
                        <a href="{{ asset('storage/'.$model->attachment_path) }}" target="_blank"
                           class="btn btn-sm btn-outline-warning" onclick="event.stopPropagation()">
                            <i class="ti ti-eye me-1"></i> عرض المرفق الحالي
                        </a>
                    </div>
                @endif
            </div>
            <input type="file" id="attachment-input" name="attachment" accept=".pdf,.jpg,.jpeg,.png,.webp"
                   class="d-none @error('attachment') is-invalid @enderror"
                   onchange="document.getElementById('file-name-preview').textContent = this.files[0]?.name ?? ''">
            @error('attachment')<div class="text-danger small mt-1">{{ $message }}</div>@enderror
        </div>

        <div class="col-md-6">
            <label class="form-label">ملاحظات إضافية</label>
            <textarea name="notes_ar" rows="4" class="form-control"
                      placeholder="أي تفاصيل أو ملاحظات إضافية...">{{ old('notes_ar', $model?->notes_ar) }}</textarea>
        </div>
    </div>
</div>

{{-- ─── أزرار الحفظ ─── --}}
<div class="d-flex gap-3 pt-2 border-top mt-2">
    <button type="submit" class="btn btn-warning fw-bold px-5">
        <i class="ti ti-device-floppy me-2"></i>
        {{ $isEdit ? 'حفظ التعديلات' : 'إضافة المصروف' }}
    </button>
    <a href="{{ route('admin.expenses.index') }}" class="btn btn-outline-secondary px-4">
        <i class="ti ti-x me-1"></i> إلغاء
    </a>
</div>