/* =============================================================
   Rainverse - Mobile Menu Fix (dark-only theme)
   Applies ONLY under the mobile breakpoint used by the theme.
   Does NOT alter any desktop navigation/header markup or styles.
   ============================================================= */
@media (max-width: 1199px) {

  /* ---- MODERN slide-in: kill the green/purple gradient overlay ---- */
  [data-mobile-nav-style=modern]:before {
    background: #000118 !important;
    background-image: none !important;
  }
  /* Darken the page while the modern mobile menu is open */
  .mobile-nav-activated [data-mobile-nav-style=modern] #wrap,
  .module-expanding [data-mobile-nav-style=modern] #wrap,
  .module-collapsing [data-mobile-nav-style=modern] #wrap {
    background-color: #000118 !important;
  }
  /* The modern panel is a dark slide-in from the right */
  [data-mobile-nav-style=modern] .navbar-collapse-clone {
    background: none !important;
    box-shadow: none !important;
  }

  /* ---- Mobile panel: force dark to match the site's dark-only theme ---- */
  .navbar-collapse,
  #main-header-collapse,
  .navbar-collapse-clone {
    background-color: #000118 !important; /* match site dark */
    color: #e0ebff !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
  }

  /* ---- Top-level nav links ---- */
  #primary-nav > li > a,
  #primary-nav .lqd-custom-menu > li > a {
    color: #e0ebff !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
  }
  #primary-nav > li > a:hover,
  #primary-nav > li > a:focus,
  #primary-nav > li.active > a,
  #primary-nav > li.current-menu-item > a {
    color: #fff !important;
  }

  /* ---- Submenu expander (chevron) toggle ---- */
  #primary-nav .submenu-expander {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: #fff !important;
  }

  /* ---- Services / mega menu: simple stacked dark list ----
     Collapsed by default; expands when the parent li is toggled. */
  #primary-nav .megamenu .nav-item-children {
    display: none;
    padding-left: 0;
    padding-right: 0;
    background: transparent !important;
  }
  #primary-nav .megamenu > li.active > .nav-item-children,
  #primary-nav .megamenu .nav-item-children.active {
    display: block;
  }

  #primary-nav .megamenu .megamenu-column {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
  #primary-nav .megamenu .megamenu-column .megamenu-heading {
    color: #5ab3ff !important;
    font-size: 15px;
    margin-top: 14px;
    margin-bottom: 4px;
  }
  #primary-nav .megamenu .megamenu-column h4.megamenu-heading {
    color: #337ab7 !important;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 2px;
  }
  #primary-nav .megamenu .megamenu-column .lqd-custom-menu > li > a {
    display: block;
    padding: 6px 0;
    color: #b4bdcd !important;
  }
  #primary-nav .megamenu .megamenu-column .lqd-custom-menu > li > a:hover {
    color: #fff !important;
  }

  /* Hide the big decorative image in the mobile Services list */
  #primary-nav .megamenu .liquid-img-group-container,
  #primary-nav .megamenu .liquid-img-group-single,
  #primary-nav .megamenu figure {
    display: none !important;
  }

  /* ---- Inner sub-headings inside the mobile list ---- */
  .navbar-collapse .megamenu .ld-container,
  .navbar-collapse .megamenu .vc_column-inner,
  .navbar-collapse .megamenu .ld-row {
    background: transparent !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
