@extends('garage.layouts.app')

@section('title', 'Edit estimate')

@push('styles')
@include('shared.garage-purchase-order-ui-styles')
@include('shared.garage-split-form-ui-styles')
@endpush

@section('navbar_lead')
@include('garage.partials.split-form-navbar-lead', [
    'icon' => 'bi-pencil-square',
    'title' => 'Edit estimate',
    'subtitle' => 'Update parts and services from quick add; the page stays fixed while line tables scroll inside their panels.',
])
@endsection

@section('content')
<div class="gpo-page gs-split-form-page gs-vf-page gs-est-page gs-ro-page container-fluid px-2 px-lg-3 py-2">
    <form method="POST" action="{{ route('garage.estimates.update', $estimate->id) }}" id="estForm">
        @csrf
        @method('PUT')
        <input type="hidden" name="garage_package_ids" id="garagePackageIds" value="{{ old('garage_package_ids', $estimate->garage_package_ids ?? '') }}">
        <input type="hidden" name="package_amount_total" id="garagePackageAmountTotal" value="{{ old('package_amount_total', $estimate->package_amount_total ?? 0) }}">

        <div class="gpo-split">
            @include('garage.estimates.partials.quick-add-panel')

            <div class="gpo-panel gs-ro-detail-panel">
                @include('garage.partials.split-form-detail-header', [
                    'icon' => 'bi-file-earmark-text',
                    'title' => 'Estimate detail',
                    'numberLabel' => 'Estimate no.',
                    'numberValue' => $estimate->estimate_number,
                    'dateName' => 'estimate_date',
                    'dateValue' => old('estimate_date', $estimate->estimate_date),
                    'historyUrl' => route('garage.estimates.index'),
                    'closeUrl' => route('garage.estimates.show', $estimate->id),
                    'saveLabel' => 'Update estimate',
                    'showCustomerVehicleQuickAdd' => true,
                ])
                <div class="gpo-panel-bd gs-ro-detail-bd">
                    <div class="gs-ro-detail-fields">
                    @if(session('error'))
                        <div class="alert alert-danger py-2 small mb-2">{{ session('error') }}</div>
                    @endif
                    @if($errors->any())
                        <div class="alert alert-danger py-2 small mb-2">
                            <ul class="mb-0 ps-3">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
                        </div>
                    @endif

                    @include('garage.estimates.partials.detail-panel-fields', [
                        'customers' => $customers,
                        'slots' => $slots ?? [],
                        'garageAdmin' => $garageAdmin,
                        'estimate' => $estimate,
                    ])

                    </div>

                    @include('garage.estimates.partials.lines-panels')

                    <div class="gs-ro-detail-footer">
                        <div class="mb-2 d-none" id="pkgSelectedCard">
                            <div class="p-2 rounded-3" style="border:1px solid rgba(var(--bs-primary-rgb), .18);background:#fff;">
                                <div class="d-flex align-items-center justify-content-between gap-2 flex-wrap">
                                    <div class="d-flex align-items-center gap-2">
                                        <div class="rounded-2 d-flex align-items-center justify-content-center" style="width:28px;height:28px;background:var(--bs-primary);color:#fff;"><i class="bi bi-box2-heart"></i></div>
                                        <div>
                                            <div class="small text-muted" style="font-weight:800;text-transform:uppercase;">Package</div>
                                            <div class="fw-bold text-dark small" id="pkgSelectedName">—</div>
                                        </div>
                                    </div>
                                    <div class="d-flex align-items-center gap-2">
                                        <span class="small text-muted">Fixed: <strong id="pkgSelectedAmount">PKR 0.00</strong></span>
                                        <button type="button" class="btn btn-sm btn-outline-danger py-0 px-2" id="btnClearPackage">Clear</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="gpo-sum gs-ro-sum-h" id="gsSumBox">
                            <div class="gpo-sum-row"><span>Subtotal</span><span id="gsSumSub">PKR 0.00</span></div>
                            <div class="gpo-sum-row"><span>Tax</span><span id="gsSumTax">PKR 0.00</span></div>
                            <div class="gpo-sum-row"><span>Discount</span><span id="gsSumDisc">PKR 0.00</span></div>
                            <div class="gpo-sum-row"><span>Freight</span><span id="gsSumShip">PKR 0.00</span></div>
                            <div class="gpo-sum-row total"><span>Total</span><span id="gsSumTot">PKR 0.00</span></div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </form>
</div>

@push('scripts')
@include('garage.partials.customer-vehicle-link-script')
@include('garage.partials.customer-vehicle-quick-add-script')
@include('garage.partials.vehicle-history-modal-script')
@include('garage.partials.ledger-label-helpers')
@include('garage.partials.meter-reading-script')
@include('garage.partials.parts-catalog-remote-script')
<script>
document.addEventListener('DOMContentLoaded', function () {
    function getPart(id) { return window.GaragePartsCatalog.getSync(id); }
    const VEHICLES = @json($vehiclesForJs);
    const CUSTOMERS_BY_ID = @json($customersById ?? []);
    const INITIAL = @json($initialLinesJson ?? []);
    const INITIAL_SERVICES = @json($initialServicesJson ?? []);
    const SVC_CATS = @json($garageServiceCategories ?? []);
    const GARAGE_SERVICES = @json($garageServicesForJs ?? []);
    const LABORS = @json($laborsForJs ?? []);
    const SERVICE_GROUPS = @json($serviceGroupsForJs ?? []);
    const HAS_SLOTS = @json(!empty($slots) && count($slots) > 0);
    let lines = INITIAL.map(function (L) { return Object.assign({ discount_type: L.discount_type || 'percentage' }, L); });
    let services = (INITIAL_SERVICES || []).map(function (S) { return Object.assign({}, S); });
    var hidPkgEl = document.getElementById('garagePackageIds');
    let packageIds = String((hidPkgEl && hidPkgEl.value) ? hidPkgEl.value : '')
        .split(',')
        .map(function (x) { return Number(String(x).trim()) || 0; })
        .filter(function (x) { return x > 0; });
    var hidPkgAmtEl = document.getElementById('garagePackageAmountTotal');
    let packageAmountTotal = Math.max(0, Number((hidPkgAmtEl && hidPkgAmtEl.value) ? hidPkgAmtEl.value : 0) || 0);
    let lastInvFiltered = [];
    let lastPkgFiltered = [];

    function money(n) { const x = Number(n)||0; return 'PKR ' + x.toLocaleString('en-PK',{minimumFractionDigits:2,maximumFractionDigits:2}); }
    function moneyCompact(n) { const x=Number(n)||0; const has=Math.round(x*100)%100!==0; return x.toLocaleString('en-PK', has?{minimumFractionDigits:2,maximumFractionDigits:2}:{maximumFractionDigits:0}); }
    function escapeHtml(s){ if(!s) return ''; return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;'); }

    var EST_TABLE_SCROLL_MIN_ROWS = 4;
    function syncRoTableScroll(scrollWrapId, bodyId) {
        var wrap = document.getElementById(scrollWrapId);
        var body = document.getElementById(bodyId);
        if (!wrap || !body) return;
        var empty = body.querySelector('.gs-ro-empty-cell');
        var rows = body.querySelectorAll('tr').length;
        wrap.classList.toggle('is-scrollable', !empty && rows >= EST_TABLE_SCROLL_MIN_ROWS);
    }

    // ---- Slot availability (date-wise, shared with repair orders) ----
    function fetchSlotAvailability(dateStr) {
        if (!HAS_SLOTS) return;
        var slotSel = document.getElementById('estSlotId');
        if (!slotSel) return;
        var url = '/garage/api/slots/availability?date=' + encodeURIComponent(String(dateStr || '')) + '&exclude_type=estimate&exclude_id=' + encodeURIComponent(String(@json((int)($estimate->id ?? 0))));
        fetch(url, { headers: { 'Accept': 'application/json' } })
            .then(function (r) { return r.json(); })
            .then(function (j) {
                if (!j || !j.ok) return;
                var occ = Array.isArray(j.occupied_ids) ? j.occupied_ids.map(String) : [];
                Array.prototype.slice.call(slotSel.options).forEach(function (opt) {
                    if (!opt.value) return;
                    opt.disabled = occ.indexOf(String(opt.value)) !== -1 && String(opt.value) !== String(slotSel.value || '');
                });
                if (window.jQuery) jQuery('#estSlotId').trigger('chosen:updated');
            })
            .catch(function () {});
    }

    var estDateInp = document.querySelector('input[name="estimate_date"]');
    if (estDateInp && HAS_SLOTS) {
        estDateInp.addEventListener('change', function () { fetchSlotAvailability(estDateInp.value); });
        fetchSlotAvailability(estDateInp.value);
    }
    function lineCalc(L){
        const qty=Math.max(1,parseInt(L.quantity,10)||1);
        const unit=Math.max(0,parseFloat(L.unit_price)||0);
        const gross=(qty*unit);
        let disc=Math.max(0,parseFloat(L.discount_amount)||0);
        if((L.discount_type||'percentage')==='percentage') disc=gross*(disc/100);
        const net=Math.max(0,gross-disc);
        const tr=Math.max(0,parseFloat(L.tax_rate)||0);
        const tax=net*(tr/100);
        return {net,tax,total:net+tax};
    }
    function serviceCalc(S){
        const hours=Math.max(0,parseFloat(S.hours)||0);
        const rate=Math.max(0,parseFloat(S.rate)||0);
        return {total:hours*rate};
    }
    function stockBadge(p){ const q=p.stock_quantity; if(q<=0) return {cls:'gpo-inv-stk-none',txt:'Out of stock'}; if(q<5) return {cls:'gpo-inv-stk-low',txt:'Low · '+q}; return {cls:'gpo-inv-stk-ok',txt:q+' in stock'}; }

    function usedQtyForPart(partId) {
        let used = 0;
        lines.forEach(function (L) {
            if (Number(L.part_id) === Number(partId)) used += (parseInt(L.quantity, 10) || 0);
        });
        return used;
    }

    function renderInventoryRows(filtered) {
        const el=document.getElementById('gsInvList');
        const fl=document.getElementById('gsInvFilterLabel');
        const q=(document.getElementById('gsInvSearch').value||'').trim();
        lastInvFiltered = filtered;
        document.getElementById('gsInvCount').textContent=String(filtered.length);
        if(fl){ fl.innerHTML=q ? 'Showing <strong>'+filtered.length+'</strong> matches' : '<strong>'+filtered.length+'</strong> items · <em>Add</em> puts a line on this estimate'; }
        if(!filtered.length){ el.innerHTML='<div class="gpo-inv-empty">'+(q?'No matches.':'Type 2+ characters to search parts.')+'</div>'; return; }
        el.innerHTML = filtered.map(function(p){
            const code=p.inventory_code||p.code||'—';
            const nm=escapeHtml(p.name);
            const stock = parseInt(p.stock_quantity, 10) || 0;
            const sb=stockBadge({ stock_quantity: stock });
            const meta='<span class="gpo-inv-stk-inline '+sb.cls+'">'+escapeHtml(sb.txt)+'</span> · Price '+moneyCompact(p.selling_price)+' · Tax '+(Number(p.tax_rate)||0)+'%';
            return '<div class="gpo-inv-row" data-pid="'+p.id+'">'+
                '<div class="gpo-inv-row-detail"><div class="gpo-inv-row-top">'+
                '<span class="gpo-inv-sku" title="'+escapeHtml(String(code))+'">'+escapeHtml(String(code))+'</span>'+
                '<span class="gpo-inv-name" title="'+nm+'">'+nm+'</span></div>'+
                '<div class="gpo-inv-inline-meta">'+meta+'</div></div>'+
                '<div class="gpo-inv-row-actions">'+
                '<input type="number" min="1" value="1" class="gpo-inv-qty gpo-line-qty" data-pid="'+p.id+'" aria-label="Quantity">'+
                '<button type="button" class="gpo-inv-add-btn" data-pid="'+p.id+'" title="Add line"><span class="gpo-inv-add-lbl"><i class="bi bi-plus-lg"></i> Add</span></button>'+
                '</div></div>';
        }).join('');
    }

    function renderInventory() {
        const q=(document.getElementById('gsInvSearch').value||'').trim();
        const el=document.getElementById('gsInvList');
        const fl=document.getElementById('gsInvFilterLabel');
        if (q.length > 0 && q.length < 2) {
            if (fl) fl.innerHTML = 'Type at least <strong>2 characters</strong> to search parts.';
            el.innerHTML = '<div class="gpo-inv-empty">Keep typing to search the catalog…</div>';
            return;
        }
        window.GaragePartsCatalog.debouncedSearch(q, renderInventoryRows);
    }

    function addPart(partId, qty){
        window.GaragePartsCatalog.ensure(partId).then(function (p) {
        if(!p) return;
        const q=Math.max(1, parseInt(qty,10)||1);
        const existing = lines.find(function (L) { return Number(L.part_id) === Number(p.id); });
        if (existing) { existing.quantity = Math.max(1, (parseInt(existing.quantity,10)||1) + q); renderLines(); renderInventory(); return; }
        lines.push({part_id:p.id,product_name:p.name,description:'',inventory_code_snapshot:p.inventory_code||p.code||null,quantity:q,unit_price:p.selling_price,discount_amount:0,discount_type:'percentage',tax_rate:p.tax_rate});
        renderLines();
        renderInventory();
        });
    }

    function updateSummary(){
        let partsSub=0, servicesSub=0, tax=0;
        lines.forEach(function (L) { const c=lineCalc(L); partsSub+=c.net; tax+=c.tax; });
        services.forEach(function (S) { servicesSub += serviceCalc(S).total; });
        const sub = partsSub + servicesSub + (Number(packageAmountTotal) || 0);
        const dt = document.querySelector('input[name="discount_type"]:checked');
        const discType = (dt && dt.value) ? dt.value : 'fixed';
        const discVal=parseFloat(document.getElementById('gsHdrDiscVal').value)||0;
        const freight=parseFloat(document.getElementById('gsFreight').value)||0;
        const hdrDisc=discType==='percentage' ? (sub*(discVal/100)) : discVal;
        const after=Math.max(0,sub-hdrDisc);
        const total=after+tax+freight;
        const partsEl=document.getElementById('gsPartsTotal'); if(partsEl) partsEl.textContent=money(partsSub);
        const servicesEl=document.getElementById('gsServicesTotal'); if(servicesEl) servicesEl.textContent=money(servicesSub);

        // Subtotal should NOT change when header discount changes.
        document.getElementById('gsSumSub').textContent=money(sub);
        document.getElementById('gsSumTax').textContent=money(tax);
        document.getElementById('gsSumDisc').textContent=money(hdrDisc);
        document.getElementById('gsSumShip').textContent=money(freight);
        document.getElementById('gsSumTot').textContent=money(total);
    }

    var invRenderTimer = null;
    function scheduleRenderInventory() {
        clearTimeout(invRenderTimer);
        invRenderTimer = setTimeout(renderInventory, 120);
    }
    function syncLineTotalInRow(tr, L) {
        const cell = tr.querySelector('.js-line-total');
        if (!cell) return;
        cell.textContent = money(lineCalc(L).total);
    }

    function renderLines(){
        const body=document.getElementById('gsLinesBody');
        if (!body) return;
        const cartBadge=document.getElementById('gsCartCount');
        if (cartBadge) cartBadge.textContent=String(lines.length);
        if(!lines.length){ body.innerHTML='<tr><td colspan="7" class="text-center text-muted gs-ro-empty-cell">No parts yet. Add from inventory.</td></tr>'; syncRoTableScroll('gsPartsScroll', 'gsLinesBody'); renderServices(); updateSummary(); return; }
        body.innerHTML=lines.map(function(L,i){
            const c=lineCalc(L);
            const isInc = String(L.source || '') === 'package_included';
            return '<tr data-idx="'+i+'">'+
                '<td><div class="fw-semibold">'+escapeHtml(L.product_name||'')+'</div><div class="small text-muted">'+escapeHtml(L.inventory_code_snapshot||'')+'</div></td>'+
                '<td><input type="number" min="1" class="form-control form-control-sm js-qty" value="'+L.quantity+'"' + (isInc ? ' readonly' : '') + '></td>'+
                (isInc
                    ? '<td><input type="text" class="form-control form-control-sm" value="—" readonly></td>'
                    : '<td><input type="number" min="0" step="0.01" class="form-control form-control-sm js-price" value="'+L.unit_price+'"></td>')+
                (isInc
                    ? '<td><input type="text" class="form-control form-control-sm" value="—" readonly></td>'
                    : '<td><div class="d-flex gap-1">'+
                        '<select class="form-select form-select-sm js-disc-type" style="max-width:6.5rem">'+
                            '<option value="percentage"'+(L.discount_type==='percentage'?' selected':'')+'>%</option>'+
                            '<option value="fixed"'+(L.discount_type==='fixed'?' selected':'')+'>PKR</option>'+
                        '</select>'+
                        '<input type="number" min="0" step="0.01" class="form-control form-control-sm js-disc" value="'+L.discount_amount+'">'+
                    '</div></td>')+
                (isInc
                    ? '<td><input type="text" class="form-control form-control-sm" value="—" readonly></td>'
                    : '<td><input type="number" min="0" step="0.01" class="form-control form-control-sm js-tax" value="'+(L.tax_rate||0)+'"></td>')+
                '<td class="text-end fw-semibold js-line-total">'+(isInc ? '—' : money(c.total))+'</td>'+
                '<td class="text-end"><button type="button" class="btn btn-sm btn-outline-danger js-del"><i class="bi bi-x-lg"></i></button></td>'+
                '</tr>';
        }).join('');
        syncRoTableScroll('gsPartsScroll', 'gsLinesBody');
        renderServices();
        updateSummary();
    }

    function serviceName(S) {
        const svc = (GARAGE_SERVICES || []).find(function (x) { return String(x.id) === String(S.garage_service_id); });
        if (svc) return svc.name;
        if (S.legacy_type === 'labor') {
            const lab = (LABORS || []).find(function (x) { return String(x.id) === String(S.labor_id); });
            return lab ? lab.name : (S.title || 'Labor');
        }
        if (S.legacy_type === 'service_group') {
            const sg = (SERVICE_GROUPS || []).find(function (x) { return String(x.id) === String(S.service_group_id); });
            return sg ? sg.name : (S.title || 'Bundle');
        }
        return S.title || 'Service';
    }

    function renderServices(){
        const body=document.getElementById('roSvcBody');
        if(!body) return;
        if(!services.length){
            body.innerHTML='<tr><td colspan="5" class="text-center text-muted gs-ro-empty-cell">No services yet.</td></tr>';
        } else {
            body.innerHTML = services.map(function(S,i){
                const nm = serviceName(S);
                const c=serviceCalc(S);
                const isInc = String(S.source || '') === 'package_included';
                const rateRo = S.garage_service_id ? ' readonly' : '';
                const stepH = S.garage_service_id ? '1' : '0.25';
                const minH = S.garage_service_id ? '1' : '0.25';
                return '<tr data-sidx="'+i+'">'+
                    '<td><div class="fw-semibold">'+escapeHtml(nm)+'</div></td>'+
                    '<td><input type="number" min="'+minH+'" step="'+stepH+'" class="form-control form-control-sm js-svc-hours" value="'+(Number(S.hours)||1)+'"' + (isInc ? ' readonly' : '') + '></td>'+
                    (isInc
                        ? '<td><input type="text" class="form-control form-control-sm" value="—" readonly></td>'
                        : '<td><input type="number" min="0" step="0.01" class="form-control form-control-sm js-svc-rate" value="'+(Number(S.rate)||0)+'"'+rateRo+'></td>')+
                    '<td class="text-end fw-semibold">'+(isInc ? '—' : money(c.total))+'</td>'+
                    '<td class="text-end"><button type="button" class="btn btn-sm btn-outline-danger js-svc-del"><i class="bi bi-x-lg"></i></button></td>'+
                    '</tr>';
            }).join('');
        }
        const badge=document.getElementById('roSvcCount');
        if(badge) badge.textContent=String(services.length);
        syncRoTableScroll('roSvcScroll', 'roSvcBody');
        if (typeof meterUi !== 'undefined' && meterUi && meterUi.syncVisibility) meterUi.syncVisibility();
    }

    var gsInvSearchEl = document.getElementById('gsInvSearch');
    if (gsInvSearchEl) {
        gsInvSearchEl.addEventListener('input', renderInventory);
        gsInvSearchEl.addEventListener('keydown', function (e) {
            if (e.key !== 'Enter') return;
            const q = (e.target.value || '').trim();
            if (!q) return;
            if (!lastInvFiltered.length) return;
            e.preventDefault();
            addPart(lastInvFiltered[0].id, 1);
            e.target.select();
            renderInventory();
        });
    }
    document.addEventListener('click', function(e){
        const svcBtn = e.target.closest('[data-add-svc]');
        if (svcBtn) {
            const id = svcBtn.getAttribute('data-add-svc');
            const qtyEl = document.querySelector('input[data-sqty="' + id + '"]');
            const qty = Math.max(1, parseInt(qtyEl && qtyEl.value, 10) || 1);
            const svc = (GARAGE_SERVICES || []).find(function (x) { return String(x.id) === String(id); });
            if (svc) {
                services.push({ garage_service_id: Number(svc.id), legacy_type: null, labor_id: null, service_group_id: null, hours: qty, rate: Number(svc.price) || 0, notes: '', title: null });
                renderServices();
                updateSummary();
            }
            return;
        }
        const pkgBtn = e.target.closest('.gpo-inv-add-btn[data-pkgid]');
        if (pkgBtn) {
            const id = pkgBtn.getAttribute('data-pkgid');
            if (id) addPackage(id);
            return;
        }
        const btn = e.target.closest('.gpo-inv-add-btn[data-pid]');
        if (btn) {
            const pid = btn.getAttribute('data-pid');
            const qtyEl = document.querySelector('.gpo-line-qty[data-pid="'+pid+'"]');
            addPart(pid, qtyEl ? qtyEl.value : 1);
            return;
        }
        const del=e.target.closest('.js-del');
        if(del){ const tr=del.closest('tr'); const idx=parseInt(tr.getAttribute('data-idx'),10); lines.splice(idx,1); renderLines(); renderInventory(); return; }
        const sdel=e.target.closest('.js-svc-del');
        if(sdel){ const tr=sdel.closest('tr'); const idx=parseInt(tr.getAttribute('data-sidx'),10); services.splice(idx,1); renderServices(); updateSummary(); }
    });
    var gsLinesBodyEl = document.getElementById('gsLinesBody');
    if (gsLinesBodyEl) gsLinesBodyEl.addEventListener('input', function(e){
        const tr=e.target.closest('tr'); if(!tr) return;
        const idx=parseInt(tr.getAttribute('data-idx'),10); const L=lines[idx]; if(!L) return;
        var refreshInv = false;
        if(e.target.classList.contains('js-qty')) { L.quantity=Math.max(1,parseInt(e.target.value,10)||1); refreshInv = true; }
        if(e.target.classList.contains('js-price')) L.unit_price=Math.max(0,parseFloat(e.target.value)||0);
        if(e.target.classList.contains('js-disc')) L.discount_amount=Math.max(0,parseFloat(e.target.value)||0);
        if(e.target.classList.contains('js-disc-type')) L.discount_type=e.target.value;
        if(e.target.classList.contains('js-tax')) L.tax_rate=Math.max(0,parseFloat(e.target.value)||0);
        syncLineTotalInRow(tr, L);
        updateSummary();
        if (refreshInv) scheduleRenderInventory();
    });

    const svcBody = document.getElementById('roSvcBody');
    if (svcBody) {
        svcBody.addEventListener('input', function(e){
            const tr=e.target.closest('tr'); if(!tr) return;
            const idx=parseInt(tr.getAttribute('data-sidx'),10); const S=services[idx]; if(!S) return;
            if(e.target.classList.contains('js-svc-hours')) S.hours=Math.max(0,parseFloat(e.target.value)||0);
            if(e.target.classList.contains('js-svc-rate')) S.rate=Math.max(0,parseFloat(e.target.value)||0);
            updateSummary();
        });
    }
    var gsHdrDiscVal = document.getElementById('gsHdrDiscVal');
    var gsFreightEl = document.getElementById('gsFreight');
    var gsHdrDiscType = document.getElementById('gsHdrDiscType');
    if (gsHdrDiscVal) gsHdrDiscVal.addEventListener('input', updateSummary);
    if (gsFreightEl) gsFreightEl.addEventListener('input', updateSummary);
    if (gsHdrDiscType) gsHdrDiscType.addEventListener('change', updateSummary);

    // ---- Quick add services (left tab: search + list) ----
    var lastSvcFiltered = [];
    function renderQuickServicesList() {
        var roSvcSearchEl = document.getElementById('roSvcSearch');
        var q = (roSvcSearchEl && roSvcSearchEl.value ? roSvcSearchEl.value : '').toLowerCase().trim();
        var el = document.getElementById('roSvcList');
        var cnt = document.getElementById('roSvcCountQuick');
        if (!el) return;

        var list = (GARAGE_SERVICES || []).filter(function (s) {
            if (!q) return true;
            return String(s.name || '').toLowerCase().indexOf(q) !== -1;
        });
        lastSvcFiltered = list;
        if (cnt) cnt.textContent = String(list.length);
        if (!list.length) { el.innerHTML = '<div class="gpo-inv-empty">No matches.</div>'; return; }

        el.innerHTML = list.map(function (s) {
            var nm = escapeHtml(s.name || 'Service');
            var meta = 'Unit ' + moneyCompact(s.price || 0);
            var mins = (s.required_minutes !== null && s.required_minutes !== undefined && String(s.required_minutes) !== '')
                ? (parseInt(s.required_minutes, 10) || 0)
                : 0;
            if (mins) meta += ' · ' + mins + ' min';
            return '<div class="gpo-inv-row">' +
                '<div class="gpo-inv-row-detail">' +
                    '<div class="gpo-inv-row-top">' +
                        '<span class="gpo-inv-name" title="' + nm + '">' + nm + '</span>' +
                    '</div>' +
                    '<div class="gpo-inv-inline-meta">' + meta + '</div>' +
                '</div>' +
                '<div class="gpo-inv-row-actions">' +
                    '<input type="number" min="1" step="1" value="1" class="gpo-inv-qty" data-sqty="' + s.id + '">' +
                    '<button type="button" class="gpo-inv-add-btn" data-add-svc="' + s.id + '"><span class="gpo-inv-add-lbl"><i class="bi bi-plus-lg"></i> Add</span></button>' +
                '</div>' +
            '</div>';
        }).join('');
    }

    var roSvcSearch = document.getElementById('roSvcSearch');
    if (roSvcSearch) {
        roSvcSearch.addEventListener('input', renderQuickServicesList);
        roSvcSearch.addEventListener('keydown', function (e) {
            if (e.key !== 'Enter') return;
            var q = (e.target.value || '').trim();
            if (!q) return;
            if (!lastSvcFiltered.length) return;
            e.preventDefault();
            var first = lastSvcFiltered[0];
            services.push({
                garage_service_id: Number(first.id),
                legacy_type: null,
                labor_id: null,
                service_group_id: null,
                hours: 1,
                rate: Number(first.price) || 0,
                estimated_minutes: (first.required_minutes !== null && first.required_minutes !== undefined) ? (parseInt(first.required_minutes, 10) || 0) : 0,
                notes: '',
                title: null
            });
            renderServices();
            updateSummary();
            e.target.select();
        });
        renderQuickServicesList();
    }

    async function fetchPackages(q) {
        try {
            const res = await fetch("{{ url('/garage/api/packages') }}" + '?q=' + encodeURIComponent(String(q || '')), { headers: { 'Accept': 'application/json' } });
            const j = await res.json();
            if (!j || !j.ok) return;
            const list = j.data || [];
            lastPkgFiltered = list;
            const count = document.getElementById('gePkgCount');
            if (count) count.textContent = String(list.length);
            const fl = document.getElementById('gePkgFilterLabel');
            if (fl) fl.innerHTML = q ? ('Showing <strong>' + list.length + '</strong> match(es)') : 'All active packages';
            const el = document.getElementById('gePkgList');
            if (!el) return;
            if (!list.length) { el.innerHTML = '<div class="gpo-inv-empty">No packages found.</div>'; return; }
            el.innerHTML = list.map(function (p) {
                const code = p.code ? ('<span class="gpo-inv-sku" title="' + escapeHtml(p.code) + '">' + escapeHtml(p.code) + '</span>') : '';
                const nm = escapeHtml(p.name || 'Package');
                const meta = 'Offer ' + moneyCompact(p.package_price || 0);
                return '<div class="gpo-inv-row" data-pkgid="' + p.id + '">' +
                    '<div class="gpo-inv-row-detail"><div class="gpo-inv-row-top">' + code +
                    '<span class="gpo-inv-name" title="' + nm + '">' + nm + '</span></div>' +
                    '<div class="gpo-inv-inline-meta">' + meta + '</div></div>' +
                    '<div class="gpo-inv-row-actions">' +
                    '<button type="button" class="gpo-inv-add-btn" data-pkgid="' + p.id + '" title="Add package"><span class="gpo-inv-add-lbl"><i class="bi bi-plus-lg"></i> Add</span></button>' +
                    '</div></div>';
            }).join('');
        } catch (e) {}
    }

    async function addPackage(pkgId) {
        if (!pkgId) return;
        try {
            const pkgNumId = Number(pkgId) || 0;
            if (!pkgNumId) return;
            if (packageIds.indexOf(pkgNumId) !== -1) return;

            const res = await fetch("{{ url('/garage/api/packages') }}/" + encodeURIComponent(String(pkgId)), { headers: { 'Accept': 'application/json' }});
            const j = await res.json();
            if (!j || !j.ok || !j.data) return;
            const pkg = j.data.package || {};
            const items = j.data.items || [];

            items.forEach(function (it) {
                const t = String(it.item_type || '');
                const qty = Math.max(0.01, parseFloat(it.quantity) || 1);
                if (t === 'part' && it.garage_part_id) {
                    addPart(it.garage_part_id, qty);
                    const L = lines.find(function (x) { return Number(x.part_id) === Number(it.garage_part_id); });
                    if (L) { L.unit_price = 0; L.discount_amount = 0; L.discount_type = 'fixed'; L.tax_rate = 0; L.source = 'package_included'; }
                }
                if (t === 'service' && it.garage_service_id) {
                    const svc = (GARAGE_SERVICES || []).find(function (x) { return String(x.id) === String(it.garage_service_id); });
                    if (!svc) return;
                    services.push({
                        garage_service_id: svc.id,
                        hours: qty,
                        rate: 0,
                        estimated_minutes: (svc.required_minutes !== null && svc.required_minutes !== undefined) ? (parseInt(svc.required_minutes, 10) || 0) : 0,
                        source: 'package_included'
                    });
                }
            });

            packageIds.push(pkgNumId);
            packageAmountTotal = Math.max(0, Number(packageAmountTotal) || 0) + Math.max(0, parseFloat(pkg.package_price) || 0);
            const hidPkg = document.getElementById('garagePackageIds');
            const hidAmt = document.getElementById('garagePackageAmountTotal');
            if (hidPkg) hidPkg.value = packageIds.join(',');
            if (hidAmt) hidAmt.value = packageAmountTotal ? String(packageAmountTotal.toFixed(2)) : '';

            const card = document.getElementById('pkgSelectedCard');
            if (card) card.classList.remove('d-none');
            const nmEl = document.getElementById('pkgSelectedName');
            const amtEl = document.getElementById('pkgSelectedAmount');
            if (nmEl) nmEl.textContent = 'Selected: ' + packageIds.length + ' package(s)';
            if (amtEl) amtEl.textContent = money(packageAmountTotal);

            renderLines();
            updateSummary();
        } catch (e) {}
    }

    const gePkgSearch = document.getElementById('gePkgSearch');
    if (gePkgSearch) {
        let t = null;
        gePkgSearch.addEventListener('input', function () { clearTimeout(t); t = setTimeout(function () { fetchPackages(gePkgSearch.value || ''); }, 200); });
        gePkgSearch.addEventListener('keydown', function (e) {
            if (e.key !== 'Enter') return;
            const q = (e.target.value || '').trim();
            if (!q) return;
            if (!lastPkgFiltered.length) return;
            e.preventDefault();
            addPackage(lastPkgFiltered[0].id);
            e.target.select();
        });
        fetchPackages('');
    }

    const clearBtn = document.getElementById('btnClearPackage');
    if (clearBtn) clearBtn.addEventListener('click', function () {
        packageIds = [];
        packageAmountTotal = 0;
        const hidPkg = document.getElementById('garagePackageIds');
        const hidAmt = document.getElementById('garagePackageAmountTotal');
        if (hidPkg) hidPkg.value = '';
        if (hidAmt) hidAmt.value = '';
        const card = document.getElementById('pkgSelectedCard');
        if (card) card.classList.add('d-none');
        lines = (lines || []).filter(function (L) { return String(L.source || '') !== 'package_included'; });
        services = (services || []).filter(function (S) { return String(S.source || '') !== 'package_included'; });
        renderLines();
        updateSummary();
    });
    document.getElementById('estForm').addEventListener('submit', function(e){
        if(!lines.length && !services.length){ e.preventDefault(); alert('Add at least one part or service.'); return; }
        const payload = lines.map(function (L) {
            return {
                part_id: L.part_id,
                product_name: L.product_name,
                description: L.description || '',
                quantity: L.quantity,
                unit_price: L.unit_price,
                discount_amount: L.discount_amount,
                discount_type: L.discount_type,
                tax_rate: L.tax_rate,
                inventory_code_snapshot: L.inventory_code_snapshot
            };
        });
        let hid=document.getElementById('gsItemsPayload');
        if(!hid){ hid=document.createElement('input'); hid.type='hidden'; hid.name='items'; hid.id='gsItemsPayload'; this.appendChild(hid); }
        hid.value = JSON.stringify(payload);

        let hid2=document.getElementById('gsServicesPayload');
        if(!hid2){ hid2=document.createElement('input'); hid2.type='hidden'; hid2.name='services'; hid2.id='gsServicesPayload'; this.appendChild(hid2); }
        hid2.value = JSON.stringify((services||[]).map(function (S) {
            return {
                garage_service_id: S.garage_service_id || null,
                legacy_type: S.legacy_type || null,
                labor_id: S.labor_id || null,
                service_group_id: S.service_group_id || null,
                hours: Number(S.hours) || 0,
                rate: Number(S.rate) || 0,
                notes: S.notes || '',
                title: S.title || null
            };
        }));
    });

    if (window.jQuery && window.jQuery.fn && typeof window.jQuery.fn.chosen === 'function') {
        window.jQuery('.js-chosen-compact').not('#gsVehicle').chosen({ width: '100%', search_contains: true, allow_single_deselect: true });
    }

    var meterUi = window.GrgMeterReading.init({
        vehicleSelectId: 'gsVehicle',
        inputId: 'estMeterReading',
        nextMeterInputId: 'estNextMeterReading',
        nextDateInputId: 'estNextServiceDate',
        hintId: 'estMeterHint',
        hasServices: function () {
            return (services || []).some(function (s) { return Number(s.garage_service_id) > 0; });
        },
        isVisible: function () { return !!document.getElementById('gsVehicle').value; },
        getServiceIds: function () {
            return (services || []).map(function (s) { return Number(s.garage_service_id) || 0; }).filter(function (id) { return id > 0; });
        }
    });

    function applyVehicleHistoryDoc(doc) {
        if (!doc) return;
        window.GrgMeterReading.prefillAll({
            currentInputId: 'estMeterReading',
            nextMeterInputId: 'estNextMeterReading',
            nextDateInputId: 'estNextServiceDate',
            current: doc.meter_reading,
            next_meter_reading: doc.next_meter_reading,
            next_service_date: doc.next_service_date
        });
        var discR = document.querySelector('#gsHdrDiscType input[name="discount_type"][value="' + (doc.discount_type || 'fixed') + '"]');
        if (discR) discR.checked = true;
        if (document.getElementById('gsHdrDiscVal')) document.getElementById('gsHdrDiscVal').value = String(doc.discount_amount || 0);
        if (document.getElementById('gsFreight')) document.getElementById('gsFreight').value = String(doc.freight_amount || 0);
        lines = (doc.parts || []).map(function (p) {
            return {
                part_id: p.part_id,
                product_name: p.product_name || '',
                description: p.description || '',
                inventory_code_snapshot: p.inventory_code_snapshot || null,
                quantity: p.quantity || 1,
                unit_price: p.unit_price || 0,
                discount_amount: p.discount_amount || 0,
                discount_type: p.discount_type || 'percentage',
                tax_rate: p.tax_rate || 0
            };
        });
        services = (doc.services || []).map(function (s) {
            return {
                garage_service_id: s.garage_service_id,
                legacy_type: s.legacy_type || null,
                labor_id: null,
                service_group_id: null,
                garage_employee_id: s.garage_employee_id || null,
                hours: Number(s.hours) || 1,
                rate: Number(s.rate) || 0,
                notes: s.notes || '',
                title: s.title || null
            };
        });
        renderLines();
        if (meterUi && meterUi.syncVisibility) meterUi.syncVisibility();
        if (meterUi && meterUi.refresh) meterUi.refresh();
    }

    if (window.GrgVehicleHistoryModal) {
        window.GrgVehicleHistoryModal.watch({
            vehicleSelectId: 'gsVehicle',
            onApply: applyVehicleHistoryDoc,
            skipInitialPopup: true
        });
    }

    var customerVehicleLink = window.GarageCustomerVehicleLink.init({
        vehicles: VEHICLES,
        customersById: CUSTOMERS_BY_ID,
        initialVehicleId: @json(old('vehicle_id', $estimate->vehicle_id)),
        onVehicleChange: function () {
            if (meterUi && meterUi.syncVisibility) meterUi.syncVisibility();
            if (meterUi && meterUi.refresh) meterUi.refresh();
        }
    });

    if (window.GrgCustomerVehicleQuickAdd) {
        window.GrgCustomerVehicleQuickAdd.init({ customerVehicleLink: customerVehicleLink });
    }

    renderInventory();
    renderLines();
    renderServices();
});
</script>
@include('garage.repair-orders.partials.quick-add-height-sync')
@endpush
@endsection