
{{-- Ini adalah Tampilan "Bayar Sekarang" --}}
<div class="invoice-detail-card">
    
    {{-- 1. HEADER --}}
    <div class="invoice-detail-header">
        <p>Total Pembayaran</p>
        <h2>Rp {{ number_format($invoice->total_amount, 0, ',', '.') }}</h2>
        <span class="status-badge {{ $invoice->status }}">{{ ucfirst($invoice->status) }}</span>
    </div>

    {{-- 2. RINCIAN --}}
    <div class="invoice-detail-body">
        <div class="detail-item">
            <span>Nomor Tagihan</span>
            <strong>{{ $invoice->invoice_number }}</strong>
        </div>
        <div class="detail-item">
            <span>Jatuh Tempo</span>
            <strong>{{ $invoice->due_date->translatedFormat('d F Y') }}</strong>
        </div>
        <div class="detail-item">
            <span>Nama Pelanggan</span>
            <strong>{{ $invoice->user->name }}</strong>
        </div>
    </div>

</div> {{-- Akhir .invoice-detail-card --}}

{{-- 3. TOMBOL AKSI --}}
<button id="pay-button" class="pay-now-btn" style="width:100%; margin-top:20px;">Bayar Sekarang</button>