<?php $statusLabels=['issued'=>'Émise','part_paid'=>'Partiellement payée','paid'=>'Payée']; ?>
<link rel="stylesheet" href="/public/assets/css/cda-family-messages-972.css?v=9.7.5">
<section class="card">
    <span class="cda-eyebrow">Portail Adhérent</span>
    <h2>Ma facturation</h2>
    <p>Retrouvez ici vos factures officielles, consultables et téléchargeables en PDF.</p>
</section>
<section class="card">
<?php if(!$invoices):?>
    <p>Aucune facture disponible.</p>
<?php else:?>
    <div class="message-list">
    <?php foreach($invoices as $invoice):
        $paid=(float)($invoice['paid_amount']??0);
        $total=(float)($invoice['total_amount']??0);
        $balance=max(0,$total-$paid);
    ?>
        <article class="family-invoice-row">
            <div>
                <strong><?= htmlspecialchars((string)$invoice['document_number']) ?></strong>
                <span><?= htmlspecialchars($statusLabels[(string)$invoice['status']]??(string)$invoice['status']) ?></span>
                <small>Émise le <?= !empty($invoice['issue_date']) ? date('d/m/Y',strtotime((string)$invoice['issue_date'])) : '—' ?></small>
            </div>
            <div class="family-invoice-amounts">
                <span>Total <strong><?= number_format($total,2,',',' ') ?> €</strong></span>
                <span>Réglé <strong><?= number_format($paid,2,',',' ') ?> €</strong></span>
                <span>Reste <strong><?= number_format($balance,2,',',' ') ?> €</strong></span>
            </div>
            <a class="button button-primary" target="_blank" rel="noopener"
               href="/public/mon-espace/factures/pdf?facture=<?=htmlspecialchars((string)$invoice['public_token'])?>">
                Télécharger / imprimer le PDF
            </a>
        </article>
    <?php endforeach?>
    </div>
<?php endif?>
</section>
<a class="button button-secondary" href="/public/clients?onglet=facturation">← Retour à mon dossier familial</a>
<style>
.family-invoice-row{display:grid!important;grid-template-columns:minmax(220px,1fr) minmax(280px,auto) auto;align-items:center;gap:18px}
.family-invoice-row>div:first-child{display:flex;flex-direction:column;gap:4px}.family-invoice-row small{color:#64748b}
.family-invoice-amounts{display:flex;gap:18px;flex-wrap:wrap}.family-invoice-amounts span{display:flex;flex-direction:column;color:#64748b}.family-invoice-amounts strong{color:#172033}
@media(max-width:850px){.family-invoice-row{grid-template-columns:1fr}.family-invoice-row .button{width:100%;text-align:center}}
</style>
