/* Mobile menu: solid panel + page blur scrim; scroll lock while open */

@media (max-width: 767px) {
  body.mobile-nav-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    touch-action: none;
  }

  html.mobile-nav-open {
    overflow: hidden;
  }

  /* Blur + dim the landing page behind the menu */
  body.mobile-nav-open::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 99990;
    background: rgba(248, 250, 252, 0.55);
    backdrop-filter: blur(32px) saturate(1.1);
    -webkit-backdrop-filter: blur(32px) saturate(1.1);
    pointer-events: none;
  }

  body.mobile-nav-open .header,
  body.mobile-nav-open #siteHeader {
    z-index: 100000;
  }

  body.mobile-nav-open .mobile-nav.active {
    z-index: 99999;
    background: #f8fafc !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .mobile-nav .mobile-nav-cta-pill {
    width: auto;
    max-width: min(100%, 18.5rem);
    margin-top: 0.35rem;
    margin-inline: auto;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(13, 148, 136, 0.28);
  }

  .mobile-nav .mobile-nav-cta-pill-btn {
    width: auto;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.5rem 0.6rem;
    gap: 0.35rem;
    border-radius: 0;
  }

  .mobile-nav .mobile-nav-cta-pill-btn i {
    font-size: 0.72rem;
  }

  .mobile-nav .mobile-nav-cta-pill-divider {
    margin: 0.3rem 0;
  }

  body.mobile-nav-open #chatbot-container,
  body.mobile-nav-open .se-scroll-up,
  body.mobile-nav-open .uwy,
  body.mobile-nav-open .uwy-container,
  body.mobile-nav-open #userwayAccessibilityIcon,
  body.mobile-nav-open .acsb-trigger,
  body.mobile-nav-open .acsb-widget,
  body.mobile-nav-open [data-acsb-custom-trigger],
  body.mobile-nav-open [class*="userway"],
  body.mobile-nav-open [id*="userway"],
  body.mobile-nav-open [id*="UserWay"] {
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
  }
}

@media (prefers-color-scheme: dark) {
  @media (max-width: 767px) {
    body.mobile-nav-open::before {
      background: rgba(2, 6, 23, 0.65);
      backdrop-filter: blur(32px) saturate(1.05);
      -webkit-backdrop-filter: blur(32px) saturate(1.05);
    }

    body.mobile-nav-open .mobile-nav.active {
      background: #0f172a !important;
    }
  }
}