<html>
    <head>
        <style type="text/css">

            @page {
                size: portrait;
                margin: 0;
                padding: 0;
                font-family: 'Helvetica';
            }
            body {
                margin: 0;
                padding: 0;
                font-family: 'Helvetica';
                line-height: 0.5em;
            }
            table {
                width: 816px;
                border: 0;
                border-collapse: collapse;
                padding: 0;
                margin: 0;
            }
            td {
                border-color: #c3c6c8;
                border-style: solid;
                border-width: 0px;
                font-size: 10px;
                vertical-align: middle;
            }
            td.ep {
                max-height: 16px;
                height: 16px;
                font-size: 14px;
                background: #c3c6c8;
                border-color: #c3c6c8;
                border-width: 1px 0px 1px 0px;
                vertical-align: bottom;
            }
            td.ep-encabezado {
                max-height: 16px;
                height: 16px;
                border-width: 1px 0px 0px 0px;
                font-size: 8px;
            }
            td.encabezado {
                vertical-align: bottom;
                height: 17px;
                max-height: 17px;
                border-width: 1px 0px 1px 0px;
                font-size: 8px;
            }
            img {
                margin-left: 30px;
            }
            .border-0 {
                border-width: 0px;
            }
            .border-linea {
                border-width: 1px 0px 0px 0px;
            }
            .color-yellow {
                background-color: #F5DF4D !important;
            }
            .monto {
                text-align: right; 
                padding-right: 5px;
                text-wrap: nowrap;
            }
            .sub-total {
                font-size: 12px; 
                font-weight: bold;
            }
            .info-s {
                font-size: 8px;
            }
            .descripcion {
                height: 12px !important;
                padding-left: 30px;
            }
            .symbol {
                font-size: 10px; 
                color:#333333;
            }
            .moneda-tag {
                color: green;
                background-color: #E6FFF1;
                border-radius: 2px;
                border:#E6FFF1 solid 1px;
                font-size: 10px;
                padding: 2px;
                font-weight: 400;
            }
            .page-break {
                page-break-after: always;
            }

        </style>
        <title>recibos</title> 
    </head>
    <body>
        @forelse ($Recibos as $rec)
            <x-recibo :Recibo="$rec"/>

            @if(!$loop->last)
                <div class="page-break"></div>
            @endif

        @empty
            <p>Vacio</p>
        @endforelse
    </body>
</html>
