<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <style type="text/css">
    .logoEmpresaPDF{
        text-align:center;
        width:150px;
    }
    .tituloEmpresaPDF{
        text-align:center;
        width:400px;
        color: #003C8D;
    }
    .datosPDF{
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        font-size: 12px;
    }
    .thDatosPDF{
        width: 5%;
        text-align: left;
        font-size: 12px;
    }
    .thDatosDPDF{
        width: 5%;
        text-align: LEFT;
        font-size: 12px;
    }
    .header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        text-align: center;
        padding: 12px;
    }
    /* Estilos para el contenido */
    .content {
        margin-top: 60px; /* Ajusta el margen superior para dejar espacio para el encabezado */
    }
    body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
    }
    .container {
        max-width: 600px;
        margin: 20px auto;
        padding: 20px;
        border: 1px solid #ccc;
        border-radius: 12px;
    }
    h1 {
        text-align: center;
    }
    h4 {
        text-align: center;
    }
    table {
        width: 100%;
        border-collapse: collapse;
        margin-top: 20px;
    }
    th, td {
        padding: 5px;
        border-bottom: 1px solid #ddd;
        text-align: left;
        font-size: 12px;
    }
    th {
        background-color: #f2f2f2;
    }
    tr.total {
        font-weight: bold;
    }
    td:last-child {
        text-align: right;
    }
    </style>
</head>
<body>
    <table>
        <tr>
            <td class="logoEmpresaPDF"> <img src="{{ public_path('/assets/img/logos/'. $empresaImg) }}" alt="" width="100"></td>
            <td class="tituloEmpresaPDF"><h3>COMPROBANTE DE PAGO <br> {{ "NO." }} {{ $numero }}</h3></td>
        </tr>
    </table><br>
    <table class="datosPDF">
        <tr>
            <th  style="background-color: {{ $empresaColor }}; color:aliceblue; text-align: center;"><h1>¡Nueva compra!</h1></th>
        </tr>
        <tr>
            <th>
                <span class="input-group-text">Estimado Administrador {{ "(a):" }} ,<br>
                Se ha realizado una compra con el número  {{ $numero }}, podrás visualizar el detalle de la compra dentro del sistema.<br><br><br>
                Detalles del pedido:<br><br>
                <strong>Nombre del cliente:</strong> {{ $nombre }}<br>
                <strong>Número de pedido:</strong> {{ $numero }}<br>
                <strong>Fecha de compra:</strong> {{ $fechaActual }}<br><br>
                ...<br>
                <strong>Total de la compra:</strong> {{ "$" . number_format($total, 2) }}<br><br><br>
                <strong>{{ $empresaCorreo }}</strong></span>
            </th>
        </tr>
    </table>
</body>
</html>
