/*
 * OmniVenta V63.26
 * Mobile top navigation must follow the selected UI theme.
 * Loaded after the legacy responsive layers and after dark-mode CSS.
 */
@media (max-width: 767px) {
  .content > .top-bar,
  .content > .top-bar > nav.navbar,
  .content > .top-bar > .navbar,
  .top-bar.navbar,
  nav.navbar.navbar-default.top-bar {
    background: linear-gradient(
      105deg,
      var(--ov-primary-deep, #62409a),
      var(--ov-primary, #8155b8),
      var(--ov-primary-soft, #9a71c9)
    ) !important;
    background-color: var(--ov-primary, #8155b8) !important;
    border-color: var(--ov-primary, #8155b8) !important;
  }

  /* Legacy all.css paints the mobile nav list blue. Keep it transparent
     so the selected theme surface behind it remains visible. */
  .top-bar .navbar-nav,
  .top-bar .navbar-default,
  .top-bar .navbar-header,
  .top-bar .navbar-collapse,
  .top-bar .top-elements {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
  }

  .top-bar .navbar-default .navbar-nav > li > a,
  .top-bar .navbar-default .navbar-right.navbar-nav > li > a,
  .top-bar .top-elements > li > a,
  .top-bar .menu-bar-mobile {
    background: transparent !important;
    background-color: transparent !important;
  }

  /* Preserve readable header icons over every bundled theme. */
  .top-bar .menu-bar-mobile,
  .top-bar .menu-bar-mobile i,
  .top-bar .navbar-nav > li > a,
  .top-bar .top-elements > li > a,
  .top-bar .top-elements > li > a i,
  .top-bar .top-elements > li > a span {
    color: #fff !important;
  }
}