/*
Theme Name: Tramoya ENAR
Theme URI: https://escenariosnacionales.ar
Description: Tramoya ENAR es una infraestructura digital de alto rendimiento...
Author: ENAR
Author URI: https://escenariosnacionales.ar
Template: hello-elementor
Version: 2.5.3
Text Domain: tramoya-enar
*/

/* ==========================================================================
   1. INFRAESTRUCTURA DE FUENTES (Armería Completa - Local)
   ========================================================================== */
/* --- BE VIETNAM PRO --- */
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 100; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-100.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 200; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-200.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 300; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 400; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-400.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 500; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 600; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 700; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 800; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-800.woff2') format('woff2'); }
@font-face { font-family: 'Be Vietnam Pro'; font-style: normal; font-weight: 900; font-display: swap; src: url('./assets/fonts/be-vietnam-pro/be-vietnam-pro-v11-latin-900.woff2') format('woff2'); }

/* --- OPEN SANS --- */
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url('./assets/fonts/open-sans/open-sans-v40-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('./assets/fonts/open-sans/open-sans-v40-latin-400.woff2') format('woff2'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('./assets/fonts/open-sans/open-sans-v40-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('./assets/fonts/open-sans/open-sans-v40-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('./assets/fonts/open-sans/open-sans-v40-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 800; font-display: swap; src: url('./assets/fonts/open-sans/open-sans-v40-latin-800.woff2') format('woff2'); }

/* ==========================================================================
   2. VARIABLES GLOBALES
   ========================================================================== */
:root {
    --enar-primary:      #22001C;
    --enar-secondary:    #C01828;
    --enar-text:         #262226;
    --enar-accent:       #EE1133;

    --enar-dark:         #262226;
    --enar-red-main:     #C01828;
    --enar-red-alert:    #D93025;

    --enar-white:        #FFFFFF;
    --enar-bg-gray:      #F2F2F2;
    --enar-bg-body:      #FAFAFA;

    --enar-plum-dark:    #22001C;
    --enar-plum-med:     #482C44;
    --enar-pink:         #DC4988;
    --enar-teal:         #077066;

    --enar-font-heading: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --enar-font-body:    'Open Sans', Helvetica, Arial, sans-serif;

    --enar-container:    1200px;
    --enar-header-h:     80px;      
    --enar-radius:       4px;        
}

/* ==========================================================================
   3. UTILIDADES
   ========================================================================== */
.bg-enar-red    { background-color: var(--enar-red-main); }
.text-enar-red  { color: var(--enar-red-main); }
.bg-enar-dark   { background-color: var(--enar-dark); color: var(--enar-white); }
.font-heading   { font-family: var(--enar-font-heading); }
.font-body      { font-family: var(--enar-font-body); }
.enar-debug     { outline: 1px solid var(--enar-red-alert); z-index: 9999; }

*:focus {
    outline: none !important;
    box-shadow: none !important;
}

* {
    -webkit-tap-highlight-color: transparent !important;
}

::selection {
    background-color: var(--enar-red-main);
    color: var(--enar-white);
}

::-moz-selection {
    background-color: var(--enar-red-main);
    color: var(--enar-white);
}

/* =========================================
   ESTILOS ESTRUCTURALES EDITOR (BACKEND)
   ========================================= */

/* 1. Fila Flex Simple (Para Funciones) 
   Input ocupa todo el lugar, botón a la derecha */
.enar-editor-row {
    display: flex;
    align-items: center; /* Centrado vertical */
    gap: 8px;            /* Aire entre input y tacho */
    margin-bottom: 8px;
    width: 100%;
}

/* 2. Grilla 1fr 3fr (Para Links Extra) */
.enar-editor-grid-1-3 {
    display: grid;
    grid-template-columns: 1fr 3fr; /* La proporción sagrada */
    gap: 10px;
    align-items: center;
    margin-bottom: 8px;
    width: 100%;
}

/* 3. Contenedor Flex dentro de la grilla (Para la columna 3fr)
   Esto permite que en la columna derecha convivan la URL y el Delete */
.enar-col-right-flex {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%; /* Ocupa todo el ancho de la celda 3fr */
}

/* --- UTILIDADES PARA DOMAR LOS INPUTS DE WP --- */

/* Clase para que el TextControl crezca todo lo que pueda */
.enar-grow {
    flex-grow: 1;
}

/* IMPORTANTE: Matamos el margin-bottom nativo de los componentes de WP
   cuando están dentro de nuestras filas, sino se desalinean los botones */
.enar-editor-row .components-base-control,
.enar-editor-grid-1-3 .components-base-control,
.enar-col-right-flex .components-base-control {
    margin-bottom: 0 !important;
}

/* Ajuste fino para el botón de borrar */
.enar-btn-delete {
    flex-shrink: 0; /* Que no se aplaste nunca */
    color: #d63638;
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}
.enar-btn-delete:hover {
    background: #f0f0f0;
}

/* ==========================================================================
   4. PERSONALIZACIÓN TRAMOYA (SISTEMA ENAR)
   ========================================================================== */

/* ==========================================================================
   4.1. ECOSISTEMA DE CABECERA
   --------------------------------------------------------------------------
   INDICE INTERNO:
   4.1.1. LAYOUT & Z-INDEX (Contenedores Base)
   4.1.2. IDENTIDAD (Logotipos)
   4.1.3. TRIGGERS & INTERACCIÓN (Hamburguesa -> X)
   4.1.4. BÚSQUEDA (Sistema Expandible)
   4.1.5. MEGA MENÚ (Navegación Principal)
   4.1.6. BARRA SECUNDARIA (Filtro Geo & Ubicación)
   4.1.7. COMPORTAMIENTO STICKY (Escritorio)
   4.1.8. MOBILE SIDEBAR (Ajustes Específicos)
   ========================================================================== */

/* --------------------------------------------------------------------------
   4.1.1. LAYOUT & Z-INDEX (CONTENEDORES BASE)
   -------------------------------------------------------------------------- */

/* Header Global Container - Capa superior absoluta */
.elementor-element.enar-header-global {
    z-index: 100 !important;
}

/* Alineación base para listas de iconos (Redes, Botones UI) */
.e-con-boxed .elementor-widget-icon-list {
    display: flex;
    align-items: center;
}

/* --------------------------------------------------------------------------
   4.1.2. IDENTIDAD (LOGOTIPOS)
   -------------------------------------------------------------------------- */

/* Configuración Base Desktop */
.enar-brand-logo img {
    width: auto; 
    height: 50px; 
    display: block; 
}

/* Ajuste Responsivo (Mobile/Tablet) */
@media (max-width: 767px) {
    .enar-brand-logo img {
        width: 100%;        
        max-width: 240px; 
    }
}

/* --------------------------------------------------------------------------
   4.1.3. TRIGGERS & INTERACCIÓN (HAMBURGUESA -> X)
   -------------------------------------------------------------------------- */

/* --- Configuración Base --- */
/* Definimos el puntero y la capa de interacción */
.enar-trigger-action-escritorio,
.enar-trigger-action-sticky-escritorio,
.enar-trigger-action-telefono {
    cursor: pointer;
    position: relative !important;
    z-index: 300; /* Siempre encima para garantizar el cierre */
}

/* --- Alineación Flex (Vital para centrar la X generada) --- */
.enar-header-global .enar-brandbar .elementor-icon-wrapper,
.enar-trigger-action-escritorio .elementor-icon-wrapper,
.enar-trigger-action-sticky-escritorio .elementor-icon-wrapper,
.enar-trigger-action-telefono .elementor-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- Estado A: Icono Original (SVG Hamburguesa) --- */
.enar-trigger-action-escritorio svg, 
.enar-trigger-action-escritorio i,
.enar-trigger-action-sticky-escritorio svg, 
.enar-trigger-action-sticky-escritorio i,
.enar-trigger-action-telefono svg, 
.enar-trigger-action-telefono i {
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 1;
    transform: scale(1);
    fill: #22001C;
}

/* --- Transición: Ocultar Original al Activar --- */
.enar-trigger-action-escritorio.is-active svg,
.enar-trigger-action-escritorio.is-active i,
.enar-trigger-action-sticky-escritorio.is-active svg,
.enar-trigger-action-sticky-escritorio.is-active i,
.enar-trigger-action-telefono.is-active svg,
.enar-trigger-action-telefono.is-active i {
    opacity: 0;
    transform: scale(0.5);
}

/* --- Estado B: Generación de la "X" (Pseudo-elementos) --- */
.enar-trigger-action-escritorio.is-active::before,
.enar-trigger-action-escritorio.is-active::after,
.enar-trigger-action-sticky-escritorio.is-active::before,
.enar-trigger-action-sticky-escritorio.is-active::after,
.enar-trigger-action-telefono.is-active::before,
.enar-trigger-action-telefono.is-active::after {
    content: '';
    position: absolute;
    width: 22px;        
    height: 2px;        
    background-color: #C01828; /* Rojo Institucional */
    top: 50%;
    left: 50%;
    transition: all 0.3s ease;
    opacity: 0; 
    z-index: 301;
}

/* Rotación Línea 1 (+45deg) */
.enar-trigger-action-escritorio.is-active::before,
.enar-trigger-action-sticky-escritorio.is-active::before,
.enar-trigger-action-telefono.is-active::before {
    transform: translate(-50%, -50%) rotate(45deg);
    opacity: 1;
}

/* Rotación Línea 2 (-45deg) */
.enar-trigger-action-escritorio.is-active::after,
.enar-trigger-action-sticky-escritorio.is-active::after,
.enar-trigger-action-telefono.is-active::after {
    transform: translate(-50%, -50%) rotate(-45deg);
    opacity: 1;
}

/* --------------------------------------------------------------------------
   4.1.4. BÚSQUEDA (SISTEMA EXPANDIBLE)
   -------------------------------------------------------------------------- */

/* Disparadores (Lupas) */
.enar-search-expand-icon,
.enar-search-sticky-icon {
    cursor: pointer !important;
    position: relative !important;
    z-index: 300 !important;
    pointer-events: auto !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Contenedor del Formulario */
.enar-search-expand .e-search-form,
.enar-search-sticky .e-search-form {
    display: flex;
    align-items: center;
    justify-content: flex-end; 
    position: relative;
}

/* Limpieza: Ocultar botón submit nativo */
.enar-search-expand .e-search-submit,
.enar-search-sticky .e-search-submit {
    display: none !important; 
}

/* --- Animación de Apertura (Input) --- */
.enar-search-expand .e-search-input-wrapper,
.enar-search-sticky .e-search-input-wrapper {
    width: 0; 
    overflow: hidden; 
    transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    opacity: 0;
}

/* Estado: Abierto */
.enar-search-expand.is-open .e-search-input-wrapper,
.enar-search-sticky.is-open .e-search-input-wrapper {
    width: 250px; 
    opacity: 1;
}

/* Estilo Visual del Campo */
.enar-search-expand .e-search-input,
.enar-search-sticky .e-search-input {
    height: 40px !important;
    background-color: #F2F2F2 !important; 
    border: none !important;
    border-radius: 4px !important; 
    padding: 0 15px !important;
    width: 250px; 
    color: #22001C;
}

/* --------------------------------------------------------------------------
   4.1.5. MEGA MENÚ (NAVEGACIÓN PRINCIPAL)
   -------------------------------------------------------------------------- */

/* Contenedor Principal Desplegable */
#enar-mega-row {
    position: absolute !important; 
    left: 0;
    width: 100%;
    top: var(--enar-menu-offset, 150px) !important; /* Offset dinámico */
    z-index: 90; 
    visibility: hidden; 
    opacity: 0;
    pointer-events: none; 
    background-color: #FFFFFF; 
    border-top: none !important; 
    border-bottom: 1px solid #22001C4A; 
    box-shadow: 0 15px 30px -5px rgba(0,0,0,0.15); 
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Variación Sticky (Anclado) */
#enar-mega-row.modo-sticky {
    position: fixed !important; 
    z-index: 190;
}

/* Estado: Activo (Visible) */
#enar-mega-row.is-active {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* Lógica de colisión: Ocultar barra secundaria si el Mega está activo */
#enar-mega-row.is-active ~ #bar-menu-principal {
    opacity: 0;
    pointer-events: none;
}

/* --------------------------------------------------------------------------
   4.1.6. BARRA SECUNDARIA (FILTRO GEO & UBICACIÓN)
   -------------------------------------------------------------------------- */

/* Contenedor de la Barra Inferior */
#bar-menu-principal {
    position: relative; 
    z-index: 50; /* Debe estar por debajo del Mega Menú (90) */
    transition: opacity 0.2s ease;
    background-color: #fff; 
}

/* --- Dropdown de Provincias --- */
.menu-ubicacion {
    position: absolute !important;
    top: calc(100% + 15px); 
    left: 0;
    width: 100%; 
    display: block !important; 
    
    /* Scroll & Layout */
    max-height: 55vh; 
    overflow-y: auto; 
    overflow-x: hidden; 
    scrollbar-width: none; 
    -ms-overflow-style: none; 
    
    /* Estética de la caja */
    background-color: #FFFFFF;
    border: 1px solid #22001C1A; 
    border-top: 2px solid #C01828; 
    border-radius: 0 0 5px 5px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    
    /* Estado Inicial (Oculto + Clip Path) */
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px); 
    clip-path: inset(0 0 100% 0); /* Efecto persiana cerrada */

    z-index: 45; 
    padding: 20px; 
    transition: all 0.3s ease, clip-path 0s linear 0.3s;
}

/* Estado: Activo */
.menu-ubicacion.is-active {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    clip-path: inset(-20px -20px -20px -20px); /* Efecto persiana abierta */
    transition: all 0.3s ease, clip-path 0s linear 0s;
}

/* Normalización de la lista interna */
.menu-ubicacion ul, .menu-ubicacion .elementor-icon-list-items { margin: 0 !important; padding: 0 !important; display: block !important; }
.menu-dropbar .menu-ubicacion ul { padding-top: 6px !important; padding-bottom: 6px !important; }
.menu-ubicacion::-webkit-scrollbar { display: none; }

/* Animación de flecha en el botón disparador */
.boton-menu-ubicacion svg { transition: transform 0.3s ease; }
.boton-menu-ubicacion.is-active svg { transform: rotate(180deg); }

/* Estilo de los Items (Provincias) */
.menu-ubicacion .elementor-icon-list-item {
    padding: 8px 10px; border-radius: 4px; transition: background-color 0.2s; width: 100%;
    justify-content: center; text-align: center; 
}
.menu-ubicacion .elementor-icon-list-item:hover { background-color: #F5F5F5; }
.menu-ubicacion .elementor-icon-list-text { color: #262226; transition: color 0.2s; font-size: 15px; }
.menu-ubicacion .elementor-icon-list-text:hover { color: #C01828; font-weight: 600; }

/* --------------------------------------------------------------------------
   4.1.7. COMPORTAMIENTO STICKY (ESCRITORIO)
   -------------------------------------------------------------------------- */

@media (min-width: 1025px) {
    /* Estado inicial: Invisible y absoluto */
    #enar-sticky-nav {
        position: absolute; 
        top: 0; 
        left: 0; 
        width: 100%; 
        z-index: -1; 
        opacity: 0; 
        visibility: hidden;
        pointer-events: none; 
        background: #FFFFFF; 
        border-bottom: 1px solid #22001C4A;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    /* Estado activo: Elementor inyecta 'elementor-sticky--effects' al scrollear */
    #enar-sticky-nav.elementor-sticky--effects {
        position: fixed !important;
        width: 100% !important; 
        max-width: 100% !important;
        left: 0 !important;
        opacity: 1;
        visibility: visible;
        pointer-events: auto; 
        z-index: 200; 
        animation-duration: 0.3s !important; 
    }
}

/* --------------------------------------------------------------------------
   4.1.8. MOBILE SIDEBAR (AJUSTES ESPECÍFICOS)
   -------------------------------------------------------------------------- */

/* Reset del Wrapper Principal */
#enar-sidebar-main {
    padding: 0 !important;
}

/* Barra Cabecera dentro del Sidebar */
.enar-header-bar {
    padding: 0 !important;
    min-height: 60px; 
    align-items: stretch; /* Estirar hijos verticalmente */
}

/* Grupo Izquierda (Comunidad + Dark Mode) */
.enar-header-group-left {
    height: 100%;
    align-items: stretch;
}

/* Elementos Full-Height (Centrado) */
#enar-icon-stretch,
#dark-mode-btn {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/* Botón Cerrar */
#enar-close-btn {
    display: flex;
    align-items: center;
}

/* Corrección de Flexbox para Elementor Widgets */
#enar-close-btn .elementor-icon-wrapper,
#enar-icon-stretch .elementor-icon-wrapper,
#dark-mode-btn .elementor-icon-wrapper {
    display: flex;
}

/* ==========================================================================
   4.2. ECOSISTEMA DE FOOTER
   --------------------------------------------------------------------------
   INDICE INTERNO:
   4.2.1. ESTÉTICA GLOBAL DE COLUMNAS (Tipografía, Listas y Enlaces)
   4.2.2. COMPONENTES DE MARCA (Claim & Redes Sociales)
   4.2.3. COMPORTAMIENTO DE ESCRITORIO (+1025px - Alineación Derecha)
   4.2.4. ENTORNO DE IMPRESIÓN (Optimización para papel)
   ========================================================================== */

/* --------------------------------------------------------------------------
   4.2.1. ESTÉTICA GLOBAL DE COLUMNAS (CONTENIDO EDITORIAL)
   Aplica a los widgets de texto dentro del footer en todas las resoluciones.
   -------------------------------------------------------------------------- */

/* 1. Títulos de Sección (Simulados con <p><strong>) */
#enar-megamenu-container-footer .enar-footer-col p {
    font-size: 15px !important;
    margin-bottom: 20px !important;
    font-weight: 700; /* Peso visual para jerarquía */
    line-height: 1.2em;
}

/* 2. Contenedor de Listas (Reset de estilos nativos) */
#enar-megamenu-container-footer .enar-footer-col ul {
    padding-left: 0px !important;
    list-style-type: none !important;
    margin: 0 !important;
}

/* 3. Ítems de Lista (Espaciado vertical) */
#enar-megamenu-container-footer .enar-footer-col ul li {
    margin-bottom: 10px !important;
}

/* 4. Enlaces (Estilo base e interacción) */
#enar-megamenu-container-footer .enar-footer-col ul li a {
    text-decoration: none;
    transition: color 0.3s ease;
    /* El color base lo hereda del widget o global de Elementor */
}

/* --------------------------------------------------------------------------
   4.2.2. COMPONENTES DE MARCA (CLAIM & REDES)
   -------------------------------------------------------------------------- */

/* Claim / Bajada (Texto en dos líneas a la izquierda) */
.footer-claim-line {
    display: block !important;
    width: 100%;
    line-height: 1.2;
}

/* Fix Flexbox para Iconos Sociales (Evita roturas de layout) */
.redes-sociales-escenarios-pie .elementor-widget-icon .elementor-icon-wrapper {
    display: flex !important;
}

/* --------------------------------------------------------------------------
   4.2.3. COMPORTAMIENTO DE ESCRITORIO (+1025px)
   Alineación forzada a la derecha para equilibrar el logo a la izquierda.
   -------------------------------------------------------------------------- */
@media (min-width: 1025px) {

    /* 1. Contenedor Principal: Flex-End (Todo a la derecha) */
    #enar-megamenu-container-footer {
        justify-content: flex-end !important;
        gap: 40px !important; /* Aire entre columnas */
        align-items: flex-start !important;
    }

    /* 2. Columnas Individuales: Ancho compacto (Hug content) */
    #enar-megamenu-container-footer .elementor-widget-wrap,
    .enar-footer-col {
        width: max-content !important; 
        flex-grow: 0 !important;
    }

    /* 3. Redes Sociales: Alineación derecha explícita */
    .caja-pie .enar-footer-social .elementor-widget-container,
    .caja-pie .enar-footer-social ul.elementor-icon-list-items {
        justify-content: flex-end !important;
        text-align: right !important;
        display: flex;
    }
}

/* --------------------------------------------------------------------------
   4.2.4. ENTORNO DE IMPRESIÓN (AHORRO DE TINTA)
   Oculta navegación y optimiza para CTRL+P
   -------------------------------------------------------------------------- */
@media print {
    /* Ocultar elementos de navegación y redes */
    #enar-megamenu-container-footer,
    .redes-sociales-escenarios-pie {
        display: none !important;
    }
    
    /* Centrado y bordes simples para papel */
    .caja-pie {
        text-align: center !important;
        border-top: 1px solid #000;
        padding-top: 20px;
    }
    
    /* Escala de grises para logos */
    .caja-pie img {
        filter: grayscale(100%); 
    }
}

/* ==========================================================================
   4.3. SINGLE POST
   --------------------------------------------------------------------------
   INDICE INTERNO:
   4.3.1. PUBLICACIÓN GENERAL
   4.3.2. PUBLICACIÓN PARA HACER MAS ADELANTE
   ========================================================================== */

/* --------------------------------------------------------------------------
   4.3.1. PUBLICACIÓN GENERAL
   Estilos específicos para la plantilla de noticias estándar.
   
   A. CABECERA Y METADATOS
   B. RESUMEN IA
   C. CUERPO DE LA NOTA Y BARRA STICKY
   D. ZONA DE FEEDBACK (CORRECCIONES Y COMENTARIOS)
   E. REDES Y APOYO
   F. RELACIONADAS
   -------------------------------------------------------------------------- */

/* -----------------------------------------------------------
   A. CABECERA Y METADATOS
   ----------------------------------------------------------- */

/* Alineación de la lista de datos del autor */
.enar-contenedor-autor-fecha .enar-lista-datos-autor {
    align-items: stretch;
}

/* Estructura de la lista (Nombre y Mail) */
.enar-contenedor-autor-fecha .enar-lista-datos-autor ul {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Botón Leer Más Tarde - Ajustes para Móvil */
@media (max-width: 767px) {
    /* Ocultar texto */
    #enar-boton-leer-tarde .elementor-button-text {
        display: none;
    }
    
    /* Botón cuadrado solo icono */
    #enar-boton-leer-tarde .elementor-button {
        padding: 0 !important;
        width: 40px !important;
        height: 40px !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Contenedor ajustado */
    #enar-boton-leer-tarde {
        width: auto !important;
    }
}

/* -----------------------------------------------------------
   B. RESUMEN IA (ACORDEÓN)
   ----------------------------------------------------------- */

/* 1. Forzar ancho completo en el título para que el Grid funcione */
#enar-acordeon-resumen .e-n-accordion-item-title,
#enar-acordeon-resumen .e-n-accordion-item-title-header,
#enar-acordeon-resumen .e-n-accordion-item-title-text {
    width: 100% !important;
}

/* 2. Ocultar el icono por defecto de Elementor */
#enar-acordeon-resumen .e-n-accordion-item-title-icon {
    display: none !important;
}

/* 3. Estilo del Ítem (Borde y Fondo Gradiente) */
#enar-acordeon-resumen .e-n-accordion-item {
    border-radius: 10px !important;
    overflow: hidden;
    border: none;
    background-image: linear-gradient(200deg, var(--e-global-color-accent) 0%, #DC4988 80%);
}

/* 4. La Grilla de la Cabecera (3 Columnas: IA | Texto | Chevron) */
#enar-acordeon-resumen .cabecera-horizontal {
    display: grid;
    grid-template-columns: 30px 1fr 30px; /* Iconos fijos, texto flexible */
    width: 100%;
    align-items: center;
}

/* 5. Estilos de los elementos internos (Iconos y Texto) */
#enar-acordeon-resumen .ia-icono-acordeon {
    width: 28px;
    filter: brightness(0) invert(92%); /* Blanco casi puro */
}

#enar-acordeon-resumen .texto-resumen-label {
    justify-self: center;
    text-align: center;
    color: #fff;
    font-weight: 500;
}

#enar-acordeon-resumen .chevron-resumen {
    width: 18px;
    height: 18px;
    justify-self: end;
    filter: brightness(0) invert(92%);
    transition: transform 0.3s ease;
}

/* 6. Rotación del Chevron al abrir */
#enar-acordeon-resumen details[open] .chevron-resumen {
    transform: scaleY(-1);
}

/* -----------------------------------------------------------
   C. CUERPO DE LA NOTA Y BARRA STICKY
   ----------------------------------------------------------- */

/* Icono de Comentarios en Barra Lateral: Bordes suaves */
#enar-barra-lateral-compartir .elementor-grid-item .elementor-social-icon-comment-alt {
    border-radius: 5px !important;
}

/* Línea divisoria debajo del icono de comentarios */
#enar-barra-lateral-compartir .elementor-grid-item:nth-child(1) {
    border-bottom: 1px solid rgba(90, 90, 90, 0.15);
    padding-bottom: 12px;
    margin-bottom: 12px;
}

/* Espaciado para los subtítulos (H2) dentro de la nota */
.enar-contenido-entrada h2 {
    margin-top: 32px;
    margin-bottom: 16px;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.3;
}

/* -----------------------------------------------------------
   D. ZONA DE FEEDBACK (CORRECCIONES Y COMENTARIOS)
   ----------------------------------------------------------- */

/* Caja de Errores: Icono del lápiz con fondo */
.enar-aviso-error .elementor-icon-list-icon svg {
    background-color: #077066; /* Verde institucional */
    padding: 6px;
    color: white;       /* Asegura contraste */
    box-sizing: content-box; /* Evita que el padding achique el SVG */
}

/* Alineación vertical del texto con el icono */
.enar-aviso-error .elementor-icon-list-item {
    align-items: center;
}

/* Motor de Comentarios JS: Estado inicial (Oculto) */
#enar-contenedor-comentarios {
    display: none;
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

/* Motor de Comentarios JS: Estado visible (Activado por Script) */
#enar-contenedor-comentarios.enar-visible {
    display: block;
    opacity: 1;
}

/* -----------------------------------------------------------
   E. REDES Y APOYO
   ----------------------------------------------------------- */

/* Reset de márgenes en textos de Google News */
.enar-caja-google-news .elementor-widget-text-editor p {
    margin-bottom: 0px;
}

/* Reset de márgenes en textos de Instagram */
.enar-caja-instagram .elementor-widget-text-editor p {
    margin-bottom: 0px;
}

/* -----------------------------------------------------------
   F. RELACIONADAS
   ----------------------------------------------------------- */

/* Wrapper del icono (+) en el título */
.titulo-miradas-entradas-relacionadas .enar-icono-mas .elementor-icon-wrapper {
    display: flex;
}

/* --------------------------------------------------------------------------
   4.3.2. PUBLICACIÓN MIRADAS
   Estilos específicos para la plantilla de miradas.
   
   A. VISUALIZACIÓN ESTADO EDITORIAL
   B. SANITIZACIÓN INFO OBRA (Ocultar si no hay meta datos)
   C. SANITIZACIÓN REDES (Ocultar si no hay links)
   D. SANITIZACIÓN ESTRUCTURAL (Colapso de Grilla)
   E. CENTRADO DE ENCABEZADO (Grilla Simétrica)
   -------------------------------------------------------------------------- */

/* -----------------------------------------------------------
   A. VISUALIZACIÓN ESTADO EDITORIAL
   ----------------------------------------------------------- */

/* Se esconde el contenedor enar-contenedor-estadoeditorial si la temporada finalizó. */
body.elementor-420157 .elementor-element.elementor-element-c32b4c9 {
    display: none !important;
}

/* -----------------------------------------------------------
   B. SANITIZACIÓN INFO OBRA
   ----------------------------------------------------------- */

/* Ocultar el contenedor de datos (Sala, Horario, etc.) si Elementor
   no renderizó ningún item de lista <li> (meta datos vacíos). */
.enar-contenedor-datos-obra:not(:has(.elementor-icon-list-item)) {
    display: none !important;
}

/* -----------------------------------------------------------
   C. SANITIZACIÓN REDES
   ----------------------------------------------------------- */

/* Ocultar el contenedor de redes sociales si Elementor
   no renderizó ningún enlace <a> (meta redes vacíos). */
.enar-contenedor-redes-obra:not(:has(.enar-social-link)) {
    display: none !important;
}

/* -----------------------------------------------------------
   D. SANITIZACIÓN ESTRUCTURAL (GRILLA)
   ----------------------------------------------------------- */

/* Si la grilla no tiene Info (<li>) Y TAMPOCO tiene Redes (<a>),
   se oculta la estructura completa para evitar espacios en blanco (Layout Shift). */
.enar-grilla-datos-obra:not(:has(.elementor-icon-list-item)):not(:has(.enar-social-link)) {
    display: none !important;
}

/* -----------------------------------------------------------
   E. CENTRADO DE ENCABEZADO Y ADAPTACIÓN MÓVIL
   ----------------------------------------------------------- */

/* --- 1. ESCRITORIO (>= 1025px) --- 
   Estrategia de Grilla Simétrica (1fr - Auto - 1fr) */
@media (min-width: 1025px) {
    
    .elementor-element-7cc3c97 {
        display: grid !important;
        grid-template-columns: 1fr auto 1fr !important;
        align-items: center;
        width: 100%;
    }

    /* Categoría: Izquierda (Carril 1) */
    .elementor-element-7cc3c97 > .elementor-element-0379f44 {
        grid-column: 1 !important;
        justify-self: start;
        margin-right: auto;
    }

    /* Título: Centro (Carril 2) */
    .elementor-element-7cc3c97 > .elementor-element-06ea7b6 {
        grid-column: 2 !important;
        justify-self: center;
        text-align: center;
        width: fit-content;
        max-width: 100%;
    }

    /* Fantasma: Derecha (Carril 3) - Equilibra la balanza */
    .elementor-element-7cc3c97::after {
        content: '';
        display: block;
        grid-column: 3 !important;
        width: 100%;
        min-height: 1px;
    }
}

/* --- 2. TABLET Y MÓVIL (<= 1024px) --- 
   Estrategia de Apilado Vertical (Flex Column) */
@media (max-width: 1024px) {

    .elementor-element-7cc3c97 {
        display: flex !important;
        flex-direction: column !important; /* Uno abajo del otro */
        width: 100%;
        gap: 10px; /* Espacio entre categoría y título */
    }

    /* Categoría: Arriba y a la Izquierda */
    .elementor-element-7cc3c97 > .elementor-element-0379f44 {
        align-self: flex-start !important; /* Se pega a la izquierda */
        width: auto !important;
        margin-bottom: 0px;
    }

    /* Título: Abajo y Centrado */
    .elementor-element-7cc3c97 > .elementor-element-06ea7b6 {
        align-self: center !important; /* Se centra en el contenedor */
        text-align: center !important; /* Centra el texto interno */
        width: 100% !important;
    }

    /* El Fantasma desaparece en móvil para no ocupar espacio al pedo */
    .elementor-element-7cc3c97::after {
        display: none !important;
    }
}

/* ==========================================================================
   4.4. LOOPS Y TARJETAS
   --------------------------------------------------------------------------
   INDICE INTERNO:
   4.4.1. IMÁGENES BLOCK
   4.4.2. IMÁGENES OVERLAY
   ========================================================================== */

/* --------------------------------------------------------------------------
   4.4.1. IMÁGENES BLOCK
   Uso: Loops verticales u horizontales donde la foto NO tiene texto encima.
   Clase Elementor: enar-imagen-loop
   -------------------------------------------------------------------------- */

/* 1. El Widget mantiene su espacio físico en la grilla */
.enar-imagen-loop {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
}

/* 2. El contenedor interno de Elementor se estira al 100% */
.enar-imagen-loop .enar-contenedor-imagen {
    width: 100% !important;
    height: 100% !important;
}

/* 3. La foto final rellena el espacio y recorta sin deformarse */
.enar-imagen-loop img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

/* --------------------------------------------------------------------------
   4.4.2. IMÁGENES OVERLAY
   Uso: Loops donde la foto actúa de fondo y el texto va ENCIMA.
   Clase Elementor: enar-imagen-loop-overlay
   -------------------------------------------------------------------------- */

/* 1. El Widget flota detrás de los textos ocupando todo el padre */
.enar-imagen-loop-overlay {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* 2. El contenedor interno de Elementor se estira al 100% */
.enar-imagen-loop-overlay .elementor-widget-container {
    width: 100% !important;
    height: 100% !important;
}

/* 3. La foto final rellena el espacio y recorta sin deformarse */
.enar-imagen-loop-overlay img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

/*-------PARA ORDENAR DESPUES
/* Form field message */

/* PAGINA CONTACTO:*/

#form-field-message{
	padding-top:8px;
	padding-bottom:8px;
}

/* ==========================================================================
   5. FORMULARIO DE CONTACTO (PÁGINA)
   ========================================================================== */

/* 1. Ocultar los mensajes y spinner por defecto */
#enar-spiner-contacto,
#enar-msg-exito-contacto,
#enar-msg-error-contacto {
    display: none;
}

/* 2. Animación del Spinner de Contacto */
#enar-spiner-contacto .elementor-icon svg {
    animation: enar-giro-eterno 1.4s linear infinite;
    transform-origin: center center; 
    fill: #077066; /* Tu color verde para que quede prolijo */
}

/* 3. Estilos de los iconos de mensaje */
#enar-msg-exito-contacto .elementor-icon svg {
    fill: #077066; /* Verde éxito */
}

#enar-msg-error-contacto .elementor-icon .e-fas-exclamation {
    border: 9px solid #ff4d4d;
    border-radius: 50%;
    padding: 10px;
    fill: #ff4d4d; /* Rojo error */
}

/* 4. Contenedor centralizado para los mensajes (Opcional pero recomendado) */
.enar-contenedor-formulario {
    position: relative;
    min-height: 200px; /* Para que al ocultar el form no salte la página bruscamente */
}

/* Pagina boletin */

/* ==========================================================================
   6. FORMULARIO BOLETÍN (NEWSLETTER)
   ========================================================================== */

/* 1. Ocultar el botón original de Elementor */
.enar-formulario-boletin .e-form__buttons {
    display: none !important;
}

/* 2. Ocultar mensajes y spinner por defecto */
.enar-spiner-boletin,
#enar-msg-exito-boletin,
#enar-msg-error-boletin {
    display: none;
}

/* 3. Animación del Spinner del Boletín */
.enar-spiner-boletin .elementor-icon svg {
    animation: enar-giro-eterno 1.4s linear infinite;
    transform-origin: center center; 
    fill: #077066; /* Verde */
}

/* 4. Estilos de los iconos de mensaje */
#enar-msg-exito-boletin .elementor-icon svg {
    fill: #077066; /* Verde éxito */
}

#enar-msg-error-boletin .elementor-icon .e-fas-exclamation {
    border: 9px solid #ff4d4d;
    border-radius: 50%;
    padding: 10px;
    fill: #ff4d4d; /* Rojo error */
}

/* Contenedor centralizado para los mensajes */
.enar-contenedor-formulario-mensajes {
    position: relative;
    min-height: 120px;
}

/* Pagina Aporte*/

/* ==========================================================================
   RESET DE MÁRGENES PARA PÁRRAFOS EN ZONAS DE APORTES
   ========================================================================== */

/* 1. Grilla principal de publicidades/aportes mensuales */
.enar-grilla-publicidades .elementor-widget-text-editor p {
    margin-bottom: 0 !important;
}

/* 2. Contenedor de aportes anuales */
.enar-contenedor-aportes-anual .elementor-widget-text-editor p {
    margin-bottom: 0 !important;
}

/* 3. Contenedor de aportes únicos */
.enar-contenedor-aportes-unico .elementor-widget-text-editor p {
    margin-bottom: 0 !important;
}

/* ==========================================================================
   CAMPO DE PRECIO (ESTILO PÍLDORA) - APORTE VOLUNTARIO
   ========================================================================== */

/* 1. Contenedor principal con bordes 100% redondos */
.enar-aporte-voluntario .price-input {
    display: flex !important;
    align-items: center !important;
    background-color: #ffffff !important;
    border: 1px solid #818a91 !important; 
    border-radius: 999px !important; /* Magia del borde redondo */
    padding: 0 20px !important; 
    height: 40px !important; 
    font-weight: 400 !important; 
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.3s ease;
}

/* Efecto al hacer clic */
.enar-aporte-voluntario .price-input:focus-within {
    border-color: #077066 !important; 
}

/* 2. El símbolo del $ */
.enar-aporte-voluntario .price-input span {
    color: #555555 !important;
    font-size: 15px !important;
    margin-right: 5px !important;
    user-select: none !important; 
}

/* 3. El campo de texto numérico limpio */
.enar-aporte-voluntario .price-input input {
    border: none !important;
    background: transparent !important;
    outline: none !important;
    width: 100% !important;
    height: 100% !important;
    font-size: 15px !important;
    color: #333333 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* 4. Ocultar las flechitas nativas del navegador */
.enar-aporte-voluntario .price-input input[type="number"]::-webkit-inner-spin-button,
.enar-aporte-voluntario .price-input input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.enar-aporte-voluntario .price-input input[type="number"] {
    -moz-appearance: textfield; 
}

/* ==========================================================================
   CAMPO DE PRECIO (SIN BORDES) - APORTE ÚNICO VOLUNTARIO
   ========================================================================== */

/* 1. Contenedor principal totalmente sin bordes */
.enar-aporte-voluntario-unico .price-input {
    display: flex !important;
    align-items: center !important;
    background-color: transparent !important; /* Transparente para que se funda con tu grilla */
    border: none !important; /* Eliminamos la línea del borde */
    border-radius: 0 !important; /* Eliminamos las curvas */
    padding: 0 10px !important; 
    height: 100% !important; /* Para que iguale a sus vecinos en la grilla */
    min-height: 40px !important;
    font-weight: 400 !important; 
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 2. Quitamos cualquier resplandor al hacer clic */
.enar-aporte-voluntario-unico .price-input:focus-within {
    outline: none !important;
    border: none !important; 
}

/* 3. El símbolo del $ */
.enar-aporte-voluntario-unico .price-input span {
    color: #555555 !important;
    font-size: 15px !important;
    margin-right: 5px !important;
    user-select: none !important; 
}

/* 4. El campo de texto numérico limpio */
.enar-aporte-voluntario-unico .price-input input {
    border: none !important;
    background: transparent !important;
    outline: none !important;
    width: 100% !important;
    height: 100% !important;
    font-size: 15px !important;
    color: #333333 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* 5. Ocultar las flechitas nativas del navegador */
.enar-aporte-voluntario-unico .price-input input[type="number"]::-webkit-inner-spin-button,
.enar-aporte-voluntario-unico .price-input input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.enar-aporte-voluntario-unico .price-input input[type="number"] {
    -moz-appearance: textfield; 
}

/* ==========================================================================
   4.X. POPUPS
   --------------------------------------------------------------------------
   INDICE INTERNO:
   4.X.1. POPUP ANUNCIOS (Formulario, Animaciones, Stepper, Autocomplete)
   4.X.2. OTROS POPUPS (Reservado para futuros desarrollos)
   ========================================================================== */


/* ==========================================================================
   4.X.1. POPUP ANUNCIOS
   ========================================================================== */

/* --- A. UTILIDADES GENERALES Y ESTADOS --- */
/* Clase utilitaria para ocultar botones custom y limpieza de botonera nativa */
.enar-boton-oculto,
#formulario_anuncio .e-form__buttons {
    display: none !important;
}

/* Ocultamos los mensajes y el spinner por defecto hasta que el JS los llame */
#enar-msg-error,
#enar-msg-exito,
#enar-spiner {
    display: none;
}

/* --- B. ANIMACIONES E ICONOS --- */
/* Motor de animación para el loader */
@keyframes enar-giro-eterno {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Aplicación del giro al SVG del spinner */
#enar-spiner .elementor-icon svg {
    animation: enar-giro-eterno 1.4s linear infinite;
    transform-origin: center center; 
}

/* Estilos a medida para el ícono de error (Shorthand CSS) */
#enar-msg-error .elementor-icon .e-fas-exclamation {
    border: 9px solid;
    border-radius: 50%;
    padding: 10px;
}

/* --- C. BARRA DE PROGRESO (STEPPER) --- */
/* ESTADO 1: PASO PENDIENTE (Fondo transparente, texto oscuro y círculo) */
.enar-boton-paso .elementor-button {
    width: 35px !important;  
    height: 35px !important; 
    border-radius: 50% !important; 
    padding: 0 !important; 
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    background-color: transparent !important;
    border: 2px solid #077066 !important;
    color: #077066 !important;
    transition: all 0.3s ease; 
}

/* ESTADO 2: PASO ACTIVO (Fondo y borde con transparencia) */
.enar-boton-paso.paso-activo .elementor-button {
    background-color: #07706682 !important;
    border: 0px solid #07706682 !important;
    color: #ffffff !important; 
}

/* ESTADO 3: PASO HECHO (Fondo y borde sólido) */
.enar-boton-paso.paso-hecho .elementor-button {
    background-color: #077066 !important;
    border: 2px solid #077066 !important;
    color: #ffffff !important;
}


/* --- D. AUTOCOMPLETADO DE LOCALIDADES --- */
/* 1. El contenedor (evita que se ponga horizontal) */
.enar-autocomplete-wrapper {
    position: relative !important;
    width: 100% !important;
    display: block !important;
    flex-basis: 100% !important;
    overflow: visible !important;
}

/* 2. La lista desplegable flotante */
.enar-autocomplete-lista {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: #ffffff !important;
    border: 1px solid #d1d1d1 !important;
    border-top: none !important;
    border-radius: 0 0 5px 5px !important;
    max-height: 200px !important;
    overflow-y: auto !important;
    z-index: 9999999 !important; 
    box-shadow: 0 8px 15px rgba(0,0,0,0.15) !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important; 
    display: none;
}

/* 3. Cada opción (localidad) de la lista */
.enar-autocomplete-lista li {
    padding: 12px 15px !important;
    cursor: pointer !important;
    color: #333 !important;
    background: #fff !important;
    border-bottom: 1px solid #eee !important;
    font-size: 14px !important;
    text-align: left !important;
    list-style-type: none !important; 
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* Eliminamos el borde del último elemento */
.enar-autocomplete-lista li:last-child {
    border-bottom: none !important;
}

/* 4. Efecto Hover (cuando pasas el mouse) */
.enar-autocomplete-lista li:hover {
    background-color: #077066 !important; 
    color: #ffffff !important;
}

/* Ajuste sutil de la barra de scroll de la lista */
.enar-autocomplete-lista::-webkit-scrollbar {
    width: 6px;
}
.enar-autocomplete-lista::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 10px;
}


/* --- E. UPLOAD DROPZONE PERSONALIZADO --- */
/* Contenedor principal */
.enar-dropzone-wrapper {
    width: 100%;
    margin-top: 5px;
}

/* La zona de arrastre (Caja punteada) */
.enar-dropzone {
    border: 2px dashed #b5b5b5;
    border-radius: 8px;
    padding: 30px 20px;
    text-align: center;
    background-color: #fbfbfb;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Efecto Hover o cuando arrastrás un archivo encima */
.enar-dropzone.is-dragover,
.enar-dropzone:hover {
    background-color: #eaf5f4; 
    border-color: #077066;     
}

/* Ícono de la nubecita/subida */
.enar-dropzone-icon svg {
    fill: #077066;
    margin-bottom: 10px;
    transition: transform 0.3s ease;
}
.enar-dropzone:hover .enar-dropzone-icon svg {
    transform: translateY(-5px); 
}

/* Textos de la caja */
.enar-dropzone-text {
    font-size: 15px;
    color: #333;
    margin-bottom: 5px;
}
.enar-dropzone-browse {
    color: #077066;
    font-weight: 700;
}
.enar-dropzone-subtext {
    font-size: 12px;
    color: #777;
}

/* Lista de archivos subidos */
.enar-dropzone-filelist {
    list-style: none !important;
    padding: 0 !important;
    margin: 15px 0 0 0 !important;
}

.enar-dropzone-filelist li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
    border: 1px solid #e5e5e5;
    padding: 10px 15px;
    border-radius: 6px;
    margin-bottom: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}

.enar-file-name {
    font-size: 13px;
    color: #444;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; 
    max-width: 85%;
}

.enar-file-name::before {
    content: "📄"; 
    margin-right: 8px;
}

/* El botón X para eliminar */
.enar-file-remove {
    color: #ff4d4d;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 4px;
    transition: background 0.2s;
}

.enar-file-remove:hover {
    background-color: #ffe6e6;
    color: #d00000;
}


/* --- F. TEXTAREA, ESPACIADOS Y AJUSTES FINALES --- */
/* Textarea de Comentarios: topes de tamaño y espaciados internos */
#form-field-correccion {
    resize: vertical !important; 
    min-height: 80px !important; 
    max-height: 130px !important; 
    overflow-y: auto !important; 
    padding-top: 8px;
    padding-bottom: 8px;
}

/* Scrollbar estilizada para el comentario */
#form-field-correccion::-webkit-scrollbar {
    width: 6px;
}
#form-field-correccion::-webkit-scrollbar-thumb {
    background-color: #077066; 
    border-radius: 10px;
}
#form-field-correccion::-webkit-scrollbar-track {
    background-color: #f1f1f1;
}

/* Ocultar label específico en el paso 2 */
.enar-popup-cuerpo .e-form__step:nth-child(2) .elementor-field-group:nth-child(3) .elementor-field-label {
    display: none;
}

/* Ajuste de padding top en la botonera siguiente */
.enar-popup-cuerpo .elementor-field-group-botonsuiguiente .elementor-field-group:nth-child(11) {
    padding-top: 15px;
}

/* ==========================================================================
   4.X.2. OTROS POPUPS (RESERVADO)
   ========================================================================== */
/* Aquí irán los estilos para futuros popups... */