@extends('layouts.app')

@php
    $eyebrow = 'Reports';
    $pageTitle = 'Arrears';
@endphp

@section('content')

<div class="d-flex flex-wrap justify-content-between align-items-center mb-3 gap-2">
    <p class="text-muted mb-0">Invoices with an outstanding balance, oldest overdue first</p>
    <div class="d-flex gap-2">
        <a href="{{ route('reports.rent-roll') }}" class="btn btn-outline-secondary btn-sm">
            <i class="bi bi-receipt me-1"></i>View Rent Roll
        </a>
        <button onclick="window.print()" class="btn btn-outline-secondary btn-sm">
            <i class="bi bi-printer me-1"></i>Print
        </button>
    </div>
</div>

<div class="row g-3 mb-3">
    <div class="col-sm-6 col-lg-3">
        <div class="stat-card">
            <div>
                <div class="label">Unpaid invoices</div>
                <div class="value">{{ $invoices->count() }}</div>
            </div>
            <div class="stat-icon bg-grad-orange"><i class="bi bi-receipt"></i></div>
        </div>
    </div>
    <div class="col-sm-6 col-lg-3">
        <div class="stat-card">
            <div>
                <div class="label">Total outstanding</div>
                <div class="value">${{ number_format((float) $totalOutstanding, 0) }}</div>
            </div>
            <div class="stat-icon bg-grad-blue"><i class="bi bi-cash-coin"></i></div>
        </div>
    </div>
</div>

<div class="surface-card">
    <div class="table-responsive">
        <table class="table table-modern mb-0 align-middle">
            <thead>
                <tr>
                    <th>Invoice #</th>
                    <th>Tenant</th>
                    <th>Due Date</th>
                    <th class="text-end">Total</th>
                    <th class="text-end">Paid</th>
                    <th class="text-end">Balance</th>
                    <th>Days Overdue</th>
                    <th>Status</th>
                </tr>
            </thead>
            <tbody>
                @forelse($invoices as $invoice)
                    <tr>
                        <td class="fw-semibold">{{ $invoice->invoice_number ?? '—' }}</td>
                        <td>{{ $invoice->tenant->full_name ?? '—' }}</td>
                        <td>{{ $invoice->due_date?->format('d M Y') ?? '—' }}</td>
                        <td class="text-end">${{ number_format((float) $invoice->amount, 2) }}</td>
                        <td class="text-end">${{ number_format((float) $invoice->amount_paid, 2) }}</td>
                        <td class="text-end fw-semibold">${{ number_format((float) $invoice->balance, 2) }}</td>
                        <td>
                            @if($invoice->daysOverdue > 0)
                                <span class="badge-status st-red">{{ $invoice->daysOverdue }} days</span>
                            @else
                                <span class="text-muted small">Not yet due</span>
                            @endif
                        </td>
                        <td>
                            @php
                                $map = ['unpaid' => 'st-orange', 'partially paid' => 'st-blue', 'overdue' => 'st-red', 'sent' => 'st-gray'];
                            @endphp
                            <span class="badge-status {{ $map[$invoice->status] ?? 'st-gray' }}">{{ $invoice->status }}</span>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="8" class="text-center text-muted py-5">No outstanding balances — everyone's paid up.</td></tr>
                @endforelse
            </tbody>
            @if($invoices->count())
                <tfoot>
                    <tr class="fw-bold">
                        <td colspan="5" class="text-end">Total outstanding</td>
                        <td class="text-end">${{ number_format((float) $totalOutstanding, 2) }}</td>
                        <td colspan="2"></td>
                    </tr>
                </tfoot>
            @endif
        </table>
    </div>
</div>
@endsection