@php
    $index = $index ?? 1;
    $customer = $customer ?? null;
    $billToId = $customer['bill_to_company_id'] ?? '';
@endphp
<div class="load-customer-panel {{ $index === 1 ? '' : 'd-none' }}" data-customer-panel data-customer-index="{{ $index }}">
    <div class="d-flex justify-content-end mb-2">
        <button type="button" class="btn btn-sm btn-outline-danger {{ $index === 1 ? 'd-none' : '' }}" data-remove-load-tab="customer" title="Remove Customer">
            <i class="fa-solid fa-ban me-1"></i> Remove
        </button>
    </div>
    <div class="row g-3">
        <div class="col-md-6">
            <label class="ff-label">Bill To <span class="text-danger">*</span></label>
            <div class="d-flex gap-2 align-items-start">
                <div class="dispatch-company-wrap flex-grow-1">
                    <input type="text" class="form-control ff-input dispatch-company-search" data-company-role="customer" data-company-target="bill_to_company_id" placeholder="Enter a Name, Address, or City..." autocomplete="off" value="">
                    <input type="hidden" data-field="bill_to_company_id" value="{{ $billToId }}">
                    <input type="hidden" data-field="customer_company_id" value="{{ $customer['customer_company_id'] ?? $billToId }}">
                    <div class="dispatch-company-results list-group"></div>
                </div>
                <button type="button" class="btn-company-info flex-shrink-0 mt-1" title="View / edit bill to" data-open-company-details data-company-role="customer" data-company-field="bill_to_company_id"><i class="fa-solid fa-circle-info"></i></button>
                <button type="button" class="btn-add flex-shrink-0 mt-1" data-bs-toggle="modal" data-bs-target="#addCustomerModal"><i class="fa-solid fa-plus"></i></button>
            </div>
        </div>
    </div>
</div>