@php
    $sale = $sale ?? null;
    $isEdit = !empty($sale);
    $showRepairOrderPick = $showRepairOrderPick ?? !$isEdit;
@endphp

<div class="row g-2 mb-2 gs-ro-fields-row">
    <div class="col-12 col-sm-6 col-lg-3">
        <div class="gpo-lbl">Sale type</div>
        <select class="gpo-sel js-chosen js-chosen-compact" name="sale_kind" id="gsSaleKind">
            <option value="customer_sale" @selected(old('sale_kind', $sale?->sale_kind ?? 'customer_sale') === 'customer_sale')>Customer sale</option>
            <option value="cash_sale" @selected(old('sale_kind', $sale?->sale_kind ?? '') === 'cash_sale')>Cash sale</option>
        </select>
    </div>
    <div class="col-12 col-sm-6 col-lg-3">
        <div class="gpo-lbl">Status</div>
        <select class="gpo-sel js-chosen js-chosen-compact" name="status" id="gsStatus">
            <option value="draft" @selected(old('status', $sale?->status ?? 'held') === 'draft')>Draft</option>
            <option value="held" @selected(old('status', $sale?->status ?? 'held') === 'held')>Held</option>
            <option value="completed" @selected(old('status', $sale?->status ?? '') === 'completed')>Completed</option>
        </select>
    </div>
    @if($showRepairOrderPick)
    <div class="col-12 col-sm-7 col-lg-4 gs-ro-repair-order-col">
        <div class="gpo-lbl">{{ $glOrder ?? 'Order' }} <span class="text-muted fw-normal">(optional)</span></div>
        <div class="d-flex gap-2 flex-wrap align-items-start">
            <div class="gs-ro-fetch-select-wrap flex-grow-1" style="min-width:0;">
                <select class="gpo-sel js-chosen js-chosen-compact" id="gsRepairOrderPick" data-placeholder="Direct sale…">
                    <option value="">— Direct sale —</option>
                    @foreach(($repairOrders ?? []) as $ro)
                        <option value="{{ $ro->id }}" @selected((int) request()->query('repair_order_id') === (int) $ro->id)>{{ $ro->repair_order_number }} · {{ str_replace('_', ' ', $ro->status) }}</option>
                    @endforeach
                </select>
            </div>
            <button type="button" class="btn btn-sm btn-outline-primary flex-shrink-0" id="gsFetchRoBtn">Fetch</button>
        </div>
    </div>
    @endif
</div>

<div class="row g-2 mb-2 gs-ro-fields-row align-items-start">
    <div class="col-12 col-sm-6 col-lg-3" id="gsCustomerWrap">
        <div class="gpo-lbl">Customer <span class="text-muted fw-normal" id="gsCustomerHint">(customer sale)</span></div>
        <select class="gpo-sel js-chosen js-chosen-compact" name="customer_ledger_id" id="gsCustomer" data-placeholder="Select customer…">
            <option value="">— Select customer —</option>
            @foreach($customers as $c)
                <option value="{{ $c->id }}" @selected((string) old('customer_ledger_id', $sale?->customer_ledger_id ?? '') === (string) $c->id)>
                    {{ \App\Support\GarageLedgerLabel::customer($c) }}
                </option>
            @endforeach
        </select>
    </div>
    <div class="col-12 col-sm-6 col-lg-3" id="gsVehicleWrap">
        <div class="gpo-lbl">Vehicle <span class="text-muted fw-normal d-none" id="gsVehicleTrackHint">(for service mileage)</span></div>
        @include('garage.partials.vehicle-select-field', ['vehicleFieldName' => 'garage_vehicle_id'])
        <div class="small text-warning mt-1 d-none" id="gsVehicleWarn">No vehicles on file for this customer.</div>
    </div>

    <div class="col-12 {{ $showRepairOrderPick ? 'col-lg-4' : 'col-lg-6' }}">
        <div class="gpo-lbl">Notes</div>
        <textarea class="gpo-inp" name="comments" id="gsSaleNotes" rows="1" placeholder="Notes for this sale…">{{ old('comments', $sale?->comments ?? '') }}</textarea>
    </div>
    <div class="col-12 col-sm-6 {{ $showRepairOrderPick ? 'col-lg-2' : 'col-lg-3' }}" id="gsSvcToggleWrap">
        <div class="gpo-lbl">&nbsp;</div>
        <label class="form-check d-inline-flex align-items-center gap-2 mt-1">
            <input class="form-check-input" type="checkbox" id="gsSvcToggle">
            <span class="form-check-label">Add services</span>
        </label>
    </div>
</div>

@php
    $hasWh = !empty($warehouseCtx['warehouses']) && count($warehouseCtx['warehouses']);
@endphp
<div class="row g-2 mb-2 gs-ro-fields-row align-items-start @if($hasWh) grg-wh-location @endif"
    @if($hasWh) data-wh-prefix="{{ $warehouseFieldPrefix ?? 'saleWh' }}" data-sections='@json($warehouseCtx['sectionsByWarehouse'] ?? [])' @endif>
    @include('garage.partials.meter-reading-fields', [
        'meterValue' => old('meter_reading', $sale?->meter_reading ?? ($prefillMeterReading ?? null)),
        'nextMeterValue' => old('next_meter_reading', $sale?->next_meter_reading ?? ($prefillNextMeterReading ?? null)),
        'nextDateValue' => old('next_service_date', $sale?->next_service_date ?? ($prefillNextServiceDate ?? null)),
        'meterId' => 'gsMeterReading',
        'nextMeterId' => 'gsNextMeterReading',
        'nextDateId' => 'gsNextServiceDate',
        'hintId' => 'gsMeterHint',
        'rowId' => 'gsMeterReadingRow',
        'colClass' => 'col-12 col-sm-6 col-lg-3',
        'hidden' => false,
    ])
    @if($hasWh)
        @include('garage.partials.warehouse-location-fields', [
            'fieldPrefix' => $warehouseFieldPrefix ?? 'saleWh',
            'warehouses' => $warehouseCtx['warehouses'],
            'sectionsByWarehouse' => $warehouseCtx['sectionsByWarehouse'],
            'defaultWarehouseId' => ($warehouseCtx['applyDefaults'] ?? false) ? $warehouseCtx['defaultWarehouseId'] : null,
            'defaultSectionId' => ($warehouseCtx['applyDefaults'] ?? false) ? $warehouseCtx['defaultSectionId'] : null,
            'applyDefaults' => $warehouseCtx['applyDefaults'] ?? false,
            'embedInRow' => true,
            'useBootstrap' => true,
            'colClass' => 'col-12 col-sm-6 col-lg-3',
            'labelClass' => 'gpo-lbl',
            'selectClass' => 'gpo-sel js-chosen js-chosen-compact',
        ])
    @endif
</div>

<div class="row g-2 mb-2 gs-ro-fields-row d-none" id="gsVehicleCardRow">
    <div class="col-12">
        <div id="gsVehicleCard" class="gs-vehicle-card" role="status" aria-live="polite">
            <div class="gs-vc-customer"><i class="bi bi-person-circle"></i><span id="gsVcCustomerName">—</span></div>
            <div><span class="gs-vc-pill">Vehicle</span><span class="gs-vc-reg" id="gsVcReg">—</span></div>
            <div class="gs-vc-meta" id="gsVcMeta"></div>
        </div>
    </div>
</div>

<div class="row g-2 mb-2 gs-ro-fields-row">
    <div class="col-12 col-md-8 col-lg-9">
        <div class="gpo-lbl mb-1">Sale discount</div>
        <div class="d-flex flex-wrap align-items-center gap-2">
            <div class="gpo-disc-toggle" id="gsHdrDiscType">
                <label class="gpo-disc-pill"><input type="radio" name="discount_type" value="fixed" @checked(old('discount_type', $sale?->discount_type ?? 'fixed') === 'fixed')><span>Fixed PKR</span></label>
                <label class="gpo-disc-pill"><input type="radio" name="discount_type" value="percentage" @checked(old('discount_type', $sale?->discount_type ?? 'fixed') === 'percentage')><span>Percent %</span></label>
            </div>
            <input type="number" step="0.01" min="0" class="gpo-inp" style="max-width:7rem;" name="discount_amount" id="gsHdrDiscVal" value="{{ old('discount_amount', $sale?->discount_amount ?? 0) }}">
        </div>
    </div>
    <div class="col-12 col-md-4 col-lg-3" id="gsFreightWrap">
        <div class="gpo-lbl">Freight</div>
        <input type="number" step="0.01" min="0" class="gpo-inp" name="freight_amount" id="gsFreight" value="{{ old('freight_amount', $sale?->freight_amount ?? 0) }}">
    </div>
</div>