/*!
 * Landing chrome — unique filename (nginx caches /css/ immutable).
 * Separate prime-nav labels without shrinking the utility cluster.
 */

@media (min-width: 1280px) {
  html[data-active-module="landing"] body.erp-body #navbar #navMenu,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.55rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a.nav-link {
    padding: 0 0.28rem !important;
    font-size: 0.8rem !important;
    white-space: nowrap !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li.partners-li,
  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li.about-li {
    display: flex !important;
  }
}

/* Keep the compact Search slot until the bar is wide enough for full labels. */
@media (min-width: 1280px) and (max-width: 1679px) {
  html[data-active-module="landing"] body.erp-body #navbar #util-bar #utilAiSearchSlot,
  html[data-active-module="landing"] body.erp-body #navbar #util-bar .util-ai-search-slot,
  html[data-active-module="landing"] body.erp-body #navbar #util-bar #us-trigger,
  html[data-active-module="landing"] body.erp-body #navbar #util-bar .us-trigger,
  html[data-active-module="landing"] body.erp-body #navbar #utilAiSearchSlot .us-trigger {
    width: 8.25rem !important;
    min-width: 8.25rem !important;
    max-width: 8.25rem !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
  }
}

/* Laptop: reclaim chevron width so Partners / About can stay on the bar. */
@media (min-width: 1280px) and (max-width: 1679px) {
  html[data-active-module="landing"] body.erp-body #navbar.erp-shell-navbar,
  html[data-active-module="landing"] body.erp-body nav.navbar.erp-shell-navbar {
    padding: 0 0.55rem 0 0.65rem !important;
    gap: 0.35rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container,
  html[data-active-module="landing"] body.erp-body #navbar .nav-container {
    max-width: calc(100% - 23.8rem) !important;
    gap: 0.25rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu {
    gap: 0.38rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a.nav-link {
    padding: 0 0.14rem !important;
    font-size: 0.8rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a .nav-chevron,
  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a .pp-chevron,
  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a .material-symbols-outlined {
    display: none !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.erp-body #navbar #util-bar,
  html[data-active-module="landing"] body.erp-body #navbar #util-bar {
    padding-right: 0.3rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > a.logo.enhanced-logo,
  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > #erpAppSwitcher,
  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > .erp-app-switcher {
    margin-right: 0 !important;
  }
}

/* Tightest laptop: keep every label, but give Help a few pixels before Search. */
@media (min-width: 1280px) and (max-width: 1359px) {
  html[data-active-module="landing"] body.erp-body #navbar #navMenu,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu {
    gap: 0.32rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a.nav-link {
    padding: 0 0.08rem !important;
    font-size: 0.78rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > a.logo.enhanced-logo > svg,
  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > a.logo.enhanced-logo {
    margin-right: 0 !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > #erpAppSwitcher,
  html[data-active-module="landing"] body.erp-body #navbar .container.nav-container > .erp-app-switcher {
    width: 2rem !important;
    min-width: 2rem !important;
    height: 2rem !important;
  }
}

@media (min-width: 1600px) and (max-width: 1679px) {
  html[data-active-module="landing"] body.erp-body #navbar #navMenu,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu {
    gap: 0.5rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a.nav-link {
    padding: 0 0.2rem !important;
    font-size: 0.8rem !important;
  }
}

@media (min-width: 1440px) and (max-width: 1599px) {
  html[data-active-module="landing"] body.erp-body #navbar #navMenu,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu {
    gap: 0.48rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a.nav-link {
    padding: 0 0.22rem !important;
  }
}

@media (min-width: 1680px) {
  html[data-active-module="landing"] body.erp-body #navbar #navMenu,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu {
    gap: 0.62rem !important;
  }

  html[data-active-module="landing"] body.erp-body #navbar #navMenu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a,
  html[data-active-module="landing"] body.erp-body #navbar .nav-menu > li > a.nav-link {
    padding: 0 0.32rem !important;
    font-size: 0.82rem !important;
  }
}
