@php
    $kat = \App\Support\RiwayatPembeli::KATEGORI;
    $f = $filterRiwayat;
    $bulanList = collect(range(1, 12))->mapWithKeys(fn ($b) => [$b => \Illuminate\Support\Carbon::create(null, $b)->translatedFormat('F')]);
    $param = array_filter(['tahun' => $f['tahun'], 'bulan' => $f['bulan'], 'kategori' => $f['kategori']]);
@endphp
<div class="card mt-3" id="riwayat-transaksi">
    <div class="card-header bg-white d-flex flex-wrap justify-content-between align-items-center gap-2">
        <span class="fw-semibold"><i class="bi bi-clock-history"></i> Riwayat Transaksi</span>
        <a href="{{ route('pembeli.riwayat.cetak', [$pembeli] + $param) }}" target="_blank" class="btn btn-sm btn-outline-danger"><i class="bi bi-file-earmark-pdf"></i> Cetak PDF</a>
    </div>
    <div class="card-body border-bottom">
        <form method="GET" action="{{ route('pembeli.show', $pembeli) }}#riwayat-transaksi" class="row g-2 align-items-end">
            <div class="col-6 col-md-3">
                <label class="form-label small mb-1">Bulan</label>
                <select name="bulan" class="form-select form-select-sm">
                    <option value="">Semua bulan</option>
                    @foreach($bulanList as $no => $nama)
                        <option value="{{ $no }}" @selected($f['bulan'] === $no)>{{ $nama }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-6 col-md-3">
                <label class="form-label small mb-1">Tahun</label>
                <select name="tahun" class="form-select form-select-sm">
                    <option value="">Semua tahun</option>
                    @foreach($tahunTersedia as $t)
                        <option value="{{ $t }}" @selected($f['tahun'] === $t)>{{ $t }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-3">
                <label class="form-label small mb-1">Jenis</label>
                <select name="kategori" class="form-select form-select-sm">
                    <option value="">Semua jenis</option>
                    @foreach($kat as $k => [$label])
                        <option value="{{ $k }}" @selected($f['kategori'] === $k)>{{ $label }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-3 d-flex gap-1">
                <button class="btn btn-sm btn-primary flex-fill"><i class="bi bi-funnel"></i> Tampilkan</button>
                @if($param)
                    <a href="{{ route('pembeli.show', $pembeli) }}#riwayat-transaksi" class="btn btn-sm btn-outline-secondary" title="Reset filter"><i class="bi bi-x-lg"></i></a>
                @endif
            </div>
        </form>
    </div>

    @php $r = $ringkasanRiwayat; @endphp
    <div class="card-body py-2 border-bottom small">
        <div class="text-muted mb-1">Periode: <strong>{{ $f['periode'] }}</strong> · {{ $r['transaksi'] }} dari {{ $f['total'] }} transaksi</div>
        <div class="row g-2 text-center">
            <div class="col-6 col-md-3"><div class="border rounded py-1"><div class="text-muted">Pembayaran Rumah</div><div class="fw-bold text-success">{{ rupiah($r['pembayaran']) }}</div>
                @if($r['pembayaran_deposit'] > 0)<div class="text-muted" style="font-size: .75rem">{{ rupiah($r['pembayaran_deposit']) }} dari deposit</div>@endif</div></div>
            <div class="col-6 col-md-3"><div class="border rounded py-1"><div class="text-muted">Denda &amp; Biaya</div><div class="fw-bold text-danger">{{ rupiah($r['denda'] + $r['biaya']) }}</div></div></div>
            <div class="col-6 col-md-3"><div class="border rounded py-1"><div class="text-muted">Deposit Setor / Ambil</div><div class="fw-bold">{{ rupiah($r['deposit_setor']) }} <span class="text-muted">/</span> {{ rupiah($r['deposit_ambil']) }}</div></div></div>
            <div class="col-6 col-md-3"><div class="border rounded py-1 border-primary"><div class="text-muted">Total Dibayarkan</div><div class="fw-bold text-primary">{{ rupiah($r['total_bayar']) }}</div></div></div>
        </div>
    </div>

    <div class="table-responsive">
        <table class="table table-sm table-hover mb-0 align-middle small">
            <thead class="table-light">
                <tr><th>Tanggal</th><th>No. Bukti</th><th>Jenis</th><th>Unit / Keterangan</th><th>Cara</th><th class="text-end">Jumlah</th></tr>
            </thead>
            <tbody>
            @forelse($riwayat as $row)
                <tr>
                    <td class="text-nowrap">{{ tgl($row->tanggal) }}</td>
                    <td class="text-nowrap">
                        @if($row->pdf)<a href="{{ $row->pdf }}" target="_blank" title="Lihat bukti PDF"><i class="bi bi-file-earmark-pdf text-danger"></i> {{ $row->nomor }}</a>@else{{ $row->nomor }}@endif
                        @if($row->kode_format)<div class="text-muted font-monospace" style="font-size: .7rem">{{ $row->kode_format }}</div>@endif
                    </td>
                    <td><span class="badge text-bg-{{ $kat[$row->kategori][1] }}">{{ $row->jenis }}</span></td>
                    <td>
                        @if($row->penjualan)<a href="{{ route('penjualan.show', $row->penjualan) }}">{{ $row->uraian }}</a>@else{{ $row->uraian }}@endif
                        @if($row->keterangan)<div class="text-muted">{{ $row->keterangan }}</div>@endif
                    </td>
                    <td class="text-nowrap">{{ $row->cara ? ucfirst($row->cara) : '-' }}</td>
                    <td class="text-end text-nowrap">
                        @switch($row->arah)
                            @case('masuk')<span class="text-success fw-semibold">{{ rupiah($row->jumlah) }}</span>@break
                            @case('keluar')<span class="text-danger fw-semibold" title="Diterima pembeli">− {{ rupiah($row->jumlah) }}</span>@break
                            @default<span class="text-muted" title="{{ $row->arah === 'potong' ? 'Dipotong dari saldo deposit' : 'Nilai transaksi (bukan arus kas)' }}">{{ rupiah($row->jumlah) }}</span>
                        @endswitch
                    </td>
                </tr>
            @empty
                <tr><td colspan="6" class="text-center text-muted py-4">{{ $f['total'] ? 'Tidak ada transaksi pada periode / jenis yang dipilih.' : 'Belum ada transaksi.' }}</td></tr>
            @endforelse
            </tbody>
        </table>
    </div>
    <div class="card-footer bg-white small text-muted">
        <span class="text-success">Hijau</span> = dibayarkan pembeli · <span class="text-danger">merah</span> = diterima pembeli (pengambilan deposit) · abu-abu = nilai transaksi / potongan deposit (tidak dihitung ke total).
    </div>
</div>