@extends('layouts.app')
@section('title', 'Accounts Receivable')

@include('inventory.accounting.partials.styles')

@section('content')
<div class="acc-header"><div><h1>Accounts Receivable Aging</h1><p>Unpaid orders by how long they've been open.</p></div></div>

@include('inventory.accounting.partials.sub-nav')

<div class="acc-kpi-grid">
    @foreach($ar['buckets'] as $key => $bucket)
        <div class="acc-kpi"><div class="lbl">{{ $bucket['label'] }}</div><div class="val">{{ number_format($bucket['total'], 2) }}</div><div class="sub">{{ count($bucket['orders']) }} orders</div></div>
    @endforeach
</div>

<div class="acc-card">
    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;">
        <h2 style="margin:0;">Open Orders</h2>
        <strong>Total: {{ number_format($ar['total'], 2) }}</strong>
    </div>
    <table class="acc-table">
        <thead><tr><th>Order</th><th>Customer</th><th class="num">Amount</th><th class="num">Days Open</th><th>Bucket</th></tr></thead>
        <tbody>
            @foreach($ar['buckets'] as $key => $bucket)
                @foreach($bucket['orders'] as $order)
                    <tr>
                        <td><strong>{{ $order['order_number'] }}</strong></td>
                        <td>{{ $order['customer_name'] }}</td>
                        <td class="num">{{ number_format($order['total'], 2) }}</td>
                        <td class="num">{{ $order['age_days'] }}</td>
                        <td>
                            @php $cls = $order['age_days'] > 60 ? 'danger' : ($order['age_days'] > 30 ? 'warning' : 'info'); @endphp
                            <span class="acc-badge acc-badge-{{ $cls }}">{{ $bucket['label'] }}</span>
                        </td>
                    </tr>
                @endforeach
            @endforeach
            @if($ar['total'] == 0)
                <tr><td colspan="5" class="acc-empty"><i class="fas fa-check-circle"></i><div>All caught up — no open receivables.</div></td></tr>
            @endif
        </tbody>
    </table>
</div>
@endsection