/* Variables CSS de Zamglobos para una gestión de colores más sencilla */
:root {
    --primary-color: #4A00B7; /* Morado oscuro/Azul de ZAM */
    --secondary-color: #FF7B00; /* Naranja brillante de GLOBOS y globos */
    --accent-color: #FFD700; /* Dorado/Amarillo para acentos y textos resaltados */
    --whatsapp-color: #25D366; /* Verde de WhatsApp */
    --text-dark: #333;
    --text-light: #f8f9fa;
    --bg-light: #ffffff;
    --bg-dark: #f0f2f5; /* Un gris claro para secciones */
    --red-promo: #DC143C; /* Rojo cereza para la promoción */

    /* Colores para el simulador de WhatsApp (no directamente usados aquí, pero para coherencia) */
    --whatsapp-bg-light: #E5DDD5; 
    --whatsapp-bubble-received: #FFFFFF;
    --whatsapp-bubble-sent: #DCF8C6;
    --whatsapp-text-dark: #222222;
    --whatsapp-text-light: #777777;
}

/* Reset básico para limpiar estilos por defecto del navegador */
body, h1, h2, h3, p, ul, li, form, input, textarea, button, table, th, td {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* Incluye padding y border en el ancho/alto total */
}

/* Estilos globales del cuerpo de la página */
body {
    font-family: 'Montserrat', sans-serif; 
    background-color: var(--bg-dark); 
    color: var(--text-dark); 
    display: flex; 
    justify-content: center; 
    padding: 20px;
    min-height: 100vh; 
    overflow: auto; 
}

body.modal-open {
    overflow: hidden; 
}

/* Contenedor principal de la cotización */
.cotizacion-container {
    background-color: var(--bg-light); 
    padding: 30px;
    border-radius: 8px; 
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); 
    width: 100%;
    max-width: 900px; 
    margin: auto; 
    visibility: hidden; 
    opacity: 0;
    transition: opacity 0.5s ease;
}

.cotizacion-container.loaded {
    visibility: visible;
    opacity: 1;
}

/* CABECERA DE LA COTIZACIÓN */
.cotizacion-header {
    display: flex;
    justify-content: space-between; 
    align-items: flex-start; 
    margin-bottom: 30px;
    flex-wrap: wrap; 
    gap: 15px; 
}

/* Sección del logo (para el navegador) */
.header-logo-section {
    flex-shrink: 0; 
    width: 150px; 
    height: 80px; 
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px; /* Mantener bordes si aplica */
    overflow: hidden; 
}

.header-logo-section img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; 
    display: block; 
}

/* Título principal de la cotización */
.cotizacion-title {
    flex-grow: 1; 
    text-align: center;
    font-size: 2.5em; 
    font-family: 'Pacifico', cursive; 
    color: var(--primary-color); 
    margin: 0 20px; 
    align-self: center; 
    min-width: 200px; 
}

/* Sección de la fecha */
.header-date-section {
    flex-shrink: 0;
    width: 180px; 
    text-align: right;
    display: flex; 
    align-items: center;
    justify-content: flex-end; 
}

.header-date-section label {
    font-weight: bold;
    margin-right: 10px;
}
.header-date-section input[type="date"] {
    border: 1px solid var(--primary-color); 
    padding: 8px;
    border-radius: 4px;
    font-size: 0.9em;
}

/* NUEVOS ESTILOS: Sección de datos de la empresa para factura fiscal (en el navegador) */
.empresa-fiscal-section {
    display: flex; 
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 25px;
    border: 1px solid var(--bg-dark);
    padding: 15px;
    border-radius: 6px;
    background-color: var(--bg-dark);
}

/* Sección de datos del cliente e información adicional (navegador) */
.cliente-data, .cotizacion-info-extra {
    display: flex;
    flex-wrap: wrap; 
    gap: 15px; 
    margin-bottom: 25px;
    border: 1px solid var(--bg-dark); 
    padding: 15px;
    border-radius: 6px;
    background-color: var(--bg-dark); 
}
/* NUEVO: Ocultar sección de cliente completamente si tiene la clase hide-for-fiscal */
.cliente-data.hide-for-fiscal {
    display: none; 
    visibility: hidden;
}

/* *** ESTILOS: Sección de Datos Bancarios (solo para cotización normal, en navegador) *** */
/* Esta sección NO será inyectada en el DOM, solo se crea en memoria para el PDF */

/* Input Group Base Styles */
.input-group {
    flex: 1 1 calc(50% - 7.5px); 
    display: flex;
    flex-direction: column;
}

.input-group.full-width {
    flex: 1 1 100%; 
}

.input-group label {
    font-weight: bold;
    margin-bottom: 5px;
    color: var(--primary-color); 
    font-size: 0.9em;
}

.input-group input[type="text"],
.input-group input[type="tel"],
.input-group input[type="number"],
.input-group input[type="email"], 
.input-group textarea {
    padding: 10px 12px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 1em;
    width: 100%; 
    transition: border-color 0.2s, box-shadow 0.2s; 
}

.input-group input:focus,
.input-group textarea:focus {
    border-color: var(--secondary-color); 
    outline: none;
    box-shadow: 0 0 5px rgba(255, 123, 0, 0.3); 
}

textarea {
    resize: vertical; 
    min-height: 50px;
    max-height: 150px;
}
/* Sección de Ítemes de la Cotización (tabla, navegador) */
.cotizacion-items {
    margin-bottom: 25px;
}

table {
    width: 100%;
    border-collapse: collapse; 
    margin-bottom: 15px;
    background-color: #fff;
}

table th, table td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: left;
    vertical-align: middle;
}

table thead th {
    background-color: var(--primary-color); 
    font-weight: bold;
    color: var(--text-light); 
}

table tbody tr:nth-child(even) { 
    background-color: var(--bg-dark); 
}

table td input {
    width: 100%;
    border: none;
    padding: 5px 0;
    font-size: 0.95em;
    background-color: transparent; 
    text-align: inherit; 
}

table td input:focus {
    background-color: #ffe0b2; 
    outline: none;
}

/* Ancho específico y alineación para columnas de la tabla */
table th:nth-child(1), table td:nth-child(1) { /* CANTIDAD */
    width: 10%;
    text-align: center;
}
table th:nth-child(2), table td:nth-child(2) { /* CONCEPTO - REFERENCIA */
    width: 55%;
}
table th:nth-child(3), table td:nth-child(3) { /* UNIDAD */
    width: 15%;
    text-align: right;
}
table th:nth-child(4), table td:nth-child(4) { /* TOTAL por línea */
    width: 15%;
    text-align: right;
    background-color: var(--bg-dark); 
    color: var(--red-promo); 
    font-weight: bold; 
}
table th:last-child, table td:last-child { /* Para el botón de eliminar línea */
    width: 5%;
    text-align: center;
}

.delete-row-btn {
    background: none;
    border: none;
    color: var(--red-promo); 
    font-size: 1.2em;
    cursor: pointer;
    opacity: 0.7; 
    transition: opacity 0.2s;
    line-height: 1;
}
.delete-row-btn:hover {
    opacity: 1;
}

/* Botón Añadir Línea */
#addRowBtn {
    background-color: var(--whatsapp-color); 
    color: white;
    padding: 10px 15px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.2s;
    display: inline-block; 
    margin-top: 10px; 
}

#addRowBtn:hover {
    background-color: #218838;
}

/* Sección de Totales (navegador) */
.cotizacion-totales {
    display: flex;
    flex-direction: column; 
    align-items: flex-end; 
    margin-bottom: 30px;
    border-top: 1px solid #ddd;
    padding-top: 15px;
}

.total-line {
    display: flex; /* Asegura que siempre sea flex por defecto */
    justify-content: space-between; 
    width: 100%;
    max-width: 300px; 
    margin-bottom: 10px;
    font-size: 1.1em;
}

.total-line span {
    font-weight: bold;
    color: var(--primary-color); 
    flex-shrink: 0;
    margin-right: 10px;
}

.total-line input {
    border: none;
    background-color: transparent;
    text-align: right;
    font-weight: bold;
    width: 120px;
    flex-grow: 1;
}

.total-line input#ivaPorcentaje {
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 5px;
    width: 60px;
}
/* Estilos para el campo de IVA deshabilitado (factura fiscal) */
.total-line input#ivaPorcentaje:disabled {
    background-color: #f0f0f0; 
    cursor: not-allowed;
    border-color: #ddd;
}


.total-line.total-final {
    font-size: 1.3em;
    color: var(--secondary-color); 
    border-top: 2px solid var(--secondary-color); 
    padding-top: 10px;
    margin-top: 10px;
}

/* Botón de Descarga (navegador) */
.download-button {
    display: block;
    width: 100%;
    padding: 15px 20px;
    background-color: var(--primary-color); 
    color: white;
    font-size: 1.2em;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-top: 30px;
}

.download-button:hover {
    background-color: #380092; 
}

/* NUEVOS ESTILOS: Modal de selección de tipo de cotización */
.modal {
    display: flex; 
    position: fixed; 
    z-index: 1000; 
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto; 
    background-color: rgba(0,0,0,0.8); 
    justify-content: center; 
    align-items: center; 
    opacity: 0; 
    visibility: hidden; 
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.modal.show {
    opacity: 1;
    visibility: visible;
}

.modal-content {
    background-color: var(--bg-light);
    margin: auto; 
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    max-width: 500px;
    text-align: center;
    position: relative;
    transform: translateY(-50px); 
    transition: transform 0.3s ease;
}

.modal.show .modal-content {
    transform: translateY(0);
}

.modal-content h2 {
    font-family: 'Pacifico', cursive;
    color: var(--primary-color);
    margin-bottom: 20px;
    font-size: 2em;
}

.modal-content p {
    font-size: 1.1em;
    margin-bottom: 30px;
}

.modal-buttons button {
    background-color: var(--primary-color);
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1.1em;
    margin: 10px;
    transition: background-color 0.2s, transform 0.2s;
}

.modal-buttons button:hover {
    background-color: #380092;
    transform: translateY(-2px);
}

.modal-buttons button.fiscal-option {
    background-color: var(--secondary-color); 
}

.modal-buttons button.fiscal-option:hover {
    background-color: #d16600;
}


/* Media Queries para Responsividad (PARA LA PANTALLA, NO EL PDF) */
@media (max-width: 768px) {
    .cotizacion-header { flex-direction: column; align-items: center; }
    .header-logo-section, .header-date-section { width: 100%; text-align: center; margin-bottom: 15px; }
    .cotizacion-title { margin: 15px 0; font-size: 2em; }
    .cliente-data, .cotizacion-info-extra, .empresa-fiscal-section { flex-direction: column; } 
    .input-group { flex: 1 1 100%; }
    .cotizacion-totales { align-items: center; }
    .total-line { max-width: 90%; }
    table th:nth-child(1), table td:nth-child(1) { width: 15%; }
    table th:nth-child(2), table td:nth-child(2) { width: 45%; }
    table th:nth-child(3), table td:nth-child(3) { width: 20%; }
    table th:nth-child(4), table td:nth-child(4) { width: 20%; }
    table th:last-child, table td:last-child { width: auto; }

    .modal-content {
        max-width: 90%;
        padding: 20px;
    }
    .modal-content h2 {
        font-size: 1.8em;
    }
    .modal-buttons button {
        font-size: 1em;
        padding: 10px 20px;
        margin: 5px;
    }
}

@media (max-width: 480px) {
    .cotizacion-container { padding: 15px; }
    .cotizacion-title { font-size: 1.8em; }
    table th, table td { font-size: 0.9em; padding: 8px; }
    table td input { font-size: 0.9em; }
    .modal-content h2 {
        font-size: 1.5em;
    }
    .modal-content p {
        font-size: 1em;
    }
}

/* ESTILOS ESPECÍFICOS PARA LA IMPRESIÓN (APLICADOS SOLO DURANTE LA GENERACIÓN DEL PDF) */
.pdf-export-mode {
    background-color: #fff !important; 
    margin: 0 !important; padding: 0 !important; box-shadow: none !important; 
    width: 100% !important; min-height: auto !important; 
    font-size: 10pt !important; 
    line-height: 1.2 !important; 
    font-family: 'Montserrat', sans-serif !important; 
}
.pdf-export-mode .cotizacion-title {
    font-family: 'Pacifico', cursive !important;
}


.pdf-export-mode .cotizacion-container {
    width: 210mm !important; 
    min-height: 297mm !important; 
    padding: 15mm !important; 
    box-shadow: none !important; border: none !important; overflow: hidden !important; 
    max-width: none !important; font-size: 10pt !important; 
    display: flex !important; 
    flex-direction: column !important; 
    /* Ajuste de gap para asegurar que las secciones no se solapen */
    gap: 5mm !important; 
}

/* Ocultar elementos no deseados en el PDF */
.pdf-export-mode .download-button, .pdf-export-mode #addRowBtn, .pdf-export-mode #logoUpload, 
.pdf-export-mode .logo-upload-button label, .pdf-export-mode #tipoCotizacion, 
.pdf-export-mode .logo-fiscal-label, .pdf-export-mode .small-logo-button { 
    display: none !important;
}

/* Estilos para los campos de texto que se convierten a <span> o <div> para el PDF */
.pdf-export-mode .pdf-text-field {
    border: none !important; padding: 0 !important; background-color: transparent !important;
    pointer-events: none !important; resize: none !important; outline: none !important; 
    white-space: normal !important; 
    word-wrap: break-word !important; overflow: visible !important; 
    height: auto !important; 
    min-height: unset !important; box-shadow: none !important;
    line-height: inherit !important; vertical-align: top !important; 
    display: inline-block !important; 
    width: 100% !important; 
    box-sizing: border-box !important;
    color: #000 !important; 
}

.pdf-export-mode textarea { 
    min-height: 5mm !important; 
}

/* Reglas para asegurar que inputs no convertidos se oculten */
.pdf-export-mode input[type="number"], .pdf-export-mode input[type="date"], 
.pdf-export-mode input[type="text"]:not(.pdf-text-field), 
.pdf-export-mode input[type="tel"]:not(.pdf-text-field),
.pdf-export-mode input[type="email"]:not(.pdf-text-field),
.pdf-export-mode textarea:not(.pdf-text-field) {
    display: none !important; 
}

/* ENCABEZADO DEL DOCUMENTO: Logo, Título, Fecha para PDF */
.pdf-export-mode .cotizacion-header {
    display: flex !important; 
    flex-direction: row !important; 
    justify-content: space-between !important; 
    align-items: flex-start !important; 
    flex-wrap: nowrap !important; 
    margin-bottom: 0 !important; 
    font-size: 9pt !important;
    position: relative !important; 
    padding-bottom: 0 !important; 
    height: auto !important; 
}

.pdf-export-mode .cotizacion-title {
    font-size: 20pt !important; 
    text-align: center !important; 
    flex-grow: 1 !important; 
    margin: 0 20px !important; 
    padding-left: 0 !important; 
    width: auto !important; 
    min-width: 200px !important; 
    align-self: center !important; 
    color: #000 !important; 
}

.pdf-export-mode .header-date-section {
    flex-shrink: 0 !important;
    width: auto !important; 
    min-width: 50mm !important; 
    display: flex !important; 
    justify-content: flex-end !important;
    align-items: center !important; 
    font-size: 9pt !important;
    margin-left: 0 !important; 
}
.pdf-export-mode .header-date-section label {
    margin-right: 2mm !important; font-weight: bold !important; white-space: nowrap !important;
    color: #000 !important; 
}
.pdf-export-mode .header-date-section .pdf-text-field { 
    text-align: right !important; 
    width: 30mm !important; 
    padding: 0 !important;
    color: #000 !important; 
}

/* NUEVOS ESTILOS PARA DATOS DE LA EMPRESA (COTIZACIÓN FISCAL) EN PDF */
.pdf-export-mode .empresa-fiscal-section { 
    display: flex !important;
    flex-direction: column !important; 
    gap: 1mm !important; 
    width: 100% !important;
    border: 1px solid #eee !important; 
    background-color: #f9f9f9 !important; 
    padding: 5mm !important; 
    margin-top: 5mm !important; 
    margin-bottom: 5mm !important;
    font-size: 8pt !important;
}

.pdf-export-mode .empresa-fiscal-section .input-group {
    flex-direction: row !important; 
    align-items: baseline !important;
    gap: 1mm !important;
    margin-bottom: 0 !important;
    font-size: 8pt !important; 
}
/* Ancho para las etiquetas de datos de empresa para alineación */
.pdf-export-mode .empresa-fiscal-section .input-group label {
    width: 28mm !important; 
    min-width: 28mm !important;
    flex-shrink: 0 !important;
    text-align: left !important;
    padding-right: 2mm !important;
    font-weight: bold !important;
    color: #000 !important;
}
.pdf-export-mode .empresa-fiscal-section .input-group .pdf-text-field {
    text-align: left !important;
    padding-left: 0 !important;
    color: #000 !important;
}

/* MODIFICADO: Contenedor para logos HORIZONTALES en PDF */
.pdf-export-mode .pdf-stacked-logos { 
    display: flex !important;
    flex-direction: row !important; 
    justify-content: center !important; 
    align-items: center !important; 
    width: 100% !important; 
    height: auto !important; 
    gap: 5mm !important; 
    flex-shrink: 0 !important;
    margin: 0 auto 5mm auto !important; 
}
.pdf-export-mode .pdf-stacked-logos img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
}
/* MODIFICADO: Tamaños de logos más grandes */
.pdf-export-mode .pdf-stacked-logos .pdf-logo-main {
    width: 60mm !important; /* AÚN MÁS GRANDE el logo principal */
    height: auto !important;
    max-height: 40mm !important; 
}
.pdf-export-mode .pdf-stacked-logos .pdf-logo-fiscal-img { 
    width: 50mm !important; /* AÚN MÁS GRANDE el logo fiscal */
    height: auto !important;
    max-height: 35mm !important; 
}

/* *** NUEVOS ESTILOS PARA DATOS BANCARIOS EN PDF *** */
.pdf-export-mode .datos-bancarios-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Centrar el título */
    width: 100% !important;
    margin-top: 10mm !important; /* Separación del contenido anterior */
    margin-bottom: 0 !important; /* Sin margen inferior porque es la última sección */
    border: 1px solid #eee !important;
    background-color: #f9f9f9 !important;
    padding: 5mm !important;
    font-size: 9pt !important;
    page-break-before: always !important; /* Asegura que empiece en una nueva página */
}

.pdf-export-mode .datos-bancarios-section h3 {
    width: 100% !important;
    text-align: center !important;
    color: #000 !important;
    margin-bottom: 5mm !important;
    font-size: 11pt !important;
}

.pdf-export-mode .pdf-banco-info-container { /* Contenedor para los dos bloques de banco */
    display: flex !important;
    flex-direction: row !important; /* Logos y datos uno al lado del otro */
    width: 100% !important;
    gap: 10mm !important;
    justify-content: center !important; /* Centrar los bloques de banco */
}

.pdf-export-mode .banco-info {
    flex: 1 1 auto !important; /* Para que cada banco ocupe espacio disponible */
    max-width: 45% !important; /* Limitar el ancho de cada bloque de banco */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Centrar contenido dentro de cada bloque */
    border: 1px solid #ddd !important;
    background-color: #fff !important;
    padding: 4mm !important;
    font-size: 8pt !important;
}

.pdf-export-mode .banco-info .logo-banco {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    height: 30mm !important; /* Logo más grande en PDF */
    margin-bottom: 3mm !important;
}

.pdf-export-mode .banco-info .logo-banco img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

.pdf-export-mode .banco-info h4 {
    text-align: center !important;
    color: #000 !important;
    margin-bottom: 3mm !important;
    font-size: 9pt !important;
}

.pdf-export-mode .banco-info p {
    margin-bottom: 2mm !important;
    color: #000 !important;
    font-size: 7.5pt !important; /* Fuente más pequeña en PDF */
    width: 100% !important; /* Para que el texto se ajuste bien */
    text-align: left !important; /* Alineación a la izquierda de los detalles */
}

.pdf-export-mode .banco-info p strong {
    color: #000 !important;
    display: inline-block !important;
    min-width: 30mm !important; /* Ancho para etiquetas en PDF */
    font-weight: bold !important;
}

/* Eliminar estilos de logo fiscal que no se usarán para apilar */
.pdf-export-mode .logo-fiscal-area, .pdf-export-mode .pdf-logo-right-section { 
    display: none !important;
}


/* TÍTULOS DE SECCIÓN PARA PDF */
.pdf-export-mode .pdf-cliente-title, .pdf-export-mode .pdf-vendedor-title {
    font-weight: bold !important;
    font-size: 11pt !important; 
    color: #333 !important;
    margin-top: 5mm !important; 
    margin-bottom: 2mm !important; 
    text-align: left !important; 
    display: block !important; 
    padding-bottom: 0 !important;
    width: 100% !important; 
    box-sizing: border-box !important;
    font-family: 'Montserrat', sans-serif !important; 
}


/* MODIFICADO: Contenedor para la sección de cliente y el contenedor de logos */
/* Ya no usaremos este para el orden global, solo para agrupar si es necesario */
.pdf-export-mode .pdf-client-logo-row {
    display: flex !important; /* Mantenemos flex para que contenga los logos y la data */
    flex-direction: column !important; /* Sigue siendo columna para apilar logos y datos */
    justify-content: flex-start !important; 
    align-items: flex-start !important; 
    gap: 5mm !important; 
    margin-bottom: 0 !important; 
    position: relative !important; 
    padding-top: 5mm !important; 
}

.pdf-export-mode .cliente-data { /* Sección cliente para PDF (si aplica) */
    flex: none !important; 
    max-width: 100% !important; 
    border: 1px solid #eee !important;
    padding: 10px !important; 
    background-color: #f9f9f9 !important;
    margin-bottom: 0 !important; 
    display: flex !important; 
    flex-direction: column !important; 
    gap: 2mm !important; 
}

/* Ajustes para los input-group dentro de .cliente-data para una sola columna y alineación */
.pdf-export-mode .cliente-data .input-group {
    flex: 0 0 100% !important; 
    width: 100% !important;
    margin-bottom: 0 !important; 
    flex-direction: row !important; 
    align-items: baseline !important;
    gap: 1mm !important;
}
/* ANCHO FIJO PARA LAS ETIQUETAS DE CLIENTE PARA ALINEAR LOS VALORES */
.pdf-export-mode .cliente-data .input-group label {
    width: 25mm !important; 
    min-width: 25mm !important;
    flex-shrink: 0 !important;
    text-align: left !important; 
    padding-right: 2mm !important; 
    color: #000 !important; 
}
/* Alinear el texto de los campos de cliente */
.pdf-export-mode .cliente-data .input-group .pdf-text-field {
    text-align: left !important; 
    padding-left: 0 !important; 
    color: #000 !important; 
}

/* TABLA DE ÍTEMS PARA PDF */
.pdf-export-mode .cotizacion-items {
    margin-top: -5mm !important; 
    margin-bottom: 0 !important; 
    page-break-inside: avoid !important; 
    box-sizing: border-box !important;
}

.pdf-export-mode table {
    width: 100% !important; 
    table-layout: fixed !important; 
    border-collapse: collapse !important;
    background-color: #fff !important;
    margin-bottom: 0 !important; 
    font-size: 9pt !important; 
    border: 1px solid #ddd !important; 
}

.pdf-export-mode table th, .pdf-export-mode table td {
    border: 1px solid #ddd !important; 
    padding: 1mm !important; 
    vertical-align: middle !important; 
    word-wrap: break-word !important; 
    white-space: normal !important; 
    overflow: hidden !important; 
    line-height: 1.2 !important; 
    box-sizing: border-box !important;
    color: #000 !important; 
}

.pdf-export-mode table thead th {
    background-color: var(--primary-color) !important;
    font-weight: bold !important; color: #fff !important;
    text-align: center !important; 
    padding: 2mm 1mm !important; 
}

/* ANCHOS DE COLUMNAS DE LA TABLA EN EL PDF */
.pdf-export-mode table th:nth-child(1), .pdf-export-mode table td:nth-child(1) { 
    width: 10% !important; 
    text-align: center !important;
}
.pdf-export-mode table th:nth-child(2), table td:nth-child(2) { 
    width: 58% !important; 
    text-align: left !important;
}
.pdf-export-mode table th:nth-child(3), table td:nth-child(3) { 
    width: 16% !important; 
    text-align: right !important;
}
.pdf-export-mode table th:nth-child(4), table td:nth-child(4) { 
    width: 16% !important; 
    text-align: right !important;
    background-color: #f0f0f0 !important; 
    color: var(--red-promo) !important; 
    font-weight: bold !important;
}
.pdf-export-mode table th:last-child, .pdf-export-mode table td:last-child { 
    width: 0 !important; padding: 0 !important; border: none !important;
    display: none !important; 
}

/* Estilos de los campos de texto reemplazados en la tabla */
.pdf-export-mode table td .pdf-text-field { 
    font-size: 9pt !important;
    padding: 0 1mm !important; 
    border: none !important;
    background-color: transparent !important;
    text-align: inherit !important; 
    width: 100% !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    display: inline-block !important; 
    height: auto !important; 
    color: #000 !important; 
}


/* SECCIÓN DE TOTALES PARA PDF */
.pdf-export-mode .cotizacion-totales {
    margin-bottom: 0 !important; 
    padding-top: 10mm !important; 
    border-top: 1px solid #ddd !important; 
    align-items: flex-end !important;
}
.pdf-export-mode .total-line {
    font-size: 10pt !important; 
    width: 90mm !important; 
    margin-left: auto !important; 
    margin-right: 0 !important; 
    margin-bottom: 5mm !important;
    display: flex !important; justify-content: space-between !important; 
    align-items: baseline !important; flex-wrap: nowrap !important;
}

.pdf-export-mode .total-line span { 
    flex-grow: 0 !important; flex-shrink: 0 !important;
    width: auto !important; 
    text-align: left !important; 
    margin-right: 5mm !important; 
    color: #000 !important; 
}

.pdf-export-mode .total-line .pdf-text-field { 
    flex-grow: 1 !important; flex-shrink: 0 !important; 
    min-width: 40mm !important; 
    max-width: 40mm !important; 
    text-align: right !important; 
    font-size: 10pt !important;
    padding: 0 !important; 
    border: none !important; 
    background-color: transparent !important;
    box-sizing: border-box !important;
    color: #000 !important; 
}

/* Estos se eliminan, ya no se usan en el pdf-client-logo-row para el logo */
.pdf-export-mode .pdf-logo-area, .pdf-export-mode .pdf-logo-right-section {
    display: none !important;
}

/* *** ESTILOS PARA DATOS BANCARIOS EN PDF *** */
.pdf-export-mode .datos-bancarios-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Centrar el título */
    width: 100% !important;
    margin-top: 10mm !important; /* Separación del contenido anterior */
    margin-bottom: 0 !important; /* Sin margen inferior porque es la última sección */
    border: 1px solid #eee !important;
    background-color: #f9f9f9 !important;
    padding: 5mm !important;
    font-size: 9pt !important;
    page-break-before: always !important; /* Asegura que empiece en una nueva página */
}

.pdf-export-mode .datos-bancarios-section h3 {
    width: 100% !important;
    text-align: center !important;
    color: #000 !important;
    margin-bottom: 5mm !important;
    font-size: 11pt !important;
}

.pdf-export-mode .pdf-banco-info-container { /* Contenedor para los dos bloques de banco */
    display: flex !important;
    flex-direction: row !important; /* Logos y datos uno al lado del otro */
    width: 100% !important;
    gap: 10mm !important;
    justify-content: center !important; /* Centrar los bloques de banco */
}

.pdf-export-mode .banco-info {
    flex: 1 1 auto !important; /* Para que cada banco ocupe espacio disponible */
    max-width: 45% !important; /* Limitar el ancho de cada bloque de banco */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Centrar contenido dentro de cada bloque */
    border: 1px solid #ddd !important;
    background-color: #fff !important;
    padding: 4mm !important;
    font-size: 8pt !important;
}

.pdf-export-mode .banco-info .logo-banco {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    height: 30mm !important; /* Logo más grande en PDF */
    margin-bottom: 3mm !important;
}

.pdf-export-mode .banco-info .logo-banco img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

.pdf-export-mode .banco-info h4 {
    text-align: center !important;
    color: #000 !important;
    margin-bottom: 3mm !important;
    font-size: 9pt !important;
}

.pdf-export-mode .banco-info p {
    margin-bottom: 2mm !important;
    color: #000 !important;
    font-size: 7.5pt !important; /* Fuente más pequeña en PDF */
    width: 100% !important; /* Para que el texto se ajuste bien */
    text-align: left !important; /* Alineación a la izquierda de los detalles */
}

.pdf-export-mode .banco-info p strong {
    color: #000 !important;
    display: inline-block !important;
    min-width: 30mm !important; /* Ancho para etiquetas en PDF */
    font-weight: bold !important;
}