/* Clean collapsed rail: one fixed axis, no scroll/flyout layout. */
html body.sidebar-collapsed .app-shell > .app-sidebar {
  width: 68px !important;
  min-width: 68px !important;
  flex: 0 0 68px !important;
  overflow: hidden !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu {
  width: 68px !important;
  min-width: 68px !important;
  margin: 0 !important;
  padding: 18px 0 12px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html body.sidebar-collapsed .app-sidebar-menu > nav.nav {
  width: 68px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px !important;
  align-items: center !important;
  /* The inherited menu rail retains a 16px left content offset. */
  position: relative !important;
  left: -16px !important;
}

html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .side-link,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup {
  position: static !important;
  width: 46px !important;
  min-width: 46px !important;
  height: 42px !important;
  min-height: 42px !important;
  flex: 0 0 46px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
  align-self: center !important;
}

html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .side-link,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  color: #c5d2cb !important;
}

html body.sidebar-collapsed .app-sidebar-menu .menu-text,
html body.sidebar-collapsed .app-sidebar-menu .app-navchev,
html body.sidebar-collapsed .app-sidebar-menu .app-navgroup-body {
  display: none !important;
}

html body.sidebar-collapsed .app-sidebar-menu .menu-icon {
  display: block !important;
  width: 18px !important;
  margin: 0 !important;
  text-align: center !important;
  line-height: 1 !important;
  font-size: 17px !important;
}

html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .sidebar-section-label {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  width: 50px !important;
  min-width: 50px !important;
  height: 18px !important;
  min-height: 18px !important;
  flex: 0 0 50px !important;
  margin: 7px auto !important;
  padding: 0 !important;
  gap: 6px !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .sidebar-section-label::before,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .sidebar-section-label::after {
  content: "" !important;
  display: block !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  min-width: 0 !important;
  background: rgba(151, 181, 161, .42) !important;
}

html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .sidebar-section-label span {
  display: block !important;
  flex: 0 0 7px !important;
  width: 7px !important;
  height: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;
  transform: rotate(45deg) !important;
  background: #294638 !important;
  border: 1px solid rgba(246, 214, 108, .74) !important;
  box-shadow: 0 0 0 2px #24332b !important;
}

html body.sidebar-collapsed .app-sidebar-menu::before,
html body.sidebar-collapsed .app-sidebar-menu::after {
  display: none !important;
}

html body.sidebar-collapsed .app-sidebar > .sidebar-header-divider {
  width: 50px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Hover belongs to the individual icon target, never to the nav wrapper. */
html body.sidebar-collapsed .app-sidebar-menu > nav.nav,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup {
  background: transparent !important;
  box-shadow: none !important;
}
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .side-link,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn {
  background: transparent !important;
  box-shadow: none !important;
}
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .side-link::before,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn::before {
  display: none !important;
}
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .side-link:hover,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn:hover {
  background: transparent !important;
  color: #fff !important;
  transform: none !important;
}
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .side-link:hover .menu-icon,
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup:not(:has(.app-navgroup-btn.active)) > .app-navgroup-btn:hover .menu-icon {
  display: grid !important;
  place-items: center !important;
  width: 46px !important;
  height: 42px !important;
  border-radius: 7px !important;
  background: rgba(246, 214, 108, .1) !important;
  color: #fff !important;
}

/* Organizational Structure already owns its 46x42px hover surface on the
   parent button; do not add a second surface to its child icon. */
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn:hover {
  background: linear-gradient(90deg, rgba(246, 214, 108, .18), rgba(57, 141, 92, .14) 55%, rgba(57, 141, 92, .04)) !important;
  color: #fff !important;
}
html body.sidebar-collapsed .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn:hover .menu-icon {
  display: block !important;
  width: 18px !important;
  height: auto !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
}

/* Total collapsed-rail revamp. Keep this block self-contained so the
   accumulated expanded-sidebar rules cannot affect the compact layout. */
html body.sidebar-collapsed .app-shell > .app-sidebar,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-header,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu {
  box-sizing: border-box !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar {
  width: 68px !important;
  min-width: 68px !important;
  flex: 0 0 68px !important;
  padding: 0 !important;
  background: linear-gradient(180deg, #263d31 0%, #1d3026 52%, #18291f 100%) !important;
  border-right: 1px solid rgba(151, 181, 161, .18) !important;
  overflow: hidden !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-header {
  width: 68px !important;
  height: 76px !important;
  min-height: 76px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-bottom: 1px solid rgba(151, 181, 161, .18) !important;
  background: transparent !important;
  overflow: hidden !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-header .app-brand-logo {
  display: flex !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  transform: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-header .app-sidebar-logo {
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-header .app-sidebar-toggle {
  display: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .sidebar-header-divider {
  position: static !important;
  display: flex !important;
  width: 50px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu {
  width: 68px !important;
  min-width: 68px !important;
  height: calc(100vh - 94px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 13px 0 16px !important;
  overflow: hidden !important;
  background: transparent !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav {
  position: static !important;
  display: flex !important;
  width: 68px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 5px !important;
  align-items: center !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .side-link,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup {
  position: static !important;
  display: flex !important;
  width: 46px !important;
  min-width: 46px !important;
  height: 42px !important;
  min-height: 42px !important;
  flex: 0 0 46px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  align-self: center !important;
  transform: none !important;
  overflow: visible !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .side-link,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #b9c9bf !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .side-link:hover,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn:hover {
  border-color: rgba(246, 214, 108, .28) !important;
  background: rgba(246, 214, 108, .1) !important;
  color: #fff !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .side-link.active,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-btn.active {
  border-color: rgba(246, 214, 108, .48) !important;
  background: rgba(246, 214, 108, .14) !important;
  color: #f6d66c !important;
}

html body.sidebar-collapsed .app-sidebar-menu .menu-text,
html body.sidebar-collapsed .app-sidebar-menu .app-navchev,
html body.sidebar-collapsed .app-sidebar-menu .app-navgroup-body {
  display: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu .menu-icon {
  display: block !important;
  width: 18px !important;
  height: auto !important;
  margin: 0 !important;
  text-align: center !important;
  line-height: 1 !important;
  font-size: 17px !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label {
  position: static !important;
  display: flex !important;
  width: 50px !important;
  min-width: 50px !important;
  height: 18px !important;
  min-height: 18px !important;
  flex: 0 0 50px !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 7px auto !important;
  padding: 0 !important;
  transform: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label::before,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label::after {
  content: "" !important;
  display: block !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  min-width: 0 !important;
  background: rgba(151, 181, 161, .42) !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label span {
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  flex: 0 0 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0 !important;
  overflow: hidden !important;
  transform: rotate(45deg) !important;
  background: #294638 !important;
  border: 1px solid rgba(246, 214, 108, .74) !important;
  box-shadow: 0 0 0 2px #1d3026 !important;
}

/* Keep both section dividers identical regardless of their position in the
   navigation flow. */
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-master-data::before,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-master-data::after,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-settings::before,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-settings::after {
  content: "" !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex: 1 1 auto !important;
  width: auto !important;
  height: 1px !important;
  background: rgba(151, 181, 161, .42) !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label::before,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label::after {
  display: none !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label > .sidebar-section-rule {
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  height: 1px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(151, 181, 161, .42) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Expanded mode: both section labels share exactly the same geometry. */
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-master-data,
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-settings {
  position: relative !important;
  display: flex !important;
  width: calc(100% - 10px) !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 8px 5px 1px !important;
  padding: 0 !important;
  align-items: center !important;
  gap: 9px !important;
  transform: none !important;
}
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-master-data::before,
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-master-data::after,
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-settings::before,
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-settings::after {
  content: "" !important;
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  height: 1px !important;
  min-width: 0 !important;
  background: rgba(151, 181, 161, .28) !important;
}
html body:not(.sidebar-collapsed) .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .sidebar-section-label > .sidebar-section-rule {
  display: none !important;
}

html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu::before,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu::after {
  display: none !important;
}

/* Plain links use the same single hover surface as the three parent groups;
   their child icon must remain visually transparent. */
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .side-link:hover .menu-icon,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .side-link.active .menu-icon {
  display: block !important;
  width: 18px !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
}

/* In collapsed mode the topbar toggle owns the single compact logo. Hide the
   full wordmark in the sidebar header to prevent two logos being rendered. */
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-header .app-brand-logo {
  display: none !important;
}

/* Collapsed navigation keeps submenus as right-side flyouts. */
html body.sidebar-collapsed .app-shell > .app-sidebar,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav {
  overflow: visible !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup {
  position: relative !important;
  overflow: visible !important;
  z-index: 1 !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-body {
  display: none !important;
  position: absolute !important;
  top: 0 !important;
  left: 53px !important;
  width: 218px !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 1px solid rgba(135, 171, 148, .3) !important;
  border-radius: 10px !important;
  background: rgba(31, 51, 42, .98) !important;
  box-shadow: 0 16px 34px rgba(3, 16, 10, .36), inset 0 1px rgba(255, 255, 255, .06) !important;
  z-index: 20 !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup:hover > .app-navgroup-body {
  display: block !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-body .side-sublink {
  display: flex !important;
  width: 100% !important;
  height: auto !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  border-radius: 7px !important;
  color: #c5d2cb !important;
  transform: none !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-body .side-sublink:hover,
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-body .side-sublink.active {
  background: rgba(98, 210, 139, .14) !important;
  color: #d9f5e2 !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-body .side-sublink .menu-text {
  display: inline !important;
  overflow: visible !important;
  white-space: nowrap !important;
}
html body.sidebar-collapsed .app-shell > .app-sidebar > .app-sidebar-menu > nav.nav > .app-navgroup > .app-navgroup-body .side-sublink .sub-icon {
  display: block !important;
  width: 16px !important;
  margin: 0 !important;
  text-align: center !important;
}
