/* Clean Table Lab rail contract.
   This file loads after the legacy sidebar polish layers and owns the rail
   geometry in one place for expanded, offcanvas, and browser-zoom states. */
:root {
  --pd-sidebar-transition-duration: 260ms;
  --pd-sidebar-transition-timing: ease;
  --pd-sidebar-rail-indicator-transition-duration: 300ms;
  --pd-sidebar-rail-indicator-transition-timing: ease-out;
  --pd-sidebar-rail-active-y-offset: 0px;
  --pd-sidebar-rail-icon-y-offset: 0px;
  --pd-sidebar-rail-background-color: #000000;
  --pd-sidebar-rail-active-circle-color: #1f2b36;
  --pd-sidebar-rail-active-icon-color: #f6c343;
}

/* USER UPDATE: shadcn sidebar wrapper canvas surface.
   The wrapper is the visible canvas around the rounded workspace corner, so it
   follows the shadcn dashboard-01 neutral frame while the rail socket keeps the
   white panel surface for alignment. */
html .app-shell[data-slot="sidebar-wrapper"],
html body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
  background: var(--pd-app-frame-background, var(--sidebar, #fafafa)) !important;
}

/* USER UPDATE: formalize the active/inactive rail as a permanent contract.
   scripts/runtime-sidebar-rail.js owns scheduling/measurement;
   this stylesheet owns named offsets, dimensions, layers, and motion. */

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] {
  --pd-table-lab-sidebar-surface: var(--pd-app-frame-background, var(--sidebar, #fafafa)) !important;
  --pd-table-lab-rail-width: 41px !important;
  --pd-table-lab-content-x: 56px !important;
  --pd-table-lab-content-right: 10px !important;
  --pd-table-lab-socket-left: 14.7px !important;
  --pd-table-lab-socket-width: 55px !important;
  --pd-table-lab-socket-height: 84px !important;
  --pd-table-lab-circle-left: 24.5px !important;
  --pd-table-lab-circle-size: 30px !important;
  --pd-table-lab-icon-size: 17px !important;
  --pd-table-lab-inactive-icon-left: 12.5px !important;
  --pd-table-lab-inactive-icon-size: 16px !important;
  --pd-sidebar-rail-active-y-offset: 0px !important;
  --pd-sidebar-rail-icon-y-offset: 0px !important;
  --pd-sidebar-rail-footer-safe-gap: 6px !important;
  --pd-table-lab-row-height: 40px !important;
  --pd-table-lab-row-pad-left: 8px !important;
  --pd-table-lab-row-pad-right: 9px !important;
  --pd-table-lab-highlight-left: -25px !important;
  --pd-table-lab-highlight-height: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: var(--pd-table-lab-sidebar-surface) !important;
  background-image: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"]::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"]::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  z-index: 0 !important;
  display: block !important;
  width: var(--pd-table-lab-rail-width) !important;
  background: var(--pd-sidebar-rail-background-color, #000000) !important;
  border: 0 !important;
  /* USER FIX: rounded black sidebar rail outer corners. */
  border-radius: 12px 0 0 12px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search):not(.sidebar-footer-search-icon):not(.sidebar-account-footer),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search):not(.sidebar-footer-search-icon):not(.sidebar-account-footer) {
  position: relative !important;
  z-index: 3 !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-main-content[data-slot="sidebar-content"],
.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  padding-left: var(--pd-table-lab-content-x) !important;
  padding-right: var(--pd-table-lab-content-right) !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-main-content[data-slot="sidebar-content"] {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-bottom: 10px !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
  min-height: auto !important;
  margin-top: auto !important;
  border-top: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content {
  margin-left: 0 !important;
  padding: 8px 0 !important;
  border-left: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  position: relative !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  height: var(--pd-table-lab-row-height) !important;
  min-height: var(--pd-table-lab-row-height) !important;
  padding: 0 var(--pd-table-lab-row-pad-right) 0 var(--pd-table-lab-row-pad-left) !important;
  gap: 10px !important;
  overflow: visible !important;
  background: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item::after {
  content: none !important;
  display: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before {
  content: "" !important;
  position: absolute !important;
  left: var(--pd-table-lab-highlight-left) !important;
  right: 0 !important;
  top: 50% !important;
  z-index: 0 !important;
  display: block !important;
  height: var(--pd-table-lab-highlight-height) !important;
  border-radius: 0 16px 16px 0 !important;
  background: var(--pd-sidebar-enterprise-active-bg, var(--pd-app-frame-surface, #ffffff)) !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > *,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > * {
  position: relative !important;
  z-index: 2 !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .nav-item-icon,
.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .nav-icon,
.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .folder-ui-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .nav-item-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .nav-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .folder-ui-icon {
  display: inline-grid !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  color: transparent !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket:not([hidden]) {
  position: absolute !important;
  left: var(--pd-table-lab-socket-left) !important;
  top: calc(var(--sidebar-active-socket-top, 62.5px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  z-index: 1 !important;
  display: block !important;
  width: var(--pd-table-lab-socket-width) !important;
  height: var(--pd-table-lab-socket-height) !important;
  overflow: visible !important;
  pointer-events: none !important;
  transition: top var(--pd-sidebar-rail-indicator-transition-duration, 300ms) var(--pd-sidebar-rail-indicator-transition-timing, ease-out) !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket path,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket path {
  fill: var(--pd-table-lab-sidebar-surface) !important;
  stroke: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator:not([hidden]) {
  position: absolute !important;
  left: var(--pd-table-lab-circle-left) !important;
  top: calc(var(--sidebar-active-indicator-top, 92px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  z-index: 40 !important;
  display: grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-circle-size) !important;
  min-width: var(--pd-table-lab-circle-size) !important;
  height: var(--pd-table-lab-circle-size) !important;
  min-height: var(--pd-table-lab-circle-size) !important;
  border-radius: 999px !important;
  background: var(--pd-sidebar-rail-active-circle-color, #1f2b36) !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transform: none !important;
  transition: top var(--pd-sidebar-rail-indicator-transition-duration, 300ms) var(--pd-sidebar-rail-indicator-transition-timing, ease-out) !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source {
  position: static !important;
  inset: auto !important;
  display: inline-grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-icon-size) !important;
  min-width: var(--pd-table-lab-icon-size) !important;
  height: var(--pd-table-lab-icon-size) !important;
  min-height: var(--pd-table-lab-icon-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  font-size: var(--pd-table-lab-icon-size) !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.fi:not(.sidebar-svg-icon)::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.fi:not(.sidebar-svg-icon)::before {
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  font-size: var(--pd-table-lab-icon-size) !important;
  line-height: 1 !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer:not([hidden]) {
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  z-index: 30 !important;
  display: block !important;
  width: var(--pd-table-lab-rail-width) !important;
  overflow: visible !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  position: absolute !important;
  left: var(--pd-table-lab-inactive-icon-left) !important;
  top: calc(var(--sidebar-rail-icon-top, 0px) + var(--pd-sidebar-rail-icon-y-offset, 0px)) !important;
  display: grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-inactive-icon-size) !important;
  min-width: var(--pd-table-lab-inactive-icon-size) !important;
  height: var(--pd-table-lab-inactive-icon-size) !important;
  min-height: var(--pd-table-lab-inactive-icon-size) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source {
  position: static !important;
  display: inline-grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-inactive-icon-size) !important;
  min-width: var(--pd-table-lab-inactive-icon-size) !important;
  height: var(--pd-table-lab-inactive-icon-size) !important;
  min-height: var(--pd-table-lab-inactive-icon-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: var(--pd-table-lab-inactive-icon-size) !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .sidebar-svg-icon-legal-case {
  --pd-sidebar-nav-icon-mask: url("assets/legal-case.svg");
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .sidebar-svg-icon-laptop {
  --pd-sidebar-nav-icon-mask: url("assets/laptop.svg");
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .sidebar-active-rail-icon-source.sidebar-svg-icon,
.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .sidebar-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .sidebar-active-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .sidebar-rail-icon-source.sidebar-svg-icon {
  display: block !important;
  background-color: currentColor !important;
  -webkit-mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
  mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
}

.app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket,
.app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator,
.app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer,
.app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket,
.app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator,
.app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer,
body[class$="-theme"] .app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket,
body[class$="-theme"] .app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator,
body[class$="-theme"] .app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer,
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-socket,
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator,
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer {
  display: none !important;
}

/* Keep the active socket tied to the active rail indicator.
   If the rail indicator is intentionally hidden, the white socket curve must
   not remain on the black rail by itself. */
html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
html body.navigation-hidden-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
html body.navigation-hidden-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
html .app-shell .sidebar[data-slot="sidebar"][data-sidebar-active-rail-visible="false"] > .sidebar-active-rail-socket,
html .app-shell .sidebar[data-slot="sidebar"][data-sidebar-active-rail-visible="false"] > .sidebar-active-rail-indicator,
html body[class$="-theme"] .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
html body[class$="-theme"] .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-active-rail-visible="false"] > .sidebar-active-rail-socket,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-active-rail-visible="false"] > .sidebar-active-rail-indicator {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Single active owner guard.
   Older sidebar layers draw the active circle as nav-item::after and can win in
   responsive/collapsed zoom branches. Keep the row responsible only for the
   blue highlight; the independent rail indicator owns the dark circle/icon. */
.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon) {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* No-gate duplicate-circle kill switch.
   The user's live zoom branch can render before the ready attribute is present,
   so this final block must not depend on data-pd-rail-ready. */
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]) {
  left: 24.5px !important;
  top: calc(var(--sidebar-active-indicator-top, 92px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  z-index: 80 !important;
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  border-radius: 999px !important;
  background: var(--pd-sidebar-rail-active-circle-color, #1f2b36) !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transform: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source {
  position: static !important;
  inset: auto !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 17px !important;
  min-width: 17px !important;
  height: 17px !important;
  min-height: 17px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  font-size: 17px !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon {
  display: block !important;
  background-color: currentColor !important;
  -webkit-mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
  mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
}

/* Canonical Table Lab rail rebuild.
   This block intentionally does not depend on data-pd-rail-ready because the
   main app has several responsive/offcanvas zoom branches. The row never owns
   the active circle/icon; the injected rail socket and indicator do. */
.app-shell .sidebar[data-slot="sidebar"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-table-lab-sidebar-surface: var(--pd-app-frame-background, var(--sidebar, #fafafa)) !important;
  --pd-table-lab-rail-width: 41px !important;
  --pd-table-lab-content-x: 56px !important;
  --pd-table-lab-content-right: 10px !important;
  --pd-table-lab-socket-left: 14.7px !important;
  --pd-table-lab-socket-width: 55px !important;
  --pd-table-lab-socket-height: 84px !important;
  --pd-table-lab-circle-left: 24.5px !important;
  --pd-table-lab-circle-size: 30px !important;
  --pd-table-lab-icon-size: 17px !important;
  --pd-table-lab-inactive-icon-left: 12.5px !important;
  --pd-table-lab-inactive-icon-size: 16px !important;
  --pd-sidebar-rail-active-y-offset: 0px !important;
  --pd-sidebar-rail-icon-y-offset: 0px !important;
  --pd-sidebar-rail-footer-safe-gap: 6px !important;
  --pd-table-lab-row-height: 40px !important;
  --pd-table-lab-row-pad-left: 8px !important;
  --pd-table-lab-row-pad-right: 9px !important;
  --pd-table-lab-highlight-left: -25px !important;
  --pd-table-lab-highlight-height: 30px !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: var(--pd-table-lab-sidebar-surface) !important;
  background-color: var(--pd-table-lab-sidebar-surface) !important;
  background-image: none !important;
}

.app-shell .sidebar[data-slot="sidebar"]::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"]::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  z-index: 0 !important;
  display: block !important;
  width: var(--pd-table-lab-rail-width) !important;
  background: var(--pd-sidebar-rail-background-color, #000000) !important;
  border: 0 !important;
  /* USER FIX: rounded black sidebar rail outer corners. */
  border-radius: 12px 0 0 12px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search):not(.sidebar-footer-search-icon):not(.sidebar-account-footer),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search):not(.sidebar-footer-search-icon):not(.sidebar-account-footer) {
  position: relative !important;
  z-index: 3 !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  padding-left: var(--pd-table-lab-content-x) !important;
  padding-right: var(--pd-table-lab-content-right) !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-bottom: 10px !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
  min-height: auto !important;
  margin-top: auto !important;
  border-top: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content {
  margin-left: 0 !important;
  padding: 8px 0 !important;
  border-left: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  position: relative !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  height: var(--pd-table-lab-row-height) !important;
  min-height: var(--pd-table-lab-row-height) !important;
  padding: 0 var(--pd-table-lab-row-pad-right) 0 var(--pd-table-lab-row-pad-left) !important;
  gap: 10px !important;
  overflow: visible !important;
  background: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :not(.nav-item-icon):not(.nav-icon):not(.folder-ui-icon),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :not(.nav-item-icon):not(.nav-icon):not(.folder-ui-icon) {
  position: relative !important;
  z-index: 2 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before {
  content: "" !important;
  position: absolute !important;
  left: var(--pd-table-lab-highlight-left) !important;
  right: 0 !important;
  top: 50% !important;
  z-index: 0 !important;
  display: block !important;
  height: var(--pd-table-lab-highlight-height) !important;
  border-radius: 0 16px 16px 0 !important;
  background: var(--pd-sidebar-enterprise-active-bg, var(--pd-app-frame-surface, #ffffff)) !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item::after,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item::after,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.nav-item-icon, .nav-icon, .folder-ui-icon) {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket:not([hidden]) {
  position: absolute !important;
  left: var(--pd-table-lab-socket-left) !important;
  top: calc(var(--sidebar-active-socket-top, 62.5px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  z-index: 1 !important;
  display: block !important;
  width: var(--pd-table-lab-socket-width) !important;
  height: var(--pd-table-lab-socket-height) !important;
  overflow: visible !important;
  pointer-events: none !important;
  transition: top var(--pd-sidebar-rail-indicator-transition-duration, 300ms) var(--pd-sidebar-rail-indicator-transition-timing, ease-out) !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket path,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket path {
  fill: var(--pd-table-lab-sidebar-surface) !important;
  stroke: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]) {
  position: absolute !important;
  inset: auto auto auto var(--pd-table-lab-circle-left) !important;
  top: calc(var(--sidebar-active-indicator-top, 92px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  z-index: 80 !important;
  display: grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-circle-size) !important;
  min-width: var(--pd-table-lab-circle-size) !important;
  height: var(--pd-table-lab-circle-size) !important;
  min-height: var(--pd-table-lab-circle-size) !important;
  border-radius: 999px !important;
  background: var(--pd-sidebar-rail-active-circle-color, #1f2b36) !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transform: none !important;
  transition: top var(--pd-sidebar-rail-indicator-transition-duration, 300ms) var(--pd-sidebar-rail-indicator-transition-timing, ease-out) !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source {
  position: static !important;
  inset: auto !important;
  display: inline-grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-icon-size) !important;
  min-width: var(--pd-table-lab-icon-size) !important;
  height: var(--pd-table-lab-icon-size) !important;
  min-height: var(--pd-table-lab-icon-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  font-size: var(--pd-table-lab-icon-size) !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer:not([hidden]) {
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  z-index: 30 !important;
  display: block !important;
  width: var(--pd-table-lab-rail-width) !important;
  overflow: visible !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  position: absolute !important;
  left: var(--pd-table-lab-inactive-icon-left) !important;
  top: calc(var(--sidebar-rail-icon-top, 0px) + var(--pd-sidebar-rail-icon-y-offset, 0px)) !important;
  display: grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-inactive-icon-size) !important;
  min-width: var(--pd-table-lab-inactive-icon-size) !important;
  height: var(--pd-table-lab-inactive-icon-size) !important;
  min-height: var(--pd-table-lab-inactive-icon-size) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source {
  position: static !important;
  display: inline-grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-inactive-icon-size) !important;
  min-width: var(--pd-table-lab-inactive-icon-size) !important;
  height: var(--pd-table-lab-inactive-icon-size) !important;
  min-height: var(--pd-table-lab-inactive-icon-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: var(--pd-table-lab-inactive-icon-size) !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon-legal-case,
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source.sidebar-svg-icon-legal-case,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon-legal-case,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source.sidebar-svg-icon-legal-case {
  --pd-sidebar-nav-icon-mask: url("assets/legal-case.svg") !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon-laptop,
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source.sidebar-svg-icon-laptop,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon-laptop,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source.sidebar-svg-icon-laptop {
  --pd-sidebar-nav-icon-mask: url("assets/laptop.svg") !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-active-rail-icon-source.sidebar-svg-icon,
.app-shell .sidebar[data-slot="sidebar"] .sidebar-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-active-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-rail-icon-source.sidebar-svg-icon {
  display: block !important;
  background-color: currentColor !important;
  -webkit-mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
  mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  bottom: 12px !important;
  z-index: 72 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  align-items: center !important;
  justify-items: center !important;
  width: var(--pd-table-lab-rail-width) !important;
  min-width: var(--pd-table-lab-rail-width) !important;
  max-width: var(--pd-table-lab-rail-width) !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action {
  appearance: none !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action:hover,
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action:focus-visible,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action:hover,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action:focus-visible {
  background: rgba(255, 255, 255, 0.12) !important;
  outline: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search svg,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account {
  background: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(226, 232, 240, 0.9), 0 3px 8px rgba(15, 23, 42, 0.24) !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account img,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account img {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
}

.sidebar-rail-search-dialog[hidden] {
  display: none !important;
}

.sidebar-rail-search-dialog {
  position: fixed !important;
  z-index: 10080 !important;
  display: grid !important;
  gap: 10px !important;
  width: min(386px, calc(100vw - 24px)) !important;
  padding: 14px 16px 16px !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14), 0 4px 12px rgba(15, 23, 42, 0.08) !important;
}

.sidebar-rail-search-dialog.is-dragging {
  cursor: grabbing !important;
  user-select: none !important;
}

.sidebar-rail-search-dialog-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  cursor: grab !important;
  touch-action: none !important;
}

.sidebar-rail-search-dialog-header strong {
  min-width: 0 !important;
  color: #111827 !important;
  font-family: "Inter", "Segoe UI", sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

.sidebar-rail-search-dialog-close {
  appearance: none !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #495057 !important;
  cursor: pointer !important;
}

.sidebar-rail-search-dialog-close:hover,
.sidebar-rail-search-dialog-close:focus-visible {
  background: #f1f3f5 !important;
  color: #111827 !important;
  outline: none !important;
}

.sidebar-rail-search-dialog-close svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sidebar-rail-search-dialog-form {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
}

.sidebar-rail-search-tags-search {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  min-height: 38px !important;
  padding: 4px 6px 4px 8px !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03) !important;
}

.sidebar-rail-search-tags-search:focus-within {
  border-color: #339af0 !important;
  box-shadow: 0 0 0 2px rgba(34, 139, 230, 0.16) !important;
}

.sidebar-rail-search-chip-list {
  display: flex !important;
  flex: 0 1 auto !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.sidebar-rail-search-chip-list[hidden] {
  display: none !important;
}

.sidebar-rail-search-chip {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  max-width: 100% !important;
  height: 24px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f1f3f5 !important;
  color: #111827 !important;
  font-family: "Inter", "Segoe UI", sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.sidebar-rail-search-chip:hover,
.sidebar-rail-search-chip:focus-visible {
  background: #e9ecef !important;
  outline: none !important;
}

.sidebar-rail-search-chip-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar-rail-search-chip-remove {
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.sidebar-rail-search-dialog-input {
  -webkit-appearance: none !important;
  appearance: none !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 78px !important;
  height: 28px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111827 !important;
  font-family: "Inter", "Segoe UI", sans-serif !important;
  font-size: 14px !important;
  line-height: 28px !important;
  outline: none !important;
  box-shadow: none !important;
}

.sidebar-rail-search-dialog-input::placeholder {
  color: #8b95a1 !important;
}

.sidebar-rail-search-dialog-input::-webkit-search-decoration,
.sidebar-rail-search-dialog-input::-webkit-search-cancel-button,
.sidebar-rail-search-dialog-input::-webkit-search-results-button,
.sidebar-rail-search-dialog-input::-webkit-search-results-decoration,
.toolbar-tags-search input[type="search"]::-webkit-search-decoration,
.toolbar-tags-search input[type="search"]::-webkit-search-cancel-button,
.toolbar-tags-search input[type="search"]::-webkit-search-results-button,
.toolbar-tags-search input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: none !important;
}

.sidebar-rail-search-dialog-input:focus {
  box-shadow: none !important;
}

.sidebar-rail-search-dialog-action {
  appearance: none !important;
  flex: 0 0 auto !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin-left: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #52637a !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.sidebar-rail-search-dialog-action:hover,
.sidebar-rail-search-dialog-action:focus-visible {
  background: #f1f5f9 !important;
  color: #1f2937 !important;
  outline: none !important;
}

.sidebar-rail-search-dialog-action svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sidebar-rail-search-dialog-clear-icon {
  display: none !important;
}

@media (max-width: 520px) {
  .sidebar-rail-search-dialog {
    width: calc(100vw - 16px) !important;
  }

  .sidebar-rail-search-dialog-form {
    gap: 8px !important;
  }
}

/* USER FIX: desktop shadcn shell frame alignment.
   Keep the fixed sidebar inside the same frame gap as SidebarInset so the rail,
   header, and workspace read as one shadcn shell instead of overlapping pieces. */
@media (min-width: 761px) {
  html .app-shell[data-slot="sidebar-wrapper"]:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-variant="inset"],
  html body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"]:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-variant="inset"] {
    position: fixed !important;
    inset-block: var(--pd-app-frame-gap, 8px) !important;
    inset-inline-start: var(--pd-app-frame-gap, 8px) !important;
    width: calc(var(--pd-shadcn-sidebar-width, 288px) - var(--pd-app-frame-gap, 8px)) !important;
    min-width: calc(var(--pd-shadcn-sidebar-width, 288px) - var(--pd-app-frame-gap, 8px)) !important;
    max-width: calc(var(--pd-shadcn-sidebar-width, 288px) - var(--pd-app-frame-gap, 8px)) !important;
    height: calc(100dvh - var(--pd-app-frame-gap, 8px) - var(--pd-app-frame-gap, 8px)) !important;
    min-height: 0 !important;
    max-height: calc(100dvh - var(--pd-app-frame-gap, 8px) - var(--pd-app-frame-gap, 8px)) !important;
    margin: 0 !important;
  }
}

/* USER FIX: desktop shadcn sidebar shell chrome neutralization.
   The sidebar keeps the measured frame geometry above, but only SidebarInset
   owns the visible app-frame border/radius. */
@media (min-width: 761px) {
  html .app-shell[data-slot="sidebar-wrapper"]:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-variant="inset"],
  html body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"]:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-variant="inset"] {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
}

.app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
.app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
.app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer,
.app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
.app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
.app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer,
body[class$="-theme"] .app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
body[class$="-theme"] .app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
body[class$="-theme"] .app-shell.sidebar-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer,
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket,
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator,
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer {
  display: none !important;
}

.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item.active::after,
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item[data-active="true"]::after,
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item[aria-current="page"]::after,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item.active::after,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item[data-active="true"]::after,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item[aria-current="page"]::after,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon),
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > :is(.nav-item-icon, .nav-icon, .folder-ui-icon) {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Final clean: neutralize legacy row-owned active icon circles.
   The old file targets .nav-item-icon.fi:not(.sidebar-svg-icon) with high
   specificity, so this must match that shape exactly and load last. */
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon,
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon),
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon,
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-icon,
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .folder-ui-icon,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon),
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-icon,
.app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .folder-ui-icon,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon),
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-icon,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .folder-ui-icon,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon),
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-icon,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .folder-ui-icon,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon),
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-icon,
body[class$="-theme"] .app-shell:is(:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .folder-ui-icon,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon),
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-icon,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .folder-ui-icon {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  z-index: -1 !important;
  display: none !important;
  place-items: initial !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  pointer-events: none !important;
}

.app-shell .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon)::before,
.app-shell .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon::before,
.app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon)::before,
.app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon::before,
body[class$="-theme"] .app-shell .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon)::before,
body[class$="-theme"] .app-shell .sidebar .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.fi:not(.sidebar-svg-icon)::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .nav-item-icon.sidebar-svg-icon::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  color: transparent !important;
  background: transparent !important;
}

/* Final clean: let menu labels share the row center with the rail icons.
   The legacy sidebar layer nudges labels down by 1px; this removes that drift. */
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text {
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  min-height: 100% !important;
  line-height: 1.18 !important;
  transform: none !important;
}

/* Final clean: paint custom SVG-mask icons in the independent rail layer.
   Font icons render through ::before; legal-case/laptop use CSS masks and need
   an explicit background on the cloned rail element. */
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source.sidebar-svg-icon {
  display: block !important;
  width: var(--pd-table-lab-inactive-icon-size) !important;
  min-width: var(--pd-table-lab-inactive-icon-size) !important;
  height: var(--pd-table-lab-inactive-icon-size) !important;
  min-height: var(--pd-table-lab-inactive-icon-size) !important;
  color: #ffffff !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  -webkit-mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
  mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator > .sidebar-active-rail-icon-source.sidebar-svg-icon {
  display: block !important;
  width: var(--pd-table-lab-icon-size) !important;
  min-width: var(--pd-table-lab-icon-size) !important;
  height: var(--pd-table-lab-icon-size) !important;
  min-height: var(--pd-table-lab-icon-size) !important;
  color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  background: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  background-color: var(--pd-sidebar-rail-active-icon-color, #f6c343) !important;
  -webkit-mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
  mask: var(--pd-sidebar-nav-icon-mask) center / contain no-repeat !important;
}

/* Final clean: the blue active highlight is only valid when the menu text
   column is visible. In expanded/offcanvas modes, keep label and count above
   the highlight; in true collapsed mode, suppress row-owned highlight paint. */
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  height: var(--pd-table-lab-row-height) !important;
  min-height: var(--pd-table-lab-row-height) !important;
}

.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text {
  position: relative !important;
  z-index: 80 !important;
  display: flex !important;
  align-items: center !important;
  justify-self: start !important;
  min-width: 0 !important;
  width: auto !important;
  min-height: 100% !important;
  height: auto !important;
  color: #020617 !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-count,
.app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > span[id$="Count"],
.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-count,
.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > span[id$="Count"],
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-count,
html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > span[id$="Count"],
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-count,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed):not(.sidebar-responsive-collapsed) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > span[id$="Count"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-count,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > span[id$="Count"],
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-count,
html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-state="expanded"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > span[id$="Count"] {
  position: relative !important;
  z-index: 80 !important;
  display: flex !important;
  align-items: center !important;
  justify-self: end !important;
  min-height: 100% !important;
  height: auto !important;
  color: #64748b !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell:is(.sidebar-collapsed, .sidebar-responsive-collapsed):not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="collapsed"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
.app-shell:is(.sidebar-collapsed, .sidebar-responsive-collapsed):not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="collapsed"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after,
body[class$="-theme"] .app-shell:is(.sidebar-collapsed, .sidebar-responsive-collapsed):not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="collapsed"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
body[class$="-theme"] .app-shell:is(.sidebar-collapsed, .sidebar-responsive-collapsed):not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"][data-state="collapsed"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Three-state navigation: expanded -> icon rail -> hidden.
   Rail mode keeps menu rows measurable for the animated socket while showing
   only the black rail, inactive rail icons, and active circle. */
.app-shell.sidebar-rail-mode[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell.sidebar-rail-mode[data-slot="sidebar-wrapper"] {
  grid-template-columns: var(--nav-rail-width, calc(var(--pd-table-lab-socket-left, 14.7px) + var(--pd-table-lab-socket-width, 55px))) minmax(var(--pd-responsive-main-min-width, 0px), 1fr) !important;
}

.app-shell.sidebar-rail-mode .sidebar-gap[data-slot="sidebar-gap"],
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar-gap[data-slot="sidebar-gap"] {
  width: var(--nav-rail-width, calc(var(--pd-table-lab-socket-left, 14.7px) + var(--pd-table-lab-socket-width, 55px))) !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"] {
  --pd-table-lab-row-height: 44px !important;
  --pd-table-lab-rail-y-nudge: 0px !important;
  --pd-sidebar-rail-active-y-offset: var(--pd-table-lab-rail-y-nudge, 0px) !important;
  --pd-sidebar-rail-icon-y-offset: var(--pd-table-lab-rail-y-nudge, 0px) !important;
  width: var(--nav-rail-width, calc(var(--pd-table-lab-socket-left, 14.7px) + var(--pd-table-lab-socket-width, 55px))) !important;
  min-width: var(--nav-rail-width, calc(var(--pd-table-lab-socket-left, 14.7px) + var(--pd-table-lab-socket-width, 55px))) !important;
  max-width: var(--nav-rail-width, calc(var(--pd-table-lab-socket-left, 14.7px) + var(--pd-table-lab-socket-width, 55px))) !important;
  padding: 0 !important;
  overflow: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

.app-shell.sidebar-rail-mode .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell.sidebar-rail-mode .workspace[data-slot="sidebar-inset"] {
  margin-left: var(--pd-app-frame-gap, 8px) !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"]::before,
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"]::before {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"],
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] {
  z-index: 80 !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search),
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: var(--pd-shadcn-sidebar-width, 288px) !important;
  min-width: var(--pd-shadcn-sidebar-width, 288px) !important;
  max-width: var(--pd-shadcn-sidebar-width, 288px) !important;
  min-height: 0 !important;
  gap: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-left: var(--pd-table-lab-content-x) !important;
  padding-right: var(--pd-table-lab-content-right) !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-section[aria-label="Collections"],
.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-menu-group.sidebar-collapsible,
.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .sidebar-collapsible-content.nav-menu-content,
.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-section[aria-label="Collections"],
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-menu-group.sidebar-collapsible,
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .sidebar-collapsible-content.nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-menu-content {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  max-height: none !important;
  margin-left: 0 !important;
  overflow: visible !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  height: var(--pd-table-lab-row-height) !important;
  min-height: var(--pd-table-lab-row-height) !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-socket:not([hidden]) {
  display: block !important;
  top: calc(var(--sidebar-active-socket-top, 62.5px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]) {
  display: grid !important;
  top: calc(var(--sidebar-active-indicator-top, 92px) + var(--pd-sidebar-rail-active-y-offset, 0px)) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer:not([hidden]) {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  top: calc(var(--sidebar-rail-icon-top, 0px) + var(--pd-sidebar-rail-icon-y-offset, 0px)) !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer:not([hidden]),
.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  pointer-events: auto !important;
}

.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
.app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  cursor: pointer !important;
}

.app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  display: block !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 360 !important;
}

.app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-tools,
.app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger,
body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-tools,
body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger {
  display: none !important;
}

.app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu,
body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu {
  position: fixed !important;
  left: var(--sidebar-rail-account-menu-left, 52px) !important;
  right: auto !important;
  top: var(--sidebar-rail-account-menu-top, 12px) !important;
  bottom: auto !important;
  display: block !important;
  width: min(260px, calc(100vw - 72px)) !important;
  min-width: min(220px, calc(100vw - 72px)) !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 370 !important;
}

.app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown,
body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown {
  position: fixed !important;
  left: var(--sidebar-account-menu-left, 52px) !important;
  right: auto !important;
  top: var(--sidebar-account-menu-top, 12px) !important;
  bottom: auto !important;
  display: grid !important;
  width: min(260px, calc(100vw - 72px)) !important;
  min-width: min(220px, calc(100vw - 72px)) !important;
  max-height: min(420px, calc(100vh - 24px)) !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  z-index: 380 !important;
}

/* USER UPDATE: account avatar menu should behave like a Mantine menu popover.
   It is fixed to the viewport so the main shell/sidebar cannot clip it, and
   the same surface is used from full navigation and icon-rail mode. */
.app-shell.sidebar-account-menu-open .sidebar[data-slot="sidebar"],
body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar[data-slot="sidebar"] {
  z-index: 10110 !important;
  overflow: visible !important;
}

.app-shell.sidebar-account-menu-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  z-index: 10115 !important;
  overflow: visible !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown {
  position: fixed !important;
  left: var(--sidebar-account-menu-left, 56px) !important;
  right: auto !important;
  top: var(--sidebar-account-menu-top, 12px) !important;
  bottom: auto !important;
  z-index: 10120 !important;
  display: grid !important;
  width: min(236px, calc(100vw - 16px)) !important;
  min-width: min(210px, calc(100vw - 16px)) !important;
  max-width: min(236px, calc(100vw - 16px)) !important;
  max-height: min(470px, calc(100vh - 16px)) !important;
  gap: 2px !important;
  padding: 6px !important;
  overflow: visible !important;
  border: 1px solid #e9ecef !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14), 0 4px 12px rgba(15, 23, 42, 0.08) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-dropdown *,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-dropdown * {
  box-sizing: border-box !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-account,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-account,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-label,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .toolbar-more-label,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-label,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .toolbar-more-label {
  margin: 0 !important;
  padding: 7px 10px 5px !important;
  color: #868e96 !important;
  font-family: var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-section,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-section {
  position: relative !important;
  display: grid !important;
  gap: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-panel,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-panel {
  display: grid !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-trigger,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-action-item,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-action,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-duplicate-label,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-trigger,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-action-item,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-action,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-duplicate-label {
  appearance: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: #111827 !important;
  box-shadow: none !important;
  font-family: var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  cursor: pointer !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-trigger:hover,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-trigger:focus-visible,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button:hover,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button:focus-visible,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-action-item:hover,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-action-item:focus-visible,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-action:hover,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-action:focus-visible,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-duplicate-label:hover,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-duplicate-label:focus-visible,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-trigger:hover,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-trigger:focus-visible,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button:hover,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button:focus-visible,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-action-item:hover,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .toolbar-more-action-item:focus-visible,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-action:hover,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-action:focus-visible,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-duplicate-label:hover,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu .menu-package-duplicate-label:focus-visible {
  background: #f8f9fa !important;
  color: #111827 !important;
  outline: none !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button.is-danger,
.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section .logout-button,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section > button.is-danger,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu-section .logout-button {
  color: #fa5252 !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-chevron,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-submenu-chevron {
  color: #868e96 !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] details[data-sidebar-avatar-submenu][open] > .sidebar-avatar-submenu-panel,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] details[data-sidebar-avatar-submenu][open] > .sidebar-avatar-submenu-panel {
  position: absolute !important;
  left: calc(100% + 8px) !important;
  top: 0 !important;
  z-index: 10130 !important;
  display: grid !important;
  width: 220px !important;
  max-width: calc(100vw - 24px) !important;
  max-height: min(420px, calc(100vh - 24px)) !important;
  gap: 2px !important;
  padding: 6px !important;
  overflow: visible !important;
  border: 1px solid #e9ecef !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14), 0 4px 12px rgba(15, 23, 42, 0.08) !important;
}

.app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu::before,
body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-protected-menu::before {
  content: "" !important;
  display: block !important;
  width: calc(100% + 12px) !important;
  height: 1px !important;
  margin: 5px -6px !important;
  background: #e9ecef !important;
}

/* Active-only vertical guide for expanded/offcanvas navigation counts. */
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > .menu-count,
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > span[id$="Count"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > .menu-count,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > span[id$="Count"] {
  overflow: visible !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > .menu-count::before,
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > span[id$="Count"]::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > .menu-count::before,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item > span[id$="Count"]::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .menu-count::after,
.app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > span[id$="Count"]::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > .menu-count::after,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) > span[id$="Count"]::after {
  content: "" !important;
  position: absolute !important;
  right: -8.5px !important;
  top: 50% !important;
  z-index: 2 !important;
  display: block !important;
  width: 2px !important;
  height: 22px !important;
  border-radius: 999px !important;
  background: #0f172a !important;
  transform: translateY(-50%) !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

/* Expanded/offcanvas text mode: restore the legacy active left accent.
   Icon-only rail still uses the separate socket/circle overlay. */
.app-shell:is(:not(.sidebar-rail-mode), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]),
body[class$="-theme"] .app-shell:is(:not(.sidebar-rail-mode), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"]) {
  color: var(--pd-sidebar-primary, #2563eb) !important;
  background: color-mix(in srgb, var(--pd-sidebar-primary, #2563eb) 8%, transparent) !important;
  box-shadow: inset 3px 0 0 var(--pd-sidebar-primary, #2563eb) !important;
  font-weight: 650 !important;
}

.app-shell:is(:not(.sidebar-rail-mode), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
body[class$="-theme"] .app-shell:is(:not(.sidebar-rail-mode), .sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-content .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
}

/* Sidebar top search: move the existing search control above Menu 1 and remove
   the small generated navigation label from the visible layout. */
.app-shell .sidebar[data-slot="sidebar"] .sidebar-section-label,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-section-label {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-main-content > .sidebar-top-search.toolbar-search-group,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-main-content > .sidebar-top-search.toolbar-search-group {
  display: grid !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 42px !important;
  grid-template-rows: 38px !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group input,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group input {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 10px 0 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #0f172a !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  outline: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group input::placeholder,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group input::placeholder {
  color: #6b7280 !important;
  opacity: 1 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button:hover,
.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button:focus-visible,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button:hover,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button:focus-visible {
  background: transparent !important;
  color: #475569 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button svg,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button svg {
  width: 20px !important;
  height: 20px !important;
  stroke-width: 2.1 !important;
}

/* USER UPDATE: sidebar search uses a compact clearable tag-input surface. */
.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group.toolbar-tags-search,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group.toolbar-tags-search {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  min-height: 38px !important;
  height: auto !important;
  padding: 4px 6px 4px 8px !important;
  overflow: visible !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03) !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-list,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-list {
  display: flex !important;
  flex: 0 1 auto !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-list[hidden],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-list[hidden] {
  display: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  max-width: 100% !important;
  height: 24px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f1f3f5 !important;
  color: #111827 !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-text,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-remove,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-chip-remove {
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group.toolbar-tags-search input,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-search-button-group.toolbar-tags-search input {
  flex: 1 1 76px !important;
  grid-column: auto !important;
  grid-row: auto !important;
  width: auto !important;
  min-width: 58px !important;
  height: 28px !important;
  padding: 0 4px !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search .toolbar-search-button,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search .toolbar-search-button {
  flex: 0 0 30px !important;
  grid-column: auto !important;
  grid-row: auto !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  margin-left: auto !important;
  border-radius: 8px !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search .toolbar-clear-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search .toolbar-clear-icon {
  display: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search.has-search-tags:not(.has-search-draft) .toolbar-search-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search.has-search-tags:not(.has-search-draft) .toolbar-search-icon {
  display: block !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search.has-search-tags:not(.has-search-draft) .toolbar-clear-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search.has-search-tags:not(.has-search-draft) .toolbar-clear-icon {
  display: none !important;
}

/* USER UPDATE: place the app icon on the black rail beside the top search. */
.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand {
  position: absolute !important;
  inset: var(--pd-sidebar-top-row-y, 8px) auto auto 0 !important;
  z-index: 12 !important;
  display: grid !important;
  place-items: center !important;
  width: var(--pd-table-lab-rail-width, 41px) !important;
  height: var(--pd-sidebar-top-row-height, 38px) !important;
  min-height: var(--pd-sidebar-top-row-height, 38px) !important;
  pointer-events: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand img,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand img {
  display: block !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.92) !important;
}

/* USER UPDATE: align the rail app icon with the top search row and rail icon centerline. */
.app-shell .sidebar[data-slot="sidebar"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-top-row-y: 8px !important;
  --pd-sidebar-top-row-height: 38px !important;
  --pd-sidebar-top-row-gap: 10px !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  padding-top: var(--pd-sidebar-top-row-y) !important;
  scroll-padding-top: calc(var(--pd-sidebar-top-row-height) + var(--pd-sidebar-top-row-gap)) !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-main-content > .sidebar-top-search.toolbar-search-group,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-main-content > .sidebar-top-search.toolbar-search-group {
  height: var(--pd-sidebar-top-row-height) !important;
  min-height: var(--pd-sidebar-top-row-height) !important;
  margin-top: 0 !important;
  margin-bottom: var(--pd-sidebar-top-row-gap) !important;
  align-self: stretch !important;
  transform: none !important;
}

.app-shell .sidebar[data-slot="sidebar"] .sidebar-main-content > .sidebar-top-search.toolbar-search-group .toolbar-search-button-group,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-main-content > .sidebar-top-search.toolbar-search-group .toolbar-search-button-group {
  height: var(--pd-sidebar-top-row-height) !important;
  min-height: var(--pd-sidebar-top-row-height) !important;
}

.app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand {
  top: var(--pd-sidebar-top-row-y) !important;
  left: 0 !important;
  width: var(--pd-table-lab-rail-width, 41px) !important;
  height: var(--pd-sidebar-top-row-height) !important;
  min-height: var(--pd-sidebar-top-row-height) !important;
  transform: none !important;
}

.app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-rail-brand,
body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-rail-brand {
  top: var(--pd-sidebar-top-row-y) !important;
  left: 0 !important;
  width: var(--pd-table-lab-rail-width, 41px) !important;
}

/* USER UPDATE: shorten system status progress tracks without changing progress values. */
.app-shell .sidebar[data-slot="sidebar"] .system-utilization-track,
.app-shell .sidebar[data-slot="sidebar"] .system-utilization-panel #saveStatusBar .save-status-track,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .system-utilization-track,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .system-utilization-panel #saveStatusBar .save-status-track {
  width: calc(100% - 24px) !important;
  max-width: calc(100% - 24px) !important;
  justify-self: start !important;
  margin-right: auto !important;
}

/* USER UPDATE: keep SAVED label/100% inside the shortened system status width and remove the old divider. */
.app-shell .sidebar[data-slot="sidebar"] .system-utilization-panel #saveStatusBar.save-status-bar,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .system-utilization-panel #saveStatusBar.save-status-bar {
  border-top: 0 !important;
}

.app-shell .sidebar[data-slot="sidebar"] .system-utilization-panel #saveStatusBar .save-status-row,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .system-utilization-panel #saveStatusBar .save-status-row {
  width: calc(100% - 24px) !important;
  max-width: calc(100% - 24px) !important;
  justify-self: start !important;
  margin-right: auto !important;
}

/* USER UPDATE: make the rail brand/search top row stable in far and rail-only views. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-top-row-y: 8px !important;
  --pd-sidebar-top-row-height: 38px !important;
  --pd-sidebar-top-row-gap: 10px !important;
}

html .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-main-content[data-slot="sidebar-content"] {
  margin-top: 0 !important;
  padding-top: var(--pd-sidebar-top-row-y) !important;
  scroll-padding-top: calc(var(--pd-sidebar-top-row-height) + var(--pd-sidebar-top-row-gap)) !important;
}

html .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-main-content[data-slot="sidebar-content"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-main-content[data-slot="sidebar-content"] > .sidebar-top-search.toolbar-search-group {
  position: relative !important;
  top: auto !important;
  display: grid !important;
  height: var(--pd-sidebar-top-row-height) !important;
  min-height: var(--pd-sidebar-top-row-height) !important;
  margin-top: 0 !important;
  margin-bottom: var(--pd-sidebar-top-row-gap) !important;
  transform: none !important;
  translate: none !important;
}

html .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-rail-brand,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-rail-brand,
html .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-rail-brand,
html body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-rail-brand {
  top: var(--pd-sidebar-top-row-y) !important;
  left: 0 !important;
  height: var(--pd-sidebar-top-row-height) !important;
  min-height: var(--pd-sidebar-top-row-height) !important;
  transform: none !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] > .sidebar-top-search.toolbar-search-group {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* USER UPDATE: search is now a sidebar top-layer item, aligned with the rail brand. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-top-row-total: calc(var(--pd-sidebar-top-row-y, 8px) + var(--pd-sidebar-top-row-height, 38px) + var(--pd-sidebar-top-row-gap, 10px)) !important;
  position: relative !important;
}

html .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-top-search.toolbar-search-group {
  position: absolute !important;
  top: var(--pd-sidebar-top-row-y, 8px) !important;
  left: var(--pd-table-lab-content-x, 56px) !important;
  right: var(--pd-table-lab-content-right, 10px) !important;
  z-index: 24 !important;
  display: grid !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: var(--pd-sidebar-top-row-height, 38px) !important;
  min-height: var(--pd-sidebar-top-row-height, 38px) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  translate: none !important;
  pointer-events: auto !important;
}

html .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-top-search.toolbar-search-group .toolbar-search-button-group,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-top-search.toolbar-search-group .toolbar-search-button-group {
  width: 100% !important;
  max-width: none !important;
  height: var(--pd-sidebar-top-row-height, 38px) !important;
  min-height: var(--pd-sidebar-top-row-height, 38px) !important;
}

html .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode) .sidebar[data-slot="sidebar"][data-state="expanded"] > .sidebar-main-content[data-slot="sidebar-content"] {
  padding-top: var(--pd-sidebar-top-row-total) !important;
  scroll-padding-top: var(--pd-sidebar-top-row-total) !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* USER UPDATE: make the direct-child top search the single source of truth.
   Older rules targeted a search nested inside sidebar-main-content; responsive
   state changes can otherwise let the search fall back to generic toolbar
   sizing and clip against the content edge. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-top-row-y: 8px !important;
  --pd-sidebar-top-row-height: 38px !important;
  --pd-sidebar-top-row-gap: 10px !important;
  --pd-sidebar-top-row-total: calc(var(--pd-sidebar-top-row-y, 8px) + var(--pd-sidebar-top-row-height, 38px) + var(--pd-sidebar-top-row-gap, 10px)) !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group {
  position: absolute !important;
  top: var(--pd-sidebar-top-row-y, 8px) !important;
  left: var(--pd-table-lab-content-x, 56px) !important;
  right: var(--pd-table-lab-content-right, 10px) !important;
  z-index: 40 !important;
  display: grid !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: var(--pd-sidebar-top-row-height, 38px) !important;
  min-height: var(--pd-sidebar-top-row-height, 38px) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  translate: none !important;
  pointer-events: auto !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group .toolbar-search-button-group,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group .toolbar-search-button-group {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: var(--pd-sidebar-top-row-height, 38px) !important;
  min-height: var(--pd-sidebar-top-row-height, 38px) !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  padding-top: var(--pd-sidebar-top-row-total) !important;
  scroll-padding-top: var(--pd-sidebar-top-row-total) !important;
}

html .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group,
html .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* USER UPDATE: remove the legacy clear X from sidebar search and align the dialog close control with the input row. */
.sidebar-rail-search-dialog,
body[class$="-theme"] .sidebar-rail-search-dialog {
  grid-template-columns: minmax(0, 1fr) 28px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 14px 14px 16px !important;
  cursor: grab !important;
  touch-action: none !important;
}

.sidebar-rail-search-dialog-header,
body[class$="-theme"] .sidebar-rail-search-dialog-header {
  display: contents !important;
  cursor: default !important;
  touch-action: auto !important;
}

.sidebar-rail-search-dialog-header strong,
body[class$="-theme"] .sidebar-rail-search-dialog-header strong {
  display: none !important;
}

.sidebar-rail-search-dialog-form,
body[class$="-theme"] .sidebar-rail-search-dialog-form {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}

.sidebar-rail-search-dialog-close,
body[class$="-theme"] .sidebar-rail-search-dialog-close {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  justify-self: center !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  cursor: pointer !important;
  touch-action: auto !important;
}

.sidebar-rail-search-dialog-input,
body[class$="-theme"] .sidebar-rail-search-dialog-input {
  cursor: text !important;
  touch-action: auto !important;
}

.sidebar-rail-search-dialog-action,
.sidebar-rail-search-chip,
body[class$="-theme"] .sidebar-rail-search-dialog-action,
body[class$="-theme"] .sidebar-rail-search-chip {
  cursor: pointer !important;
  touch-action: auto !important;
}

.sidebar-rail-search-dialog-clear-icon,
.app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search .toolbar-clear-icon,
body[class$="-theme"] .sidebar-rail-search-dialog-clear-icon,
body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .sidebar-top-search .toolbar-tags-search .toolbar-clear-icon {
  display: none !important;
}

.sidebar-rail-search-tags-search.has-search-tags:not(.has-search-draft) .sidebar-rail-search-dialog-search-icon,
body[class$="-theme"] .sidebar-rail-search-tags-search.has-search-tags:not(.has-search-draft) .sidebar-rail-search-dialog-search-icon {
  display: none !important;
}

/* USER UPDATE: keep the sidebar search action as search-only; chips can still be removed individually. */
.sidebar-rail-search-tags-search.has-search-tags:not(.has-search-draft) .sidebar-rail-search-dialog-search-icon,
html .toolbar-tags-search.has-search-tags:not(.has-search-draft) .toolbar-search-icon,
body[class$="-theme"] .sidebar-rail-search-tags-search.has-search-tags:not(.has-search-draft) .sidebar-rail-search-dialog-search-icon {
  display: block !important;
}

/* USER UPDATE: remove native and legacy clear X controls from tag search boxes. */
html .toolbar-tags-search .toolbar-clear-icon,
html body[class$="-theme"] .toolbar-tags-search .toolbar-clear-icon {
  display: none !important;
}

/* USER UPDATE: shared sidebar transition contract for expanded, rail, and hidden states. */
html .app-shell[data-slot="sidebar-wrapper"],
html body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
  transition: grid-template-columns var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease) !important;
}

html .app-shell .sidebar-gap[data-slot="sidebar-gap"],
html body[class$="-theme"] .app-shell .sidebar-gap[data-slot="sidebar-gap"],
html .app-shell .sidebar[data-slot="sidebar"][data-variant="inset"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-variant="inset"] {
  transition:
    width var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    min-width var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    max-width var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    transform var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    opacity var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease) !important;
  will-change: width, min-width, max-width, transform, opacity !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer,
html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-top-search,
html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-top-search,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand {
  transition:
    opacity var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    transform var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    visibility 0s linear 0s !important;
  will-change: opacity, transform !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search),
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search),
html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search),
html body[class$="-theme"] .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > :not(.sidebar-active-rail-socket):not(.sidebar-active-rail-indicator):not(.sidebar-rail-icon-layer):not(.sidebar-rail-footer-layer):not(.sidebar-rail-brand):not(.sidebar-top-search) {
  transform: translateX(-8px) !important;
  transition:
    opacity var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    transform var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease),
    visibility 0s linear var(--pd-sidebar-transition-duration, 260ms) !important;
}

/* USER UPDATE: compact the left sidebar menu start below the top search row. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-top-row-gap: 4px !important;
  --pd-sidebar-top-row-total: calc(var(--pd-sidebar-top-row-y, 8px) + var(--pd-sidebar-top-row-height, 38px) + 4px) !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  padding-top: var(--pd-sidebar-top-row-total) !important;
  scroll-padding-top: var(--pd-sidebar-top-row-total) !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] > .nav-section:first-child,
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] > .nav-section:first-child {
  margin-top: 0 !important;
}

/* USER UPDATE: move expanded sidebar search to a single clickable icon on the black rail footer. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-top-row-total: 0px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-top-search.toolbar-search-group {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  padding-top: 0 !important;
  scroll-padding-top: 0 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
  appearance: none !important;
  position: absolute !important;
  left: calc((var(--pd-table-lab-rail-width, 41px) - 30px) / 2) !important;
  bottom: 10px !important;
  z-index: 8 !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:hover,
html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:focus-visible,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:hover,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:focus-visible {
  background: rgba(255, 255, 255, 0.12) !important;
  outline: none !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon svg,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* USER UPDATE: keep avatar account popover above the shell.
   The expanded PaperDesk sidebar intentionally clips its rail artwork; when the
   account menu is open, the popover needs a viewport overlay layer instead. */
html .app-shell.sidebar-account-menu-open,
html body[class$="-theme"] .app-shell.sidebar-account-menu-open {
  overflow: visible !important;
}

html .app-shell.sidebar-account-menu-open .sidebar-gap[data-slot="sidebar-gap"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-gap[data-slot="sidebar-gap"],
html .app-shell.sidebar-account-menu-open .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] {
  overflow: visible !important;
  isolation: auto !important;
  contain: none !important;
  transform: none !important;
  will-change: auto !important;
  z-index: 2147482990 !important;
}

html .app-shell.sidebar-account-menu-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] {
  overflow: visible !important;
  isolation: auto !important;
  contain: none !important;
  transform: none !important;
  will-change: auto !important;
  z-index: 2147482995 !important;
}

html .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown,
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown {
  position: fixed !important;
  left: var(--sidebar-account-menu-left, 56px) !important;
  top: var(--sidebar-account-menu-top, 12px) !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2147483000 !important;
  max-height: none !important;
  overflow: visible !important;
  transform: none !important;
  will-change: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* USER UPDATE: remove the top app icon from the black sidebar rail. */
html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-brand {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* USER UPDATE: anchor the expanded sidebar search icon lower against the account avatar row without copying the avatar surface. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-footer-search-bottom: 2px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
  left: calc((var(--pd-table-lab-rail-width, 41px) - 30px) / 2) !important;
  bottom: var(--pd-sidebar-footer-search-bottom, 2px) !important;
  z-index: 74 !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:hover,
html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:focus-visible,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:hover,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon:focus-visible {
  background: rgba(255, 255, 255, 0.12) !important;
  transform: none !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon svg,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon svg {
  width: 18px !important;
  height: 18px !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* USER UPDATE: lower the generated black-rail search action.
   Rail mode uses .sidebar-rail-footer-layer, not the static expanded-sidebar
   .sidebar-footer-search-icon, so search must be the bottom rail action. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-rail-footer-bottom: 2px !important;
  --pd-sidebar-rail-footer-gap: 4px !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  bottom: var(--pd-sidebar-rail-footer-bottom, 2px) !important;
  gap: var(--pd-sidebar-rail-footer-gap, 4px) !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account {
  order: 1 !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search {
  order: 2 !important;
}

/* USER UPDATE: rail footer avatar and search share the same 36px enterprise control. */
html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  left: var(--pd-sidebar-footer-search-left, 2px) !important;
  bottom: var(--pd-sidebar-footer-control-bottom, 10px) !important;
  justify-items: center !important;
  align-items: center !important;
  width: var(--pd-sidebar-footer-control-size, 36px) !important;
  min-width: var(--pd-sidebar-footer-control-size, 36px) !important;
  gap: 6px !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-action {
  display: inline-grid !important;
  place-items: center !important;
  justify-self: center !important;
  width: var(--pd-sidebar-footer-control-size, 36px) !important;
  min-width: var(--pd-sidebar-footer-control-size, 36px) !important;
  height: var(--pd-sidebar-footer-control-size, 36px) !important;
  min-height: var(--pd-sidebar-footer-control-size, 36px) !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 999px !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account img,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account img,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account img {
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search svg,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search svg,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search svg {
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
}

/* USER UPDATE: collapsed rail account avatar mirrors the configured user avatar. */
html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar {
  display: inline-grid !important;
  place-items: center !important;
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account:hover .sidebar-rail-footer-avatar,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account:hover .sidebar-rail-footer-avatar,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account:hover .sidebar-rail-footer-avatar {
  border-color: rgba(255, 255, 255, 0.42) !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar.has-custom-user-avatar,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar.has-custom-user-avatar,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar.has-custom-user-avatar {
  border-color: rgba(255, 255, 255, 0.38) !important;
  background: var(--pd-user-avatar-color, #2563eb) !important;
  color: #ffffff !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar img,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar img,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar img {
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  border-radius: inherit !important;
  object-fit: cover !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar .sidebar-avatar-custom-icon,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar .sidebar-avatar-custom-icon,
html body[class$="-theme"] .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-avatar .sidebar-avatar-custom-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 1em !important;
  height: 1em !important;
  color: inherit !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

/* USER UPDATE: float the sidebar search and account controls as bottom-left utility buttons.
   Keep the existing DOM and handlers, but remove the generated legacy rail
   footer surface so the two controls are not duplicated. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-floating-search-left: calc((var(--pd-table-lab-rail-width, 41px) - 30px) / 2) !important;
  --pd-sidebar-floating-search-bottom: 14px !important;
  --pd-sidebar-floating-account-left: calc(var(--pd-table-lab-rail-width, 41px) + 15px) !important;
  --pd-sidebar-floating-account-bottom: 14px !important;
  --pd-sidebar-floating-account-width: 210px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
  position: fixed !important;
  left: var(--pd-sidebar-floating-search-left, 6px) !important;
  bottom: var(--pd-sidebar-floating-search-bottom, 14px) !important;
  z-index: 2147482600 !important;
  display: inline-grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html .app-shell:not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body[class$="-theme"] .app-shell:not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: fixed !important;
  inset: auto auto var(--pd-sidebar-floating-account-bottom, 14px) var(--pd-sidebar-floating-account-left, 56px) !important;
  z-index: 2147482600 !important;
  display: grid !important;
  width: min(var(--pd-sidebar-floating-account-width, 210px), calc(100vw - var(--pd-sidebar-floating-account-left, 56px) - 12px)) !important;
  min-width: 0 !important;
  max-width: calc(100vw - var(--pd-sidebar-floating-account-left, 56px) - 12px) !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

html .app-shell:not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger,
html body[class$="-theme"] .app-shell:not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger {
  min-height: 38px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(226, 232, 240, 0.92) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* USER UPDATE: canonical left-sidebar cleanup owner.
   Part 23 now owns only swipe edge and avatar popout; this final block owns
   sidebar font consistency plus bottom search/account placement. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-ui-font: "Noto Sans Khmer", "Noto Serif Khmer", "Khmer OS Siemreap", "Khmer OS Battambang", "Khmer OS Content", "Leelawadee UI", DaunPenh, "PaperDesk Inter Latin", Inter, "Segoe UI", Arial, sans-serif !important;
  --pd-sidebar-footer-control-size: 36px !important;
  --pd-sidebar-footer-control-bottom: 10px !important;
  --pd-sidebar-footer-search-size: var(--pd-sidebar-footer-control-size, 36px) !important;
  --pd-sidebar-footer-search-left: calc((var(--pd-table-lab-rail-width, 41px) - var(--pd-sidebar-footer-search-size, 36px)) / 2) !important;
  --pd-sidebar-footer-search-bottom: var(--pd-sidebar-footer-control-bottom, 10px) !important;
  --pd-sidebar-footer-account-left: calc(var(--pd-table-lab-rail-width, 41px) + 15px) !important;
  --pd-sidebar-footer-account-bottom: var(--pd-sidebar-footer-control-bottom, 10px) !important;
  --pd-sidebar-footer-account-width: 210px !important;
  --pd-sidebar-rail-footer-bottom: 14px !important;
  --pd-sidebar-rail-footer-gap: 8px !important;
  --pd-sidebar-rail-footer-safe-gap: 6px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] :is(
  .nav-menu-content .nav-item,
  .nav-menu-content .nav-item > :not(.nav-item-icon):not(.nav-icon):not(.folder-ui-icon),
  .nav-menu-content .menu-text,
  .nav-menu-content .menu-count,
  .nav-menu-content span[id$="Count"],
  .nav-menu-content .dashboard-nav-item,
  .sidebar-collapsible-summary,
  .sidebar-collapsible-title,
  .sidebar-collapsible-count,
  .system-utilization-label,
  .system-utilization-value,
  .save-status-text,
  .save-status-percent
),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] :is(
  .nav-menu-content .nav-item,
  .nav-menu-content .nav-item > :not(.nav-item-icon):not(.nav-icon):not(.folder-ui-icon),
  .nav-menu-content .menu-text,
  .nav-menu-content .menu-count,
  .nav-menu-content span[id$="Count"],
  .nav-menu-content .dashboard-nav-item,
  .sidebar-collapsible-summary,
  .sidebar-collapsible-title,
  .sidebar-collapsible-count,
  .system-utilization-label,
  .system-utilization-value,
  .save-status-text,
  .save-status-percent
) {
  font-family: var(--pd-sidebar-ui-font) !important;
  letter-spacing: 0 !important;
}

html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"].sidebar .nav-section .nav-menu-group.sidebar-collapsible .sidebar-collapsible-content.nav-menu-content button.nav-item[data-slot="sidebar-menu-button"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"].sidebar .nav-section .nav-menu-group.sidebar-collapsible .sidebar-collapsible-content.nav-menu-content button.nav-item[data-slot="sidebar-menu-button"] :is(.menu-text, .menu-count, span[id$="Count"]),
html .app-shell .sidebar[data-slot="sidebar"].sidebar .nav-section .nav-menu-group.sidebar-collapsible .sidebar-collapsible-content.nav-menu-content button.nav-item[data-slot="sidebar-menu-button"],
html .app-shell .sidebar[data-slot="sidebar"].sidebar .nav-section .nav-menu-group.sidebar-collapsible .sidebar-collapsible-content.nav-menu-content button.nav-item[data-slot="sidebar-menu-button"] :is(.menu-text, .menu-count, span[id$="Count"]) {
  font-family: var(--pd-sidebar-ui-font) !important;
  letter-spacing: 0 !important;
}

/* USER UPDATE: align expanded sidebar footer search and avatar controls.
   Search uses the same 36px control height and bottom anchor as the avatar
   trigger, while the SVG stays optically 18px inside the black rail. */
html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body:not(.navigation-rail-mode):not(.navigation-hidden-mode)[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
  position: fixed !important;
  left: var(--pd-sidebar-footer-search-left, 6px) !important;
  bottom: var(--pd-sidebar-footer-search-bottom, 14px) !important;
  z-index: 2147482600 !important;
  display: inline-grid !important;
  place-items: center !important;
  width: var(--pd-sidebar-footer-search-size, 30px) !important;
  min-width: var(--pd-sidebar-footer-search-size, 30px) !important;
  height: var(--pd-sidebar-footer-search-size, 30px) !important;
  min-height: var(--pd-sidebar-footer-search-size, 30px) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

html .app-shell:not(.sidebar-rail-mode):not(.sidebar-hidden-mode) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body:not(.navigation-rail-mode):not(.navigation-hidden-mode)[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: fixed !important;
  inset: auto auto var(--pd-sidebar-footer-account-bottom, 14px) var(--pd-sidebar-footer-account-left, 56px) !important;
  z-index: 2147482600 !important;
  display: grid !important;
  width: min(var(--pd-sidebar-footer-account-width, 210px), calc(100vw - var(--pd-sidebar-footer-account-left, 56px) - 12px)) !important;
  min-width: 0 !important;
  max-width: calc(100vw - var(--pd-sidebar-footer-account-left, 56px) - 12px) !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

html .app-shell:is(.sidebar-rail-mode, .sidebar-hidden-mode):not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html body:is(.navigation-rail-mode, .navigation-hidden-mode) .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body.navigation-hidden-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open):not(.sidebar-rail-account-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open):not(.sidebar-rail-account-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  position: fixed !important;
  left: var(--pd-sidebar-footer-search-left, 6px) !important;
  bottom: var(--pd-sidebar-rail-footer-bottom, 14px) !important;
  z-index: 2147482600 !important;
  display: grid !important;
  gap: var(--pd-sidebar-rail-footer-gap, 8px) !important;
  width: var(--pd-sidebar-footer-search-size, 30px) !important;
  min-width: var(--pd-sidebar-footer-search-size, 30px) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

html .app-shell.sidebar-hidden-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]),
html body.navigation-hidden-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer:not([hidden]) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-account {
  order: 1 !important;
}

html .app-shell.sidebar-rail-mode:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search,
html body.navigation-rail-mode .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-rail-footer-layer .sidebar-rail-footer-search {
  order: 2 !important;
}

@media (max-width: 760px) {
  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon,
  html body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] > .sidebar-footer-search-icon {
    position: fixed !important;
    left: var(--pd-sidebar-footer-search-left, 6px) !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
  html body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
    position: fixed !important;
    inset: auto 12px max(12px, env(safe-area-inset-bottom)) calc(var(--pd-table-lab-rail-width, 41px) + 12px) !important;
    width: auto !important;
    max-width: calc(100vw - var(--pd-table-lab-rail-width, 41px) - 24px) !important;
  }
}

/* USER UPDATE: final left-sidebar spacing rhythm.
   Keep Menu 1, Menu 2, and dashboard rows on one shared compact grid. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"],
html .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"] {
  --pd-sidebar-group-row-height: 40px !important;
  --pd-sidebar-nav-row-height: 38px !important;
  --pd-sidebar-nav-row-gap: 0px !important;
  --pd-sidebar-nav-row-pad-left: 10px !important;
  --pd-sidebar-nav-row-pad-right: 12px !important;
  --pd-sidebar-nav-label-size: 12px !important;
  --pd-sidebar-nav-count-width: 34px !important;
  --pd-sidebar-group-edge-gutter: 4px !important;
  --pd-sidebar-group-edge-gutter-total: 8px !important;
  --pd-table-lab-row-height: var(--pd-sidebar-nav-row-height) !important;
  --pd-table-lab-row-pad-left: var(--pd-sidebar-nav-row-pad-left) !important;
  --pd-table-lab-row-pad-right: var(--pd-sidebar-nav-row-pad-right) !important;
  --pd-table-lab-highlight-left: 0px !important;
  --pd-table-lab-highlight-height: 30px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-section,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-section {
  gap: 4px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) {
  margin: 0 0 4px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 100% !important;
  height: var(--pd-sidebar-group-row-height) !important;
  min-height: var(--pd-sidebar-group-row-height) !important;
  margin: 0 !important;
  padding: 0 6px !important;
  border-radius: 8px !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--pd-sidebar-nav-row-gap) !important;
  margin: 0 !important;
  padding: 4px 0 6px !important;
  border-left: 0 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--pd-sidebar-nav-count-width) !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 100% !important;
  height: var(--pd-sidebar-nav-row-height) !important;
  min-height: var(--pd-sidebar-nav-row-height) !important;
  margin: 0 !important;
  padding: 0 var(--pd-sidebar-nav-row-pad-right) 0 var(--pd-sidebar-nav-row-pad-left) !important;
  border-radius: 8px !important;
  font-size: var(--pd-sidebar-nav-label-size) !important;
  line-height: 1.18 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item {
  grid-template-columns: minmax(0, 1fr) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.18 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item > .menu-text,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item > .menu-text {
  grid-column: 1 / -1 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]),
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count {
  justify-self: end !important;
  min-width: var(--pd-sidebar-nav-count-width) !important;
  text-align: right !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before {
  left: var(--pd-table-lab-highlight-left) !important;
  right: 0 !important;
  height: var(--pd-table-lab-highlight-height) !important;
  border-radius: 8px !important;
}

/* Specificity bridge for the generated rail-ready shell state. */
html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"],
html .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"][data-pd-rail-ready="true"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"][data-pd-rail-ready="true"],
html .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"][data-variant="inset"][data-pd-rail-ready="true"],
html body[class$="-theme"] .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"][data-variant="inset"][data-pd-rail-ready="true"] {
  --pd-table-lab-row-height: var(--pd-sidebar-nav-row-height) !important;
  --pd-table-lab-row-pad-left: var(--pd-sidebar-nav-row-pad-left) !important;
  --pd-table-lab-row-pad-right: var(--pd-sidebar-nav-row-pad-right) !important;
  --pd-table-lab-highlight-left: 0px !important;
  --pd-table-lab-highlight-height: 30px !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary {
  height: var(--pd-sidebar-group-row-height) !important;
  min-height: var(--pd-sidebar-group-row-height) !important;
  padding: 0 6px !important;
  border-radius: 8px !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-content.nav-menu-content {
  gap: var(--pd-sidebar-nav-row-gap) !important;
  padding: 4px 0 6px !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  grid-template-columns: minmax(0, 1fr) var(--pd-sidebar-nav-count-width) !important;
  column-gap: 8px !important;
  height: var(--pd-sidebar-nav-row-height) !important;
  min-height: var(--pd-sidebar-nav-row-height) !important;
  padding: 0 var(--pd-sidebar-nav-row-pad-right) 0 var(--pd-sidebar-nav-row-pad-left) !important;
  border-radius: 8px !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item {
  grid-template-columns: minmax(0, 1fr) !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item.dashboard-nav-item[data-slot="sidebar-menu-button"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item.dashboard-nav-item[data-slot="sidebar-menu-button"] {
  grid-template-columns: minmax(0, 1fr) !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]) {
  min-width: var(--pd-sidebar-nav-count-width) !important;
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before {
  left: 0 !important;
  height: var(--pd-table-lab-highlight-height) !important;
  border-radius: 8px !important;
}

/* USER UPDATE: rebuilt flat sidebar account menu.
   The footer account menu is now one flat panel; legacy submenu/flyout CSS stays
   below this ownership layer and must not shape the live account surface. */
html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
  position: fixed !important;
  left: var(--sidebar-account-menu-left, 8px) !important;
  right: auto !important;
  top: var(--sidebar-account-menu-top, 12px) !important;
  bottom: auto !important;
  z-index: 10140 !important;
  display: flex !important;
  flex-direction: column !important;
  width: min(300px, calc(100vw - 16px)) !important;
  min-width: min(260px, calc(100vw - 16px)) !important;
  max-width: min(300px, calc(100vw - 16px)) !important;
  max-height: none !important;
  gap: 4px !important;
  padding: 8px !important;
  overflow: visible !important;
  scrollbar-width: none !important;
  border: 1px solid rgba(15, 23, 42, 0.1) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.16), 0 4px 12px rgba(15, 23, 42, 0.08) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] *,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] * {
  box-sizing: border-box !important;
  letter-spacing: 0 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-menu-account,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-menu-account {
  display: grid !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 8px 10px 10px !important;
  min-width: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan {
  color: #111827 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-section,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-section {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(15, 23, 42, 0.08) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-management-section,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-management-section {
  border-top: 0 !important;
  padding-top: 0 !important;
}

/* USER UPDATE: hide account menu Workspace/Appearance action bridge. */
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #toolbarMoreMenu[data-sidebar-account-actions-hidden="true"][hidden],
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #toolbarMoreMenu[data-sidebar-account-actions-hidden="true"][hidden] {
  display: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-protected-menu::before,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-protected-menu::before {
  display: none !important;
  content: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-summary,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-summary {
  display: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-panel,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-panel {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-group,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-label,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-label {
  display: block !important;
  margin: 0 !important;
  padding: 2px 10px 4px !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.sidebar-account-flat-row, .sidebar-account-flat-control-row),
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.sidebar-account-flat-row, .sidebar-account-flat-control-row) {
  appearance: none !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: #111827 !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  cursor: pointer !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.sidebar-account-flat-row, .sidebar-account-flat-control-row):hover,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.sidebar-account-flat-row, .sidebar-account-flat-control-row):focus-visible,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.sidebar-account-flat-row, .sidebar-account-flat-control-row):hover,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.sidebar-account-flat-row, .sidebar-account-flat-control-row):focus-visible {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  outline: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 6px !important;
  color: #64748b !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-label,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-label {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-kbd,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-kbd {
  justify-self: end !important;
  color: #94a3b8 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button {
  color: #dc2626 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #menuPackageControls[hidden],
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #menuPackageControls[hidden] {
  display: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #menuPackageControls:not([hidden]),
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #menuPackageControls:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label select,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label select {
  width: 100% !important;
  min-width: 0 !important;
  height: 24px !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #111827 !important;
  font-size: 12px !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-appearance-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-appearance-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 36px 36px !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 10px !important;
  background: transparent !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button:hover,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button:focus-visible,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button:hover,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button:focus-visible {
  background: #f8fafc !important;
  outline: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeCustomColorInput,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeCustomColorInput {
  width: 36px !important;
  height: 30px !important;
  min-width: 36px !important;
  padding: 2px !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  border-radius: 6px !important;
  background: #ffffff !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-theme-select-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-theme-select-row {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 10px !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeSelector,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeSelector {
  width: 100% !important;
  min-width: 0 !important;
  height: 30px !important;
  padding: 0 8px !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #111827 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

@media (max-width: 760px) {
  html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
  html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: min(620px, calc(100vh - 24px)) !important;
  }
}

/* USER UPDATE: professional left-sidebar rail/text alignment.
   The runtime centers rail wrappers from measured rows; this final layer keeps
   inactive icons, active sockets, labels, and counters on the same axis. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"],
html .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html body[class$="-theme"] .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"][data-variant="inset"] {
  --pd-sidebar-rail-active-y-offset: 0px !important;
  --pd-sidebar-rail-icon-y-offset: 0px !important;
  --pd-sidebar-nav-row-pad-left: 10px !important;
  --pd-sidebar-nav-row-pad-right: 12px !important;
  --pd-sidebar-nav-count-width: 34px !important;
  --pd-table-lab-row-pad-left: var(--pd-sidebar-nav-row-pad-left) !important;
  --pd-table-lab-row-pad-right: var(--pd-sidebar-nav-row-pad-right) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  align-items: center !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-title,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-title,
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > .menu-text {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count,
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  top: calc(var(--sidebar-rail-icon-top, 0px) + var(--pd-sidebar-rail-icon-y-offset, 0px)) !important;
  transform: none !important;
}

html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source,
html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] > .sidebar-active-rail-indicator {
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
}

/* USER UPDATE: enterprise left-sidebar row grid refinement.
   Keep the shell flex and measured rail behavior; refine only row rhythm,
   count alignment, and active/open row surfaces. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"],
html .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"][data-variant="inset"],
html body[class$="-theme"] .app-shell.sidebar-hidden-mode .sidebar[data-slot="sidebar"][data-variant="inset"] {
  --pd-sidebar-enterprise-row-bg: transparent !important;
  --pd-sidebar-enterprise-row-hover-bg: rgba(15, 23, 42, 0.04) !important;
  --pd-sidebar-enterprise-active-bg: var(--pd-app-frame-surface, #ffffff) !important;
  --pd-sidebar-enterprise-active-border: var(--pd-app-frame-border, #e5e7eb) !important;
  --pd-sidebar-enterprise-active-color: #111827 !important;
  --pd-sidebar-enterprise-muted-color: #64748b !important;
  --pd-sidebar-enterprise-count-width: 38px !important;
  --pd-sidebar-enterprise-count-size: 11px !important;
  --pd-sidebar-enterprise-radius: 8px !important;
  --pd-sidebar-nav-count-width: var(--pd-sidebar-enterprise-count-width) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary {
  grid-template-columns: 24px minmax(0, 1fr) var(--pd-sidebar-enterprise-count-width) 16px !important;
  background: var(--pd-sidebar-enterprise-row-bg) !important;
  border-radius: var(--pd-sidebar-enterprise-radius) !important;
  color: var(--pd-sidebar-enterprise-active-color) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary:hover,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary:hover {
  background: var(--pd-sidebar-enterprise-row-hover-bg) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"])[open] > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"])[open] > .sidebar-collapsible-summary {
  background: var(--pd-sidebar-enterprise-active-bg) !important;
  box-shadow: inset 0 0 0 1px var(--pd-sidebar-enterprise-active-border) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
  grid-template-columns: minmax(0, 1fr) var(--pd-sidebar-enterprise-count-width) !important;
  background: var(--pd-sidebar-enterprise-row-bg) !important;
  border-radius: var(--pd-sidebar-enterprise-radius) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:hover,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:hover {
  background: var(--pd-sidebar-enterprise-row-hover-bg) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item,
html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item {
  grid-template-columns: minmax(0, 1fr) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item > .menu-text,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .dashboard-nav-item > .menu-text {
  grid-column: 1 / -1 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) {
  background: var(--pd-sidebar-enterprise-active-bg) !important;
  color: var(--pd-sidebar-enterprise-active-color) !important;
  box-shadow: inset 0 0 0 1px var(--pd-sidebar-enterprise-active-border) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count,
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item > :is(.menu-count, span[id$="Count"]) {
  min-width: var(--pd-sidebar-enterprise-count-width) !important;
  width: var(--pd-sidebar-enterprise-count-width) !important;
  color: var(--pd-sidebar-enterprise-muted-color) !important;
  font-size: var(--pd-sidebar-enterprise-count-size) !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: 0 !important;
  text-align: right !important;
}

/* USER UPDATE: make open group counts match the flat menu row counters.
   The old global badge rendered the top count as a pale circle; the group grid
   already reserves the count column, so keep the number text-only. */
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  justify-self: stretch !important;
  min-width: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pd-sidebar-enterprise-muted-color) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-chevron,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary .sidebar-collapsible-chevron {
  justify-self: end !important;
  color: var(--pd-sidebar-enterprise-muted-color) !important;
}

/* USER UPDATE: give open sidebar group headers a small edge gutter.
   The sidebar content clips overflow horizontally, so a 100%-wide rounded
   group surface can visually look cut at the edge. Keep the gutter on the
   group header only; row and rail measurements remain unchanged. */
html .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-pd-rail-ready="true"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary {
  box-sizing: border-box !important;
  width: calc(100% - var(--pd-sidebar-group-edge-gutter-total, 8px)) !important;
  margin-inline: var(--pd-sidebar-group-edge-gutter, 4px) !important;
}

/* USER UPDATE: AppDataGrid-style hover affordance for the black sidebar rail.
   The generated rail wrappers stay icon-sized so row measurement remains stable;
   the hover plate expands with a pseudo-element around the centered icon. */
html .app-shell .sidebar[data-slot="sidebar"],
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] {
  --pd-sidebar-rail-hover-plate-size: 30px !important;
  --pd-sidebar-rail-hover-plate-radius: 8px !important;
  --pd-sidebar-rail-hover-bg: #ffffff !important;
  --pd-sidebar-rail-hover-border: rgba(226, 232, 240, 0.96) !important;
  --pd-sidebar-rail-hover-shadow: 0 1px 2px rgba(15, 23, 42, 0.08), 0 0 0 3px rgba(148, 163, 184, 0.18) !important;
  --pd-sidebar-rail-hover-color: #0f172a !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon {
  overflow: visible !important;
  border-radius: var(--pd-sidebar-rail-hover-plate-radius, 8px) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  transition: color 160ms ease, opacity 160ms ease !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon::before,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  z-index: 0 !important;
  width: var(--pd-sidebar-rail-hover-plate-size, 30px) !important;
  height: var(--pd-sidebar-rail-hover-plate-size, 30px) !important;
  border: 1px solid transparent !important;
  border-radius: var(--pd-sidebar-rail-hover-plate-radius, 8px) !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) !important;
  transition: opacity 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon > .sidebar-rail-icon-source {
  position: relative !important;
  z-index: 1 !important;
  transition: color 160ms ease, background-color 160ms ease !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon:hover::before,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon:hover::before {
  border-color: var(--pd-sidebar-rail-hover-border, rgba(226, 232, 240, 0.96)) !important;
  background: var(--pd-sidebar-rail-hover-bg, #ffffff) !important;
  box-shadow: var(--pd-sidebar-rail-hover-shadow, 0 1px 2px rgba(15, 23, 42, 0.08)) !important;
  opacity: 1 !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon:hover > .sidebar-rail-icon-source,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-rail-icon-layer > .sidebar-rail-icon:hover > .sidebar-rail-icon-source {
  color: var(--pd-sidebar-rail-hover-color, #0f172a) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]),
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]) {
  cursor: pointer !important;
  pointer-events: auto !important;
  transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]):hover,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]):hover {
  background: var(--pd-sidebar-rail-hover-bg, #ffffff) !important;
  color: var(--pd-sidebar-rail-hover-color, #0f172a) !important;
  box-shadow: var(--pd-sidebar-rail-hover-shadow, 0 1px 2px rgba(15, 23, 42, 0.08)) !important;
}

html .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]):hover > .sidebar-active-rail-icon-source,
html body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-active-rail-indicator:not([hidden]):hover > .sidebar-active-rail-icon-source {
  color: var(--pd-sidebar-rail-hover-color, #0f172a) !important;
}

/* USER UPDATE: account menu actions render as button rows.
   Keep actions visibly clickable, and keep select/color controls distinct from
   action buttons inside the same flat account dropdown. */
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.toolbar-more-panel, .toolbar-more-section, .sidebar-account-flat-group),
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(.toolbar-more-panel, .toolbar-more-section, .sidebar-account-flat-group) {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  grid-template-columns: none !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #menuPackageControls:not([hidden]),
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #menuPackageControls:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row {
  appearance: none !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) max-content !important;
  align-items: center !important;
  justify-content: stretch !important;
  column-gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid rgba(15, 23, 42, 0.11) !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:hover,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:focus-visible,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:hover,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:focus-visible {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  color: #0f172a !important;
  outline: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:active,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:active {
  transform: translateY(1px) !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row .sidebar-account-row-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row .sidebar-account-row-icon {
  width: 22px !important;
  height: 22px !important;
  color: #475569 !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row .sidebar-account-row-label,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row .sidebar-account-row-label {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label.sidebar-account-flat-control-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label.sidebar-account-flat-control-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 5px !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(15, 23, 42, 0.09) !important;
  border-radius: 7px !important;
  background: #f8fafc !important;
  color: #64748b !important;
  cursor: default !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label .menu-package-duplicate-text,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label .menu-package-duplicate-text {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label select,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .menu-package-duplicate-label select {
  width: 100% !important;
  min-width: 0 !important;
  height: 30px !important;
  margin: 0 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-appearance-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-appearance-row {
  display: grid !important;
  grid-template-columns: 36px 36px 36px !important;
  align-items: center !important;
  justify-content: start !important;
  gap: 6px !important;
  width: max-content !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 10px !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button {
  display: inline-grid !important;
  place-items: center !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border: 1px solid rgba(15, 23, 42, 0.11) !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #334155 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button svg,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-chip-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeCustomColorInput,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeCustomColorInput {
  width: 36px !important;
  min-width: 36px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 3px !important;
  cursor: pointer !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-theme-select-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-theme-select-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 5px !important;
  padding: 4px 10px 0 !important;
  color: #64748b !important;
  cursor: default !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-theme-select-row > span,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-theme-select-row > span {
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeSelector,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] #themeSelector {
  height: 34px !important;
  border-radius: 7px !important;
}

/* USER UPDATE: account dropdown workspace buttons override legacy toolbar IDs. */
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(#menuExportPackageButton, #menuMergePackageButton, #downloadSelectedButton, #copyCitationButton, #printButton).sidebar-account-flat-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(#menuExportPackageButton, #menuMergePackageButton, #downloadSelectedButton, #copyCitationButton, #printButton).sidebar-account-flat-row {
  appearance: none !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) max-content !important;
  align-items: center !important;
  justify-content: stretch !important;
  column-gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid rgba(15, 23, 42, 0.11) !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  text-decoration: none !important;
  text-transform: none !important;
  cursor: pointer !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(#menuExportPackageButton, #menuMergePackageButton, #downloadSelectedButton, #copyCitationButton, #printButton).sidebar-account-flat-row:hover,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(#menuExportPackageButton, #menuMergePackageButton, #downloadSelectedButton, #copyCitationButton, #printButton).sidebar-account-flat-row:focus-visible,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(#menuExportPackageButton, #menuMergePackageButton, #downloadSelectedButton, #copyCitationButton, #printButton).sidebar-account-flat-row:hover,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(#menuExportPackageButton, #menuMergePackageButton, #downloadSelectedButton, #copyCitationButton, #printButton).sidebar-account-flat-row:focus-visible {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  color: #0f172a !important;
  outline: none !important;
}

/* USER UPDATE: account dropdown click target guard.
   The flat account menu is fixed to the viewport, so it must also own the
   final overlay stack and hit-testing after the legacy rail/flyout layers. */
html .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
  z-index: 2147483001 !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(button, summary, input, select, label, .sidebar-account-flat-row, .sidebar-account-chip-button),
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] :is(button, summary, input, select, label, .sidebar-account-flat-row, .sidebar-account-chip-button) {
  pointer-events: auto !important;
}

html .app-shell.sidebar-account-menu-open .sidebar-gap[data-slot="sidebar-gap"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-gap[data-slot="sidebar-gap"] {
  pointer-events: none !important;
}

html .app-shell.sidebar-account-menu-open .sidebar-swipe-edge,
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-swipe-edge {
  pointer-events: none !important;
}

/* USER UPDATE: rail account dropdown viewport hit target guard.
   Later floating-footer rules must not make the fixed account dropdown inherit
   the hidden footer's bottom position; anchor the open menu layer to 0,0 and
   let the dropdown use the measured viewport CSS variables. */
html .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body.navigation-rail-mode .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  display: block !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transform: none !important;
  contain: none !important;
  isolation: auto !important;
  z-index: 2147483000 !important;
}

html .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open],
html body.navigation-rail-mode .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open],
html body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  display: block !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  pointer-events: none !important;
  transform: none !important;
  contain: none !important;
  z-index: 2147483001 !important;
}

html .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body.navigation-rail-mode .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
  position: fixed !important;
  inset: auto !important;
  left: var(--sidebar-account-menu-left, 52px) !important;
  top: var(--sidebar-account-menu-top, 12px) !important;
  right: auto !important;
  bottom: auto !important;
  display: grid !important;
  width: min(260px, calc(100vw - 72px)) !important;
  min-width: min(220px, calc(100vw - 72px)) !important;
  max-width: min(260px, calc(100vw - 16px)) !important;
  max-height: none !important;
  overflow: visible !important;
  scrollbar-width: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  contain: none !important;
  z-index: 2147483002 !important;
}

html .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row,
html body.navigation-rail-mode .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row,
html body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) max-content !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  height: 36px !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* USER UPDATE: render configured user avatars in the existing account slot. */
html .app-shell .sidebar-avatar-image.has-custom-user-avatar,
html body[class$="-theme"] .app-shell .sidebar-avatar-image.has-custom-user-avatar {
  border-color: color-mix(in srgb, var(--pd-user-avatar-color, #2563eb) 34%, #ffffff) !important;
  background: var(--pd-user-avatar-color, #2563eb) !important;
  color: #ffffff !important;
}

html .app-shell .sidebar-avatar-image .sidebar-avatar-custom-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-image .sidebar-avatar-custom-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 1em !important;
  height: 1em !important;
  color: inherit !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

/* USER UPDATE: enterprise avatar account dropdown.
   Keep the existing flat menu wiring, but give the visible account menu the
   same composed control rhythm as the shadcn shell. */
html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell.sidebar-account-menu-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
  width: min(272px, calc(100vw - 16px)) !important;
  min-width: min(248px, calc(100vw - 16px)) !important;
  max-width: min(272px, calc(100vw - 16px)) !important;
  gap: 8px !important;
  padding: 8px !important;
  border: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
  border-radius: 10px !important;
  background: var(--pd-app-frame-surface, #ffffff) !important;
  color: #0f172a !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16), 0 4px 12px rgba(15, 23, 42, 0.08) !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"]::after,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"]::after {
  content: "" !important;
  position: absolute !important;
  left: 26px !important;
  bottom: -6px !important;
  width: 10px !important;
  height: 10px !important;
  border-right: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
  border-bottom: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
  border-radius: 2px !important;
  background: var(--pd-app-frame-surface, #ffffff) !important;
  transform: rotate(45deg) !important;
  pointer-events: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-menu-account,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-menu-account {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  column-gap: 10px !important;
  row-gap: 2px !important;
  padding: 10px !important;
  border: 1px solid rgba(226, 232, 240, 0.96) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-menu-account::before,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-menu-account::before {
  content: "" !important;
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  width: 32px !important;
  height: 32px !important;
  border: 1px solid rgba(191, 219, 254, 0.9) !important;
  border-radius: 50% !important;
  background-color: #eff6ff !important;
  background-image: url("assets/app-icon.png") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 24px 24px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08) !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan {
  grid-column: 2 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-email {
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-plan {
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-section,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-flat-section {
  gap: 4px !important;
  padding: 0 !important;
  border-top: 0 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section {
  padding-top: 8px !important;
  border-top: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row {
  grid-template-columns: 30px minmax(0, 1fr) max-content !important;
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 8px !important;
  border: 1px solid rgba(226, 232, 240, 0.96) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:hover,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:focus-visible,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:hover,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:focus-visible {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  color: #0f172a !important;
  box-shadow: inset 3px 0 0 #2563eb, 0 1px 2px rgba(15, 23, 42, 0.08) !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row .sidebar-account-row-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row .sidebar-account-row-icon {
  width: 24px !important;
  height: 24px !important;
  border: 1px solid rgba(226, 232, 240, 0.96) !important;
  border-radius: 7px !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 12px !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:hover .sidebar-account-row-icon,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:focus-visible .sidebar-account-row-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:hover .sidebar-account-row-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] button.sidebar-account-flat-row:focus-visible .sidebar-account-row-icon {
  border-color: rgba(147, 197, 253, 0.9) !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-kbd,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-account-row-kbd {
  min-width: 38px !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(226, 232, 240, 0.96) !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button {
  border-color: #fee2e2 !important;
  color: #dc2626 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button .sidebar-account-row-icon,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button .sidebar-account-row-icon {
  border-color: #fee2e2 !important;
  background: #fff7ed !important;
  color: #dc2626 !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button:hover,
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button:focus-visible,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button:hover,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] .sidebar-avatar-logout-section .logout-button:focus-visible {
  border-color: #fecaca !important;
  background: #fff1f2 !important;
  color: #b91c1c !important;
  box-shadow: inset 3px 0 0 #ef4444, 0 1px 2px rgba(127, 29, 29, 0.1) !important;
}

html .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body.navigation-rail-mode .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell.sidebar-rail-mode.sidebar-rail-account-open .sidebar-avatar-menu[open] > .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
  width: min(272px, calc(100vw - 72px)) !important;
  min-width: min(248px, calc(100vw - 72px)) !important;
  max-width: min(272px, calc(100vw - 16px)) !important;
}

/* USER UPDATE: account dropdown should never show an inner scrollbar.
   The panel is a compact menu popover; rail and expanded modes share the same
   no-scroll surface so the account actions always read as one complete menu. */
html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"],
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"] {
  max-height: none !important;
  overflow: visible !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"]::-webkit-scrollbar,
html body[class$="-theme"] .app-shell .sidebar-avatar-dropdown[data-sidebar-account-menu="flat"]::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* USER UPDATE: enterprise account footer trigger.
   This owns the closed account control; the dropdown block above owns only the
   opened menu panel. */
html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 14px !important;
  align-items: center !important;
  column-gap: 8px !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 4px 8px !important;
  border: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
  border-radius: 8px !important;
  background: var(--pd-app-frame-surface, #ffffff) !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06) !important;
  outline: none !important;
  transform: none !important;
  transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:hover,
html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:focus-visible,
html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-trigger,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:hover,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:focus-visible,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-trigger {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.07), 0 0 0 3px rgba(37, 99, 235, 0.07) !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-image,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-image {
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-image:not(.has-custom-user-avatar),
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-image:not(.has-custom-user-avatar) {
  border-color: rgba(226, 232, 240, 0.96) !important;
  background: #f8fafc !important;
  color: #334155 !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-copy,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-copy {
  gap: 0 !important;
  align-content: center !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-copy strong,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-copy strong {
  color: #0f172a !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-copy span,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-copy span {
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
}

html .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-chevron,
html body[class$="-theme"] .app-shell .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger .sidebar-avatar-chevron {
  justify-self: end !important;
  width: 14px !important;
  height: 14px !important;
  color: #64748b !important;
}

/* USER UPDATE: mobile offcanvas rail stacking guard.
   Phone drawer opens from rail mode, so this final layer must keep the sheet
   above the dim backdrop and restore content that rail mode normally hides. */
html .app-shell.sidebar-offcanvas-open.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
html body[class$="-theme"] .app-shell.sidebar-offcanvas-open.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
html.navigation-offcanvas-open .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
html.navigation-offcanvas-open body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"] {
  position: fixed !important;
  inset-block: 0 !important;
  inset-inline-start: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  min-width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  max-width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  padding: 8px !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
  translate: none !important;
  z-index: 120 !important;
}

html .app-shell.sidebar-offcanvas-open.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html body[class$="-theme"] .app-shell.sidebar-offcanvas-open.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html.navigation-offcanvas-open .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
html.navigation-offcanvas-open body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

html .app-shell.sidebar-offcanvas-open.sidebar-rail-mode .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item),
html body[class$="-theme"] .app-shell.sidebar-offcanvas-open.sidebar-rail-mode .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item),
html.navigation-offcanvas-open .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item),
html.navigation-offcanvas-open body[class$="-theme"] .app-shell.sidebar-rail-mode .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item) {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* USER UPDATE: rebuilt mobile navigation drawer and no-selection chrome guard.
   The sidebar and toolbar are controls, not document text. Prevent accidental
   blue text selection during touch/drag, while keeping inputs editable. */
html .app-shell :is(.sidebar, .sidebar *, .sidebar-swipe-edge, .toolbar-text-loop, .toolbar-text-loop *, .left-nav-hamburger-button, .left-nav-hamburger-button *),
html body[class$="-theme"] .app-shell :is(.sidebar, .sidebar *, .sidebar-swipe-edge, .toolbar-text-loop, .toolbar-text-loop *, .left-nav-hamburger-button, .left-nav-hamburger-button *) {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
}

html .app-shell :is(.sidebar, .sidebar *) :is(input, textarea, select, option, [contenteditable="true"], [data-allow-text-selection="true"]),
html body[class$="-theme"] .app-shell :is(.sidebar, .sidebar *) :is(input, textarea, select, option, [contenteditable="true"], [data-allow-text-selection="true"]) {
  -webkit-user-select: text !important;
  user-select: text !important;
  -webkit-touch-callout: default !important;
}

@media (max-width: 760px) {
  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"] {
    --pd-sidebar-mobile-drawer-gap: max(8px, env(safe-area-inset-left)) !important;
    --pd-sidebar-mobile-drawer-width: min(304px, calc(100vw - 16px)) !important;
    --pd-sidebar-mobile-footer-reserve: 96px !important;
    position: fixed !important;
    inset-block: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-bottom)) !important;
    inset-inline-start: var(--pd-sidebar-mobile-drawer-gap) !important;
    display: flex !important;
    width: var(--pd-sidebar-mobile-drawer-width) !important;
    min-width: var(--pd-sidebar-mobile-drawer-width) !important;
    max-width: var(--pd-sidebar-mobile-drawer-width) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 16px) !important;
    padding: 0 !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    border-radius: 8px !important;
    background: var(--pd-table-lab-sidebar-surface, var(--pd-app-frame-background, #fafafa)) !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.22) !important;
    overflow: hidden !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    translate: none !important;
    z-index: 2147482600 !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"]::before,
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"]::before,
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"]::before,
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"]::before {
    width: var(--pd-table-lab-rail-width, 41px) !important;
    border-radius: 8px 0 0 8px !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 10px 10px var(--pd-sidebar-mobile-footer-reserve, 96px) calc(var(--pd-table-lab-rail-width, 41px) + 10px) !important;
    gap: 4px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item),
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item),
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item),
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item) {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] :is(.tag-panel, .system-utilization-panel, .sidebar-tools),
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] :is(.tag-panel, .system-utilization-panel, .sidebar-tools),
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] :is(.tag-panel, .system-utilization-panel, .sidebar-tools),
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] :is(.tag-panel, .system-utilization-panel, .sidebar-tools) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary {
    min-height: 38px !important;
    height: 38px !important;
    padding-inline: 8px !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.82) !important;
  }

  html .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
  html body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item,
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item {
    min-height: 36px !important;
    height: 36px !important;
    padding-inline: 10px !important;
    border-radius: 8px !important;
  }
}

/* USER UPDATE: mobile navigation opens as a centered modal dialog.
   The phone menu should be a modal surface, not a left-anchored sheet with
   rail-only icon layers drifting across the dimmed app. */
@media (max-width: 760px) {
  html.navigation-offcanvas-open,
  html.navigation-offcanvas-open body,
  body.navigation-offcanvas-open,
  html.navigation-offcanvas-open body[class$="-theme"] {
    overflow: hidden !important;
    overscroll-behavior: contain !important;
  }

  html.navigation-offcanvas-open .app-shell[data-slot="sidebar-wrapper"],
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"],
  body.navigation-offcanvas-open .app-shell[data-slot="sidebar-wrapper"],
  body[class$="-theme"].navigation-offcanvas-open .app-shell[data-slot="sidebar-wrapper"] {
    isolation: isolate !important;
  }

  html.navigation-offcanvas-open .app-shell[data-slot="sidebar-wrapper"]::before,
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"]::before,
  body.navigation-offcanvas-open .app-shell[data-slot="sidebar-wrapper"]::before,
  body[class$="-theme"].navigation-offcanvas-open .app-shell[data-slot="sidebar-wrapper"]::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147482500 !important;
    display: block !important;
    background: rgba(15, 23, 42, 0.52) !important;
    backdrop-filter: blur(2px) saturate(0.96) !important;
    pointer-events: auto !important;
  }

  html.navigation-offcanvas-open body :is(.floating-edge-snap-button, .floating-settings-btn, .floating-action-button),
  html.navigation-offcanvas-open body[class$="-theme"] :is(.floating-edge-snap-button, .floating-settings-btn, .floating-action-button),
  body.navigation-offcanvas-open :is(.floating-edge-snap-button, .floating-settings-btn, .floating-action-button),
  body[class$="-theme"].navigation-offcanvas-open :is(.floating-edge-snap-button, .floating-settings-btn, .floating-action-button) {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"],
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"],
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"],
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] {
    --pd-sidebar-mobile-modal-width: min(356px, calc(100vw - 32px)) !important;
    --pd-sidebar-mobile-modal-height: min(82dvh, calc(100dvh - 32px)) !important;
    position: fixed !important;
    inset: auto !important;
    inset-block: auto !important;
    inset-inline-start: auto !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    display: flex !important;
    flex-direction: column !important;
    width: var(--pd-sidebar-mobile-modal-width) !important;
    min-width: 0 !important;
    max-width: var(--pd-sidebar-mobile-modal-width) !important;
    height: var(--pd-sidebar-mobile-modal-height) !important;
    min-height: 0 !important;
    max-height: var(--pd-sidebar-mobile-modal-height) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(148, 163, 184, 0.32) !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 80px rgba(15, 23, 42, 0.32), 0 4px 16px rgba(15, 23, 42, 0.14) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate(-50%, -50%) !important;
    translate: none !important;
    z-index: 2147482600 !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"]::before,
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"]::before,
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"]::before,
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"]::before {
    content: none !important;
    display: none !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > :is(.sidebar-active-rail-socket, .sidebar-active-rail-indicator, .sidebar-rail-icon-layer, .sidebar-rail-footer-layer, .sidebar-rail-brand, .sidebar-footer-search-icon, .sidebar-account-footer),
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > :is(.sidebar-active-rail-socket, .sidebar-active-rail-indicator, .sidebar-rail-icon-layer, .sidebar-rail-footer-layer, .sidebar-rail-brand, .sidebar-footer-search-icon, .sidebar-account-footer),
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > :is(.sidebar-active-rail-socket, .sidebar-active-rail-indicator, .sidebar-rail-icon-layer, .sidebar-rail-footer-layer, .sidebar-rail-brand, .sidebar-footer-search-icon, .sidebar-account-footer),
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > :is(.sidebar-active-rail-socket, .sidebar-active-rail-indicator, .sidebar-rail-icon-layer, .sidebar-rail-footer-layer, .sidebar-rail-brand, .sidebar-footer-search-icon, .sidebar-account-footer) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-top-search.toolbar-search-group,
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-top-search.toolbar-search-group,
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-top-search.toolbar-search-group,
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-top-search.toolbar-search-group {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 38px !important;
    margin: 14px 14px 8px !important;
    padding: 0 !important;
    transform: none !important;
    translate: none !important;
    z-index: 2 !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-main-content[data-slot="sidebar-content"],
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-main-content[data-slot="sidebar-content"],
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-main-content[data-slot="sidebar-content"],
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] > .sidebar-main-content[data-slot="sidebar-content"] {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 6px 14px 14px !important;
    gap: 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item, .sidebar-collapsible-summary),
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item, .sidebar-collapsible-summary),
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item, .sidebar-collapsible-summary),
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-section, .nav-menu-group.sidebar-collapsible, .sidebar-collapsible-content.nav-menu-content, .nav-menu-content, .nav-item, .dashboard-nav-item, .sidebar-collapsible-summary) {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-item, .dashboard-nav-item),
  html.navigation-offcanvas-open body[class$="-theme"] .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-item, .dashboard-nav-item),
  body.navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-item, .dashboard-nav-item),
  body[class$="-theme"].navigation-offcanvas-open .app-shell .sidebar[data-slot="sidebar"][data-sidebar-modal="true"] :is(.nav-item, .dashboard-nav-item) {
    min-height: 40px !important;
    height: auto !important;
    border-radius: 8px !important;
  }
}

/* USER FIX: remove subtle white sidebar control pills.
   Keep the measured row geometry, counts, and account alignment while making
   group headers and active rows sit directly on the sidebar canvas. The fixed
   account footer keeps its own subtle surface below so underlying text cannot
   bleed through it. */
@media (min-width: 761px) {
  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"],
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] {
    --pd-sidebar-enterprise-active-bg: rgba(15, 23, 42, 0.055) !important;
    --pd-sidebar-enterprise-active-border: rgba(15, 23, 42, 0.08) !important;
    --pd-sidebar-enterprise-row-hover-bg: rgba(15, 23, 42, 0.035) !important;
    --pd-sidebar-fixed-footer-reserve: 68px !important;
    --pd-sidebar-avatar-surface: rgba(255, 255, 255, 0.9) !important;
    --pd-sidebar-avatar-border: rgba(226, 232, 240, 0.92) !important;
    --pd-sidebar-avatar-shadow: 0 8px 18px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05) !important;
  }

  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
    padding-bottom: var(--pd-sidebar-fixed-footer-reserve, 68px) !important;
  }

  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]).sidebar-collapsible[open],
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]).sidebar-collapsible[open] {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }

  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) > .sidebar-collapsible-summary,
  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"])[open] > .sidebar-collapsible-summary,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"])[open] > .sidebar-collapsible-summary {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }

  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]),
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"]) {
    background: var(--pd-sidebar-enterprise-active-bg, rgba(15, 23, 42, 0.055)) !important;
    background-color: var(--pd-sidebar-enterprise-active-bg, rgba(15, 23, 42, 0.055)) !important;
    border-color: var(--pd-sidebar-enterprise-active-border, rgba(15, 23, 42, 0.08)) !important;
    box-shadow: none !important;
  }

  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] .nav-menu-group:is([data-sidebar-section="menu1"], [data-sidebar-section="menu2"]) .nav-item:is(.active, [data-active="true"], [aria-current="page"])::before {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }

  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger,
  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:hover,
  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:focus-visible,
  html .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-trigger,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:hover,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-trigger:focus-visible,
  html body[class$="-theme"] .app-shell:not(.sidebar-offcanvas-open) .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-avatar-menu[open] > .sidebar-avatar-trigger {
    background: var(--pd-sidebar-avatar-surface, rgba(255, 255, 255, 0.9)) !important;
    background-color: var(--pd-sidebar-avatar-surface, rgba(255, 255, 255, 0.9)) !important;
    border-color: var(--pd-sidebar-avatar-border, rgba(226, 232, 240, 0.92)) !important;
    box-shadow: var(--pd-sidebar-avatar-shadow, 0 8px 18px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05)) !important;
  }
}