@php
    $method = $method ?? 'POST';
@endphp
<div class="modal fade" id="{{ $modalId }}" tabindex="-1">
    <div class="modal-dialog fa-asset-form-modal">
        <div class="modal-content">
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title fw-semibold">{{ $title }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form method="POST" action="{{ $action }}" id="{{ $formId }}" class="fa-asset-form-shell fa-asset-form">
                @csrf
                @if($method !== 'POST')
                @method($method)
                @endif
                <div class="modal-body pt-2">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Asset Code <span class="text-danger">*</span></label>
                            <input type="text" name="code" class="form-control" required maxlength="40">
                        </div>
                        <div class="col-md-8">
                            <label class="form-label fw-semibold">Asset Name <span class="text-danger">*</span></label>
                            <input type="text" name="name" class="form-control" required maxlength="150">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Category</label>
                            <select name="category_id" class="form-select">
                                <option value="">—</option>
                                @foreach($categories as $category)
                                <option value="{{ $category->id }}">{{ $category->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Location</label>
                            <input type="text" name="location" class="form-control" maxlength="120">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Serial Number</label>
                            <input type="text" name="serial_number" class="form-control" maxlength="80">
                        </div>
                        <div class="col-md-3">
                            <label class="form-label fw-semibold">Purchase Date</label>
                            <div class="input-group axis-date-field">
                                <input type="text" name="purchase_date" class="form-control axis-report-datepicker" autocomplete="off" placeholder="dd-mm-yyyy">
                                <button type="button" class="input-group-text axis-date-trigger" data-axis-date-open aria-label="Open calendar">
                                    <i class="bi bi-calendar3"></i>
                                </button>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label fw-semibold">In Service Date</label>
                            <div class="input-group axis-date-field">
                                <input type="text" name="in_service_date" class="form-control axis-report-datepicker" autocomplete="off" placeholder="dd-mm-yyyy">
                                <button type="button" class="input-group-text axis-date-trigger" data-axis-date-open aria-label="Open calendar">
                                    <i class="bi bi-calendar3"></i>
                                </button>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Purchase Cost <span class="text-danger">*</span></label>
                            <input type="number" step="0.01" min="0" name="purchase_cost" class="form-control" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Salvage Value</label>
                            <input type="number" step="0.01" min="0" name="salvage_value" class="form-control" value="0">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Useful Life (Months) <span class="text-danger">*</span></label>
                            <input type="number" step="1" min="1" max="600" name="useful_life_months" class="form-control" value="60" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Depreciation Method</label>
                            <select name="depreciation_method" class="form-select">
                                @foreach($depreciationMethods as $value => $label)
                                <option value="{{ $value }}">{{ $label }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Asset Account</label>
                            @include('payroll.salary-components._account-picker', [
                                'name' => 'asset_account_id',
                                'listKey' => 'asset',
                                'placeholder' => 'Select asset account...',
                                'pickerClass' => 'fa-asset-account-picker',
                            ])
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Accum. Depreciation Account</label>
                            @include('payroll.salary-components._account-picker', [
                                'name' => 'accum_depreciation_account_id',
                                'listKey' => 'asset',
                                'placeholder' => 'Select accumulated depreciation account...',
                                'pickerClass' => 'fa-accum-dep-account-picker',
                            ])
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Depreciation Expense Account</label>
                            @include('payroll.salary-components._account-picker', [
                                'name' => 'depreciation_expense_account_id',
                                'listKey' => 'expense',
                                'placeholder' => 'Select depreciation expense account...',
                                'pickerClass' => 'fa-expense-account-picker',
                            ])
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Notes</label>
                            <textarea name="notes" class="form-control" rows="2"></textarea>
                        </div>
                        @if($formId === 'assetEditForm')
                        <div class="col-12">
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" name="is_active" value="1" id="{{ $formId }}Active">
                                <label class="form-check-label fw-semibold" for="{{ $formId }}Active">Active</label>
                            </div>
                        </div>
                        @endif
                    </div>
                </div>
                <div class="modal-footer border-0 pt-0">
                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary">Save</button>
                </div>
            </form>
        </div>
    </div>
</div>