/* shadcn Sidebar-style left navigation shell */
:root {
  --pd-sidebar-background: var(--sidebar-background, #fafafa);
  --pd-sidebar-foreground: var(--sidebar-foreground, #3f3f46);
  --pd-sidebar-primary: var(--sidebar-primary, #18181b);
  --pd-sidebar-primary-foreground: var(--sidebar-primary-foreground, #fafafa);
  --pd-sidebar-accent: var(--sidebar-accent, #f5f5f5);
  --pd-sidebar-accent-foreground: var(--sidebar-accent-foreground, #18181b);
  --pd-sidebar-border: var(--sidebar-border, #e5e7eb);
  --pd-sidebar-ring: var(--sidebar-ring, #a1a1aa);
  --pd-sidebar-muted: var(--muted-foreground, #71717a);
  --pd-sidebar-radius: var(--radius, 10px);
  --nav-collapsed-width: 3rem;
}

/* Exact menu icon classes requested by the app owner; aliases cover names absent from the current UIcons package. */
.fi-sr-legal-case:before {
  content: "\f884";
}

.fi-ss-task-checklist:before {
  content: "\f3ca";
}

.fi-rr-steps-carreer:before {
  content: "\f372";
}

.fi-sr-discussion-group:before {
  content: "\f72c";
}

.fi-ss-launch:before {
  content: "\f9eb";
}

.fi-sr-financial-analysis:before {
  content: "\f39f";
}

.fi-rr-web-statistics:before {
  content: "\f3a2";
}

.sidebar[data-slot="sidebar"],
body[class$="-theme"] .sidebar[data-slot="sidebar"] {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  min-width: 300px !important;
  max-width: 680px !important;
  min-height: 100vh !important;
  padding: 8px !important;
  color: var(--pd-sidebar-foreground) !important;
  background: var(--pd-sidebar-background) !important;
  border-right: 1px solid var(--pd-sidebar-border) !important;
  box-shadow: none !important;
}

.sidebar-brand[data-slot="sidebar-header"] {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 52px !important;
  padding: 8px !important;
  border-radius: calc(var(--pd-sidebar-radius) - 2px) !important;
}

.sidebar-brand-logo-wrap {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  overflow: hidden !important;
  border: 1px solid var(--pd-sidebar-border) !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06) !important;
}

.sidebar-brand-logo {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.sidebar-brand-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 1px !important;
}

.sidebar-brand-copy strong {
  overflow: hidden !important;
  color: var(--pd-sidebar-primary) !important;
  font-family: var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar-brand-copy span {
  overflow: hidden !important;
  color: var(--pd-sidebar-muted) !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar-main-content[data-slot="sidebar-content"] {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  gap: 8px !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 !important;
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

.sidebar-main-content[data-slot="sidebar-content"]::-webkit-scrollbar,
.sidebar-main-content[data-slot="sidebar-content"]::-webkit-scrollbar-button,
.sidebar-main-content[data-slot="sidebar-content"]::-webkit-scrollbar-track,
.sidebar-main-content[data-slot="sidebar-content"]::-webkit-scrollbar-thumb {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.sidebar .nav-section[aria-label="Collections"],
.sidebar .tag-panel,
.sidebar .system-utilization-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.sidebar .nav-section[aria-label="Collections"] > h2 {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 6px 8px 2px !important;
  overflow: visible !important;
  clip: auto !important;
  position: static !important;
  color: var(--pd-sidebar-muted) !important;
  font-family: var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.sidebar .sidebar-collapsible[data-slot="sidebar-group"],
.sidebar .nav-menu-group.sidebar-collapsible {
  display: flex !important;
  flex-direction: column !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;
}

.sidebar .sidebar-collapsible-summary[data-slot="sidebar-group-label"],
.sidebar .sidebar-collapsible-summary {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto 16px !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  width: 100% !important;
  padding: 4px 6px !important;
  color: var(--pd-sidebar-muted) !important;
  border-radius: calc(var(--pd-sidebar-radius) - 2px) !important;
  cursor: pointer !important;
  list-style: none !important;
  transition: color 150ms ease, background-color 150ms ease !important;
}

.sidebar .sidebar-collapsible-summary::-webkit-details-marker {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
}

.sidebar .sidebar-collapsible-summary::marker {
  content: "" !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
}

.app-shell:not(.sidebar-collapsed) .sidebar .sidebar-collapsible-summary[data-sidebar-section-summary="menu1"],
.app-shell:not(.sidebar-collapsed) .sidebar .sidebar-collapsible-summary[data-sidebar-section-summary="menu2"] {
  grid-template-columns: 24px minmax(0, 1fr) auto 16px !important;
}

.app-shell:not(.sidebar-collapsed) .sidebar .sidebar-collapsible-summary .sidebar-group-icon[data-sidebar-group-icon="menu1"],
.app-shell:not(.sidebar-collapsed) .sidebar .sidebar-collapsible-summary .sidebar-group-icon[data-sidebar-group-icon="menu2"] {
  display: inline-flex !important;
}

.sidebar .sidebar-collapsible-summary:hover,
.sidebar .sidebar-collapsible.is-open > .sidebar-collapsible-summary,
.sidebar .nav-menu-group:has(.nav-item.active) > .sidebar-collapsible-summary {
  color: var(--pd-sidebar-accent-foreground) !important;
  background: var(--pd-sidebar-accent) !important;
}

.sidebar-group-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  border-radius: 6px !important;
  color: var(--pd-sidebar-primary) !important;
  background: transparent !important;
  font-family: var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
}

.sidebar-group-icon .sidebar-group-lucide-icon {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  color: currentColor !important;
  stroke: currentColor !important;
}

.sidebar-group-icon[data-sidebar-group-icon="menu2"],
.sidebar-group-icon[data-sidebar-group-icon="tags"],
.sidebar-group-icon[data-sidebar-group-icon="system"] {
  font-size: 0 !important;
}

.sidebar-group-icon[data-sidebar-group-icon="menu2"]::before,
.sidebar-group-icon[data-sidebar-group-icon="tags"]::before,
.sidebar-group-icon[data-sidebar-group-icon="system"]::before {
  content: "" !important;
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  background: currentColor !important;
  -webkit-mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-position: center !important;
  mask-repeat: no-repeat !important;
  mask-size: contain !important;
}

.sidebar-group-icon[data-sidebar-group-icon="menu2"]::before {
  -webkit-mask-image: url("assets/dashboard-panel.svg") !important;
  mask-image: url("assets/dashboard-panel.svg") !important;
}

.sidebar-group-icon[data-sidebar-group-icon="tags"]::before {
  -webkit-mask-image: url("assets/note-sticky.svg") !important;
  mask-image: url("assets/note-sticky.svg") !important;
}

.sidebar-group-icon[data-sidebar-group-icon="system"]::before {
  -webkit-mask-image: url("assets/galaxy-planet.svg") !important;
  mask-image: url("assets/galaxy-planet.svg") !important;
}

.sidebar .sidebar-collapsible-chevron {
  display: inline-grid !important;
  place-items: center !important;
  width: 16px !important;
  height: 16px !important;
  color: currentColor !important;
  transform: rotate(0deg) !important;
  transition: transform 150ms ease !important;
}

.sidebar .sidebar-collapsible-chevron svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sidebar .sidebar-collapsible[open] > .sidebar-collapsible-summary .sidebar-collapsible-chevron,
.sidebar .sidebar-collapsible.is-open > .sidebar-collapsible-summary .sidebar-collapsible-chevron {
  transform: rotate(90deg) !important;
}

.sidebar .sidebar-collapsible-title {
  overflow: hidden !important;
  color: currentColor !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar .sidebar-collapsible-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 22px !important;
  height: 22px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  color: var(--pd-sidebar-muted) !important;
  background: var(--pd-sidebar-accent) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

.sidebar .sidebar-collapsible-content[data-slot="sidebar-group-content"],
.sidebar .sidebar-collapsible-content.nav-menu-content[data-slot="sidebar-menu"],
.sidebar .sidebar-collapsible-content.nav-menu-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  max-height: none !important;
  padding: 2px 0 8px 16px !important;
  margin: 0 0 2px 17px !important;
  overflow: visible !important;
  overflow-y: visible !important;
  border: 0 !important;
  border-left: 1px solid var(--pd-sidebar-border) !important;
  background: transparent !important;
  box-shadow: none !important;
  scrollbar-gutter: auto !important;
}

.sidebar .nav-item[data-slot="sidebar-menu-button"],
.sidebar .dashboard-nav-item[data-slot="sidebar-menu-button"],
.sidebar .nav-menu-content .nav-item {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
  color: var(--pd-sidebar-foreground) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: calc(var(--pd-sidebar-radius) - 2px) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  text-align: left !important;
  transition: color 150ms ease, background-color 150ms ease !important;
}

.sidebar .tag-list button {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
  color: var(--pd-sidebar-foreground) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: calc(var(--pd-sidebar-radius) - 2px) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  text-align: left !important;
  transition: color 150ms ease, background-color 150ms ease !important;
}

.sidebar .nav-menu-content .nav-item .folder-ui-icon,
.sidebar .nav-menu-content .dashboard-nav-item .nav-icon {
  display: none !important;
}

.sidebar .nav-item[data-slot="sidebar-menu-button"]:hover,
.sidebar .dashboard-nav-item[data-slot="sidebar-menu-button"]:hover,
.sidebar .nav-menu-content .nav-item:hover,
.sidebar .tag-list button:hover {
  color: var(--pd-sidebar-accent-foreground) !important;
  background: var(--pd-sidebar-accent) !important;
}

.sidebar .nav-item.active,
.sidebar .dashboard-nav-item.active,
.sidebar .nav-item[data-active="true"] {
  color: var(--pd-sidebar-accent-foreground) !important;
  background: var(--pd-sidebar-accent) !important;
  font-weight: 600 !important;
}

.sidebar .nav-item-icon,
.sidebar .folder-ui-icon,
.sidebar .nav-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  color: var(--pd-sidebar-muted) !important;
}

.sidebar .nav-item-icon.fi {
  color: color-mix(in srgb, var(--pd-sidebar-primary) 88%, #0ea5e9 12%) !important;
  font-size: 17px !important;
  line-height: 1 !important;
}

.sidebar .nav-item-icon.sidebar-svg-icon {
  display: inline-block !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  color: color-mix(in srgb, var(--pd-sidebar-primary) 88%, #0ea5e9 12%) !important;
  background-color: currentColor !important;
  font-size: 0 !important;
  line-height: 1 !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;
}

.sidebar .nav-item-icon.sidebar-svg-icon::before {
  content: "" !important;
  display: none !important;
}

.sidebar .nav-item-icon.sidebar-svg-icon-legal-case {
  --pd-sidebar-nav-icon-mask: url("assets/legal-case.svg");
}

.sidebar .nav-item-icon.sidebar-svg-icon-laptop {
  --pd-sidebar-nav-icon-mask: url("assets/laptop.svg");
}

.sidebar .nav-item.active .nav-item-icon.fi,
.sidebar .nav-item[data-active="true"] .nav-item-icon.fi,
.sidebar .nav-item.active .nav-item-icon.sidebar-svg-icon,
.sidebar .nav-item[data-active="true"] .nav-item-icon.sidebar-svg-icon {
  color: currentColor !important;
}

.app-shell:not(.sidebar-collapsed) .sidebar .sidebar-collapsible-content.nav-menu-content .nav-item .folder-ui-icon:not(.nav-item-icon),
.app-shell:not(.sidebar-collapsed) .sidebar .sidebar-collapsible-content.nav-menu-content .dashboard-nav-item .nav-icon {
  display: none !important;
}

.sidebar .nav-item.active .folder-ui-icon,
.sidebar .dashboard-nav-item.active .nav-icon {
  color: currentColor !important;
}

.sidebar .menu-count,
.sidebar .nav-item > span[id$="Count"],
.sidebar .nav-item > span:last-child:not(.menu-text):not(.folder-ui-icon):not(.nav-icon) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 20px !important;
  color: var(--pd-sidebar-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

.sidebar #addItemButton {
  width: calc(100% - 4px) !important;
  min-height: 34px !important;
  margin: 0 2px 4px !important;
  border-radius: calc(var(--pd-sidebar-radius) - 2px) !important;
}

.app-shell.sidebar-collapsed,
body[class$="-theme"] .app-shell.sidebar-collapsed {
  grid-template-columns: var(--nav-collapsed-width, 3rem) minmax(0, 1fr) !important;
}

.app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"],
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar[data-slot="sidebar"] {
  width: var(--nav-collapsed-width, 3rem) !important;
  min-width: var(--nav-collapsed-width, 3rem) !important;
  max-width: var(--nav-collapsed-width, 3rem) !important;
  padding: 8px 4px !important;
  overflow: hidden !important;
}

.app-shell.sidebar-collapsed .sidebar-brand[data-slot="sidebar-header"] {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 40px !important;
  min-height: 40px !important;
  padding: 4px 0 8px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-collapsed .sidebar-brand-logo-wrap {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
}

.app-shell.sidebar-collapsed .sidebar-brand-copy,
.app-shell.sidebar-collapsed #addItemButton,
.app-shell.sidebar-collapsed .sidebar-tools {
  display: none !important;
}

.app-shell.sidebar-collapsed .sidebar-main-content[data-slot="sidebar-content"] {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 40px !important;
  overflow: hidden !important;
}

.app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"],
.app-shell.sidebar-collapsed .sidebar .tag-panel,
.app-shell.sidebar-collapsed .sidebar .system-utilization-panel {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 40px !important;
  height: auto !important;
  gap: 6px !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.app-shell.sidebar-collapsed .sidebar .nav-section[aria-label="Collections"] > h2 {
  display: none !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible[data-slot="sidebar-group"],
.app-shell.sidebar-collapsed .sidebar .nav-menu-group.sidebar-collapsible,
.app-shell.sidebar-collapsed .sidebar .tag-collapsible,
.app-shell.sidebar-collapsed .sidebar .system-collapsible {
  display: flex !important;
  flex: 0 0 32px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 40px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary[data-slot="sidebar-group-label"],
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  margin: 0 auto !important;
  gap: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  overflow: hidden !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary::-webkit-details-marker,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary::marker {
  content: "" !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-group-icon {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  color: var(--pd-sidebar-primary) !important;
  background: var(--pd-sidebar-accent) !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary > :not(.sidebar-group-icon) {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-title,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-count,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-chevron,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-content,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content,
.app-shell.sidebar-collapsed .sidebar .tag-list,
.app-shell.sidebar-collapsed .sidebar .system-utilization-content,
.app-shell.sidebar-collapsed .sidebar .nav-item,
.app-shell.sidebar-collapsed .sidebar .dashboard-nav-item {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.app-shell.sidebar-collapsed .sidebar .nav-menu-group.sidebar-collapsible > .sidebar-collapsible-content.nav-menu-content,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-content.nav-menu-content[data-slot="sidebar-menu"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

.app-shell.sidebar-collapsed .tag-panel,
.app-shell.sidebar-collapsed .system-utilization-panel,
.app-shell.sidebar-collapsed #systemUtilizationPanel {
  display: flex !important;
  width: 100% !important;
  min-width: 40px !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.app-shell.sidebar-collapsed .sidebar {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.app-shell.sidebar-collapsed .sidebar::-webkit-scrollbar,
.app-shell.sidebar-collapsed .sidebar::-webkit-scrollbar-button,
.app-shell.sidebar-collapsed .sidebar-main-content::-webkit-scrollbar,
.app-shell.sidebar-collapsed .sidebar-main-content::-webkit-scrollbar-button {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Compact ReUI avatar dropdown footer at the bottom of the left navigation. */
.sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  position: relative !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  padding: 8px 2px 0 !important;
  margin-top: 8px !important;
  border-top: 1px solid rgba(229, 231, 235, 0.76) !important;
}

.sidebar-avatar-menu {
  position: relative !important;
  display: block !important;
  width: 100% !important;
}

.sidebar-avatar-trigger {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) 14px !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 36px !important;
  padding: 4px 8px 4px 5px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #27272a !important;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
  cursor: pointer !important;
  list-style: none !important;
}

.sidebar-avatar-trigger::-webkit-details-marker,
.sidebar-avatar-trigger::marker {
  display: none !important;
  content: "" !important;
}

.sidebar-avatar-trigger:hover,
.sidebar-avatar-menu[open] > .sidebar-avatar-trigger {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}

.sidebar-avatar-image {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  overflow: hidden !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 999px !important;
  background: #ffffff !important;
}

.sidebar-avatar-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.sidebar-avatar-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 1px !important;
  text-align: left !important;
}

.sidebar-avatar-copy strong,
.sidebar-avatar-copy span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar-avatar-copy strong {
  color: #18181b !important;
  font-family: var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

.sidebar-avatar-copy span {
  color: #71717a !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
}

.sidebar-avatar-chevron {
  width: 14px !important;
  height: 14px !important;
  color: #71717a !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sidebar-avatar-dropdown {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: calc(100% + 8px) !important;
  z-index: 80 !important;
  display: grid !important;
  gap: 2px !important;
  min-width: 190px !important;
  padding: 6px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow:
    0 18px 42px rgba(15, 23, 42, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.9) inset !important;
}

.sidebar-avatar-menu:not([open]) .sidebar-avatar-dropdown {
  display: none !important;
}

.sidebar-avatar-menu-label {
  margin: 2px 8px 4px !important;
  color: #71717a !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

.sidebar-avatar-dropdown button {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 30px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #27272a !important;
  font: 600 12px/1.2 var(--pd-english-ui-font, "Inter", "Segoe UI", Arial, sans-serif) !important;
  text-align: left !important;
  cursor: pointer !important;
}

.sidebar-avatar-dropdown button:hover,
.sidebar-avatar-dropdown button:focus-visible {
  background: #f4f4f5 !important;
  outline: none !important;
}

.sidebar-avatar-dropdown button.is-danger {
  color: #dc2626 !important;
}

.app-shell.sidebar-collapsed .sidebar-account-footer[data-reui-avatar-dropdown="compact"] {
  padding: 8px 0 0 !important;
}

.app-shell.sidebar-collapsed .sidebar-avatar-trigger {
  display: inline-grid !important;
  grid-template-columns: 1fr !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  padding: 4px !important;
  place-items: center !important;
}

.app-shell.sidebar-collapsed .sidebar-avatar-copy,
.app-shell.sidebar-collapsed .sidebar-avatar-chevron {
  display: none !important;
}

.app-shell.sidebar-collapsed .sidebar-avatar-dropdown {
  left: calc(100% + 8px) !important;
  right: auto !important;
  bottom: 0 !important;
}

body.dark-theme,
body.midnight-theme,
body.deep-navy-theme,
body.charcoal-theme,
body.dark-emerald-theme {
  --pd-sidebar-background: var(--sidebar-background, #09090b);
  --pd-sidebar-foreground: var(--sidebar-foreground, #e4e4e7);
  --pd-sidebar-primary: var(--sidebar-primary, #fafafa);
  --pd-sidebar-accent: var(--sidebar-accent, #18181b);
  --pd-sidebar-accent-foreground: var(--sidebar-accent-foreground, #fafafa);
  --pd-sidebar-border: var(--sidebar-border, #27272a);
  --pd-sidebar-muted: var(--muted-foreground, #a1a1aa);
}

/* shadcn dashboard-01 inspired outer frame only. Keep screens and workflows unchanged. */
:root {
  --pd-app-frame-background: #fafafa;
  --pd-app-frame-surface: #ffffff;
  --pd-app-frame-border: #e5e7eb;
  --pd-app-frame-border-soft: #e5e7eb;
  --pd-app-frame-shadow: 0 1px 2px rgba(15, 23, 42, 0.025), 0 14px 36px rgba(15, 23, 42, 0.035);
  --pd-app-frame-radius: 16px;
  --pd-app-frame-gap: 10px;
  --pd-sidebar-background: var(--pd-app-frame-background);
  --pd-sidebar-border: var(--pd-app-frame-border);
  --pd-sidebar-muted: #71717a;
  --pd-sidebar-accent: #f5f5f5;
}

html,
body,
body[class$="-theme"] {
  background: var(--pd-app-frame-background) !important;
}

body.dark-theme,
body.midnight-theme,
body.deep-navy-theme,
body.charcoal-theme,
body.dark-emerald-theme {
  color-scheme: light !important;
  --bg: var(--pd-app-frame-background) !important;
  --panel: var(--pd-app-frame-surface) !important;
  --ink: #18181b !important;
  --muted: #71717a !important;
  --line: var(--pd-app-frame-border) !important;
  --pd-sidebar-background: var(--pd-app-frame-background) !important;
  --pd-sidebar-foreground: #3f3f46 !important;
  --pd-sidebar-primary: #18181b !important;
  --pd-sidebar-accent: #f5f5f5 !important;
  --pd-sidebar-accent-foreground: #18181b !important;
  --pd-sidebar-border: var(--pd-app-frame-border) !important;
  --pd-sidebar-muted: #71717a !important;
}

.app-shell,
body[class$="-theme"] .app-shell {
  gap: var(--pd-app-frame-gap) !important;
  padding: var(--pd-app-frame-gap) !important;
  background: var(--pd-app-frame-background) !important;
}

.sidebar[data-slot="sidebar"],
body[class$="-theme"] .sidebar[data-slot="sidebar"] {
  height: 100% !important;
  min-height: 0 !important;
  background: transparent !important;
  border-right: 0 !important;
  box-shadow: none !important;
}

.workspace,
body[class$="-theme"] .workspace {
  margin: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--pd-app-frame-border) !important;
  border-radius: var(--pd-app-frame-radius) !important;
  background: var(--pd-app-frame-surface) !important;
  box-shadow: var(--pd-app-frame-shadow) !important;
}

.toolbar,
body[class$="-theme"] .toolbar {
  border-bottom: 1px solid var(--pd-app-frame-border-soft) !important;
  background: var(--pd-app-frame-surface) !important;
  box-shadow: none !important;
}

.content-grid {
  padding: 12px !important;
  background: var(--pd-app-frame-surface) !important;
}

.library-panel,
.detail-panel,
body[class$="-theme"] .library-panel,
body[class$="-theme"] .detail-panel {
  border-color: var(--pd-app-frame-border) !important;
  background: var(--pd-app-frame-surface) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.library-panel {
  border-top-left-radius: 12px !important;
  border-bottom-left-radius: 12px !important;
}

.detail-panel {
  border-top-right-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
}

.content-grid.dashboard-mode .library-panel {
  border-radius: 12px !important;
}

.resize-handle {
  border-color: var(--pd-app-frame-border-soft) !important;
  background: color-mix(in srgb, var(--pd-app-frame-background) 88%, var(--pd-app-frame-surface)) !important;
}

.resize-handle:hover,
.content-grid.resizing .resize-handle {
  background: color-mix(in srgb, var(--accent) 24%, var(--pd-app-frame-background)) !important;
}

.content-grid.detail-collapsed .resize-handle {
  border-color: var(--pd-app-frame-border-soft) !important;
  background: color-mix(in srgb, var(--pd-app-frame-background) 90%, var(--pd-app-frame-surface)) !important;
}

/* USER UPDATE: unified dashboard shell with one scrollable white main panel. */
.app-shell,
body[class$="-theme"] .app-shell {
  align-items: stretch !important;
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden !important;
}

.sidebar[data-slot="sidebar"],
body[class$="-theme"] .sidebar[data-slot="sidebar"] {
  position: sticky !important;
  top: var(--pd-app-frame-gap) !important;
  align-self: start !important;
  height: calc(100vh - (var(--pd-app-frame-gap) * 2)) !important;
  min-height: 0 !important;
  max-height: calc(100vh - (var(--pd-app-frame-gap) * 2)) !important;
}

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

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

.app-shell .content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode),
body[class$="-theme"] .app-shell .content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) {
  display: block !important;
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 12px !important;
  background: transparent !important;
}

.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .library-panel,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .data-grid-shell,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .data-grid-scroll,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) #itemList,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-shell {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  background: transparent !important;
}

.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .library-panel,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .data-grid-shell,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .data-grid-scroll,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) #itemList {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-shell {
  min-height: 0 !important;
  padding: 0 !important;
}

.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-shell > .dashboard-header,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-header,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-expert-filterbar,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-filter-panel,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-slicer-bar,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-builder-toolbar,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .dashboard-widget-library,
.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) .advanced-pivot-section {
  background: var(--pd-app-frame-surface) !important;
  box-shadow: none !important;
}

body:has(.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode)) .toolbar,
body[class$="-theme"]:has(.content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode)) .toolbar {
  flex: 0 0 auto !important;
}

/* USER UPDATE: remove only the tiny right-edge scrollbar corner artifact. */
.workspace::-webkit-scrollbar-corner,
.workspace::-webkit-resizer,
.data-grid-scroll::-webkit-scrollbar-corner,
.data-grid-scroll::-webkit-resizer {
  background: transparent !important;
  border: 0 !important;
}

/* USER UPDATE: remove the legacy left disclosure arrow that overlaps group icons. */
.app-shell .sidebar .sidebar-collapsible-summary::before,
.app-shell .sidebar .sidebar-collapsible[open] > .sidebar-collapsible-summary::before,
.app-shell.sidebar-collapsed .sidebar .sidebar-collapsible-summary::before,
body[class$="-theme"] .app-shell .sidebar .sidebar-collapsible-summary::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  rotate: 0deg !important;
}

.app-shell .sidebar .sidebar-collapsible-summary::-webkit-details-marker,
.app-shell .sidebar .sidebar-collapsible-summary::marker,
body[class$="-theme"] .app-shell .sidebar .sidebar-collapsible-summary::-webkit-details-marker,
body[class$="-theme"] .app-shell .sidebar .sidebar-collapsible-summary::marker {
  content: "" !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
}

/* USER UPDATE: PaperDesk shadcn shell surface contract.
   Keep the custom black rail, but make the header and main inset one surface. */
:root {
  --pd-paperdesk-shadcn-shell-canvas: var(--pd-app-frame-background, #fafafa);
  --pd-paperdesk-shadcn-shell-surface: var(--pd-app-frame-surface, #ffffff);
  --pd-paperdesk-shadcn-shell-gap: 16px;
  --pd-paperdesk-shadcn-shell-gap-lg: 24px;
}

.app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
  background: var(--pd-paperdesk-shadcn-shell-canvas) !important;
}

.workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .workspace[data-slot="sidebar-inset"],
.workspace[data-slot="sidebar-inset"] > .toolbar,
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] > .toolbar,
.workspace[data-slot="sidebar-inset"] > .content-grid,
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] > .content-grid {
  background: var(--pd-paperdesk-shadcn-shell-surface) !important;
}

.app-shell .content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode),
body[class$="-theme"] .app-shell .content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) {
  padding: var(--pd-paperdesk-shadcn-shell-gap) !important;
}

@media (min-width: 1024px) {
  .app-shell .content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode),
  body[class$="-theme"] .app-shell .content-grid.dashboard-mode:not(.global-search-mode):not(.ai-decision-mode) {
    padding: var(--pd-paperdesk-shadcn-shell-gap-lg) !important;
  }
}