{# templates/commercial/portefeuille/tabs/_finance.html.twig #}
<div class="card border-0 shadow-sm">
    <div class="card-body">
        <div class="row text-center mb-4">
            <div class="col-md-6 border-end">
                <h6 class="text-muted small uppercase">Total Versé</h6>
                <span class="h4 text-success">{{ totalPaye|number_format(0,',',' ') }} FCFA</span>
            </div>
            <div class="col-md-6">
                <h6 class="text-muted small uppercase">Reste à payer</h6>
                <span class="h4 text-danger">{{ resteAPayer|number_format(0,',',' ') }} FCFA</span>
            </div>
        </div>

        <table class="table table-sm">
            <thead>
                <tr>
                    <th>Date</th>
                    <th>Montant</th>
                    <th>Statut</th>
                </tr>
            </thead>
            <tbody>
                {% for p in souscription.paiements %}
                    <tr>
                        <td>{{ p.datePaiement|date('d/m/Y') }}</td>
                        <td>{{ p.montant|number_format(0,',',' ') }}</td>
                        <td><span class="badge {{ p.estValide ? 'bg-success' : 'bg-warning' }}">
                            {{ p.estValide ? 'Confirmé' : 'En attente' }}
                        </span></td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>