<style>
    .table,
    .td,
    .th {
        border: 1px solid black;
        text-align: left;
    }

    .table {
        border-collapse: collapse;
        width: 100%;
    }

    .th,
    .td {
        padding: 5px;
    }
</style>

<div style="display:block; width: 100%;">
    <table class="table">
        <thead>
            <tr>
                <th class="th" style="text-align: center">Fecha</th>
                <th class="th" style="text-align: center">Metodo</th>
                <th class="th" style="text-align: right">Monto</th>
                <th class="th" style="text-align: right">Factor</th>
                <th class="th" style="text-align: right">Conversion</th>
            </tr>
        </thead>
        <tbody>
            <?php foreach ($abonos as $row) : ?>
                <tr>
                    <td class="td" style="text-align: center"><?= $row['fab_fecha'] ?></td>
                    <td class="td" style="text-align: center"><?= $row['mp_nombre'] ?></td>
                    <td class="td" style="text-align: right"><?= $row['fab_monto'] ?></td>
                    <td class="td" style="text-align: right"><?= $row['fab_factor'] ?></td>
                    <td class="td" style="text-align: right"><?= $row['fab_conversion'] ?></td>
                </tr>
            <?php endforeach; ?>
        </tbody>
    </table>
    <br>
    <table width="100%">
        <tr>            
            <td style="text-align: right">Abonado:</td>
            <th style="width: 20% ;text-align: right"><?= $abonado ?></th>
        </tr>
        <tr>            
            <td style="text-align: right">Total:</td>
            <th style="width: 20% ;text-align: right"><?= $total ?></th>
        </tr>
        <tr>            
            <td style="text-align: right">Pendiente:</td>
            <th style="width: 20% ;text-align: right"><?= $pendiente ?></th>
        </tr>
    </table>
</div>
