Tul xxx Tul

Viewing: index12.html

<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Factura Digital - SGI Red Point</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');

        body {
            font-family: 'Poppins', sans-serif;
            background-color: #f7f7f7;
        }

        h2,
        h3 {
            color: #54595F;
            padding-bottom: 10px;
        }

        p {
            color: #54595f;
            font-size: 14px;
            line-height: 1.8;
        }

        td {
            color: #54595F;
            font-size: 14px;
        }

        tr {
            border-bottom: 0.2px solid #f3f3f3;
            line-height: 2.2;

        }

        .price {
            font-size: 20;
        }

        .logo {
            max-width: 150px;
            height: auto;
        }

        .invoice-details {
            font-size: 14px;
        }

        .table-header {
            background-color: #f1f1f1;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border-bottom: 2px solid #54595F;
        }

        .header-border {
            border-bottom: 1px solid #0086FF;
            margin-bottom: 20px;
        }

        .total-row {
            font-weight: 600;
            border-top: 2px solid #54595F;
        }

        .invoice-container {
            background-color: white;
            border-radius: 16px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        .invoice-header {
            background-image: url('http://emprendo.com.co/wp-content/uploads/2024/10/Back2.png');
            background-size: cover;
            background-position: center;
            color: white;
            border-top-left-radius: 16px;
            border-top-right-radius: 16px;
            padding: 2rem;
        }

        .align-right {
            text-align: right;
        }

        .align-center {
            text-align: center;
        }

        .print-only {
            display: none;
        }

        .container {
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
            box-sizing: border-box;
        }

        @media print {
            @page {
                size: auto;
                margin: 0mm;
            }

            body {
                margin: 0;
                padding: 0;
                size: auto;
                margin: 0mm;
            }

            .container {
                page-break-after: avoid;
                width: 100%;
                max-width: none !important;
                padding: 0 !important;
                margin: 0 !important;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                page-break-after: avoid;
            }

            .invoice-container {
                height: auto !important;
                min-height: 0 !important;
                page-break-after: avoid;
                page-break-inside: avoid;
            }

            .highlight-section,
            .highlight-section2 {
                padding-bottom: 0;
                margin-bottom: 0;
            }

            .print-only {
                display: block;
            }

            .no-print {
                display: none;
            }

            @page {
                margin: 0;
                size: auto;
            }

            body * {
                visibility: hidden;
            }

            .container,
            .container * {
                visibility: visible;
            }

            .container {
                position: absolute;
                left: 0;
                top: 0;
                width: 210mm;
                height: 297mm;
                margin: 0;
                padding: 0;
                box-shadow: none;
                border-radius: 0;
            }

            .message-container,
            .no-print {
                display: none !important;
            }

            @page {
                size: letter;
                margin: 0;
            }

            .invoice-header {
                background-color: white !important;
                background-image: none;
                margin-top: -70px;
            }

            .invoice-header h1 {
                color: #d82400 !important;
                font-weight: 600;
                font-size: 42px;
            }

            .invoice-header h2 {
                color: #ff3900 !important;
                font-weight: 500;
                font-size: 28px;
                padding-bottom: 5px;
            }

            .invoice-header p {
                color: #54595f !important;
                font-size: 22px;
                font-weight: 300;
            }

            .invoice-header img {
                content: url('http://emprendo.com.co/wp-content/uploads/2023/06/Logotipo-e-mprendo-Transparente-Fondo-Blanco.png');
                width: 230px;
            }

            td {
                font-size: 11px;
                line-height: normal;
            }

            th {
                font-size: 12px !important;
            }

            .price {
                font-size: 12;
            }

            .table-row td {
                border-bottom: .3px solid #f3f3f3;
            }

            .footer-logo {
                width: 0px !important;
            }

            .highlight-section {
                margin-top: -50px;
            }

            .highlight-section2 {
                margin-top: -20px;
            }

            .highlight-section3 {
                margin-top: -20px;
                color: #d82400;
            }

            .invoice-container {
                min-height: auto;
                height: auto;
            }

            .highlight-section {
                padding-bottom: 0;
            }

            .highlight-section2 {
                margin-bottom: 0;
            }
        }

        @media (max-width: 640px) {

            .container {
                margin: -20;
            }

            /* .invoice-container {
                padding: .1rem;
            } */

            .invoice-header {
                flex-direction: column-reverse;
                align-items: center;
                text-align: center;
            }

            .invoice-header>div:first-child {
                margin-top: 1rem;
            }

            .invoice-header img {
                margin-bottom: 1rem;
            }

            .logo {
                margin-bottom: 1rem;
            }

            /* Nuevos estilos para móviles */
            .mb-8.flex.justify-between {
                flex-direction: column !important;
            }

            .mb-8.flex.justify-between>div {
                width: 100% !important;
                text-align: left !important;
                margin-bottom: 1rem !important;
            }

            .sm\:w-1\/2 {
                width: 100% !important;
            }

            .sm\:text-right {
                text-align: left !important;
            }

            /*Nuevo estilo para alinear el segundo div a la izquierda en móviles*/
            .mb-8.flex.justify-between>div:last-child {
                text-align: left;
            }

            .w-1\/2 {
                width: 100%;
            }

            table {
                font-size: 11px;
            }

            th,
            td {

                font-size: 11px;
            }

            /* .tdm {
                font-size: 11px;
            } */

            .invoice-header h1 {
                font-size: 28px;
            }

            .invoice-header h2 {
                font-size: 20px;
            }

            .phone-numbers {
                flex-direction: column;
                align-items: center;
            }

            .phone-numbers a {
                margin-bottom: 0.5rem;
            }

            .phone-numbers span {
                display: none;
            }

            .table-responsive {
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
            }

            .table-responsive table {
                width: 100%;
                min-width: 500px;
                /* Ajusta este valor según sea necesario */
            }

            .fase {
                font-weight: bold;
                background-color: #f3f4f6;
            }

            .accion {
                word-break: break-word;
            }

            .horas,
            .precioHora,
            .total {
                white-space: nowrap;
            }

            /* Estilos para vista móvil */
            @media (max-width: 640px) {
                .desktop-view {
                    display: none;
                }

                .mobile-view {
                    display: block;
                }

                .mobile-fase {
                    font-weight: bold;
                    font-size: 1.1em;
                    color: #0086FF;
                    margin: 1rem 0 0.5rem;
                    border-bottom: 2px solid #0086FF;
                    padding-bottom: 0.25rem;
                }

                .mobile-card {
                    background-color: #f3f4f6;
                    border-radius: 0.5rem;
                    padding: 0.75rem;
                    margin-bottom: 0.75rem;
                    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
                }

                .mobile-card-content {
                    display: grid;
                    grid-template-columns: auto 1fr;
                    gap: 0.25rem;
                    font-size: 0.9em;
                }

                .mobile-card-label {
                    font-weight: 600;
                    color: #4b5563;
                }

                .mobile-card-value {
                    text-align: right;
                }
            }

            /* Vista de escritorio */
            @media (min-width: 641px) {
                .mobile-view {
                    display: none;
                }

                .desktop-view {
                    display: block;
                }
            }
        }

        /* Estilos base */
        .desktop-view,
        .mobile-view {
            display: none;
        }

        /* Vista de escritorio */
        @media (min-width: 641px) {
            .desktop-view {
                display: block;
            }
        }

        /* Vista móvil */
        @media (max-width: 640px) {
            .mobile-view {
                display: block;
            }

            /* Estilos para las cards móviles */
            .mobile-fase {
                font-weight: bold;
                font-size: 1.1em;
                color: #0086FF;
                margin: 1rem 0 0.5rem;
                border-bottom: 2px solid #0086FF;
                padding-bottom: 0.25rem;
            }

            .mobile-card {
                background-color: #f3f4f6;
                border-radius: 0.5rem;
                padding: 0.75rem;
                margin-bottom: 0.75rem;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
            }

            .mobile-card-content {
                display: grid;
                grid-template-columns: auto 1fr;
                gap: 0.25rem;
                font-size: 0.9em;
            }

            .mobile-card-label {
                font-weight: 600;
                color: #4b5563;
            }

            .mobile-card-value {
                text-align: right;
            }
        }
    </style>

    <script>
        function fetchInvoiceDetails() {
            var urlParams = new URLSearchParams(window.location.search);
            var clientCode = urlParams.get('code');

            if (!clientCode) {
                document.getElementById("details").innerHTML = "<p>Cliente no encontrado</p>";
                return;
            }

            var scriptUrl = "https://script.google.com/macros/s/AKfycbyUr4RwJlZEKpO6PeD5DXdO6pos5WX_MTg2wbZr5xN2koperkXrmvzpbfEd484CHwDtyA/exec?code=" + clientCode;

            fetch(scriptUrl)
                .then(response => response.json())
                .then(data => {
                    if (data.error) {
                        document.getElementById("details").innerHTML = "<p>" + data.error + "</p>";
                    } else {
                        // Función para formatear la fecha
                        function formatearFecha(fecha) {
                            if (!fecha) return "No disponible";
                            const date = new Date(fecha + "T00:00:00Z"); // Agregar "T00:00:00Z" para tratar la fecha como UTC
                            if (isNaN(date)) return "Fecha inválida";
                            return `${date.getUTCDate()}/${date.getUTCMonth() + 1}/${date.getUTCFullYear()}`;
                        }

                        function obtenerFecha() {
                            const dias = ["Domingo", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado"];
                            const meses = ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"];
                            const fecha = new Date();
                            const diaSemana = dias[fecha.getDay()];
                            const dia = fecha.getDate();
                            const mes = meses[fecha.getMonth()];
                            const anio = fecha.getFullYear();
                            return `${diaSemana}, ${dia} de ${mes} de ${anio}`;
                        }

                        // Actualiza los datos generales
                        document.getElementById("iDProyecto").textContent = data.iDProyecto || "No disponible";
                        document.getElementById("obtenerFecha").textContent = obtenerFecha() || "No disponible";
                        document.getElementById("eMprendimiento").textContent = data.eMprendimiento || "No disponible";
                        document.getElementById("direccion").textContent = data.direccion || "No disponible";
                        document.getElementById("telefono").textContent = data.telefono || "No disponible";
                        document.getElementById("eMail").textContent = data.eMail || "No disponible";
                        document.getElementById("contacto").textContent = data.contacto || "No disponible";
                        document.getElementById("proyecto").textContent = data.proyecto || "No disponible";
                        document.getElementById("producto").textContent = data.producto || "No disponible";
                        document.getElementById("inicio").textContent = formatearFecha(data.inicio) || "No disponible";
                        document.getElementById("deadline").textContent = formatearFecha(data.deadline) || "No disponible";
                        document.getElementById("status").textContent = data.status || "No disponible";
                        document.getElementById("projectManager").textContent = data.projectManager || "No disponible";
                        document.getElementById("total").textContent = `$${parseFloat(data.total).toFixed(2) || "No disponible"}`;
                        const descuentosP = data.descuentoP ? parseFloat(data.descuentoP) * 100 : 0;
                        const porcentaje = descuentosP % 1 === 0 ? descuentosP.toFixed(0) : descuentosP.toFixed(2);
                        document.getElementById("descuentoP").textContent = `${porcentaje}`;
                        document.getElementById("descuentoM").textContent = `$${parseFloat(data.descuento).toFixed(2) || "No disponible"}`;
                        document.getElementById("totalcDescuentos").textContent = `$${parseFloat(data.totalcDescuentos).toFixed(2) || "No disponible"}`;
                        document.getElementById("abonado").textContent = `$${parseFloat(data.abonado).toFixed(2) || "No disponible"}`;
                        document.getElementById("restante").textContent = `$${parseFloat(data.restante).toFixed(2) || "No disponible"}`;

                        // Añadir la nueva función y su uso
                        function generarTextoCondicionesPago(tipodePago, inicialP, inicial) {
                            const porcentajeInicial = (inicialP * 100).toFixed(0);
                            if (tipodePago === "pago anticipado") {
                                if (inicialP === 0.3 || inicialP === 0.5) {
                                    return `Para asegurar el inicio y avance de este proyecto, se requiere un ${tipodePago} de al menos el ${porcentajeInicial}% (${inicial})`;
                                } else if (inicialP === 1) {
                                    return `Para asegurar el inicio y avance de este proyecto, se requiere un ${tipodePago} del total del proyecto`;
                                }
                            }
                            return `Para asegurar el inicio y avance de este proyecto, se requiere un ${tipodePago} de ${inicial}`;
                        }

                        const condicionesPago = generarTextoCondicionesPago(
                            data.tipodePago || 'pago inicial',
                            parseFloat(data.inicialP || '0'),
                            data.inicial ? `$ ${parseFloat(data.inicial).toFixed(0)}` : 'No disponible'
                        );

                        // Actualizar el elemento original
                        const condicionesElement = document.getElementById("condiciones");
                        if (condicionesElement) {
                            condicionesElement.textContent = condicionesPago;
                        }

                        // Actualizar el elemento condiciones-print
                        const condicionesPrint = document.getElementById('condiciones-print');
                        if (condicionesPrint) {
                            condicionesPrint.textContent = condicionesPago;
                            console.log("Elemento condiciones-print actualizado:", condicionesPago);
                        } else {
                            console.error("Elemento condiciones-print no encontrado");
                        }

                        // Construye la tabla de detalles
                        const detailsElement = document.getElementById("details");
                        if (detailsElement) {
                            const { table, mobileView } = construirTablaDetalles(data.detalles);

                            // Crear elementos separados para desktop y mobile
                            const desktopElement = document.createElement('div');
                            desktopElement.className = 'desktop-view';
                            desktopElement.innerHTML = `<div class='table-responsive'>${table}</div>`;

                            const mobileElement = document.createElement('div');
                            mobileElement.className = 'mobile-view';
                            mobileElement.innerHTML = mobileView;

                            // Limpiar el contenido existente
                            detailsElement.innerHTML = '';

                            // Añadir los nuevos elementos
                            detailsElement.appendChild(desktopElement);
                            detailsElement.appendChild(mobileElement);

                            console.log("Contenido insertado en el DOM");
                        } else {
                            console.error("Elemento 'details' no encontrado en el DOM");
                        }
                    }
                })
                .catch(error => {
                    console.error("Error:", error);
                    document.getElementById("details").innerHTML = "<p>Error al obtener los detalles de la factura</p>";
                });
        }

        function printDocument() {
            window.print();
        }

        window.onload = fetchInvoiceDetails;

        function construirTablaDetalles(detalles) {
            let table = "<table class='w-full header-border desktop-table'>";
            table += "<thead class='header-border'>" +
                "<tr class='text-center'>" +
                "<th class='p-1' style='color: #0086FF;'>Fase</th>" +
                "<th class='p-1' style='color: #0086FF;'>Acción</th>" +
                "<th class='p-1' style='color: #0086FF;'>Horas</th>" +
                "<th class='p-1' style='color: #0086FF;'>Precio Hora</th>" +
                "<th class='p-1' style='color: #0086FF;'>Total</th>" +
                "</tr>" +
                "</thead><tbody>";

            let mobileView = "<div class='mobile-cards'>";
            let currentFase = '';
            let rowspanCount = 0;

            detalles.forEach((detalle, index, array) => {
                if (detalle.fase !== currentFase) {
                    if (rowspanCount > 0) {
                        table = table.replace('{{ROWSPAN}}', rowspanCount);
                    }
                    table += `<tr>
                    <td class='fase' style='text-align:left;' rowspan='{{ROWSPAN}}'>${detalle.fase}</td>
                    <td class='accion' style='text-align:left;'>${detalle.accion}</td>
                    <td class='horas' style='text-align:center;'>${detalle.horas}</td>
                    <td class='precioHora' style='text-align:center;'>$${parseFloat(detalle.precioHora).toFixed(0)}</td>
                    <td class='total' style='text-align:center;'>$${parseFloat(detalle.total).toFixed(0)}</td>
                </tr>`;
                    currentFase = detalle.fase;
                    rowspanCount = 1;

                    mobileView += `<div class='mobile-fase'>${detalle.fase}</div>`;
                } else {
                    table += `<tr>
                    <td class='accion' style='text-align:left;'>${detalle.accion}</td>
                    <td class='horas' style='text-align:center;'>${detalle.horas}</td>
                    <td class='precioHora' style='text-align:center;'>$${parseFloat(detalle.precioHora).toFixed(0)}</td>
                    <td class='total' style='text-align:center;'>$${parseFloat(detalle.total).toFixed(0)}</td>
                </tr>`;
                    rowspanCount++;
                }

                mobileView += `
                <div class='mobile-card'>
                    <div class='mobile-card-content'>
                        <span class='mobile-card-label'>Acción:</span>
                        <span class='mobile-card-value'>${detalle.accion}</span>
                        <span class='mobile-card-label'>Horas:</span>
                        <span class='mobile-card-value'>${detalle.horas}</span>
                        <span class='mobile-card-label'>Precio Hora:</span>
                        <span class='mobile-card-value'>$${parseFloat(detalle.precioHora).toFixed(0)}</span>
                        <span class='mobile-card-label'>Total:</span>
                        <span class='mobile-card-value'>$${parseFloat(detalle.total).toFixed(0)}</span>
                    </div>
                </div>
            `;

                if (index === array.length - 1) {
                    table = table.replace('{{ROWSPAN}}', rowspanCount);
                }
            });

            table += "</tbody></table>";
            mobileView += "</div>";

            return { table, mobileView };
        }
    </script>
</head>

<body onload="fetchInvoiceDetails()" class="bg-gray-100">
    <div class="message-container text-center py-4">
        <p class="mb-4" style="padding-left: 20px; padding-right: 20px;">😊 ¡Tu documento ha sido creado! Si no es
            esencial imprimirlo 🖨️, te animamos a mantenerlo digital y reducir el impacto ambiental 🌿.</p>
        <button onclick="window.print()" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
            Imprimir Documento
        </button>
    </div>

    <div class="container mx-auto px-4 py-4">
        <div class="invoice-container max-w-4xl mx-auto">
            <div class="invoice-header mb-6 flex justify-between items-center">
                <div>
                    <h1 class="text-2xl font-bold" style="font-size: 38px; padding-bottom: 10px;">Factura</h1>
                    <h2 id="iDProyecto" class="text-sm" style="color: #f7f7f7; font-size: 28px;">Cargando</h2>
                    <p class="text-sm" style="color: #f7f7f7; font-size: 14px;" id="obtenerFecha">...</p>
                </div>
                <img src="http://emprendo.com.co/wp-content/uploads/2024/10/Logotipo-e-Transparente-Negativo.png"
                    alt="eMprendo" width="230">
            </div>
            <div class="p-8 highlight-section">
                <!-- Contenido de la factura -->
                <div class="mb-8 flex flex-col sm:flex-row justify-between">
                    <div class="w-full sm:w-1/2 mb-4">
                        <h2 id="eMprendimiento" class="text-xl font-semibold mb-2">...</h2>
                        <p id="direccion">...</p>
                        <p id="telefono">...</p>
                        <p id="eMail">...</p>
                        <p><strong>Atención a: </strong><span id="contacto">...</span></p>
                    </div>
                    <div class="w-full sm:w-1/2 sm:text-right">
                        <h2 class="text-xl font-semibold mb-2" id="proyecto">...</h2>
                        <p><strong>Producto: </strong><span id="producto">...</span></p>
                        <p><strong>Inicio: </strong><span id="inicio">...</span></p>
                        <p><strong>Deadline: </strong><span id="deadline">...</span></p>
                        <p><strong>Status: </strong><span id="status">...</span></p>
                        <p><strong>Project Manager: </strong><span id="projectManager">...</span></p>
                    </div>
                </div>

                <!-- Aquí se carga la tabla de detalles -->
                <div id="details" class="table-responsive">
                    <table class='w-full header-border'>
                        <p>Cargando detalles...</p>
                    </table>
                </div>

                <div class="mb-8 flex justify-end totales">
                    <div class="w-1/2">
                        <div class="flex justify-between mb-2" style="color: #54595F;">
                            <span style="font-weight: 600;">Subtotal:</span>
                            <span id="total">...</span>
                        </div>

                        <div class="flex justify-between mb-2" style="color: #54595F;">
                            <span style="font-weight: 600;">Descuento (<span id="descuentoP">0</span>%):</span>
                            <span id="descuentoM">...</span>
                        </div>

                        <div class="flex justify-between font-semibold text-xl price" style="color: #54595F;">
                            <span>Total:</span>
                            <span style="color: #0086FF;" id="totalcDescuentos">...</span>
                        </div>
                        <br>
                        <div class="flex justify-between font-semibold text-xl price"
                            style="line-height: 1.5; color: #54595F;">
                            <span>Abonado:</span>
                            <span class="text-green-600" id="abonado">...</span>
                        </div>
                        <div class="flex justify-between font-semibold text-xl price"
                            style="line-height: 1.5; color: #54595F;">
                            <span>Pendiente de pago:</span>
                            <span class="text-red-600" id="restante">...</span>
                        </div>
                    </div>
                </div>

                <br>

                <div class="mt-8 text-center text-sm text-gray-600 highlight-section2">
                    <div class="no-print">
                        <p class="px-5"><span id="condiciones">...</span>. Las acciones y el desarrollo del proyecto
                            pueden ajustarse
                            en función de sus requerimientos, lo que podría disminuir o aumentar el monto, siempre bajo
                            mutuo acuerdo.</p>
                        <br>
                        <p>Gracias por tu confianza en eMprendo, sigue encendiendo tus iDeas 🔥. Para
                            cualquier consulta, por favor contáctenos a través de <a
                                href="mailto:cuentame@emprendo.com.co" target="_blank"
                                class="text-blue-600 hover:underline">cuentame@emprendo.com.co</a></p>

                        <div class="flex justify-center items-center space-x-4">
                            <a href="https://emprendo.com.co/" target="_blank" rel="noopener noreferrer">
                                <img src="http://emprendo.com.co/wp-content/uploads/2024/09/Logo-eMprendo-1.png"
                                    alt="cuentame" width="150" class="footer-logo">
                            </a>
                        </div>
                        <div class="flex justify-center items-center space-x-4 phone-numbers">
                            <a href="https://api.whatsapp.com/send?phone=573028424064" target="_blank"
                                class="text-blue-600 hover:underline">+57 302 8424064</a>
                            <span class="text-blue-600 separator"> • </span>
                            <a href="https://api.whatsapp.com/send?phone=573143604300" target="_blank"
                                class="text-blue-600 hover:underline">+57 314 3604300</a>
                        </div>
                        <a href="https://emprendo.com.co" target="_blank"
                            class="text-blue-600 hover:underline">emprendo.com.co</a>
                    </div>

                    <div class="print-only">
                        <p style="line-height: 1.5;"><span id="condiciones-print"></span>. Las acciones y el
                            desarrollo del proyecto pueden ajustarse en función de sus requerimientos, lo que podría
                            disminuir o aumentar el monto, siempre bajo mutuo acuerdo.</p>
                        <p> Gracias por tu confianza en eMprendo, sigue encendiendo tus iDeas. Para cualquier consulta,
                            por favor contáctenos a través de <a href="mailto:cuentame@emprendo.com.co" target="_blank"
                                class="text-blue-600 hover:underline">cuentame@emprendo.com.co</a>, llámenos al
                            <a href="https://api.whatsapp.com/send?phone=573028424064" target="_blank"
                                class="text-blue-600 hover:underline">+57 302 8424064</a>
                            <span> • </span>
                            <a href="https://api.whatsapp.com/send?phone=573143604300" target="_blank"
                                class="text-blue-600 hover:underline">+57 314 3604300</a> o visítenos en <a
                                href="https://emprendo.com.co" target="_blank"
                                class="text-blue-600 hover:underline">emprendo.com.co</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        document.addEventListener('DOMContentLoaded', function () {
            const condicionesPrint = document.getElementById('condiciones-print');
            if (condicionesPrint && window.condicionesPagoTexto) {
                condicionesPrint.textContent = window.condicionesPagoTexto;
            }
        });

        function adjustForPrint() {
            const container = document.querySelector('.container');
            const invoiceContainer = document.querySelector('.invoice-container');

            // Ajustar el tamaño del contenedor de la factura
            invoiceContainer.style.width = '210mm';
            invoiceContainer.style.height = 'auto';
            invoiceContainer.style.padding = '10mm';
            invoiceContainer.style.boxShadow = 'none';
            invoiceContainer.style.borderRadius = '0';
            invoiceContainer.style.overflow = 'hidden';

            // Eliminar cualquier espacio en blanco adicional
            document.body.style.margin = '0';
            document.body.style.padding = '0';
            container.style.padding = '0';

            // Forzar un repintado del contenedor
            container.style.display = 'none';
            container.offsetHeight;
            container.style.display = 'block';

            // Ajustar la altura del contenedor después del repintado
            setTimeout(() => {
                invoiceContainer.style.height = invoiceContainer.scrollHeight + 'px';
            }, 0);
        }



        window.onbeforeprint = adjustForPrint;
    </script>
</body>

</html>
User / IP	: 216.73.216.217
Host / Server	: 45.84.207.204 / aircan.me
System	: Linux lt-bnk-web1726.main-hosting.eu 5.14.0-611.36.1.el9_7.x86_64 #1 SMP PREEMPT_DYNAMIC Tue Mar 3 11:23:52 EST 2026 x86_64