{{--
    Müşteri kartı → Satışlar sekmesi.
    Her satır: durum rayı + ürün + tarih + ödeme ilerlemesi + tutar.
    Beklenen: $customer
--}}
@php
    $sales = $customer->sales->sortByDesc(fn($s) => $s->start_date ?? $s->created_at);
    $totalAmt = (float) $sales->sum('total_amount');
    $paidAmt  = (float) $sales->sum('paid_amount');
    $dueAmt   = max(0, $totalAmt - $paidAmt);
    $openCnt  = $sales->whereNotIn('status', ['completed', 'cancelled', 'refunded'])->count();
@endphp

<div class="csx-wrap">

    {{-- ══ ÖZET ══ --}}
    <div class="csx-summary">
        <div class="csx-sum-item">
            <span class="csx-sum-l">Toplam Satış</span>
            <span class="csx-sum-v">{{ number_format($totalAmt, 0, ',', '.') }} ₺</span>
            <span class="csx-sum-s">{{ $sales->count() }} kayıt</span>
        </div>
        <div class="csx-sum-item">
            <span class="csx-sum-l">Tahsil Edilen</span>
            <span class="csx-sum-v pos">{{ number_format($paidAmt, 0, ',', '.') }} ₺</span>
            <span class="csx-sum-s">%{{ $totalAmt > 0 ? round($paidAmt / $totalAmt * 100) : 0 }} tamamlandı</span>
        </div>
        <div class="csx-sum-item">
            <span class="csx-sum-l">Bakiye</span>
            <span class="csx-sum-v {{ $dueAmt > 0 ? 'neg' : 'pos' }}">{{ number_format($dueAmt, 0, ',', '.') }} ₺</span>
            <span class="csx-sum-s">{{ $openCnt }} açık satış</span>
        </div>
        <div class="csx-sum-bar">
            <div class="csx-sum-fill" style="width:{{ $totalAmt > 0 ? min(100, round($paidAmt / $totalAmt * 100)) : 0 }}%"></div>
        </div>
    </div>

    {{-- ══ FİLTRE ══ --}}
    @if($sales->count() > 3)
        <div class="csx-filters" id="csxFilters">
            <button type="button" class="csx-f active" data-f="all" onclick="csxFilter(this,'all')">Tümü <b>{{ $sales->count() }}</b></button>
            <button type="button" class="csx-f" data-f="open" onclick="csxFilter(this,'open')">Açık <b>{{ $openCnt }}</b></button>
            <button type="button" class="csx-f" data-f="due" onclick="csxFilter(this,'due')">Bakiyeli <b>{{ $sales->filter(fn($s) => $s->remaining_amount > 0)->count() }}</b></button>
            <button type="button" class="csx-f" data-f="done" onclick="csxFilter(this,'done')">Kapanan <b>{{ $sales->where('status', 'completed')->count() }}</b></button>
        </div>
    @endif

    {{-- ══ SATIŞ LİSTESİ ══ --}}
    <div class="csx-list">
        @forelse($sales as $s)
            @php
                $pct = (float) $s->total_amount > 0 ? min(100, round((float) $s->paid_amount / (float) $s->total_amount * 100)) : 0;
                $due = (float) $s->remaining_amount;
                $isOpen = !in_array($s->status, ['completed', 'cancelled', 'refunded'], true);
                $tags = ['all'];
                if ($isOpen) $tags[] = 'open';
                if ($due > 0) $tags[] = 'due';
                if ($s->status === 'completed') $tags[] = 'done';
                $start = $s->start_date ? \Carbon\Carbon::parse($s->start_date) : null;
                $days = $start ? (int) \Carbon\Carbon::today()->diffInDays($start, false) : null;
            @endphp

            <article class="csx-row" data-csx="{{ implode(' ', $tags) }}"
                     onclick="openSaleDrawer({{ $s->id }})" title="Satış kartını aç">
                <span class="csx-rail" style="background:{{ $s->status_color }}"></span>

                <div class="csx-date">
                    @if($start)
                        <b>{{ $start->format('d') }}</b>
                        <span>{{ $start->translatedFormat('M') }}</span>
                        <small>{{ $start->format('Y') }}</small>
                    @else
                        <b>—</b><span>tarih</span>
                    @endif
                </div>

                <div class="csx-main">
                    <div class="csx-title">{{ $s->product_title ?: 'Satış' }}</div>
                    <div class="csx-meta">
                        <span class="csx-code">#{{ $s->sale_code ?: $s->id }}</span>
                        @if($s->total_participants)<span><i class="fas fa-users"></i>{{ $s->total_participants }} kişi</span>@endif
                        @if($days !== null && $isOpen)
                            @if($days > 0)<span class="csx-soon"><i class="fas fa-hourglass-half"></i>{{ $days }} gün kaldı</span>
                            @elseif($days === 0)<span class="csx-soon now"><i class="fas fa-bolt"></i>Bugün</span>@endif
                        @endif
                    </div>
                </div>

                <div class="csx-pay">
                    <div class="csx-pay-top">
                        <span class="csx-badge" style="background:{{ $s->status_color }}1a;color:{{ $s->status_color }}">{{ $s->status_label }}</span>
                        @if($due > 0)
                            <span class="csx-due">Kalan {{ number_format($due, 0, ',', '.') }} ₺</span>
                        @else
                            <span class="csx-paid"><i class="fas fa-circle-check"></i> Tahsil edildi</span>
                        @endif
                    </div>
                    <div class="csx-prog"><div class="csx-prog-fill" style="width:{{ $pct }}%"></div></div>
                </div>

                <div class="csx-amount">
                    <b>{{ number_format((float) $s->total_amount, 2, ',', '.') }}</b>
                    <span>{{ $s->currency }}</span>
                </div>

                <i class="fas fa-chevron-right csx-go"></i>
            </article>
        @empty
            <div class="csx-empty">
                <i class="fas fa-cart-shopping"></i>
                <b>Bu müşterinin satışı yok</b>
                <span>Yeni bir satış oluşturduğunuzda burada listelenir.</span>
            </div>
        @endforelse
    </div>
</div>