/*
  Workspace Grid Overlay
  Reusable visual guide for table/workspace customization surfaces.
*/

:root {
  --platform-grid-size: 8px;
  --platform-grid-opacity: 0.24;
  --platform-grid-pattern: none;
  --platform-grid-guide-color: rgba(37, 99, 235, 0.34);
}

/* USER UPDATE: editing grid for the white workspace shell.
   Keep this grid on table/workspace pages only; dashboard builder does not use it. */
.library-panel .data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] {
  position: relative !important;
  isolation: isolate !important;
  width: 100% !important;
  max-width: none !important;
  resize: none !important;
  border: 1px dashed rgba(105, 108, 255, 0.24) !important;
  background-color: rgba(248, 249, 252, 0.78) !important;
  background-image:
    linear-gradient(rgba(105, 108, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(105, 108, 255, 0.06) 1px, transparent 1px) !important;
  background-size: 2rem 2rem !important;
  box-shadow:
    inset 0 0 0 1px rgba(105, 108, 255, 0.08),
    0 0.75rem 1.6rem rgba(67, 89, 113, 0.06) !important;
}

.library-panel .data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] .data-grid-scroll[data-platform-grid-surface="table"] {
  background-color: #ffffff !important;
  background-image:
    linear-gradient(rgba(105, 108, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(105, 108, 255, 0.045) 1px, transparent 1px) !important;
  background-size: 2rem 2rem !important;
}

/* USER UPDATE: free table/widget adjustment handles for customization mode. */
.workspace-adjustment-host {
  position: relative !important;
}

.library-panel .data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] {
  min-height: min(760px, calc(100dvh - 118px)) !important;
  width: 100% !important;
  max-width: none !important;
  overflow: hidden !important;
  resize: none !important;
}

.workspace-adjustment-freeform-host {
  display: block !important;
  min-height: min(760px, calc(100dvh - 160px)) !important;
  overflow: hidden !important;
}

.workspace-adjustable-item {
  position: relative !important;
}

.workspace-adjustable-freeform {
  position: absolute !important;
  inset: auto auto auto auto !important;
  z-index: 30 !important;
  margin: 0 !important;
  transform: none !important;
  will-change: left, top, width, height !important;
}

.data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] > .workspace-canvas-item.workspace-adjustable-freeform {
  display: block !important;
  min-width: 220px !important;
  min-height: 150px !important;
  max-width: calc(100% - 2px) !important;
  max-height: calc(100% - 2px) !important;
  overflow: auto !important;
  border: 1px solid rgba(148, 163, 184, 0.42) !important;
  border-radius: 12px !important;
  background-color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
}

.workspace-canvas-item[data-workspace-canvas-kind="table"] {
  min-width: 360px !important;
  min-height: 220px !important;
}

/* USER UPDATE: Menu 1 workspace canvas items inside the white shell. */
.library-panel .data-grid-shell.menu1-workspace-widgets-enabled {
  position: relative !important;
  isolation: isolate !important;
  min-height: min(760px, calc(100dvh - 118px)) !important;
}

.library-panel .data-grid-shell.menu1-workspace-widgets-enabled > .data-grid-scroll[data-platform-grid-surface="table"] {
  padding-top: 0 !important;
}

.library-panel .data-grid-shell.menu1-workspace-widgets-enabled[data-platform-grid-editing="true"] > .data-grid-scroll[data-platform-grid-surface="table"] {
  margin-top: var(--menu1-workspace-widget-offset, 0px) !important;
}

.library-panel .data-grid-shell.menu1-workspace-widgets-enabled:not([data-platform-grid-editing="true"]) > .data-grid-scroll[data-platform-grid-surface="table"] {
  margin-top: 0 !important;
}

/* USER UPDATE: keep normal document widgets in page flow so they cannot cover table rows. */
.library-panel .data-grid-shell.menu1-workspace-widgets-enabled:not([data-platform-grid-editing="true"]) > .workspace-menu1-area-chart-card {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: min(900px, 100%) !important;
  height: 280px !important;
  margin: 0 0 12px !important;
  transform: none !important;
}

/* USER UPDATE: shadcn Area Chart - Interactive canvas widget for the legal documents menu. */
.data-grid-shell[data-platform-grid-surface="table"] > .workspace-menu1-area-chart-card {
  display: block !important;
  min-width: 320px !important;
  min-height: 260px !important;
  overflow: visible !important;
  z-index: 32 !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] > .workspace-menu1-area-chart-card.workspace-adjustable-freeform {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  cursor: grab !important;
  touch-action: none !important;
}

.workspace-adjustment-active .workspace-menu1-area-chart-card,
.workspace-menu1-area-chart-card.is-workspace-adjusting {
  cursor: grabbing !important;
}

.workspace-menu1-area-chart-card .workspace-shadcn-area-widget-card,
.workspace-menu1-area-chart-card .workspace-shadcn-area-root,
.workspace-menu1-area-chart-card .shadcn-area-react-root {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

.workspace-menu1-area-chart-card .shadcn-area-react-root > * {
  width: 100% !important;
  height: 100% !important;
}

.workspace-menu1-area-chart-card .shadcn-area-react-root [data-slot="card"] {
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  border-radius: 12px !important;
}

.workspace-adjustment-toolbar {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 80 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 3px !important;
  border: 1px solid rgba(148, 163, 184, 0.42) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 140ms ease !important;
}

.workspace-adjustable-item:hover > .workspace-adjustment-toolbar,
.workspace-adjustable-item:focus-within > .workspace-adjustment-toolbar,
.workspace-adjustable-item.is-workspace-adjusting > .workspace-adjustment-toolbar {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] > .workspace-adjustable-item > .workspace-adjustment-toolbar {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.workspace-adjustment-move,
.workspace-adjustment-reset {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 44px !important;
  height: 26px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #334155 !important;
  font: 700 11px/1 "Inter", "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
  cursor: grab !important;
}

.workspace-adjustment-reset {
  min-width: 48px !important;
  cursor: pointer !important;
}

.workspace-adjustment-move:hover,
.workspace-adjustment-reset:hover {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

.workspace-adjustment-active .workspace-adjustment-move,
.workspace-adjustable-item.is-workspace-adjusting .workspace-adjustment-move {
  cursor: grabbing !important;
}

.workspace-adjustment-resize {
  position: absolute !important;
  right: 8px !important;
  bottom: 8px !important;
  z-index: 82 !important;
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  border: 1px solid rgba(37, 99, 235, 0.32) !important;
  border-radius: 5px !important;
  background:
    linear-gradient(135deg, transparent 0 48%, rgba(37, 99, 235, 0.82) 50%, transparent 52%) no-repeat,
    #ffffff !important;
  background-size: 100% 100% !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12) !important;
  cursor: nwse-resize !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.workspace-adjustable-item:hover > .workspace-adjustment-resize,
.workspace-adjustable-item:focus-within > .workspace-adjustment-resize,
.workspace-adjustable-item.is-workspace-adjusting > .workspace-adjustment-resize {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] > .workspace-adjustable-item > .workspace-adjustment-resize {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.workspace-adjustable-item.is-workspace-adjusting {
  z-index: 90 !important;
  outline: 2px solid rgba(37, 99, 235, 0.42) !important;
  outline-offset: 2px !important;
}

/* USER UPDATE: workspace canvas customization panel for table/workspace pages. */
.workspace-customization-panel {
  display: grid !important;
  gap: 0 !important;
  min-width: 0 !important;
  margin: 0 0 12px !important;
  padding: 12px !important;
  border: 1px dashed rgba(214, 51, 132, 0.28) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.04) !important;
}

.workspace-builder-toolbar.dashboard-builder-toolbar {
  display: grid !important;
  grid-template-columns: minmax(220px, 0.55fr) minmax(360px, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(203, 213, 225, 0.78) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.workspace-builder-toolbar > div:first-child {
  min-width: 0 !important;
  display: grid !important;
  gap: 5px !important;
}

.workspace-builder-toolbar.dashboard-builder-toolbar strong {
  color: #334155 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
}

.workspace-builder-toolbar.dashboard-builder-toolbar span {
  min-width: 0 !important;
  color: #7c5369 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  overflow-wrap: anywhere !important;
}

.workspace-builder-toolbar > .platform-grid-overlay-controls {
  width: min(100%, 620px) !important;
  min-width: 0 !important;
  justify-self: end !important;
  grid-template-columns: minmax(208px, max-content) minmax(106px, 128px) minmax(160px, 1fr) !important;
  gap: 6px 8px !important;
  padding: 6px 8px !important;
  border-radius: 12px !important;
  background: rgba(248, 250, 252, 0.9) !important;
}

.workspace-builder-toolbar .platform-grid-overlay-controls label {
  min-width: 0 !important;
}

.workspace-builder-toolbar .platform-grid-overlay-controls select,
.workspace-builder-toolbar .platform-grid-overlay-controls input[type="range"] {
  width: 100% !important;
}

.workspace-builder-toolbar .platform-grid-overlay-controls .platform-grid-toggle-row {
  gap: 8px !important;
}

/* USER UPDATE: ReUI c-data-grid-7 row-selection table for workspace Add Table. */
.workspace-reui-table-ready {
  padding: 14px !important;
}

.workspace-reui-table-ready > #itemList,
.workspace-reui-table-ready > .item-list {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
}

.workspace-reui-data-grid {
  --workspace-reui-border: #e5e7eb;
  --workspace-reui-muted: #737373;
  --workspace-reui-ink: #171717;
  display: block !important;
  width: 100% !important;
  min-width: 620px !important;
  overflow: hidden !important;
  border: 1px solid var(--workspace-reui-border) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: var(--workspace-reui-ink) !important;
  box-shadow: none !important;
  font-family: "Inter", "Segoe UI", "Khmer OS Siemreap", Arial, sans-serif !important;
}

.workspace-reui-data-grid.is-preview {
  min-width: min(100%, 620px) !important;
  max-width: 100% !important;
}

.workspace-reui-data-grid-header,
.workspace-reui-data-grid-row {
  display: grid !important;
  grid-template-columns: 44px minmax(210px, 1.15fr) minmax(170px, 0.92fr) minmax(120px, 0.5fr) !important;
  align-items: stretch !important;
  min-width: 0 !important;
}

.workspace-reui-data-grid-header {
  min-height: 36px !important;
  background: #fafafa !important;
  border-bottom: 1px solid var(--workspace-reui-border) !important;
}

.workspace-reui-data-grid-row {
  min-height: 58px !important;
  background: #ffffff !important;
  border-bottom: 1px solid var(--workspace-reui-border) !important;
  transition: background-color 120ms ease !important;
}

.workspace-reui-data-grid-row:last-child {
  border-bottom: 0 !important;
}

.workspace-reui-data-grid-row:hover,
.workspace-reui-data-grid-row.is-selected {
  background: #fafafa !important;
}

.workspace-reui-data-grid-head,
.workspace-reui-data-grid-cell {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 16px !important;
  overflow: hidden !important;
  text-align: left !important;
}

.workspace-reui-data-grid-head {
  color: #525252 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.workspace-reui-data-grid-cell {
  color: var(--workspace-reui-ink) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}

.workspace-reui-select-cell {
  justify-content: center !important;
  padding: 0 !important;
}

.workspace-reui-checkbox {
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  padding: 0 !important;
  border: 1px solid #d4d4d4 !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  color: #ffffff !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.workspace-reui-checkbox:hover,
.workspace-reui-checkbox:focus-visible {
  border-color: #a3a3a3 !important;
  outline: none !important;
}

.workspace-reui-checkbox[aria-checked="true"] {
  border-color: #171717 !important;
  background: #171717 !important;
}

.workspace-reui-checkbox[aria-checked="true"]::after {
  width: 8px !important;
  height: 5px !important;
  margin-top: -1px !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  content: "" !important;
  transform: rotate(45deg) !important;
}

.workspace-reui-checkbox[aria-checked="mixed"] {
  border-color: #171717 !important;
  background: #171717 !important;
}

.workspace-reui-checkbox[aria-checked="mixed"]::after,
.workspace-reui-checkbox.is-mixed::after {
  width: 8px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  content: "" !important;
}

.workspace-reui-name-cell {
  gap: 12px !important;
}

.workspace-reui-avatar {
  position: relative !important;
  display: inline-grid !important;
  flex: 0 0 auto !important;
  width: 32px !important;
  height: 32px !important;
  place-items: center !important;
  overflow: visible !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.64), transparent 30%),
    linear-gradient(135deg, #f4c2c2, #8b5cf6) !important;
  color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.workspace-reui-avatar i {
  position: absolute !important;
  right: -1px !important;
  bottom: -1px !important;
  width: 8px !important;
  height: 8px !important;
  border: 2px solid #ffffff !important;
  border-radius: 999px !important;
  background: #a3a3a3 !important;
}

.workspace-reui-avatar-online i { background: #22c55e !important; }
.workspace-reui-avatar-away i { background: #f59e0b !important; }
.workspace-reui-avatar-busy i { background: #f97316 !important; }
.workspace-reui-avatar-offline i { background: #94a3b8 !important; }

.workspace-reui-person {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

.workspace-reui-person strong,
.workspace-reui-location-cell strong,
.workspace-reui-joined-cell strong {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #171717 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.workspace-reui-person small {
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--workspace-reui-muted) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.workspace-reui-location-cell {
  gap: 6px !important;
}

.workspace-reui-flag {
  display: inline-grid !important;
  flex: 0 0 auto !important;
  width: 18px !important;
  height: 18px !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif !important;
  font-size: 15px !important;
  line-height: 1 !important;
}

.workspace-reui-joined-cell {
  justify-content: flex-start !important;
}

@media print {
  .library-panel .data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"],
  .library-panel .data-grid-shell[data-platform-grid-surface="table"][data-platform-grid-editing="true"] .data-grid-scroll[data-platform-grid-surface="table"] {
    background-image: none !important;
  }

  .workspace-customization-panel,
  .workspace-adjustment-toolbar,
  .workspace-adjustment-resize {
    display: none !important;
  }
}

.platform-grid-overlay-surface {
  position: relative !important;
  isolation: isolate;
}

.platform-grid-overlay-surface::before,
.platform-grid-overlay-surface::after {
  content: "";
  position: absolute;
  inset: 0;
  display: none;
  pointer-events: none;
  border-radius: inherit;
}

.platform-grid-overlay-surface::before {
  z-index: 45;
  background-image: var(--platform-grid-pattern);
  background-size: var(--platform-grid-size) var(--platform-grid-size);
  opacity: var(--platform-grid-opacity);
  mix-blend-mode: multiply;
}

.platform-grid-overlay-surface[data-platform-grid-surface="table"]::after {
  z-index: 44;
  background-image:
    linear-gradient(to right, var(--platform-grid-guide-color) 1px, transparent 1px),
    linear-gradient(to right, rgba(37, 99, 235, 0.07), rgba(37, 99, 235, 0.07));
  background-size: calc(100% / 12) 100%, calc(100% / 12) 100%;
  background-repeat: repeat, repeat;
  opacity: calc(var(--platform-grid-opacity) * 0.85);
}

body.platform-grid-overlay-visible .platform-grid-overlay-surface::before,
body.platform-grid-overlay-visible .platform-grid-overlay-surface[data-platform-grid-surface="table"]::after {
  display: block;
}

.platform-grid-overlay-controls {
  display: grid;
  grid-template-columns: minmax(208px, max-content) minmax(106px, 132px) minmax(170px, 1fr);
  gap: 6px 8px;
  align-items: center;
  min-width: min(100%, 548px);
  max-width: 640px;
  margin: 0;
  padding: 6px 8px;
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.78);
}

.platform-grid-overlay-controls legend {
  padding-inline: 4px;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
}

.platform-grid-overlay-controls label {
  display: grid;
  gap: 3px;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
}

.platform-grid-overlay-controls .platform-grid-toggle-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.platform-grid-overlay-controls .platform-grid-toggle {
  display: inline-grid;
  grid-template-columns: auto max-content;
  gap: 5px;
  align-items: center;
  width: auto;
  min-width: 0;
  white-space: nowrap;
}

.platform-grid-overlay-controls select,
.platform-grid-overlay-controls input[type="range"] {
  min-height: 28px;
}

.platform-grid-overlay-controls select {
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  font: inherit;
}

.platform-grid-overlay-controls input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--accent, #2563eb);
}

.platform-grid-overlay-controls output {
  color: #0f172a;
  font-weight: 700;
}

@media (max-width: 1180px) {
  .platform-grid-overlay-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .platform-grid-overlay-controls {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* USER UPDATE: shadcn dashboard-01 scrolling shell.
   The outer viewport stays fixed; the white workspace panel owns vertical page scroll. */
html,
body,
body[class$="-theme"] {
  height: 100% !important;
  overflow: hidden !important;
}

.app-shell,
body[class$="-theme"] .app-shell {
  align-items: stretch !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
}

.sidebar[data-slot="sidebar"],
body[class$="-theme"] .sidebar[data-slot="sidebar"] {
  height: calc(100dvh - (var(--pd-app-frame-gap, 10px) * 2)) !important;
  max-height: calc(100dvh - (var(--pd-app-frame-gap, 10px) * 2)) !important;
  overflow: hidden !important;
}

.workspace,
body[class$="-theme"] .workspace {
  height: calc(100dvh - (var(--pd-app-frame-gap, 10px) * 2)) !important;
  min-height: 0 !important;
  max-height: calc(100dvh - (var(--pd-app-frame-gap, 10px) * 2)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: auto !important;
}

/* USER UPDATE: align the empty white workspace shell edges.
   The main panel owns the frame; do not reserve an always-visible scrollbar gutter. */
.workspace > .toolbar,
body[class$="-theme"] .workspace > .toolbar,
.workspace > .content-grid,
body[class$="-theme"] .workspace > .content-grid {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
}

.workspace > .content-grid,
body[class$="-theme"] .workspace > .content-grid {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
}

.workspace > .content-grid > .library-panel,
body[class$="-theme"] .workspace > .content-grid > .library-panel {
  height: 100% !important;
  min-height: 0 !important;
}

/* USER UPDATE: shadcn-style responsive app frame.
   Runtime writes the shell columns, but these variables keep resize behavior fluid. */
.app-shell,
body[class$="-theme"] .app-shell {
  --pd-responsive-main-min-width: 0px;
  --pd-app-frame-gap: 8px;
  --spacing: 0.25rem;
  --sidebar-width: calc(var(--spacing) * 72);
  --pd-shadcn-sidebar-width: var(--sidebar-width, 288px);
  --pd-shadcn-header-height: 48px;
  --pd-responsive-sidebar-column: var(--sidebar-width, var(--pd-shadcn-sidebar-width));
  --nav-collapsed-width: 0px;
  max-width: 100vw !important;
  min-width: 0 !important;
  overflow: hidden !important;
  transition: grid-template-columns 220ms cubic-bezier(0.2, 0, 0, 1) !important;
}

/* USER UPDATE: match shadcn dashboard-01 shell anatomy.
   Sidebar is a fixed rail and the main workspace is the rounded SidebarInset. */
.sidebar[data-slot="sidebar"],
body[class$="-theme"] .sidebar[data-slot="sidebar"] {
  width: var(--pd-shadcn-sidebar-width) !important;
  min-width: var(--pd-shadcn-sidebar-width) !important;
  max-width: var(--pd-shadcn-sidebar-width) !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(0) !important;
  transition:
    transform 220ms cubic-bezier(0.2, 0, 0, 1),
    opacity 180ms ease !important;
  will-change: transform;
}

/* USER UPDATE: shadcn collapsible="offcanvas" sidebar behavior.
   The sidebar itself is not resized into an icon rail; it slides off-canvas while the white shell expands. */
.app-shell.sidebar-collapsed,
body[class$="-theme"] .app-shell.sidebar-collapsed {
  grid-template-columns: var(--nav-collapsed-width, 0px) minmax(var(--pd-responsive-main-min-width, 0px), 1fr) !important;
}

.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] {
  display: flex !important;
  width: var(--pd-shadcn-sidebar-width) !important;
  min-width: var(--pd-shadcn-sidebar-width) !important;
  max-width: var(--pd-shadcn-sidebar-width) !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transform: translateX(calc(-1 * (var(--pd-shadcn-sidebar-width, 288px) + 1px))) !important;
}

.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] > .sidebar-brand[data-slot="sidebar-header"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] > .sidebar-brand[data-slot="sidebar-header"],
.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] > .sidebar-main-content[data-slot="sidebar-content"] {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] > .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  display: grid !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-brand-copy,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary > *,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .nav-item,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .dashboard-nav-item,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .menu-text,
.app-shell.sidebar-collapsed .sidebar .tag-panel,
.app-shell.sidebar-collapsed .sidebar .system-utilization-panel,
.app-shell.sidebar-collapsed .sidebar .system-utilization-content,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-brand-copy,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary > *,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .menu-text,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .tag-panel,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .system-utilization-panel,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .system-utilization-content {
  opacity: 1 !important;
  visibility: visible !important;
  clip: auto !important;
  clip-path: none !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-brand-copy,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-brand-copy {
  display: block !important;
}

.app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] > h2,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] > h2 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-content: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  gap: 10px !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary > :not(.sidebar-group-icon),
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary > :not(.sidebar-group-icon) {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-chevron,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-chevron {
  display: inline-flex !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-content.nav-menu-content,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-content.nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content {
  display: grid !important;
  width: 100% !important;
  max-height: none !important;
  gap: 4px !important;
  padding: 4px 0 8px 20px !important;
  overflow: visible !important;
  pointer-events: none !important;
}

.app-shell.sidebar-collapsed .sidebar .nav-menu-content .nav-item,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .dashboard-nav-item,
.app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] .nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] .nav-item {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-content: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  gap: 10px !important;
  text-align: left !important;
}

.app-shell.sidebar-collapsed .sidebar .nav-item .menu-text,
.app-shell.sidebar-collapsed .sidebar .dashboard-nav-item .menu-text,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .menu-text,
.app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] .nav-item .menu-text,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-item .menu-text,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .dashboard-nav-item .menu-text,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .menu-text,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] .nav-item .menu-text {
  position: static !important;
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: auto !important;
  white-space: nowrap !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  border: 0 !important;
}

.workspace,
body[class$="-theme"] .workspace {
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

/* USER UPDATE: one shadcn SidebarInset shell.
   The white workspace owns the border/radius; content panes underneath must not draw a second shell. */
.workspace > .content-grid,
body[class$="-theme"] .workspace > .content-grid {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.workspace > .content-grid > .library-panel,
body[class$="-theme"] .workspace > .content-grid > .library-panel {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.toolbar,
body[class$="-theme"] .toolbar {
  display: flex !important;
  align-items: center !important;
  min-height: var(--pd-shadcn-header-height, 48px) !important;
  flex: 0 0 var(--pd-shadcn-header-height, 48px) !important;
  gap: 4px !important;
  padding: 0 16px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border-bottom: 1px solid var(--pd-app-frame-border-soft, #e5e7eb) !important;
  border-radius: 12px 12px 0 0 !important;
  box-shadow: none !important;
  transition:
    width 200ms ease-linear,
    height 200ms ease-linear !important;
}

.toolbar > .left-nav-hamburger-button,
body.app-is-locked .toolbar > .left-nav-hamburger-button,
body:has(#appLockOverlay) .toolbar > .left-nav-hamburger-button {
  display: inline-grid !important;
  place-items: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  margin: 0 0 0 -4px !important;
  padding: 0 !important;
  visibility: visible !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #18181b !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: auto !important;
}

.toolbar > .left-nav-hamburger-button:hover,
body[class$="-theme"] .toolbar > .left-nav-hamburger-button:hover {
  background: #f5f5f5 !important;
  color: #18181b !important;
  transform: none !important;
  box-shadow: none !important;
}

.toolbar > .left-nav-hamburger-button span {
  display: block !important;
  width: 16px !important;
  height: 1.5px !important;
  border-radius: 999px !important;
  background: currentColor !important;
}

.toolbar > .left-nav-hamburger-button::after {
  content: none !important;
  display: none !important;
}

.toolbar > .site-header-separator,
body[class$="-theme"] .toolbar > .site-header-separator {
  display: block !important;
  flex: 0 0 1px !important;
  width: 1px !important;
  height: 16px !important;
  margin: 0 8px !important;
  background: #e5e7eb !important;
}

.toolbar > #viewTitle,
body[class$="-theme"] .toolbar > #viewTitle {
  position: static !important;
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: #09090b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.toolbar > .toolbar-actions,
body[class$="-theme"] .toolbar > .toolbar-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  margin-left: auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

.toolbar .reference-nav-controls:has(#referenceBackButton:disabled):has(#referenceForwardButton:disabled) {
  display: none !important;
}

/* USER UPDATE: compact Khmer toolbar title so tall glyph marks do not look cut. */
.toolbar > #viewTitle,
body[class$="-theme"] .toolbar > #viewTitle {
  min-height: 24px !important;
  padding: 2px 0 !important;
  overflow: hidden !important;
  color: #09090b !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.workspace,
.workspace > .content-grid,
.workspace > .content-grid > .library-panel,
.workspace > .content-grid .data-grid-shell,
.workspace > .content-grid .data-grid-scroll,
body[class$="-theme"] .workspace,
body[class$="-theme"] .workspace > .content-grid,
body[class$="-theme"] .workspace > .content-grid > .library-panel,
body[class$="-theme"] .workspace > .content-grid .data-grid-shell,
body[class$="-theme"] .workspace > .content-grid .data-grid-scroll {
  min-width: 0 !important;
}

/* USER UPDATE: shadcn SidebarProvider inset and sidebar-gap parity.
   The transparent gap reserves desktop sidebar width; the white panel is the only SidebarInset shell. */
.app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
  display: grid !important;
  grid-template-columns: var(--pd-responsive-sidebar-column, var(--sidebar-width, var(--pd-shadcn-sidebar-width, 288px))) minmax(var(--pd-responsive-main-min-width, 0px), 1fr) !important;
  gap: 0 !important;
  padding: 0 !important;
  background: var(--pd-sidebar-background, #fafafa) !important;
}

.sidebar-gap[data-slot="sidebar-gap"],
body[class$="-theme"] .sidebar-gap[data-slot="sidebar-gap"] {
  display: block !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: var(--pd-responsive-sidebar-column, var(--sidebar-width, var(--pd-shadcn-sidebar-width, 288px))) !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 100dvh !important;
  background: transparent !important;
  pointer-events: none !important;
  transition: width 200ms ease-linear !important;
}

.sidebar[data-slot="sidebar"][data-variant="inset"],
body[class$="-theme"] .sidebar[data-slot="sidebar"][data-variant="inset"] {
  position: fixed !important;
  inset-block: 0 !important;
  inset-inline-start: 0 !important;
  z-index: 40 !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;
  height: 100dvh !important;
  max-height: 100dvh !important;
  transform: translateX(0) !important;
}

.workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  height: calc(100dvh - (var(--pd-app-frame-gap, 8px) * 2)) !important;
  max-height: calc(100dvh - (var(--pd-app-frame-gap, 8px) * 2)) !important;
  margin: var(--pd-app-frame-gap, 8px) var(--pd-app-frame-gap, 8px) var(--pd-app-frame-gap, 8px) 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.app-shell.sidebar-collapsed .sidebar-gap[data-slot="sidebar-gap"],
.app-shell.sidebar-responsive-collapsed .sidebar-gap[data-slot="sidebar-gap"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar-gap[data-slot="sidebar-gap"],
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed .sidebar-gap[data-slot="sidebar-gap"] {
  width: var(--nav-collapsed-width, 0px) !important;
}

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

.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"][data-variant="inset"],
.app-shell.sidebar-responsive-collapsed .sidebar[data-slot="sidebar"][data-variant="inset"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"][data-variant="inset"],
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed .sidebar[data-slot="sidebar"][data-variant="inset"] {
  transform: translateX(calc(-1 * (var(--pd-shadcn-sidebar-width, 288px) + 1px))) !important;
}

@media (max-width: 1180px) {
  .app-shell,
  body[class$="-theme"] .app-shell {
    --pd-shadcn-sidebar-width: var(--sidebar-width, 288px);
  }
}

@media (max-width: 980px) {
  .app-shell,
  body[class$="-theme"] .app-shell {
    --pd-shadcn-sidebar-width: var(--sidebar-width, 288px);
  }

  .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode),
  body[class$="-theme"] .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .resize-handle,
  .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel,
  body[class$="-theme"] .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .resize-handle,
  body[class$="-theme"] .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel {
    display: none !important;
  }

  .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .library-panel,
  body[class$="-theme"] .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .library-panel {
    border-right: 0 !important;
    border-radius: 0 !important;
  }
}

@media (max-width: 760px) {
  /* USER UPDATE: shadcn-style zoom resilience.
     Browser zoom shrinks CSS viewport width; at 175% this breakpoint should still show the header and page content. */
  html,
  body:not(.app-is-locked):not(:has(#appLockOverlay)),
  body[class$="-theme"]:not(.app-is-locked):not(:has(#appLockOverlay)) {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  html.paperdesk-protected-login-required,
  html.paperdesk-protected-login-required body,
  body.app-is-locked,
  body:has(#appLockOverlay) {
    height: 100% !important;
    overflow: hidden !important;
  }

  .app-shell,
  body[class$="-theme"] .app-shell {
    --pd-app-frame-gap: 6px;
    --pd-responsive-sidebar-column: 0px;
    --nav-collapsed-width: 0px;
    gap: 0 !important;
    grid-template-columns: 0 minmax(0, 1fr) !important;
    height: auto !important;
    padding: var(--pd-app-frame-gap) !important;
    overflow: visible !important;
  }

  .sidebar[data-slot="sidebar"],
  .sidebar-gap[data-slot="sidebar-gap"],
  body[class$="-theme"] .sidebar[data-slot="sidebar"] {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  .workspace,
  body[class$="-theme"] .workspace {
    height: auto !important;
    min-height: calc(100dvh - (var(--pd-app-frame-gap, 6px) * 2)) !important;
    max-height: none !important;
    border-radius: 12px !important;
    overflow: visible !important;
  }

  .toolbar,
  body[class$="-theme"] .toolbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 50 !important;
    min-height: var(--pd-shadcn-header-height, 48px) !important;
    flex-basis: var(--pd-shadcn-header-height, 48px) !important;
    padding-inline: 16px !important;
  }

  .workspace > .content-grid,
  body[class$="-theme"] .workspace > .content-grid {
    flex: 1 1 auto !important;
    min-height: calc(100dvh - var(--pd-shadcn-header-height, 48px) - (var(--pd-app-frame-gap, 6px) * 2)) !important;
    padding: 10px !important;
    overflow: visible !important;
  }

  .workspace > .content-grid > .library-panel,
  body[class$="-theme"] .workspace > .content-grid > .library-panel {
    min-height: 100% !important;
    overflow: visible !important;
  }
}

@media (max-width: 560px) {
  .app-shell,
  body[class$="-theme"] .app-shell {
    --pd-app-frame-gap: 2px;
  }

  .workspace,
  body[class$="-theme"] .workspace {
    border-radius: 8px !important;
  }

  .toolbar,
  body[class$="-theme"] .toolbar {
    padding-inline: 12px !important;
  }

  .toolbar > #viewTitle,
  body[class$="-theme"] .toolbar > #viewTitle {
    margin-left: 0 !important;
  }

  .workspace > .content-grid,
  body[class$="-theme"] .workspace > .content-grid {
    padding: 8px !important;
  }
}

body:has(.content-grid.dashboard-mode) .workspace,
body:has(.content-grid.table-rebuild-dashboard-mode) .workspace,
body:has(.content-grid.documents-appdatagrid-page-mode) .workspace,
body[class$="-theme"]:has(.content-grid.dashboard-mode) .workspace,
body[class$="-theme"]:has(.content-grid.table-rebuild-dashboard-mode) .workspace,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .workspace,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace {
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .workspace::-webkit-scrollbar,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .workspace::-webkit-scrollbar-track,
body:has(.content-grid.documents-appdatagrid-page-mode) .workspace::-webkit-scrollbar-thumb,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace::-webkit-scrollbar-track,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace::-webkit-scrollbar-thumb {
  background: transparent !important;
  border: 0 !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden {
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar-track,
body:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar-thumb,
body:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar-corner,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar-track,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar-thumb,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .app-data-grid-scrollbar-hidden::-webkit-scrollbar-corner {
  background: transparent !important;
  border: 0 !important;
}

.app-shell .content-grid.dashboard-mode,
.app-shell .content-grid.table-rebuild-dashboard-mode,
.app-shell .content-grid.documents-appdatagrid-page-mode,
body[class$="-theme"] .app-shell .content-grid.dashboard-mode,
body[class$="-theme"] .app-shell .content-grid.table-rebuild-dashboard-mode,
body[class$="-theme"] .app-shell .content-grid.documents-appdatagrid-page-mode {
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  overflow: visible !important;
}

.app-shell .content-grid.documents-appdatagrid-page-mode > .library-panel.documents-appdatagrid-page-mode,
body[class$="-theme"] .app-shell .content-grid.documents-appdatagrid-page-mode > .library-panel.documents-appdatagrid-page-mode {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  min-width: 0 !important;
  overflow: visible !important;
}

/* USER UPDATE: shadcn-style document dashboard flow.
   The legacy document table shell becomes a transparent flow wrapper; AppDataGrid
   owns the single visible table surface below the chart. */
.library-panel .data-grid-shell.documents-appdatagrid-mode,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--pd-menu-appdatagrid-vertical-spacing, 16px) !important;
  grid-template-rows: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: var(--pd-menu-appdatagrid-spacing, 16px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.library-panel .data-grid-shell.documents-appdatagrid-mode > .data-grid-toolbar,
.library-panel .data-grid-shell.documents-appdatagrid-mode > .scroll-hint,
.library-panel .data-grid-shell.documents-appdatagrid-mode > .document-table-pager-footer,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode > .data-grid-toolbar,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode > .scroll-hint,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode > .document-table-pager-footer {
  display: none !important;
}

.library-panel .data-grid-shell.documents-appdatagrid-mode > .data-grid-scroll[data-platform-grid-surface="table"],
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode > .data-grid-scroll[data-platform-grid-surface="table"] {
  display: block !important;
  grid-row: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.library-panel .data-grid-shell.documents-appdatagrid-mode > .data-grid-scroll[data-platform-grid-surface="table"] > .item-list,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode > .data-grid-scroll[data-platform-grid-surface="table"] > .item-list {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.library-panel .data-grid-shell.documents-appdatagrid-mode .documents-app-data-grid-root,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode .documents-app-data-grid-root {
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
}

.library-panel .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .workspace-menu1-area-chart-card,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .workspace-menu1-area-chart-card {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 100% !important;
  height: clamp(260px, 34vh, 360px) !important;
  min-width: 0 !important;
  min-height: 260px !important;
  margin: 0 !important;
  transform: none !important;
  z-index: auto !important;
}

/* USER UPDATE: higher-specificity normal mode override.
   Older library-panel table rules use :not(...) selectors, so normal documents
   flow needs matching specificity. Customization mode is intentionally excluded. */
.library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body[class$="-theme"] .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--pd-menu-appdatagrid-vertical-spacing, 16px) !important;
  grid-template-rows: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: var(--pd-menu-appdatagrid-spacing, 16px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .data-grid-scroll[data-platform-grid-surface="table"],
body[class$="-theme"] .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .data-grid-scroll[data-platform-grid-surface="table"] {
  display: block !important;
  grid-row: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .data-grid-scroll[data-platform-grid-surface="table"] > .item-list,
body[class$="-theme"] .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .data-grid-scroll[data-platform-grid-surface="table"] > .item-list {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) .documents-app-data-grid-root,
body[class$="-theme"] .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) .documents-app-data-grid-root {
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
}

.library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .workspace-menu1-area-chart-card,
body[class$="-theme"] .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) > .workspace-menu1-area-chart-card {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 100% !important;
  height: clamp(260px, 34vh, 360px) !important;
  min-width: 0 !important;
  min-height: 260px !important;
  margin: 0 !important;
  transform: none !important;
  z-index: auto !important;
}

/* USER UPDATE: make document AppDataGrid absorb the shadcn shell floor.
   The white shell stays full-height, but the document page/grid section now
   consumes leftover height so the blank area is not owned by the outer shell. */
body:has(.content-grid.documents-appdatagrid-page-mode) .workspace[data-slot="sidebar-inset"],
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace[data-slot="sidebar-inset"] {
  display: flex !important;
  flex-direction: column !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .workspace > .content-grid.documents-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .workspace > .content-grid.documents-appdatagrid-page-mode {
  flex: 1 0 auto !important;
  min-height: calc(100% - var(--pd-shadcn-header-height, 48px)) !important;
  align-content: stretch !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .content-grid.documents-appdatagrid-page-mode > .library-panel.documents-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .content-grid.documents-appdatagrid-page-mode > .library-panel.documents-appdatagrid-page-mode {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 0 auto !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) {
  flex: 1 0 auto !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) .documents-grid-adapter,
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .library-panel:not(.inspector-mode):not(.task-mode):not(.work-mode) .data-grid-shell.documents-appdatagrid-mode:not([data-platform-grid-editing="true"]) .documents-grid-adapter {
  flex: 1 0 auto !important;
  min-height: 0 !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .documents-grid-adapter > section[data-app-data-grid-vertical-scroll="page"],
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .documents-grid-adapter > section[data-app-data-grid-vertical-scroll="page"] {
  flex: 1 0 auto !important;
  min-height: 0 !important;
}

body:has(.content-grid.documents-appdatagrid-page-mode) .documents-grid-adapter > section[data-app-data-grid-vertical-scroll="page"] > div:has(> [data-slot="table-container"]),
body[class$="-theme"]:has(.content-grid.documents-appdatagrid-page-mode) .documents-grid-adapter > section[data-app-data-grid-vertical-scroll="page"] > div:has(> [data-slot="table-container"]) {
  flex: 1 0 auto !important;
}

/* USER UPDATE: use the legal-documents AppDataGrid shell as the benchmark for
   every menu bridged through the shared MenuGridAdapter. Data mapping stays in
   the menu runtimes; this only normalizes the surrounding shell. */
body:has(.content-grid.menu-appdatagrid-page-mode) .workspace[data-slot="sidebar-inset"],
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .workspace[data-slot="sidebar-inset"] {
  display: flex !important;
  flex-direction: column !important;
}

body:has(.content-grid.menu-appdatagrid-page-mode) .workspace > .content-grid.menu-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .workspace > .content-grid.menu-appdatagrid-page-mode {
  flex: 1 0 auto !important;
  min-height: calc(100% - var(--pd-shadcn-header-height, 48px)) !important;
  min-width: 0 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: stretch !important;
  overflow: visible !important;
}

body:has(.content-grid.menu-appdatagrid-page-mode) .content-grid.menu-appdatagrid-page-mode > .library-panel.menu-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .content-grid.menu-appdatagrid-page-mode > .library-panel.menu-appdatagrid-page-mode {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 0 auto !important;
  min-height: 100% !important;
  min-width: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body:has(.content-grid.menu-appdatagrid-page-mode) .library-panel.menu-appdatagrid-page-mode .data-grid-shell.menu-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .library-panel.menu-appdatagrid-page-mode .data-grid-shell.menu-appdatagrid-mode:not([data-platform-grid-editing="true"]) {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 0 auto !important;
  gap: var(--pd-menu-appdatagrid-vertical-spacing, 16px) !important;
  grid-template-rows: none !important;
  min-height: 100% !important;
  min-width: 0 !important;
  max-height: none !important;
  padding: var(--pd-menu-appdatagrid-spacing, 16px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.library-panel .data-grid-shell.documents-appdatagrid-mode .menu-app-data-grid-root,
body[class$="-theme"] .library-panel .data-grid-shell.documents-appdatagrid-mode .menu-app-data-grid-root,
body:has(.content-grid.menu-appdatagrid-page-mode) .library-panel.menu-appdatagrid-page-mode .data-grid-shell.menu-appdatagrid-mode .menu-app-data-grid-root,
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .library-panel.menu-appdatagrid-page-mode .data-grid-shell.menu-appdatagrid-mode .menu-app-data-grid-root {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
}

body:has(.content-grid.menu-appdatagrid-page-mode) .menu-app-data-grid-root > section[data-app-data-grid-vertical-scroll="page"],
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .menu-app-data-grid-root > section[data-app-data-grid-vertical-scroll="page"] {
  flex: 1 0 auto !important;
  min-height: 0 !important;
}

body:has(.content-grid.menu-appdatagrid-page-mode) .menu-app-data-grid-root > section[data-app-data-grid-vertical-scroll="page"] > div:has(> [data-slot="table-container"]),
body[class$="-theme"]:has(.content-grid.menu-appdatagrid-page-mode) .menu-app-data-grid-root > section[data-app-data-grid-vertical-scroll="page"] > div:has(> [data-slot="table-container"]) {
  flex: 1 0 auto !important;
}

/* USER UPDATE: Staff/Officials AppDataGrid shrink-wraps short row sets instead of
   leaving raw blank table space after the last visible record. */
body:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .library-panel.inspectors-appdatagrid-page-mode .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .library-panel.inspectors-appdatagrid-page-mode .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body:has(.content-grid.inspectors-appdatagrid-page-mode) .data-grid-shell.inspectors-appdatagrid-mode .inspectors-app-data-grid-root,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .data-grid-shell.inspectors-appdatagrid-mode .inspectors-app-data-grid-root,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .inspectors-app-data-grid-root > .menu-grid-adapter,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .inspectors-app-data-grid-root > .menu-grid-adapter,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .inspectors-app-data-grid-root > .menu-grid-adapter > section[data-app-data-grid-vertical-scroll="page"],
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .inspectors-app-data-grid-root > .menu-grid-adapter > section[data-app-data-grid-vertical-scroll="page"],
body:has(.content-grid.inspectors-appdatagrid-page-mode) .inspectors-app-data-grid-root > .menu-grid-adapter > section[data-app-data-grid-vertical-scroll="page"] > div:has(> [data-slot="table-container"]),
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .inspectors-app-data-grid-root > .menu-grid-adapter > section[data-app-data-grid-vertical-scroll="page"] > div:has(> [data-slot="table-container"]) {
  flex: 0 0 auto !important;
  min-height: 0 !important;
}

body:has(.content-grid.inspectors-appdatagrid-page-mode) .workspace > .content-grid.inspectors-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .workspace > .content-grid.inspectors-appdatagrid-page-mode,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .library-panel.inspectors-appdatagrid-page-mode .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .library-panel.inspectors-appdatagrid-page-mode .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]) {
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
  align-content: start !important;
}

body:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode {
  align-self: start !important;
  justify-self: stretch !important;
  height: auto !important;
  min-height: 0 !important;
}

/* USER UPDATE: Staff/Officials AppDataGrid page should end after the grid,
   not stretch the surrounding white panel to the viewport bottom. */
body:has(.content-grid.inspectors-appdatagrid-page-mode) .workspace > .content-grid.inspectors-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .workspace > .content-grid.inspectors-appdatagrid-page-mode {
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
  align-content: start !important;
  align-items: start !important;
}

body:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .content-grid.inspectors-appdatagrid-page-mode > .library-panel.inspectors-appdatagrid-page-mode,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .library-panel.inspectors-appdatagrid-page-mode .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]),
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .library-panel.inspectors-appdatagrid-page-mode .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]) {
  flex: 0 0 auto !important;
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}

body:has(.content-grid.inspectors-appdatagrid-page-mode) .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]) .inspectors-app-data-grid-root > .menu-grid-adapter,
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]) .inspectors-app-data-grid-root > .menu-grid-adapter,
body:has(.content-grid.inspectors-appdatagrid-page-mode) .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]) .inspectors-app-data-grid-root > .menu-grid-adapter > section[data-app-data-grid-vertical-scroll="page"],
body[class$="-theme"]:has(.content-grid.inspectors-appdatagrid-page-mode) .data-grid-shell.inspectors-appdatagrid-mode:not([data-platform-grid-editing="true"]) .inspectors-app-data-grid-root > .menu-grid-adapter > section[data-app-data-grid-vertical-scroll="page"] {
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
}
