{% block body %}
    <style>
        * {
            margin: 0;
        }
        table {
            border-collapse: collapse;
        }
        #tabladetalle tbody tr td {
            padding: 2px 0 2px 0;
        }

        table  tr {
            font-size: 10px
        }

        #ticket p {
            font-size: 11px;
        }
    </style>
    <div id="ticket" style="text-align: center">
        <p style=" border-bottom:1px solid black;">{{ accion| upper }}</p>
        <table style="width:100%">
            <tr >
                <td><p>{{ mesa| upper }}</p></td>
                <td><p>PEDIDO: {{ nroPedido }}</p></td>
            </tr>
            <tr >
                <td colspan="2"></td>
            </tr>
            <tr style="text-align: center">
                <td colspan="2">ITEMS</td>
            </tr>
        </table>
        <table id="tabladetalle" style="width:100%">
            <thead style=" border-bottom:1px solid black;">
            <tr style="font-size: 11px;">
                <th>Cant</th>
                <th>Descripción</th>
                <th>Precio</th>
                <th>Importe</th>
            </tr>

            </thead>
            <tbody style=" border-bottom:1px solid black;">
            {% set total = 0 %}
            {% for f in pedidoDetalle %}
            <tr>
                <td>{{ f.cantidad }}</td>
                <td>{{ f.idproducto.nombre }} </td>
                <td> {{ f.preciounitario }}</td>
                <td> {{ f.cantidad * f.preciounitario }}.00</td>
            </tr>
                {% set total = total + (f.cantidad *  f.preciounitario) %}
            {% endfor %}
            </tbody>

            <tr>
                <td></td>
                <td></td>
                <td>Total</td>
                <td>{{ total }}.00</td>
            </tr>

            <tr>
                <td colspan="4"></td>
            </tr>
            <tr style="text-align: center">
                <td colspan="4">{{ time }}</td>
            </tr>
            <tr  style="text-align: center">
                    <p style="display:inline; font-size: 8px"> {{ pedido.idusuario.idpersona.nombres| upper }}  {{ pedido.idusuario.idpersona.apellidos | upper}}</p></td>
            </tr>
        </table>
    </div>
{% endblock %}