/* ============================================================
   FUNDACIONFORENSIS.EDU.CO — CORRECCIÓN TÉCNICA INTEGRAL
   v1.0.0 | Angie Snippets 1f770622
   ============================================================ */


/* ============================================================
   1. ELEMENTSKIT NAV MENU — BASE & DESKTOP
   ============================================================ */

/* Estabilizar el contenedor del menú */
.elementskit-menu-container,
.elementskit-navbar-nav-wrapper {
    position: relative;
    z-index: 999;
}

/* Overlay del menú: inerte excepto cuando está activo */
.elementskit-menu-overlay {
    pointer-events: none;
}
.elementskit-menu-overlay.active {
    pointer-events: all;
}

/* Hamburguesa base */
.elementskit-menu-hamburger,
.elementskit-menu-toggler {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1000;
    position: relative;
}


/* ============================================================
   2. BLOQUEO LIMPIO DE BANNERS, COOKIES Y OVERLAYS
      Elimina por completo los elementos — sin dejar capas
      transparentes que bloqueen los clics.
   ============================================================ */

.cookie-banner,
#CookieConsent,
.sidebar-ad,
.ad-banner,
.advertisement,
[class*="cookie-notice"],
[id*="cookie-notice"],
[class*="gdpr-notice"],
[class*="consent-banner"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
}

/* Backdrop de modales: sin bloqueo de clic residual */
.modal-backdrop {
    display: none !important;
    pointer-events: none !important;
}

/* Overlays genéricos: inertes salvo los nativos de Elementor */
[class*="overlay"]:not(.elementor-motion-effects-layer):not(.elementor-background-overlay):not(.ekit-menu-overlay) {
    pointer-events: none !important;
}

/* Asegurar scroll cuando hay modales */
body.modal-open {
    overflow: auto !important;
    padding-right: 0 !important;
}


/* ============================================================
   3. MEDIA QUERIES AGRUPADAS
   ============================================================ */

/* ── TABLET (768px – 1024px) ─────────────────────────────── */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .elementskit-navbar-nav > li > a {
        padding: 10px 14px;
        font-size: 14px;
    }
    .elementskit-submenu-panel {
        min-width: 200px;
    }
}

/* ── MÓVIL (≤767px) ──────────────────────────────────────── */
@media screen and (max-width: 767px) {

    /* Hamburguesa visible y sobre todo */
    .elementskit-menu-hamburger,
    .elementskit-menu-toggler {
        display: flex !important;
        z-index: 1001;
    }

    /* Wrapper: desplegarse debajo del header sin saltar el layout */
    .elementskit-navbar-nav-wrapper {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        z-index: 999;
        background: #fff;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    }

    /* Lista principal: full-width, sin desbordamiento */
    .elementskit-navbar-nav {
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .elementskit-navbar-nav > li {
        width: 100%;
        border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    }

    .elementskit-navbar-nav > li > a {
        padding: 13px 20px;
        display: block;
        width: 100%;
    }

    /* Submenús: relativos, sin superposición absoluta */
    .elementskit-dropdown > .elementskit-submenu-panel {
        display: none;
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        box-shadow: none !important;
        border: none !important;
        background: rgba(0, 0, 0, 0.03) !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transition: none !important;
    }
    .elementskit-dropdown.elementskit-open > .elementskit-submenu-panel {
        display: block;
    }

    /* Subítem de segundo nivel */
    .elementskit-submenu-panel li a {
        padding: 10px 30px;
        display: block;
        font-size: 0.9em;
    }

    /* Overlay del menú: nunca bloquea en móvil */
    .elementskit-menu-overlay,
    .ekit-menu-overlay {
        pointer-events: none !important;
    }
}

/* ============================================================
   4. Corrección: Botones Circulares de Acceso (Móvil)
   ============================================================ */
@media (max-width: 767px) {
  /* Al contenedor principal le damos formato de cuadrícula flexible */
  .ff-botones-acceso {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 15px !important;
  }
  
  /* Hacemos que cada botón/círculo ocupe menos de la mitad y tenga un tope */
  .ff-botones-acceso > .e-con,
  .ff-botones-acceso > .elementor-widget,
  .ff-botones-acceso > .elementor-column {
    width: calc(50% - 15px) !important; 
    max-width: 140px !important; 
    margin-bottom: 10px !important;
  }

  /* Reducimos el tamaño de los textos dentro del botón */
  .ff-botones-acceso .elementor-heading-title,
  .ff-botones-acceso .elementor-icon-box-title,
  .ff-botones-acceso span {
    font-size: 12px !important;
    line-height: 1.2 !important;
  }

  /* Reducimos el tamaño de los íconos o imágenes dentro */
  .ff-botones-acceso img,
  .ff-botones-acceso svg,
  .ff-botones-acceso i {
    max-width: 45px !important;
    height: auto !important;
    font-size: 45px !important; 
  }
}