{{-- 5. MÜŞTERİ --}}
<div class="rcard">
    <div class="rcard-head d-flex justify-content-between align-items-center">
        <div class="d-flex align-items-center gap-2">
            <div class="rcard-icon" style="background:#fce7f3;color:#db2777"><i class="fas fa-user"></i></div>
            <div class="rcard-title">Müşteri <span class="req">*</span></div>
        </div>
        <div class="d-flex align-items-center gap-2">
            <div class="info-tip" data-bs-toggle="tooltip" data-bs-placement="top" title="Müşteri kartını veya listedeki satırı 1 saniye basılı tutarak detay çekmecesini açabilirsiniz.">
                <i class="fas fa-lightbulb"></i> İPUCU: 1 SN BASILI TUTUN
            </div>
            <button type="button" class="btn btn-sm btn-outline-primary shadow-sm" style="border-radius:8px;font-size:11px;font-weight:700;padding:4px 10px" data-bs-toggle="modal" data-bs-target="#quickAddCustomerModal">
                <i class="fas fa-plus me-1"></i> YENİ MÜŞTERİ EKLE
            </button>
        </div>
    </div>
    <div class="rcard-body">
        <input type="hidden" name="customer_id" id="cspHidden"
            value="{{ old('customer_id', $preselectedCustomer?->id ?? '') }}">
        <div class="csp" id="csp">
            <div class="csp-trigger" id="cspTrigger" tabindex="0">
                <div class="csp-av" id="cspAv"><i class="fas fa-user"></i></div>
                <div class="csp-info">
                    <span class="csp-ph" id="cspPh">Müşteri seçin veya ara…</span>
                    <span class="csp-nm" id="cspNm"></span>
                    <span class="csp-sb" id="cspSb"></span>
                </div>
                <i class="fas fa-chevron-down csp-arr" id="cspArr"></i>
            </div>
        </div>
        @error('customer_id')<div class="err mt-1">{{ $message }}</div>@enderror
        <div class="csp-selcard" id="cspCard">
            <div class="csp-selcard-inner">
                <div class="csp-selav" id="cspCardAv">?</div>
                <div>
                    <div class="csp-selnm" id="cspCardNm"></div>
                    <div class="csp-selmt" id="cspCardMt"></div>
                </div>
                <div class="csp-selbtns">
                    <a id="cspCardLk" href="#" target="_blank" class="go-btn"><i
                            class="fas fa-arrow-up-right-from-square me-1"></i>Karta Git</a>
                    <button type="button" onclick="cspClear()" class="clr-btn"><i
                            class="fas fa-times me-1"></i>Temizle</button>
                </div>
            </div>
        </div>
    </div>
</div>