/* =========================================
   ESTILOS DEL COTIZADOR UNIFI (SISTEC INT)
   ========================================= */
#contenedor-formulario { 
    max-width: 600px; 
    margin: 0 auto; 
    text-align: left; 
    background: #ffffff; 
    padding: 30px; 
    border-radius: 8px; 
    border: 1px solid #e0e0e0; 
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); 
}

.form-group { margin-bottom: 20px; }

.form-group label { 
    display: block; 
    font-weight: bold; 
    margin-bottom: 8px; 
    color: #333333; 
}

#formCotizador input[type="text"], 
#formCotizador input[type="email"], 
#formCotizador input[type="number"], 
#formCotizador select,
#formCotizador textarea { 
    width: 100%; 
    font-family: inherit;
    resize: vertical; /* Permite al cliente hacer la caja más grande si escribe mucho */
    padding: 10px; 
    background: #fafafa; 
    border: 1px solid #cccccc; 
    color: #333333; 
    border-radius: 4px; 
    font-size: 16px;
}

#formCotizador option { background-color: #ffffff; color: #333333; }

.fila-equipo { display: flex; gap: 10px; margin-bottom: 10px; align-items: center; }
.fila-equipo .col-select { flex: 3; }
.fila-equipo .col-cant { flex: 1; }

.btn-eliminar { background-color: #dc3545; color: white; border: none; padding: 10px 12px; border-radius: 4px; cursor: pointer; font-weight: bold; }
.btn-eliminar:hover { background-color: #c82333; }

.btn-secundario { background-color: #e2e8f0; color: #333333; padding: 8px 15px; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; font-size: 14px; margin-top: 5px; }
.btn-secundario:hover { background-color: #cbd5e1; }

#btnEnviar { background-color: #0056b3; color: white !important; padding: 12px 20px; border: none; cursor: pointer; width: 100%; font-size: 16px; border-radius: 4px; font-weight: bold; transition: background-color 0.3s; margin-top: 15px; }
#btnEnviar:hover { background-color: #004494; }

#mensaje { margin-top: 15px; font-weight: bold; color: #2e7d32; text-align: center; display: none; padding: 10px; background: #edf7ed; border-radius: 4px; border: 1px solid #4CAF50; }

/* ESTILOS PARA LAS NOTAS ACLARATORIAS */
.nota-disclaimer {
    background-color: #f8f9fa;
    border-left: 4px solid #0056b3;
    padding: 12px 15px;
    margin-bottom: 20px;
    border-radius: 4px;
    font-size: 13px;
    color: #555555;
}
.nota-disclaimer p { margin: 0 0 5px 0 !important; line-height: 1.4; }
.nota-disclaimer p:last-child { margin: 0 !important; }

/* =========================================
   ESTILOS PARA LA VENTANA MODAL (VISTA PREVIA)
   ========================================= */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.modal-content {
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    width: 95%; /* Ahora ocupa el 95% del ancho de la pantalla */
    max-width: 1200px; /* Aumentamos el límite de 800px a 1200px */
    position: relative;
    box-shadow: 0 5px 25px rgba(0,0,0,0.2);
}

/* NUEVO: Forzar que el visor del PDF sea mucho más alto */
#pdfPreview {
    height: 75vh !important; /* Ocupa el 75% de la altura visible de la pantalla */
}


.close-modal {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 28px;
    font-weight: bold;
    color: #666;
    cursor: pointer;
}

.close-modal:hover {
    color: #000;
}

#btnConfirmarEnviar:hover {
    background-color: #218838 !important;
}