/* CasaInversión 1.2.11 — menú móvil aislado y uniforme
   Este archivo se carga DESPUÉS de styles.css para neutralizar reglas históricas. */

#ciMobileDrawer { display: none; }

@media (max-width: 1024px) {
  html, body { max-width: 100%; }

  /* Header móvil: sólo logo + botón. No puede reaparecer el CTA de escritorio. */
  body #ciSiteHeader .ci-site-nav#ciSiteNavigation,
  body #ciSiteHeader .ci-site-header__cta {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  body #ciSiteHeader .ci-site-menu-button {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 5 !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin-left: auto !important;
    padding: 0 !important;
    place-items: center !important;
    border: 1px solid #d7e0eb !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #10203a !important;
    box-shadow: none !important;
    filter: none !important;
    -webkit-filter: none !important;
  }

  body #ciSiteHeader,
  body #ciSiteHeader .ci-site-header__bar,
  body #ciSiteHeader .ci-site-header__bar > .ci-public-container {
    filter: none !important;
    -webkit-filter: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html.ci-mobile-drawer-open,
  body.ci-mobile-drawer-open {
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  /* El menú ocupa el viewport completo. Evita diferencias entre visual/layout viewport de iOS. */
  body #ciMobileDrawer {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 2147483600 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: #fff !important;
    transform: none !important;
    filter: none !important;
    -webkit-filter: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    transition: opacity .16s ease, visibility 0s linear .16s !important;
  }

  body #ciMobileDrawer.is-open {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transition: opacity .16s ease !important;
  }

  /* No usamos overlay semitransparente: fondo 100% sólido e idéntico en todos los móviles. */
  body #ciMobileDrawer .ci-mobile-drawer__backdrop {
    display: none !important;
  }

  body #ciMobileDrawer #ciMobileNavigation {
    box-sizing: border-box !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: max(14px, env(safe-area-inset-top)) 20px max(18px, env(safe-area-inset-bottom)) !important;
    display: block !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    background: #fff !important;
    color: #13233d !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    filter: none !important;
    -webkit-filter: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    text-shadow: none !important;
    font-family: Montserrat, Arial, sans-serif !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__head {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    width: 100% !important;
    min-height: 68px !important;
    margin: 0 !important;
    padding: 0 0 14px !important;
    border: 0 !important;
    border-bottom: 1px solid #e1e7ef !important;
    background: #fff !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__brand {
    display: flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: calc(100% - 62px) !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-decoration: none !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__brand img {
    display: block !important;
    width: 156px !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 52px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__close {
    all: unset !important;
    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border: 1px solid #d7e0eb !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #10203a !important;
    cursor: pointer !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__close .material-symbols-outlined {
    display: block !important;
    font-size: 27px !important;
    line-height: 1 !important;
    color: inherit !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__label {
    display: block !important;
    width: 100% !important;
    margin: 24px 0 8px !important;
    padding: 0 4px 12px !important;
    color: #6a7b96 !important;
    border-bottom: 1px solid #e8edf3 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: .11em !important;
    text-transform: uppercase !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__nav {
    box-sizing: border-box !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__nav > a,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a:link,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a:visited {
    box-sizing: border-box !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 14px 6px !important;
    overflow: visible !important;
    color: #172844 !important;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #e7ecf2 !important;
    border-radius: 0 !important;
    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    text-decoration: none !important;
    text-indent: 0 !important;
    white-space: normal !important;
    transform: none !important;
    filter: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__nav > a::before,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a::after {
    display: none !important;
    content: none !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__nav > a:hover,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a:focus-visible,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a.is-active,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a[aria-current="page"] {
    color: #174f8a !important;
    background: #f5f7fa !important;
    padding-left: 12px !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__account,
  body #ciMobileDrawer .ci-mobile-drawer__account:link,
  body #ciMobileDrawer .ci-mobile-drawer__account:visited {
    box-sizing: border-box !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    width: 100% !important;
    min-height: 54px !important;
    margin: 24px 0 0 !important;
    padding: 12px 16px !important;
    color: #fff !important;
    background: #0d2f5d !important;
    border: 0 !important;
    border-radius: 8px !important;
    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    transform: none !important;
    filter: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__account .material-symbols-outlined {
    font-size: 21px !important;
    line-height: 1 !important;
    color: inherit !important;
  }

  /* Mata cualquier resto del sistema móvil anterior. */
  body .ci-mobile-menu-backdrop {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}

@media (max-width: 380px) {
  body #ciMobileDrawer #ciMobileNavigation { padding-left: 16px !important; padding-right: 16px !important; }
  body #ciMobileDrawer .ci-mobile-drawer__brand img { width: 142px !important; }
  body #ciMobileDrawer .ci-mobile-drawer__nav > a { font-size: 15px !important; min-height: 54px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body #ciMobileDrawer { transition: none !important; }
}


/* 1.2.11 — blindaje de interacción táctil.
   El panel es la única capa interactiva del menú; no existe backdrop dentro del drawer. */
@media (max-width: 1024px) {
  body #ciMobileDrawer.is-open,
  body #ciMobileDrawer.is-open #ciMobileNavigation,
  body #ciMobileDrawer.is-open .ci-mobile-drawer__head,
  body #ciMobileDrawer.is-open .ci-mobile-drawer__nav,
  body #ciMobileDrawer.is-open .ci-mobile-drawer__nav > a,
  body #ciMobileDrawer.is-open .ci-mobile-drawer__account,
  body #ciMobileDrawer.is-open .ci-mobile-drawer__brand,
  body #ciMobileDrawer.is-open .ci-mobile-drawer__close {
    pointer-events: auto !important;
  }

  body #ciMobileDrawer #ciMobileNavigation {
    z-index: 2 !important;
    isolation: isolate !important;
  }

  body #ciMobileDrawer .ci-mobile-drawer__nav,
  body #ciMobileDrawer .ci-mobile-drawer__nav > a,
  body #ciMobileDrawer .ci-mobile-drawer__account,
  body #ciMobileDrawer .ci-mobile-drawer__brand,
  body #ciMobileDrawer .ci-mobile-drawer__close {
    position: relative !important;
    z-index: 4 !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(0,0,0,.06);
  }

  /* Neutraliza cualquier pseudo-capa heredada que pudiera quedar sobre los enlaces. */
  body #ciMobileDrawer #ciMobileNavigation::before,
  body #ciMobileDrawer #ciMobileNavigation::after,
  body #ciMobileDrawer .ci-mobile-drawer__nav::before,
  body #ciMobileDrawer .ci-mobile-drawer__nav::after {
    content: none !important;
    display: none !important;
    pointer-events: none !important;
  }
}