<?php ob_start(); ?>
<div class="container-fluid py-4">
    <div class="row mb-4">
        <div class="col-xl-4 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-capitalize font-weight-bold">Total Charges</p>
                                <h5 class="font-weight-bolder mb-0">
                                    <?= $stats['total'] ?? 0 ?>
                                </h5>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-capitalize font-weight-bold">Pending</p>
                                <h5 class="font-weight-bolder mb-0 text-warning">
                                    <?= formatCurrency((float)($stats['pending'] ?? 0)) ?>
                                </h5>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-capitalize font-weight-bold">Paid</p>
                                <h5 class="font-weight-bolder mb-0 text-success">
                                    <?= formatCurrency((float)($stats['paid'] ?? 0)) ?>
                                </h5>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Billing Table -->
    <div class="card">
        <div class="card-header pb-0">
            <h6>Subscription Charges & Fees</h6>
        </div>
        <div class="card-body px-0 pt-0 pb-2">
            <div class="table-responsive p-0">
                <table class="table align-items-center mb-0">
                    <thead>
                        <tr>
                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Reference</th>
                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Project</th>
                            <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Contractor</th>
                            <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">PO Amount</th>
                            <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Charge (0.5%)</th>
                            <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Due Date</th>
                            <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Status</th>
                            <th class="text-secondary opacity-7"></th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php if(!empty($charges)): ?>
                            <?php foreach($charges as $charge): ?>
                            <tr>
                                <td>
                                    <div class="d-flex px-3 py-1">
                                        <h6 class="mb-0 text-sm"><?= htmlspecialchars($charge['reference_number']) ?></h6>
                                    </div>
                                </td>
                                <td>
                                    <p class="text-xs font-weight-bold mb-0"><?= htmlspecialchars($charge['project_name'] ?? 'N/A') ?></p>
                                </td>
                                <td class="align-middle text-center text-sm">
                                    <span class="text-xs font-weight-bold"><?= htmlspecialchars($charge['contractor_name'] ?? 'N/A') ?></span>
                                </td>
                                <td class="align-middle text-center text-sm">
                                    <span class="text-xs font-weight-bold"><?= formatCurrency((float)$charge['po_amount'], $charge['currency'] ?? DEFAULT_CURRENCY) ?></span>
                                </td>
                                <td class="align-middle text-center text-sm">
                                    <span class="text-xs font-weight-bold"><?= formatCurrency((float)$charge['charge_amount'], $charge['currency'] ?? DEFAULT_CURRENCY) ?></span>
                                </td>
                                <td class="align-middle text-center">
                                    <span class="text-secondary text-xs font-weight-bold"><?= htmlspecialchars($charge['due_date'] ?? '-') ?></span>
                                </td>
                                <td class="align-middle text-center text-sm">
                                    <span class="badge badge-sm bg-gradient-<?= $charge['status'] == 'paid' ? 'success' : 'warning' ?>"><?= ucfirst($charge['status']) ?></span>
                                </td>
                                <td class="align-middle">
                                    <?php if ($charge['status'] === 'pending'): ?>
                                    <form action="<?= APP_URL ?>/finance/billing/<?= $charge['id'] ?>/pay" method="POST" class="d-flex gap-1 align-items-center" onsubmit="return confirm('Record this payment?');">
                                        <input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION[CSRF_TOKEN_NAME] ?? '') ?>">
                                        <input type="hidden" name="amount" value="<?= htmlspecialchars($charge['charge_amount']) ?>">
                                        <button type="submit" class="btn btn-sm btn-success">Record Payment</button>
                                    </form>
                                    <?php else: ?>
                                        &mdash;
                                    <?php endif; ?>
                                </td>
                            </tr>
                            <?php endforeach; ?>
                        <?php else: ?>
                            <tr>
                                <td colspan="8" class="text-center py-4">No billing charges found.</td>
                            </tr>
                        <?php endif; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<?php
$content = ob_get_clean();
require ROOT_PATH . '/modules/shared/views/layouts/main.php';
?>

