/* V874 · balanced desktop header.
   V873 centered the primary navigation against the entire viewport, which
   created an excessive empty gap after the brand.  The correct geometry is:
   brand | available navigation area | utilities.  The nav is centered inside
   that available area, while V870's intrinsic canvas still prevents overlap
   during browser zoom. */

html.app-desktop-device body.app-modern-shell .app-header,
html.app-desktop-device body.app-modern-shell.products-modern-body .app-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1300 !important;
  display: grid !important;
  grid-template-columns: 170px minmax(0, 1fr) !important;
  grid-template-rows: 44px !important;
  align-items: center !important;
  column-gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 var(--gm-actions-reserve, 360px) 0 20px !important;
  overflow: visible !important;
  transform: none !important;
}

html.app-desktop-device body.app-modern-shell .brand,
html.app-desktop-device body.app-modern-shell.products-modern-body .brand {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  width: 170px !important;
  min-width: 170px !important;
  max-width: 170px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  overflow: visible !important;
}

html.app-desktop-device body.app-modern-shell .main-nav,
html.app-desktop-device body.app-modern-shell.products-modern-body .main-nav {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  overflow: visible !important;
  transform: none !important;
  transition: none !important;
}

/* Keep the actual menu at its intrinsic width; centering is performed by the
   parent navigation track, not by an absolute 50% transform. */
html.app-desktop-device body.app-modern-shell .main-nav-menu,
html.app-desktop-device body.app-modern-shell.products-modern-body .main-nav-menu {
  position: relative !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  flex: 0 0 auto !important;
}
