/* Mobile navbar layout styles */
@media (max-width: 991.98px) {
  /* Collapsed mobile menu: stack its sections vertically, full width,
     so links never overflow into a horizontally-scrolling row. */
  .mobile-menu-bar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    padding: 0.5rem 0;
  }

  /* Main nav links stack vertically instead of sitting in a row */
  .mobile-menu-bar .navbar-nav {
    margin: 0 !important;
    flex-direction: column !important;
    width: 100%;
    padding: 0;
  }

  .mobile-menu-bar .nav-item {
    display: block;
    width: 100%;
    margin: 0;
  }

  .mobile-menu-bar .nav-link {
    padding: 0.6rem 0.25rem;
    white-space: normal;
  }

  /* Auth + language controls sit on their own full-width row below the links */
  .mobile-menu-bar > .d-flex {
    width: 100%;
    margin-top: 0.25rem;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }

  /* Dropdown menus (language / user) */
  .mobile-menu-bar .dropdown-menu {
    position: absolute;
    min-width: 8rem;
  }

  /* Keep dropdowns aligned right so they stay inside the viewport */
  .navbar-nav .dropdown-menu {
    right: 0;
    left: auto;
  }

  /* Collapsed menu spacing */
  #mobileNavbar {
    margin-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 0.5rem;
  }

  .d-lg-none.show {
    display: block !important;
  }

  /* Prevent desktop-only elements from showing on mobile */
  .d-none.d-lg-flex {
    display: none !important;
  }
}

/* Hide mobile menu / toggler on desktop */
@media (min-width: 992px) {
  #mobileNavbar,
  .navbar-toggler {
    display: none !important;
  }
}