/* shadcn dashboard-01 SidebarProvider / SidebarInset parity.
   This file is intentionally loaded last so the shell is not affected by older app-frame rules. */
:root {
  --pd-sidebar-transition-duration: 260ms;
  --pd-sidebar-transition-timing: ease;
  --pd-right-drawer-transition-duration: 260ms;
  --pd-right-drawer-transition-timing: ease;
  --pd-right-drawer-close-transition-timing: ease;
  --pd-app-frame-gap: 12px;
}

.app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
  --spacing: 0.25rem;
  --sidebar-width: calc(var(--spacing) * 72);
  --pd-shadcn-sidebar-width: var(--sidebar-width, 288px);
  --pd-responsive-sidebar-column: var(--sidebar-width, var(--pd-shadcn-sidebar-width, 288px));
  --pd-responsive-main-min-width: 0px;
  --pd-app-frame-gap: inherit;
  --pd-shadcn-header-height: 48px;
  --nav-collapsed-width: 0px;
  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;
  width: 100% !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--pd-sidebar-background, #fafafa) !important;
  transition: grid-template-columns var(--pd-sidebar-transition-duration, 260ms) var(--pd-sidebar-transition-timing, ease) !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: auto !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;
  grid-column: 1 !important;
  grid-row: 1 !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;
  min-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;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  justify-self: stretch !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;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  border: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
  border-radius: 12px !important;
  background: var(--pd-app-frame-surface, #ffffff) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.app-shell.sidebar-collapsed[data-slot="sidebar-wrapper"],
.app-shell.sidebar-responsive-collapsed[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell.sidebar-collapsed[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell.sidebar-responsive-collapsed[data-slot="sidebar-wrapper"] {
  grid-template-columns: var(--nav-collapsed-width, 0px) minmax(var(--pd-responsive-main-min-width, 0px), 1fr) !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;
  margin-right: var(--pd-app-frame-gap, 8px) !important;
  justify-self: stretch !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"] {
  pointer-events: none !important;
  transform: translateX(calc(-1 * (var(--pd-shadcn-sidebar-width, 288px) + 1px))) !important;
}

@media (max-width: 760px) {
  .app-shell[data-slot="sidebar-wrapper"],
  body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
    --pd-app-frame-gap: 6px;
    --pd-responsive-sidebar-column: 0px;
    grid-template-columns: 0 minmax(0, 1fr) !important;
    min-height: 100dvh !important;
    padding: var(--pd-app-frame-gap) !important;
    overflow: visible !important;
  }

  .sidebar[data-slot="sidebar"][data-variant="inset"],
  .sidebar-gap[data-slot="sidebar-gap"],
  body[class$="-theme"] .sidebar[data-slot="sidebar"][data-variant="inset"],
  body[class$="-theme"] .sidebar-gap[data-slot="sidebar-gap"] {
    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[data-slot="sidebar-inset"],
  body[class$="-theme"] .workspace[data-slot="sidebar-inset"] {
    grid-column: 2 !important;
    height: auto !important;
    min-height: calc(100dvh - (var(--pd-app-frame-gap, 6px) * 2)) !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
  }
}

/* USER UPDATE: shadcn zoom/offcanvas sidebar sheet. */
html.navigation-offcanvas-open {
  overflow: hidden !important;
}

.app-shell.sidebar-offcanvas-open[data-slot="sidebar-wrapper"]::before,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open[data-slot="sidebar-wrapper"]::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 45 !important;
  display: block !important;
  background: rgba(0, 0, 0, 0.5) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"] {
  display: flex !important;
  align-items: stretch !important;
  width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  min-width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  max-width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  padding: 8px !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
  translate: none !important;
  z-index: 60 !important;
  border-right: 1px solid var(--pd-sidebar-border, #e5e7eb) !important;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28) !important;
}

.app-shell.sidebar-offcanvas-open .sidebar > :not(.sidebar-resize-handle),
.app-shell.sidebar-offcanvas-open .sidebar .sidebar-brand,
.app-shell.sidebar-offcanvas-open .sidebar .sidebar-main-content,
.app-shell.sidebar-offcanvas-open .sidebar .sidebar-account-footer,
.app-shell.sidebar-offcanvas-open .sidebar .sidebar-tools,
.app-shell.sidebar-offcanvas-open .sidebar .tag-panel,
.app-shell.sidebar-offcanvas-open .sidebar .system-utilization-panel,
.app-shell.sidebar-offcanvas-open .sidebar #systemUtilizationPanel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar > :not(.sidebar-resize-handle),
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-brand,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-main-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-account-footer,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-tools,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .tag-panel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .system-utilization-panel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar #systemUtilizationPanel {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .sidebar-brand,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-brand {
  display: flex !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .sidebar-main-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-main-content {
  display: flex !important;
  overflow-y: auto !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .tag-panel,
.app-shell.sidebar-offcanvas-open .sidebar .system-utilization-panel,
.app-shell.sidebar-offcanvas-open .sidebar #systemUtilizationPanel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .tag-panel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .system-utilization-panel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar #systemUtilizationPanel {
  display: flex !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .sidebar-tools,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-tools {
  display: grid !important;
}

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

.app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-summary,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-summary {
  display: grid !important;
  visibility: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-content,
.app-shell.sidebar-offcanvas-open .sidebar .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .nav-menu-content {
  display: block !important;
  visibility: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .nav-item,
.app-shell.sidebar-offcanvas-open .sidebar .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .nav-item,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .dashboard-nav-item {
  display: grid !important;
  justify-content: initial !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 7px 8px !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .nav-item .menu-text,
.app-shell.sidebar-offcanvas-open .sidebar .dashboard-nav-item .menu-text,
.app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-title,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .nav-item .menu-text,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .dashboard-nav-item .menu-text,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-title {
  position: static !important;
  display: inline !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  clip: auto !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

.app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-count,
.app-shell.sidebar-offcanvas-open .sidebar .menu-count,
.app-shell.sidebar-offcanvas-open .sidebar .nav-item > span[id$="Count"],
.app-shell.sidebar-offcanvas-open .sidebar .nav-item > span:last-child:not(.menu-text):not(.folder-ui-icon):not(.nav-icon),
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .sidebar-collapsible-count,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .menu-count,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .nav-item > span[id$="Count"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar .nav-item > span:last-child:not(.menu-text):not(.folder-ui-icon):not(.nav-icon) {
  display: inline-flex !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* USER UPDATE: when the offcanvas sheet is open, use the full expanded sidebar layout.
   Older collapsed/icon rules remain active only while the sheet is closed. */
.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-state="expanded"] {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  min-width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  max-width: min(var(--pd-shadcn-sidebar-width, 288px), calc(100vw - 32px)) !important;
  padding: 8px !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  background: var(--pd-sidebar-background, #fafafa) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
  translate: none !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-brand,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-main-content,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-account-footer,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-brand,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-main-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-account-footer {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  clip: auto !important;
  clip-path: none !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-brand,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-brand {
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-height: 48px !important;
  padding: 8px 10px !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-brand-logo-wrap,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-brand-logo-wrap {
  display: inline-flex !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-brand-copy,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-brand-copy {
  position: static !important;
  display: grid !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: normal !important;
  text-align: left !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-main-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-main-content {
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-tools,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-tools {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-section[aria-label="Collections"],
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-panel,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .system-utilization-panel,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] #systemUtilizationPanel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-section[aria-label="Collections"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-panel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .system-utilization-panel,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] #systemUtilizationPanel {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  overflow: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-section[aria-label="Collections"] > h2,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-section[aria-label="Collections"] > h2 {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 4px !important;
  padding: 0 8px !important;
  color: var(--pd-sidebar-muted, #64748b) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-group.sidebar-collapsible,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-collapsible,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .system-collapsible,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-group.sidebar-collapsible,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-collapsible,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .system-collapsible {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  overflow: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary[data-slot="sidebar-group-label"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary[data-slot="sidebar-group-label"] {
  appearance: none !important;
  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: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  gap: 10px !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  background: transparent !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  text-align: left !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  overflow: hidden !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary > *,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary > * {
  display: inline-flex !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  overflow: hidden !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-group-icon,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-group-icon {
  display: inline-flex !important;
  flex: 0 0 22px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  background: transparent !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-title,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .menu-text,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-title,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .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;
  opacity: 1 !important;
  visibility: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-count,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-chevron,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .menu-count,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item > span[id$="Count"],
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item > span:last-child:not(.menu-text):not(.folder-ui-icon):not(.nav-icon),
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-count,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-chevron,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .menu-count,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item > span[id$="Count"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .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;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  color: var(--pd-sidebar-muted, #64748b) !important;
  font-size: 12px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-content,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-content.nav-menu-content,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-content,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-list,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .system-utilization-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-content.nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-list,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .system-utilization-content {
  display: grid !important;
  width: 100% !important;
  max-height: none !important;
  gap: 4px !important;
  padding: 4px 0 8px 20px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  overflow: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .dashboard-nav-item {
  position: relative !important;
  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: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  gap: 10px !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  background: transparent !important;
  text-align: left !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .folder-ui-icon,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-icon,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item-icon,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .folder-ui-icon,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-icon,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item-icon {
  display: inline-flex !important;
  flex: 0 0 22px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  color: currentColor !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item.active::before,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .dashboard-nav-item.active::before,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-item.active::before,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .dashboard-nav-item.active::before {
  display: block !important;
  content: "" !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-account-footer,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] > .sidebar-account-footer {
  flex: 0 0 auto !important;
  display: grid !important;
  align-items: stretch !important;
  gap: 8px !important;
  margin-top: 8px !important;
  padding: 8px 2px 0 !important;
  overflow: visible !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-footer-tools,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-footer-search,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-avatar-menu,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-footer-tools,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-footer-search,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-avatar-menu {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* USER UPDATE: keep collapsed SidebarInset frame after sidebar show/hide. */
.app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
.app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"],
body.app-is-locked .app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
body.app-is-locked .app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"],
body:has(#appLockOverlay) .app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
body:has(#appLockOverlay) .app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"] {
  box-sizing: border-box !important;
  justify-self: stretch !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100vw - (var(--pd-app-frame-gap, 8px) * 2)) !important;
  margin: var(--pd-app-frame-gap, 8px) !important;
  border-right: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
  border-top-right-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
  box-shadow: inset -1px 0 0 var(--pd-app-frame-border, #e5e7eb), 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

/* USER FIX: collapsed SidebarInset follows the rounded unboxed shadcn frame. */
.app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
.app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"],
body.app-is-locked .app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
body.app-is-locked .app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"],
body:has(#appLockOverlay) .app-shell[data-slot="sidebar-wrapper"].sidebar-collapsed > .workspace[data-slot="sidebar-inset"],
body:has(#appLockOverlay) .app-shell[data-slot="sidebar-wrapper"].sidebar-responsive-collapsed > .workspace[data-slot="sidebar-inset"] {
  border-right: 0 !important;
  border-top-right-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

/* USER UPDATE: keep offcanvas sheet above the header and keep group chevrons inline. */
.app-shell.sidebar-offcanvas-open[data-slot="sidebar-wrapper"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open[data-slot="sidebar-wrapper"] {
  isolation: isolate !important;
}

.app-shell.sidebar-offcanvas-open[data-slot="sidebar-wrapper"]::before,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open[data-slot="sidebar-wrapper"]::before {
  z-index: 100 !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-slot="sidebar"][data-collapsible="offcanvas"] {
  z-index: 110 !important;
}

.app-shell.sidebar-offcanvas-open > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open > .workspace[data-slot="sidebar-inset"] {
  position: relative !important;
  z-index: 0 !important;
}

.app-shell.sidebar-offcanvas-open > .workspace[data-slot="sidebar-inset"] > .toolbar,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open > .workspace[data-slot="sidebar-inset"] > .toolbar {
  z-index: 30 !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary[data-slot="sidebar-group-label"],
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-summary[data-slot="sidebar-group-label"] {
  grid-template-columns: 22px minmax(0, 1fr) auto auto !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-title,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-title {
  grid-column: 2 !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-count,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-count {
  grid-column: 3 !important;
  justify-self: end !important;
}

.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-chevron,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .sidebar-collapsible-chevron {
  grid-column: 4 !important;
  justify-self: end !important;
}

/* USER UPDATE: native details open state owns offcanvas sidebar group visibility. */
.app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible:not([open]) > .sidebar-collapsible-content,
.app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible:not([open]) > .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible:not([open]) > .sidebar-collapsible-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible:not([open]) > .nav-menu-content {
  display: none !important;
  visibility: hidden !important;
  max-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

.app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible[open] > .sidebar-collapsible-content,
.app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible[open] > .nav-menu-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible[open] > .sidebar-collapsible-content,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar details.sidebar-collapsible[open] > .nav-menu-content {
  display: grid !important;
  visibility: visible !important;
  max-height: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  overflow: visible !important;
}

/* USER UPDATE: shadcn PanelLeft trigger icon for the top toolbar. */
.toolbar > .left-nav-hamburger-button.shadcn-sidebar-trigger,
body[class$="-theme"] .toolbar > .left-nav-hamburger-button.shadcn-sidebar-trigger {
  gap: 0 !important;
}

.toolbar > .left-nav-hamburger-button.shadcn-sidebar-trigger .sidebar-trigger-icon,
body[class$="-theme"] .toolbar > .left-nav-hamburger-button.shadcn-sidebar-trigger .sidebar-trigger-icon {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  color: currentColor !important;
}

/* USER UPDATE: right detail panel uses an offcanvas drawer contract at zoom/mobile widths. */
@media (max-width: 980px) {
  body.right-detail-drawer-open,
  body[class$="-theme"].right-detail-drawer-open {
    overflow: hidden !important;
  }

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

  body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"]::after,
  body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"]::after {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 88 !important;
    background: rgba(15, 23, 42, 0.42) !important;
    pointer-events: auto !important;
  }

  body.right-detail-drawer-open .workspace > .content-grid,
  body[class$="-theme"].right-detail-drawer-open .workspace > .content-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    overflow: visible !important;
  }

  body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
  body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
  body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
  body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]) {
    position: fixed !important;
    top: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    left: auto !important;
    z-index: 96 !important;
    display: block !important;
    box-sizing: border-box !important;
    width: min(var(--detail-width, 420px), calc(100vw - 32px)) !important;
    min-width: min(320px, calc(100vw - 32px)) !important;
    max-width: calc(100vw - 32px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 24px) !important;
    padding: 12px 14px 14px !important;
    border: 1px solid var(--pd-app-frame-border, #e5e7eb) !important;
    border-radius: 18px !important;
    background: var(--pd-app-frame-surface, #ffffff) !important;
    box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
  }

  body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar,
  body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar,
  body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar,
  body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-track,
  body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-thumb,
  body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-track,
  body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-thumb,
  body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-track,
  body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-thumb,
  body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-track,
  body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden])::-webkit-scrollbar-thumb {
    background: transparent !important;
    border: 0 !important;
  }

  body.right-detail-drawer-open .content-grid > .resize-handle,
  body[class$="-theme"].right-detail-drawer-open .content-grid > .resize-handle {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .library-panel,
  body[class$="-theme"].right-detail-drawer-open .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;
  }
}

@keyframes rightDetailDrawerSlideIn {
  from {
    opacity: 0;
    translate: 28px 0;
  }

  to {
    opacity: 1;
    translate: 0 0;
  }
}

@keyframes rightDetailDrawerSlideOut {
  from {
    opacity: 1;
    translate: 0 0;
  }

  to {
    opacity: 0;
    translate: 28px 0;
  }
}

/* USER UPDATE: Tremor-style right input drawer chrome. */
@media (max-width: 980px) {
  body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
  body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
  body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
  body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]) {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    overflow: hidden !important;
    animation: rightDetailDrawerSlideIn var(--pd-right-drawer-transition-duration, 180ms) var(--pd-right-drawer-transition-timing, cubic-bezier(0.16, 1, 0.3, 1)) both !important;
  }

  body.right-detail-drawer-open .detail-panel > form:not([hidden]),
  body[class$="-theme"].right-detail-drawer-open .detail-panel > form:not([hidden]) {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 24px) !important;
    padding: 0 16px 16px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
  }

  body.right-detail-drawer-open .detail-panel > form:not([hidden])::-webkit-scrollbar,
  body[class$="-theme"].right-detail-drawer-open .detail-panel > form:not([hidden])::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  body.right-detail-drawer-open .detail-panel .detail-heading,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-heading {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    gap: 10px 12px !important;
    margin: 0 -16px 10px !important;
    padding: 18px 16px 14px !important;
    border-radius: 18px 18px 0 0 !important;
    background: rgba(255, 255, 255, 0.98) !important;
  }

  body.right-detail-drawer-open .detail-panel .detail-heading > div:first-child,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-heading > div:first-child {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  body.right-detail-drawer-open .detail-panel .detail-heading .eyebrow,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-heading .eyebrow {
    display: none !important;
  }

  body.right-detail-drawer-open .detail-panel .detail-heading h2,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-heading h2 {
    order: 1 !important;
    margin: 0 !important;
    color: #0f172a !important;
    font-size: clamp(1.2rem, 4vw, 1.65rem) !important;
    line-height: 1.2 !important;
  }

  body.right-detail-drawer-open .detail-panel .detail-quick-action-group,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-quick-action-group {
    order: 2 !important;
    align-self: start !important;
  }

  body.right-detail-drawer-open .detail-panel .detail-actions,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-actions {
    display: flex !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-width: 34px !important;
  }

  body.right-detail-drawer-open .detail-panel .right-detail-drawer-close,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .right-detail-drawer-close {
    display: inline-grid !important;
    width: 34px !important;
    height: 34px !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: #0f172a !important;
    font-size: 24px !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }

  body.right-detail-drawer-open .detail-panel .right-detail-drawer-close:hover,
  body.right-detail-drawer-open .detail-panel .right-detail-drawer-close:focus-visible,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .right-detail-drawer-close:hover,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .right-detail-drawer-close:focus-visible {
    background: #f4f4f5 !important;
    outline: none !important;
  }

  body.right-detail-drawer-open .detail-panel .panel-arrow-toggle,
  body.right-detail-drawer-open .detail-panel .panel-switch-button,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .panel-arrow-toggle,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .panel-switch-button {
    display: none !important;
  }

  body.right-detail-drawer-open .detail-panel .form-actions,
  body.right-detail-drawer-open .detail-panel .placeholder-form-actions,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .form-actions,
  body[class$="-theme"].right-detail-drawer-open .detail-panel .placeholder-form-actions {
    margin: auto -16px -16px !important;
    padding: 12px 16px 16px !important;
    border-radius: 0 0 18px 18px !important;
    background: rgba(255, 255, 255, 0.98) !important;
  }
}

/* USER UPDATE: hide right sidebar scrollbars while preserving scroll behavior.
   The detail panel can scroll in desktop layout, while the active form scrolls in
   drawer layout. Cover both so zoom state changes do not reveal a native gutter. */
.detail-panel,
body[class$="-theme"] .detail-panel,
.detail-panel > form,
body[class$="-theme"] .detail-panel > form {
  -ms-overflow-style: none !important;
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
}

.detail-panel::-webkit-scrollbar,
.detail-panel::-webkit-scrollbar-button,
.detail-panel::-webkit-scrollbar-track,
.detail-panel::-webkit-scrollbar-thumb,
.detail-panel::-webkit-scrollbar-corner,
.detail-panel > form::-webkit-scrollbar,
.detail-panel > form::-webkit-scrollbar-button,
.detail-panel > form::-webkit-scrollbar-track,
.detail-panel > form::-webkit-scrollbar-thumb,
.detail-panel > form::-webkit-scrollbar-corner,
body[class$="-theme"] .detail-panel::-webkit-scrollbar,
body[class$="-theme"] .detail-panel::-webkit-scrollbar-button,
body[class$="-theme"] .detail-panel::-webkit-scrollbar-track,
body[class$="-theme"] .detail-panel::-webkit-scrollbar-thumb,
body[class$="-theme"] .detail-panel::-webkit-scrollbar-corner,
body[class$="-theme"] .detail-panel > form::-webkit-scrollbar,
body[class$="-theme"] .detail-panel > form::-webkit-scrollbar-button,
body[class$="-theme"] .detail-panel > form::-webkit-scrollbar-track,
body[class$="-theme"] .detail-panel > form::-webkit-scrollbar-thumb,
body[class$="-theme"] .detail-panel > form::-webkit-scrollbar-corner {
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  display: none !important;
}

/* USER UPDATE: enterprise document right detail drawer, inspired by Tremor transaction panels.
   Scope this to the legal-document form so inspector and placeholder forms keep their legacy behavior. */
.detail-panel #itemForm[data-detail-drawer-form="documents"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  min-height: 100% !important;
  padding: 0 !important;
  color: #0f172a !important;
  background: #ffffff !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  position: sticky !important;
  top: 0 !important;
  z-index: 8 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 18px 18px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child {
  display: grid !important;
  min-width: 0 !important;
  gap: 7px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading .eyebrow,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading .eyebrow {
  display: block !important;
  margin: 0 !important;
  color: #64748b !important;
  font-family: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: clamp(1.18rem, 2.1vw, 1.55rem) !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-quick-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-quick-action-group {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
  align-self: start !important;
  margin-top: 4px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: 36px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-close,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-close {
  display: inline-grid !important;
  width: 34px !important;
  height: 34px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #334155 !important;
  font-size: 22px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-close:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-close:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-close:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-close:focus-visible {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  outline: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .panel-arrow-toggle,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .panel-switch-button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .panel-arrow-toggle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .panel-switch-button {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  position: sticky !important;
  top: 78px !important;
  z-index: 7 !important;
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: rgba(255, 255, 255, 0.98) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::-webkit-scrollbar,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  gap: 6px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab:hover {
  color: #2563eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab.is-active,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab[aria-selected="true"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab.is-active,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab[aria-selected="true"] {
  color: #2563eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab.is-active::after,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab.is-active::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab[aria-selected="true"]::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: #2563eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-grid,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > label,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > datalist + label,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-status,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .document-custom-fields,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-grid,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > label,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > datalist + label,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .document-custom-fields,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .record-meta {
  margin-right: 18px !important;
  margin-left: 18px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-grid:first-of-type,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-grid:first-of-type {
  margin-top: 16px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] label,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] label {
  display: grid !important;
  gap: 7px !important;
  margin-top: 12px !important;
  color: #334155 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] input,
.detail-panel #itemForm[data-detail-drawer-form="documents"] textarea,
.detail-panel #itemForm[data-detail-drawer-form="documents"] select,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] input,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] textarea,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] select {
  min-height: 38px !important;
  width: 100% !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-size: 0.9rem !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.02) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] textarea,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] textarea {
  min-height: 96px !important;
  resize: vertical !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] input:focus,
.detail-panel #itemForm[data-detail-drawer-form="documents"] textarea:focus,
.detail-panel #itemForm[data-detail-drawer-form="documents"] select:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] input:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] textarea:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] select:focus {
  border-color: #94a3b8 !important;
  box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.18) !important;
  outline: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 14px !important;
  padding: 12px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group::before {
  content: "Document files" !important;
  grid-column: 1 / -1 !important;
  color: #475569 !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group > button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group > button {
  justify-content: center !important;
  min-height: 34px !important;
  border-radius: 10px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group > #removeAttachmentButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-tools.right-detail-attachment-group > #removeAttachmentButton {
  grid-column: 1 / -1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .attachment-status {
  margin-top: 8px !important;
  color: #64748b !important;
  font-size: 0.8rem !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .record-meta {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 14px !important;
  padding: 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .record-meta div,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .record-meta div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 9 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  margin: auto 0 0 !important;
  padding: 14px 18px 18px !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 -12px 28px rgba(15, 23, 42, 0.05) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > button {
  height: 40px !important;
  border-radius: 0 !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > #deleteButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > #deleteButton {
  border: 1px solid #fecaca !important;
  border-right: 0 !important;
  border-radius: 11px 0 0 11px !important;
  background: #ffffff !important;
  color: #dc2626 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > .primary-action[type="submit"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > .primary-action[type="submit"] {
  border: 1px solid #111827 !important;
  border-radius: 0 11px 11px 0 !important;
  background: #111827 !important;
  color: #ffffff !important;
}

@media (max-width: 980px) {
  body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"],
  body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] {
    max-height: calc(100dvh - 24px) !important;
    overflow-y: auto !important;
  }
}

/* USER UPDATE: flat sidebar submenu rows.
   Keep native details open/close state and button.nav-item behavior intact. */
.sidebar .sidebar-collapsible-content.nav-menu-content,
body[class$="-theme"] .sidebar .sidebar-collapsible-content.nav-menu-content {
  gap: 3px !important;
  margin-top: 4px !important;
  margin-bottom: 8px !important;
  padding: 2px 0 2px 14px !important;
  border: 0 !important;
  border-left: 1px solid color-mix(in srgb, var(--pd-sidebar-border, #e2e8f0) 82%, transparent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.sidebar .nav-menu-content .nav-item,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item {
  position: relative !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  min-height: 34px !important;
  padding: 7px 9px 7px 11px !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--pd-sidebar-foreground, #0f172a) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.sidebar .nav-menu-content .nav-item:has(> .nav-item-icon),
.sidebar .nav-menu-content .nav-item:has(> .folder-ui-icon),
body[class$="-theme"] .sidebar .nav-menu-content .nav-item:has(> .nav-item-icon),
body[class$="-theme"] .sidebar .nav-menu-content .nav-item:has(> .folder-ui-icon) {
  grid-template-columns: 20px minmax(0, 1fr) auto !important;
}

.sidebar .nav-menu-content .dashboard-nav-item,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .dashboard-nav-item,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-content .dashboard-nav-item,
.app-shell.sidebar-collapsed .sidebar .nav-menu-content .nav-item:not(:has(> .nav-item-icon)):not(:has(> .folder-ui-icon)):not(:has(> .nav-icon)),
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-content .nav-item:not(:has(> .nav-item-icon)):not(:has(> .folder-ui-icon)):not(:has(> .nav-icon)),
body[class$="-theme"] .sidebar .nav-menu-content .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-content .dashboard-nav-item,
body[class$="-theme"] .app-shell.sidebar-collapsed .sidebar .nav-menu-content .nav-item:not(:has(> .nav-item-icon)):not(:has(> .folder-ui-icon)):not(:has(> .nav-icon)),
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .nav-menu-content .nav-item:not(:has(> .nav-item-icon)):not(:has(> .folder-ui-icon)):not(:has(> .nav-icon)) {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.sidebar .nav-menu-content .dashboard-nav-item > .nav-icon,
body[class$="-theme"] .sidebar .nav-menu-content .dashboard-nav-item > .nav-icon {
  display: none !important;
}

.sidebar .nav-menu-content .nav-item:hover,
.sidebar .nav-menu-content .nav-item:focus-visible,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item:hover,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item:focus-visible {
  color: var(--pd-sidebar-accent-foreground, #0f172a) !important;
  border-color: transparent !important;
  background: color-mix(in srgb, var(--pd-sidebar-background, #ffffff) 78%, var(--pd-sidebar-accent, #f1f5f9)) !important;
  box-shadow: none !important;
}

.sidebar .nav-menu-content .nav-item.active,
.sidebar .nav-menu-content .nav-item[data-active="true"],
.sidebar .nav-menu-content .nav-item[aria-current="page"],
body[class$="-theme"] .sidebar .nav-menu-content .nav-item.active,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item[data-active="true"],
body[class$="-theme"] .sidebar .nav-menu-content .nav-item[aria-current="page"] {
  color: var(--pd-sidebar-primary, #2563eb) !important;
  border-color: transparent !important;
  background: color-mix(in srgb, var(--pd-sidebar-primary, #2563eb) 8%, transparent) !important;
  box-shadow: inset 3px 0 0 var(--pd-sidebar-primary, #2563eb) !important;
  font-weight: 650 !important;
}

.sidebar .nav-menu-content .nav-item .menu-text,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item .menu-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.sidebar .nav-menu-content .nav-item > span[id$="Count"],
.sidebar .nav-menu-content .nav-item > .menu-count,
.sidebar .nav-menu-content .nav-item > span:last-child:not(.menu-text):not(.folder-ui-icon):not(.nav-icon):not(.nav-item-icon),
body[class$="-theme"] .sidebar .nav-menu-content .nav-item > span[id$="Count"],
body[class$="-theme"] .sidebar .nav-menu-content .nav-item > .menu-count,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item > span:last-child:not(.menu-text):not(.folder-ui-icon):not(.nav-icon):not(.nav-item-icon) {
  justify-self: end !important;
  color: var(--pd-sidebar-muted, #64748b) !important;
}

/* Right detail drawer tabs: route document files, finance, and history into sections. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel {
  display: grid !important;
  gap: 0 !important;
  margin: 0 18px !important;
  padding-top: 16px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel[hidden],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel[hidden] {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .form-grid,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > label,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > datalist + label,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-status,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .document-custom-fields,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .form-grid,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > label,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > datalist + label,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .document-custom-fields,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .record-meta {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .form-grid:first-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .form-grid:first-child {
  margin-top: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 14px !important;
  padding: 12px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group::before {
  content: "Document files" !important;
  grid-column: 1 / -1 !important;
  color: #475569 !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group > button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group > button {
  justify-content: center !important;
  min-height: 34px !important;
  border-radius: 10px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group > #removeAttachmentButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group > #removeAttachmentButton {
  grid-column: 1 / -1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-status {
  margin-top: 8px !important;
  color: #64748b !important;
  font-size: 0.8rem !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .record-meta {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 0 !important;
  padding: 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .record-meta div,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .record-meta div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

/* Right detail Files tab: upload-card treatment around existing attachment actions. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .document-file-path-field,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .document-file-path-field {
  margin-bottom: 12px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group.document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group.document-files-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin-top: 0 !important;
  padding: 14px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group.document-files-card::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-tab-panel > .attachment-tools.right-detail-attachment-group.document-files-card::before {
  content: none !important;
  display: none !important;
}

.document-files-card-header {
  display: grid !important;
  gap: 3px !important;
}

.document-files-card-header span {
  color: #0f172a !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
}

.document-files-card-header small {
  color: #64748b !important;
  font-size: 0.74rem !important;
  line-height: 1.35 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  align-items: center !important;
  column-gap: 12px !important;
  row-gap: 2px !important;
  width: 100% !important;
  min-height: 112px !important;
  padding: 16px !important;
  text-align: left !important;
  border: 1px dashed #94a3b8 !important;
  border-radius: 14px !important;
  background: rgba(248, 250, 252, 0.82) !important;
  color: #1e293b !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone:hover {
  border-color: #2563eb !important;
  background: #eff6ff !important;
}

.document-file-dropzone-icon {
  grid-row: 1 / span 2 !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  background: #e0ecff !important;
  color: #1d4ed8 !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
}

.document-file-dropzone strong {
  align-self: end !important;
  color: #0f172a !important;
  font-size: 0.9rem !important;
  font-weight: 750 !important;
}

.document-file-dropzone small {
  align-self: start !important;
  color: #64748b !important;
  font-size: 0.76rem !important;
}

.document-file-current {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  background: #ffffff !important;
}

.document-file-current-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 28px !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #475569 !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current > .attachment-status {
  min-width: 0 !important;
  margin: 0 !important;
  color: #334155 !important;
  font-size: 0.78rem !important;
  line-height: 1.4 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.document-file-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions > button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions > button {
  justify-content: center !important;
  min-height: 34px !important;
  border-radius: 10px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions > #removeAttachmentButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions > #removeAttachmentButton {
  grid-column: 1 / -1 !important;
}

/* LEGACY UPDATE: document detail overlay shell.
   Overridden later by the flush right drawer contract. */
body.right-detail-drawer-open,
body.right-detail-drawer-closing,
body[class$="-theme"].right-detail-drawer-open,
body[class$="-theme"].right-detail-drawer-closing {
  overflow: hidden !important;
}

body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"],
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] {
  isolation: isolate !important;
}

body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"]::after,
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"]::after,
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"]::after,
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"]::after {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 88 !important;
  background: rgba(15, 23, 42, 0.42) !important;
  pointer-events: auto !important;
}

body.right-detail-drawer-open .workspace[data-slot="sidebar-inset"],
body.right-detail-drawer-open .workspace,
body:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace[data-slot="sidebar-inset"],
body:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace,
body[class$="-theme"].right-detail-drawer-open .workspace[data-slot="sidebar-inset"],
body[class$="-theme"].right-detail-drawer-open .workspace,
body[class$="-theme"]:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace[data-slot="sidebar-inset"],
body[class$="-theme"]:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace {
  width: auto !important;
  margin-right: var(--pd-app-frame-gap, 8px) !important;
  transform: none !important;
}

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

body.right-detail-drawer-open .content-grid > .resize-handle,
body[class$="-theme"].right-detail-drawer-open .content-grid > .resize-handle {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]),
body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel:not([hidden]) {
  position: fixed !important;
  top: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  left: auto !important;
  z-index: 96 !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  width: min(var(--detail-width, 480px), calc(100vw - 32px)) !important;
  min-width: min(340px, calc(100vw - 32px)) !important;
  max-width: min(920px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 28px) !important;
  padding: 0 !important;
  border: 1px solid #d8dee8 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
  overflow: hidden !important;
  animation: rightDetailDrawerSlideIn var(--pd-right-drawer-transition-duration, 180ms) var(--pd-right-drawer-transition-timing, cubic-bezier(0.16, 1, 0.3, 1)) both !important;
}

body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel.is-closing:not([hidden]),
body.right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel.is-closing:not([hidden]),
body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel.is-closing:not([hidden]),
body[class$="-theme"].right-detail-drawer-open .content-grid.detail-collapsed:not(.dashboard-mode):not(.global-search-mode):not(.ai-decision-mode):not(.calendar-dashboard-mode) > .detail-panel.is-closing:not([hidden]) {
  pointer-events: none !important;
  animation: rightDetailDrawerSlideOut var(--pd-right-drawer-transition-duration, 180ms) var(--pd-right-drawer-close-transition-timing, cubic-bezier(0.7, 0, 0.84, 0)) both !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 22px 24px 18px !important;
  border-radius: 12px 12px 0 0 !important;
  background: #ffffff !important;
}

.right-detail-drawer-meta,
body[class$="-theme"] .right-detail-drawer-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 2px !important;
}

.right-detail-drawer-meta > span,
body[class$="-theme"] .right-detail-drawer-meta > span {
  display: inline-flex !important;
  max-width: 100% !important;
  min-height: 24px !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  color: #475569 !important;
  background: #f8fafc !important;
  font-size: 0.72rem !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 24px !important;
  background: #ffffff !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 12px 20px 18px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar-button,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar-track,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar-thumb,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar-button,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar-track,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel::-webkit-scrollbar-thumb {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel[hidden],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel[hidden] {
  display: none !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions {
  position: relative !important;
  bottom: auto !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 16px 24px 20px !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 0 12px 12px !important;
  background: #ffffff !important;
  box-shadow: 0 -12px 28px rgba(15, 23, 42, 0.05) !important;
}

body.right-detail-drawer-open .sneat-floating-right-nav-button:not(.is-dashboard-menu),
body[class$="-theme"].right-detail-drawer-open .sneat-floating-right-nav-button:not(.is-dashboard-menu) {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* USER UPDATE: document drawer save/delete footer.
   Keep the active tab as the scroll area and keep record actions anchored at
   the drawer bottom, matching the reference details drawer action bar. */
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  order: 1 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  order: 2 !important;
}

/* USER UPDATE: fit the four document drawer tabs inside the drawer width. */
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  overflow: hidden !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab {
  width: 100% !important;
  min-width: 0 !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 44px !important;
  padding: 0 2px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  font-size: 0.8125rem !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab-icon,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab-icon,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab > span,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab > span,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab > span,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab > span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel {
  order: 3 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions {
  order: 4 !important;
  position: relative !important;
  bottom: auto !important;
  z-index: 12 !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  margin: auto 0 0 !important;
  padding: 14px 24px 20px !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 0 12px 12px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 -12px 28px rgba(15, 23, 42, 0.05) !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > button,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > button {
  width: auto !important;
  min-width: 92px !important;
  height: 38px !important;
  border-radius: 8px !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > #deleteButton,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > #deleteButton {
  border: 1px solid #fecaca !important;
  background: #ffffff !important;
  color: #dc2626 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > .primary-action[type="submit"],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > .primary-action[type="submit"] {
  border: 1px solid #111827 !important;
  background: #111827 !important;
  color: #ffffff !important;
}

@media (max-width: 520px) {
  body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
  body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions {
    justify-content: stretch !important;
  }

  body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > button,
  body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions > button {
    flex: 1 1 0 !important;
  }
}

/* USER UPDATE: disable right detail floating-card chrome.
   Keep the right detail as a slide-in drawer, but make it flush with the
   viewport edge instead of a detached floating card. */
body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"]::after,
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"]::after,
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"]::after,
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"]::after {
  content: none !important;
  display: none !important;
  pointer-events: none !important;
  background: transparent !important;
  backdrop-filter: none !important;
}

body.right-detail-drawer-open .content-grid:not(.dashboard-mode) > .detail-panel:not([hidden]),
body.right-detail-drawer-closing .content-grid:not(.dashboard-mode) > .detail-panel:not([hidden]),
body[class$="-theme"].right-detail-drawer-open .content-grid:not(.dashboard-mode) > .detail-panel:not([hidden]),
body[class$="-theme"].right-detail-drawer-closing .content-grid:not(.dashboard-mode) > .detail-panel:not([hidden]) {
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: min(var(--detail-width, 480px), 100vw) !important;
  min-width: min(340px, 100vw) !important;
  max-width: min(920px, 100vw) !important;
  max-height: 100dvh !important;
  border: 0 !important;
  border-left: 1px solid #dce3ea !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.right-detail-drawer-open .detail-panel .detail-heading,
body.right-detail-drawer-closing .detail-panel .detail-heading,
body[class$="-theme"].right-detail-drawer-open .detail-panel .detail-heading,
body[class$="-theme"].right-detail-drawer-closing .detail-panel .detail-heading {
  border-radius: 0 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* USER UPDATE: document drawer action strip.
   Arrange DELETE/SAVE in a flat section row, matching the tab strip surface
   instead of a separate nested button shell. */
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions {
  margin: auto 0 0 !important;
  padding: 12px 24px !important;
  min-height: 58px !important;
  border: 0 !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  box-sizing: border-box !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button {
  min-width: 0 !important;
  width: auto !important;
  height: 42px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #475569 !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton {
  color: #dc2626 !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > .primary-action[type="submit"],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > .primary-action[type="submit"],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > .primary-action[type="submit"],
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > .primary-action[type="submit"] {
  color: #0f172a !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:hover,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:hover,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:hover,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:hover {
  background: #f8fafc !important;
  color: #0f172a !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:hover,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:hover,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:hover,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:hover {
  color: #b91c1c !important;
}

/* USER UPDATE: flatten document drawer tab shells.
   Files, finance, and history should read as sections of the drawer body,
   not cards nested inside the right drawer. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel {
  gap: 10px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] > .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] > .document-files-card,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] > .document-files-card,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] > .document-files-card,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] > .document-files-card,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] > .document-files-card,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] > .finance-source-panel,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] > .finance-source-panel,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] > .finance-source-panel,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] > .finance-source-panel,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] > .finance-source-panel,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] > .finance-source-panel,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header {
  padding: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-panel-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-panel-header,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-panel-header,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-panel-header,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-panel-header,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-panel-header {
  padding: 0 0 12px !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-actions,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-summary,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-list,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-summary,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-list,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-summary,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-list,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-summary,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-list,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-summary,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-list,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-actions,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-summary,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="finance"] .finance-source-list {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div {
  padding: 10px 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div:last-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div:last-child,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div:last-child,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div:last-child,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div:last-child,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] > .record-meta div:last-child {
  border-bottom: 0 !important;
}

/* USER UPDATE: right detail drawer hover resize rail.
   Re-enable the existing width persistence and anchor the rail to the
   drawer's actual left edge so zoom/responsive math cannot drift. */
body.right-detail-drawer-open,
body.right-detail-drawer-closing,
body[class$="-theme"].right-detail-drawer-open,
body[class$="-theme"].right-detail-drawer-closing {
  --right-detail-drawer-effective-width: min(var(--detail-width, 480px), 920px, 100vw);
  --right-detail-resize-hit-area: 12px;
}

body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle,
body[class$="-theme"].right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle,
body[class$="-theme"].right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle {
  position: absolute !important;
  top: 0 !important;
  right: auto !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 30 !important;
  display: flex !important;
  width: var(--right-detail-resize-hit-area) !important;
  min-width: var(--right-detail-resize-hit-area) !important;
  max-width: var(--right-detail-resize-hit-area) !important;
  height: auto !important;
  min-height: 0 !important;
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: col-resize !important;
  pointer-events: auto !important;
  touch-action: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
}

body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle::before,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle::before {
  content: "" !important;
  position: absolute !important;
  inset-block: 0 !important;
  left: 0 !important;
  width: 1px !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: color-mix(in srgb, var(--ring, #64748b) 56%, transparent) !important;
  box-shadow: none !important;
  opacity: 0 !important;
  transform: none !important;
  transition: opacity 120ms ease, width 120ms ease, background 120ms ease !important;
}

body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle::after,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  width: 2px !important;
  height: 46px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--foreground, #111827) !important;
  background-image: none !important;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.78) !important;
  opacity: 0 !important;
  transform: translateY(-50%) !important;
  transition: opacity 120ms ease, height 120ms ease !important;
}

body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::before,
body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::after,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::before,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:not(:hover):not(:focus-visible)::after {
  opacity: 0 !important;
}

body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:hover::before,
body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:focus-visible::before,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:hover::before,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:focus-visible::before,
body.right-navigation-resizing .detail-panel > #resizeHandle.right-navigation-resize-handle::before,
.content-grid.resizing .detail-panel > #resizeHandle.right-navigation-resize-handle::before {
  width: 2px !important;
  background: var(--ring, #2563eb) !important;
  opacity: 0.42 !important;
}

body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:hover::after,
body.right-detail-drawer-open .detail-panel > #resizeHandle.right-navigation-resize-handle:focus-visible::after,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:hover::after,
body.right-detail-drawer-closing .detail-panel > #resizeHandle.right-navigation-resize-handle:focus-visible::after,
body.right-navigation-resizing .detail-panel > #resizeHandle.right-navigation-resize-handle::after,
.content-grid.resizing .detail-panel > #resizeHandle.right-navigation-resize-handle::after {
  opacity: 1 !important;
}

body:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) #resizeHandle.right-navigation-resize-handle,
body:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) #resizeHandle.right-navigation-resize-handle::before,
body:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) #resizeHandle.right-navigation-resize-handle::after {
  pointer-events: none !important;
  opacity: 0 !important;
}

/* USER UPDATE: collapsed document AppDataGrid detail panel must not reserve height.
   The drawer remains available when opened, but the hidden zero-width panel no
   longer stretches the document workspace into a large blank bottom area. */
body:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) .content-grid.documents-appdatagrid-page-mode.detail-collapsed > .detail-panel,
body[class$="-theme"]:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) .content-grid.documents-appdatagrid-page-mode.detail-collapsed > .detail-panel {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) .content-grid.documents-appdatagrid-page-mode.detail-collapsed > .resize-handle,
body[class$="-theme"]:not(.right-detail-drawer-open):not(.right-detail-drawer-closing) .content-grid.documents-appdatagrid-page-mode.detail-collapsed > .resize-handle {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Centered app-level unsaved-change decision dialog. */
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog {
  inset: 50% auto auto 50% !important;
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  border: 1px solid var(--border, #e5e7eb) !important;
  border-radius: 16px !important;
  background: var(--background, #ffffff) !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22) !important;
  transform: translate(-50%, -50%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog::backdrop {
  background: rgba(15, 23, 42, 0.36) !important;
  backdrop-filter: blur(2px) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-panel {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 12px !important;
  padding: 18px !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy {
  gap: 6px !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy strong {
  color: var(--foreground, #111827) !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy span {
  color: var(--muted-foreground, #64748b) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions {
  grid-column: 1 / -1 !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding-top: 6px !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button {
  height: 36px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

/* USER UPDATE: enterprise record section layout for document detail drawer.
   Preserve the existing form IDs and handlers while making each tab read as a
   clean enterprise drawer section rather than one long raw form. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #eef2f7 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section + .right-detail-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section + .right-detail-section {
  padding-top: 10px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section:last-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker {
  color: #64748b !important;
  font-size: 0.68rem !important;
  font-weight: 750 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 0.98rem !important;
  font-weight: 750 !important;
  line-height: 1.28 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-grid,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: start !important;
  min-width: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field label,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field label {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field > span,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field label > span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field > span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field label > span {
  color: #334155 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-wide,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-wide {
  grid-column: 1 / -1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-compact,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-compact {
  min-width: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field input,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field select,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field input,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field select {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 0 !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.02) !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea {
  min-height: 96px !important;
  resize: vertical !important;
}

/* USER UPDATE: document drawer inputs use filled surfaces instead of empty outline-only fields. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field input,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field select,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-input,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field input,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field select,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-input {
  background: #f8fafc !important;
  border-color: #d8e2ee !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.035) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field input:focus,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea:focus,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field select:focus,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-input:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field input:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field textarea:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field select:focus,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-input:focus {
  background: #ffffff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), inset 0 1px 2px rgba(15, 23, 42, 0.025) !important;
  outline: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #documentCustomFields,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #documentCustomFields {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* USER UPDATE: remove the empty custom-field slot from the Details tab rhythm. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #documentCustomFields:empty,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #documentCustomFields:empty {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone {
  display: grid !important;
  place-items: center !important;
  gap: 5px !important;
  min-height: 112px !important;
  padding: 18px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  text-align: center !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-dropzone-icon {
  display: inline-grid !important;
  width: 30px !important;
  height: 30px !important;
  place-items: center !important;
  border-radius: 10px !important;
  background: #e2e8f0 !important;
  color: #334155 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 44px !important;
  padding: 8px 10px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  background: #ffffff !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current-icon {
  display: inline-grid !important;
  min-width: 36px !important;
  height: 26px !important;
  place-items: center !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-current .attachment-status {
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #475569 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions button {
  min-height: 36px !important;
  border-radius: 9px !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] .record-meta {
  display: grid !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] .record-meta div,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] .record-meta div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 11px 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  color: #475569 !important;
  font-size: 0.86rem !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] .record-meta strong,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="history"] .record-meta strong {
  color: #0f172a !important;
  font-weight: 650 !important;
  text-align: right !important;
}

@media (max-width: 420px) {
  .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-grid,
  body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field-grid,
  .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions,
  body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-actions {
    grid-template-columns: 1fr !important;
  }
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions .paperdesk-discard-action {
  border-color: #fecaca !important;
  color: #dc2626 !important;
  background: #ffffff !important;
}

@media (max-width: 640px) {
  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog {
    inset: auto 8px 8px 8px !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 18px !important;
    transform: none !important;
  }

  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions {
    flex-direction: column-reverse !important;
  }

  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button {
    width: 100% !important;
  }
}

/* Enterprise active-state glow used only for selected navigation and active filters. */
@keyframes paperdesk-active-glow-sweep {
  0% {
    transform: translateX(-135%) skewX(-16deg);
    opacity: 0;
  }

  18%,
  72% {
    opacity: 0.34;
  }

  100% {
    transform: translateX(135%) skewX(-16deg);
    opacity: 0;
  }
}

.paperdesk-active-glow {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
}

.paperdesk-active-glow {
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--primary, #2563eb) 22%, transparent),
    0 0 18px color-mix(in srgb, var(--primary, #2563eb) 12%, transparent),
    0 8px 18px rgba(15, 23, 42, 0.06) !important;
}

/* Sidebar active rows intentionally stay flat; glow is reserved for cards and table rows. */
.sidebar .nav-menu-content .nav-item.active,
.sidebar .nav-menu-content .nav-item[data-active="true"],
.sidebar .nav-menu-content .nav-item[aria-current="page"],
body[class$="-theme"] .sidebar .nav-menu-content .nav-item.active,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item[data-active="true"],
body[class$="-theme"] .sidebar .nav-menu-content .nav-item[aria-current="page"] {
  box-shadow: inset 3px 0 0 var(--pd-sidebar-primary, #2563eb) !important;
}

.paperdesk-active-glow::after {
  content: "" !important;
  position: absolute !important;
  inset: -1px !important;
  z-index: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 38%,
      color-mix(in srgb, var(--primary, #2563eb) 30%, transparent) 50%,
      transparent 62%,
      transparent 100%
    ) !important;
  animation: paperdesk-active-glow-sweep 3.8s ease-in-out infinite !important;
}

.sidebar .nav-menu-content .nav-item.active::after,
.sidebar .nav-menu-content .nav-item[data-active="true"]::after,
.sidebar .nav-menu-content .nav-item[aria-current="page"]::after,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item.active::after,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item[data-active="true"]::after,
body[class$="-theme"] .sidebar .nav-menu-content .nav-item[aria-current="page"]::after {
  content: none !important;
  animation: none !important;
}

.paperdesk-active-glow > *,
.paperdesk-active-glow-row > * {
  position: relative !important;
  z-index: 1 !important;
}

.app-data-grid-table .paperdesk-active-glow-row > td,
.paperdesk-active-glow-row > td {
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--primary, #2563eb) 18%, transparent),
    inset 0 -1px 0 color-mix(in srgb, var(--primary, #2563eb) 14%, transparent) !important;
  transition: background-color 160ms ease, box-shadow 160ms ease !important;
}

.app-data-grid-table .paperdesk-active-glow-row > td:first-child,
.paperdesk-active-glow-row > td:first-child {
  /* Active table rows keep top and bottom glow only; no left rail. */
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--primary, #2563eb) 18%, transparent),
    inset 0 -1px 0 color-mix(in srgb, var(--primary, #2563eb) 14%, transparent) !important;
}

.app-data-grid-table .paperdesk-active-glow-row > td[data-column-id="actions"],
.paperdesk-active-glow-row > td[data-column-id="actions"] {
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--primary, #2563eb) 18%, transparent),
    inset 0 -1px 0 color-mix(in srgb, var(--primary, #2563eb) 14%, transparent),
    inset 1px 0 0 color-mix(in srgb, var(--primary, #2563eb) 12%, transparent) !important;
}

@media (prefers-reduced-motion: reduce) {
  .paperdesk-active-glow::after {
    animation: none !important;
    opacity: 0.18 !important;
  }
}

/* Sidebar footer search: keep the static IDs/handlers but render like a compact input group. */
.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search.toolbar-search-group,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search.toolbar-search-group {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
}

.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button-group,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button-group {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 42px !important;
  grid-template-rows: 38px !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--border, #e5e7eb) !important;
  border-radius: 12px !important;
  background: var(--background, #ffffff) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button-group input,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button-group input {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 10px 0 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--foreground, #0f172a) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  outline: 0 !important;
}

.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button-group input:focus,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button-group input:focus {
  box-shadow: none !important;
  outline: 0 !important;
}

.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-left: 1px solid var(--border, #e5e7eb) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--muted-foreground, #64748b) !important;
  box-shadow: none !important;
}

.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button:hover,
.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button:focus-visible,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button:hover,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button:focus-visible {
  background: var(--accent, #f8fafc) !important;
  color: var(--foreground, #0f172a) !important;
}

.sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button svg,
body[class$="-theme"] .sidebar-account-footer[data-reui-avatar-dropdown="compact"] .sidebar-footer-search .toolbar-search-button svg {
  width: 17px !important;
  height: 17px !important;
  stroke-width: 2.25 !important;
}

/* USER UPDATE: AppDataGrid should keep the website Latin font, then Khmer OS Siemreap for Khmer glyphs. */
.app-data-grid,
.app-data-grid :is(button, input, select, textarea, [role="button"], [data-slot="input-group"], [data-slot="input-group-addon"], [data-slot="input-group-control"], [data-slot="input-group-text"]),
body[class$="-theme"] .app-data-grid,
body[class$="-theme"] .app-data-grid :is(button, input, select, textarea, [role="button"], [data-slot="input-group"], [data-slot="input-group-addon"], [data-slot="input-group-control"], [data-slot="input-group-text"]) {
  font-family: var(--pd-font-latin, "PaperDesk Inter Latin"), Inter, "Inter Variable", "Khmer OS Siemreap", var(--pd-font-khmer, "Noto Sans Khmer"), ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

.app-data-grid [data-app-data-grid-search-control],
body[class$="-theme"] .app-data-grid [data-app-data-grid-search-control] {
  flex: 0 1 320px !important;
  width: min(100%, 320px) !important;
  min-width: min(100%, 220px) !important;
  max-width: 320px !important;
}

.app-data-grid .app-data-grid-search-group,
body[class$="-theme"] .app-data-grid .app-data-grid-search-group {
  height: 36px !important;
  min-height: 36px !important;
  border-radius: 10px !important;
  border-color: #dbe3ee !important;
  background: var(--background, #ffffff) !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03) !important;
  overflow: hidden !important;
}

.app-data-grid .app-data-grid-search-group:focus-within,
body[class$="-theme"] .app-data-grid .app-data-grid-search-group:focus-within {
  border-color: #cbd5e1 !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03) !important;
  outline: 0 !important;
}

.app-data-grid .app-data-grid-search-group [data-slot="input-group-addon"],
body[class$="-theme"] .app-data-grid .app-data-grid-search-group [data-slot="input-group-addon"] {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

.app-data-grid .app-data-grid-search-action,
body[class$="-theme"] .app-data-grid .app-data-grid-search-action {
  align-self: stretch !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-left: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--muted-foreground, #64748b) !important;
}

.app-data-grid .app-data-grid-search-action svg,
body[class$="-theme"] .app-data-grid .app-data-grid-search-action svg {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 2 !important;
}

.app-data-grid .app-data-grid-search-input,
body[class$="-theme"] .app-data-grid .app-data-grid-search-input {
  height: 34px !important;
  min-height: 34px !important;
  padding-left: 12px !important;
  padding-right: 8px !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: var(--foreground, #0f172a) !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

.app-data-grid .app-data-grid-search-input:focus,
.app-data-grid .app-data-grid-search-input:focus-visible,
body[class$="-theme"] .app-data-grid .app-data-grid-search-input:focus,
body[class$="-theme"] .app-data-grid .app-data-grid-search-input:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.app-data-grid .app-data-grid-search-input::placeholder,
body[class$="-theme"] .app-data-grid .app-data-grid-search-input::placeholder {
  color: var(--muted-foreground, #64748b) !important;
  opacity: 0.78 !important;
}

.app-data-grid .app-data-grid-search-count,
body[class$="-theme"] .app-data-grid .app-data-grid-search-count {
  color: var(--muted-foreground, #64748b) !important;
  font-size: 12px !important;
  line-height: 1 !important;
}

@media (max-width: 640px) {
  .app-data-grid [data-app-data-grid-search-control],
  body[class$="-theme"] .app-data-grid [data-app-data-grid-search-control] {
    flex-basis: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

/* USER UPDATE: render sidebar tag filters as Tremor-style compact badges, not menu rows. */
.sidebar .tag-collapsible .sidebar-collapsible-content,
body[class$="-theme"] .sidebar .tag-collapsible .sidebar-collapsible-content {
  padding: 6px 0 8px 18px !important;
  margin: 2px 0 4px 18px !important;
  border-left: 1px solid color-mix(in srgb, var(--pd-sidebar-border, #e2e8f0) 84%, transparent) !important;
  overflow: visible !important;
}

.sidebar .tag-list,
body[class$="-theme"] .sidebar .tag-list,
.app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-list,
body[class$="-theme"] .app-shell.sidebar-offcanvas-open .sidebar[data-state="expanded"] .tag-list {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

.sidebar .tag-list .tag-chip,
body[class$="-theme"] .sidebar .tag-list .tag-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 24px !important;
  height: auto !important;
  padding: 2px 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #475569 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.sidebar .tag-list .tag-chip .tag-chip-label,
body[class$="-theme"] .sidebar .tag-list .tag-chip .tag-chip-label {
  display: inline-block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar .tag-list .tag-chip .tag-chip-check,
body[class$="-theme"] .sidebar .tag-list .tag-chip .tag-chip-check {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 12px !important;
  height: 12px !important;
  color: currentColor !important;
}

.sidebar .tag-list .tag-chip .tag-chip-check svg,
body[class$="-theme"] .sidebar .tag-list .tag-chip .tag-chip-check svg {
  display: block !important;
  width: 12px !important;
  height: 12px !important;
}

.sidebar .tag-list .tag-chip .tag-chip-check path,
body[class$="-theme"] .sidebar .tag-list .tag-chip .tag-chip-check path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.4 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sidebar .tag-list .tag-chip:hover,
.sidebar .tag-list .tag-chip:focus-visible,
body[class$="-theme"] .sidebar .tag-list .tag-chip:hover,
body[class$="-theme"] .sidebar .tag-list .tag-chip:focus-visible {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  box-shadow: none !important;
}

.sidebar .tag-list .tag-chip.active,
.sidebar .tag-list .tag-chip[aria-pressed="true"],
.sidebar .tag-list .tag-chip[data-active="true"],
body[class$="-theme"] .sidebar .tag-list .tag-chip.active,
body[class$="-theme"] .sidebar .tag-list .tag-chip[aria-pressed="true"],
body[class$="-theme"] .sidebar .tag-list .tag-chip[data-active="true"] {
  border-color: #6b7280 !important;
  background: #6b7280 !important;
  color: #ffffff !important;
}

.sidebar .tag-list .tag-chip.active:hover,
.sidebar .tag-list .tag-chip.active:focus-visible,
.sidebar .tag-list .tag-chip[aria-pressed="true"]:hover,
.sidebar .tag-list .tag-chip[aria-pressed="true"]:focus-visible,
.sidebar .tag-list .tag-chip[data-active="true"]:hover,
.sidebar .tag-list .tag-chip[data-active="true"]:focus-visible,
body[class$="-theme"] .sidebar .tag-list .tag-chip.active:hover,
body[class$="-theme"] .sidebar .tag-list .tag-chip.active:focus-visible,
body[class$="-theme"] .sidebar .tag-list .tag-chip[aria-pressed="true"]:hover,
body[class$="-theme"] .sidebar .tag-list .tag-chip[aria-pressed="true"]:focus-visible,
body[class$="-theme"] .sidebar .tag-list .tag-chip[data-active="true"]:hover,
body[class$="-theme"] .sidebar .tag-list .tag-chip[data-active="true"]:focus-visible {
  border-color: #4b5563 !important;
  background: #4b5563 !important;
  color: #ffffff !important;
}

.sidebar .tag-list .tag-reset-chip,
body[class$="-theme"] .sidebar .tag-list .tag-reset-chip {
  border-style: solid !important;
  border-color: #e2e8f0 !important;
  background: #f8fafc !important;
  color: #475569 !important;
  font-weight: 650 !important;
}

.sidebar .tag-list .tag-reset-chip:hover,
.sidebar .tag-list .tag-reset-chip:focus-visible,
body[class$="-theme"] .sidebar .tag-list .tag-reset-chip:hover,
body[class$="-theme"] .sidebar .tag-list .tag-reset-chip:focus-visible {
  color: var(--pd-sidebar-primary, #2563eb) !important;
}

/* USER UPDATE: document drawer delete/save should be a flat footer row, not legacy filled buttons. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions {
  position: relative !important;
  bottom: auto !important;
  z-index: 12 !important;
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 22px !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 0 20px !important;
  min-height: 48px !important;
  border-top: 1px solid #e5e7eb !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #475569 !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton {
  color: #dc2626 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > .primary-action[type="submit"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > .primary-action[type="submit"] {
  color: #0f172a !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > button:focus-visible {
  background: transparent !important;
  color: #0f172a !important;
  text-decoration: underline !important;
  text-underline-offset: 6px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-bottom-actions > #deleteButton:focus-visible {
  color: #b91c1c !important;
}

/* USER UPDATE: final document drawer action reset.
   This intentionally targets the existing save/delete anchors by exact form
   context so old .primary-action/.secondary-action button skins cannot win. */
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 24px !important;
  width: 100% !important;
  min-height: 50px !important;
  margin: 10px 0 0 !important;
  padding: 0 22px !important;
  border: 0 !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"] {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 50px !important;
  min-height: 50px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #0f172a !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete {
  color: #dc2626 !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete::before,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete::after,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::before,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::after {
  content: none !important;
  display: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:hover,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:focus-visible,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:hover,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  text-decoration: underline !important;
  text-underline-offset: 6px !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:hover,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:focus-visible {
  color: #b91c1c !important;
}

/* Right drawer Files tab upload surface */
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .right-detail-files-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .right-detail-files-section {
  gap: 16px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card {
  display: grid !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header {
  display: grid !important;
  gap: 2px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header span {
  color: #0f172a !important;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header small,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header small {
  color: #64748b !important;
  font-size: 0.8rem !important;
  line-height: 1.35 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone {
  display: grid !important;
  min-height: 188px !important;
  place-items: center !important;
  gap: 12px !important;
  padding: 28px 18px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 14px !important;
  background: #fbfdff !important;
  color: #0f172a !important;
  text-align: center !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone:focus-visible,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card.is-dragging .document-file-dropzone,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card.is-drag-over .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone:focus-visible {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-icon {
  display: inline-grid !important;
  width: 48px !important;
  height: 48px !important;
  place-items: center !important;
  border-radius: 16px !important;
  background: #eef2f7 !important;
  color: #94a3b8 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-icon svg,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-icon svg {
  width: 32px !important;
  height: 32px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy {
  display: grid !important;
  gap: 4px !important;
  justify-items: center !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy strong,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy strong {
  color: #0f172a !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy strong span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy strong span {
  color: #2563eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy small,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy small {
  color: #64748b !important;
  font-size: 0.78rem !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-paste-hint,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-paste-hint {
  color: #64748b !important;
  font-size: 0.72rem !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-paste-hint kbd,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-paste-hint kbd {
  display: inline-flex !important;
  min-width: 18px !important;
  height: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 4px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  color: #475569 !important;
  font-size: 0.68rem !important;
  font-family: inherit !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-current {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  min-height: 52px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 0 !important;
  border-width: 1px 0 !important;
  border-style: solid !important;
  border-color: #e5e7eb !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] #removeAttachmentButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] #removeAttachmentButton {
  grid-column: 1 / -1 !important;
  border-color: #fecaca !important;
  color: #dc2626 !important;
  background: #ffffff !important;
}

/* USER UPDATE: document drawer save action uses compact icon button. */
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"] {
  position: relative !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08) !important;
  text-decoration: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:hover,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:focus-visible {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.12) !important;
  outline: none !important;
  text-decoration: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:focus-visible {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2), 0 3px 10px rgba(15, 23, 42, 0.12) !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"] > .detail-save-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::before {
  content: none !important;
  display: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::after {
  content: attr(data-tooltip) !important;
  display: block !important;
  position: absolute !important;
  bottom: calc(100% + 8px) !important;
  left: 50% !important;
  z-index: 30 !important;
  transform: translateX(-50%) translateY(2px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  padding: 4px 7px !important;
  border-radius: 7px !important;
  background: #0f172a !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18) !important;
  transition: opacity 120ms ease, transform 120ms ease !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:hover::after,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]:focus-visible::after {
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) !important;
}

/* USER UPDATE: split document drawer footer actions into three equal tab-style parts. */
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: center !important;
  justify-content: stretch !important;
  column-gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 58px !important;
  margin: auto 0 0 !important;
  padding: 0 20px !important;
  border-top: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close {
  grid-column: 1 !important;
  justify-self: stretch !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #334155 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete {
  grid-column: 2 !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  gap: 7px !important;
  white-space: nowrap !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"] {
  grid-column: 3 !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  gap: 8px !important;
  white-space: nowrap !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::after {
  content: none !important;
  display: none !important;
}

/* USER UPDATE: right-detail tab navigation gets a persistent horizontal guide line. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  position: relative !important;
  border-bottom: 0 !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before {
  content: "" !important;
  position: absolute !important;
  right: 12px !important;
  bottom: 0 !important;
  left: 12px !important;
  z-index: 0 !important;
  height: 1px !important;
  background: #2563eb !important;
  pointer-events: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab {
  position: relative !important;
  z-index: 1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after {
  z-index: 2 !important;
}

/* USER UPDATE: Files tab upload header and completed file row use full drawer width. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header {
  justify-items: stretch !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: normal !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section .document-file-current {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section .document-file-current > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section .document-file-current > .attachment-status {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* USER UPDATE: compact History tab content so metadata does not stretch vertically. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory {
  align-content: start !important;
  gap: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .right-detail-history-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .right-detail-history-section {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 14px !important;
  min-height: 0 !important;
  height: auto !important;
  padding-bottom: 14px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .right-detail-section-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .right-detail-section-header {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta > div,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 38px !important;
  padding: 9px 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta span,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta strong,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelHistory .record-meta strong {
  min-width: 0 !important;
  line-height: 1.35 !important;
}

/* USER UPDATE: compact Details and Files tab content like History. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles {
  align-content: start !important;
  grid-auto-rows: max-content !important;
  gap: 12px !important;
  min-height: 0 !important;
  height: auto !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails .right-detail-section,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails .right-detail-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section {
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 10px !important;
  min-height: 0 !important;
  height: auto !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails .right-detail-section-header,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails .right-detail-section-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section-header {
  min-height: 0 !important;
  margin: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails .right-detail-field-grid,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelDetails .right-detail-field-grid {
  align-content: start !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card {
  align-content: start !important;
}

/* USER UPDATE: show all Files actions directly below the tab navigation. */
#itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  display: none !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-bottom: 1px solid #2563eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group {
  display: grid !important;
}

#itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 0 !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  cursor: pointer !important;
}

#itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:hover,
#itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:focus-visible,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:hover,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:focus-visible {
  color: #2563eb !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions .document-file-action-icon,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions .document-file-action-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

#itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions .document-file-group-separator,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions .document-file-group-separator {
  display: none !important;
}

/* USER UPDATE: right drawer tabs use a tab-navigation underline guide. */
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  position: relative !important;
  border-bottom: 1px solid #e5e7eb !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab {
  overflow: visible !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after {
  right: auto !important;
  bottom: -1px !important;
  left: 50% !important;
  width: 58px !important;
  transform: translateX(-50%) !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="files"]::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="files"]::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="files"]::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="files"]::after {
  width: 44px !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="finance"]::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="finance"]::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="finance"]::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[data-right-detail-tab="finance"]::after {
  width: 64px !important;
}

/* USER UPDATE: AppDataGrid search uses a clearable tag-input surface. */
.app-data-grid [data-app-data-grid-search-control],
body[class$="-theme"] .app-data-grid [data-app-data-grid-search-control] {
  flex: 0 1 340px !important;
  width: min(100%, 340px) !important;
  min-width: min(100%, 240px) !important;
  max-width: 340px !important;
}

.app-data-grid .app-data-grid-tags-search,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  width: 100% !important;
  min-height: 36px !important;
  padding: 4px 6px 4px 8px !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 10px !important;
  background: var(--background, #ffffff) !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03) !important;
}

.app-data-grid .app-data-grid-tags-search:focus-within,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search:focus-within {
  border-color: #cbd5e1 !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03) !important;
}

.app-data-grid .app-data-grid-search-chip-list,
body[class$="-theme"] .app-data-grid .app-data-grid-search-chip-list {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

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

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

.app-data-grid .app-data-grid-tags-search .app-data-grid-search-input,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-input {
  flex: 1 1 86px !important;
  width: auto !important;
  min-width: 64px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 4px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: var(--foreground, #0f172a) !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

.app-data-grid .app-data-grid-tags-search .app-data-grid-search-input:focus,
.app-data-grid .app-data-grid-tags-search .app-data-grid-search-input:focus-visible,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-input:focus,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-input:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.app-data-grid .app-data-grid-tags-search .app-data-grid-search-input::placeholder,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-input::placeholder {
  color: var(--muted-foreground, #64748b) !important;
  opacity: 0.78 !important;
}

.app-data-grid .app-data-grid-tags-search .app-data-grid-search-action,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-action {
  display: inline-flex !important;
  flex: 0 0 28px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  margin-left: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--muted-foreground, #64748b) !important;
}

.app-data-grid .app-data-grid-tags-search .app-data-grid-search-action:hover,
.app-data-grid .app-data-grid-tags-search .app-data-grid-search-action:focus-visible,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-action:hover,
body[class$="-theme"] .app-data-grid .app-data-grid-tags-search .app-data-grid-search-action:focus-visible {
  color: var(--foreground, #0f172a) !important;
  outline: 0 !important;
}

/* USER UPDATE: document drawer header title should consume available width.
   Static equivalent of flex w-full items-start justify-between gap-4 with
   min-w-0 flex-1 on the text group and shrink-0 on the action group. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child {
  flex: 1 1 0% !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > .detail-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > .detail-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > .detail-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > .detail-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > .detail-actions,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > .detail-actions {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2 {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding-block: 0.08em 0.14em !important;
  overflow: visible !important;
  line-height: 1.38 !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: break-word !important;
}

/* Shadcn-style AlertDialog treatment for unsaved-change decisions. */
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog {
  inset: 50% auto auto 50% !important;
  width: min(424px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid hsl(240 5.9% 90%) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  color: #09090b !important;
  overflow: hidden !important;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.16), 0 0 0 1px rgba(15, 23, 42, 0.02) !important;
  transform: translate(-50%, -50%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog::backdrop {
  background: rgba(244, 244, 245, 0.72) !important;
  backdrop-filter: blur(8px) saturate(110%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-panel {
  display: block !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-icon {
  display: none !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy {
  display: block !important;
  min-width: 0 !important;
  padding: 22px 20px 18px !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy strong {
  display: block !important;
  margin: 0 0 8px !important;
  color: #09090b !important;
  font-family: Inter, var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy span {
  display: block !important;
  color: #71717a !important;
  font-family: Inter, var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.45 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 16px 20px !important;
  border-top: 1px solid #e4e4e7 !important;
  background: #fafafa !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 72px !important;
  height: 36px !important;
  padding: 0 14px !important;
  border: 1px solid #e4e4e7 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: #09090b !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  font-family: Inter, var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button:hover {
  background: #f4f4f5 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button:focus-visible {
  outline: 2px solid #18181b !important;
  outline-offset: 2px !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-cancel {
  order: 1 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-discard,
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-discard-action {
  order: 2 !important;
  border-color: #fecaca !important;
  color: #dc2626 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-discard:hover,
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-discard-action:hover {
  border-color: #fca5a5 !important;
  background: #fef2f2 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-save {
  order: 3 !important;
  border-color: #09090b !important;
  background: #09090b !important;
  color: #ffffff !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-save:hover {
  border-color: #18181b !important;
  background: #18181b !important;
}

@media (max-width: 480px) {
  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions {
    padding: 14px !important;
  }

  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button {
    min-width: 0 !important;
    flex: 1 1 0 !important;
  }
}
/* Final shadcn AlertDialog pass for unsaved-change decisions. */
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog {
  width: min(424px, calc(100vw - 32px)) !important;
  max-width: min(424px, calc(100vw - 32px)) !important;
  padding: 0 !important;
  border: 1px solid hsl(240 5.9% 90%) !important;
  border-radius: 14px !important;
  background: hsl(0 0% 100%) !important;
  color: hsl(240 10% 3.9%) !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.2), 0 2px 10px rgba(15, 23, 42, 0.08) !important;
  overflow: hidden !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog::backdrop {
  background: rgba(244, 244, 245, 0.72) !important;
  -webkit-backdrop-filter: blur(8px) saturate(90%);
  backdrop-filter: blur(8px) saturate(90%);
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-content {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-icon {
  display: none !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-copy {
  padding: 20px 20px 18px !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-title {
  margin: 0 0 6px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-description {
  margin: 0 !important;
  color: hsl(240 3.8% 46.1%) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 16px 20px !important;
  border-top: 1px solid hsl(240 5.9% 90%) !important;
  background: hsl(0 0% 98%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button {
  height: 36px !important;
  min-width: 0 !important;
  padding: 0 14px !important;
  border: 1px solid hsl(240 5.9% 90%) !important;
  border-radius: 10px !important;
  background: hsl(0 0% 100%) !important;
  color: hsl(240 10% 3.9%) !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .primary-action,
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-save {
  order: 3;
  border-color: hsl(240 5.9% 10%) !important;
  background: hsl(240 5.9% 10%) !important;
  color: hsl(0 0% 98%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-discard-action,
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-discard,
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .danger-action {
  order: 2;
  border-color: hsl(0 84.2% 80%) !important;
  color: hsl(0 72.2% 50.6%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-action-cancel,
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .secondary-action {
  order: 1;
}

@media (max-width: 520px) {
  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions {
    justify-content: stretch !important;
  }

  .paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-unsaved-changes-dialog .paperdesk-decision-actions button {
    flex: 1 1 0 !important;
  }
}

/* Destructive delete confirmation: compact shadcn AlertDialog-style modal. */
.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog {
  width: min(360px, calc(100vw - 32px)) !important;
  max-width: min(360px, calc(100vw - 32px)) !important;
  padding: 0 !important;
  border: 1px solid hsl(240 5.9% 90%) !important;
  border-radius: 12px !important;
  background: hsl(0 0% 100%) !important;
  color: hsl(240 10% 3.9%) !important;
  box-shadow: 0 22px 64px rgba(15, 23, 42, 0.2), 0 2px 10px rgba(15, 23, 42, 0.08) !important;
  overflow: hidden !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog::backdrop {
  background: rgba(244, 244, 245, 0.72) !important;
  -webkit-backdrop-filter: blur(8px) saturate(90%);
  backdrop-filter: blur(8px) saturate(90%);
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-media {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  margin: 20px auto 10px !important;
  border-radius: 12px !important;
  background: hsl(0 84.2% 60.2% / 0.12) !important;
  color: hsl(0 72.2% 50.6%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-media svg {
  width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  align-items: center !important;
  padding: 0 24px 22px !important;
  text-align: center !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-copy strong {
  margin: 0 !important;
  color: hsl(240 10% 3.9%) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-copy span {
  margin: 0 !important;
  color: hsl(240 3.8% 46.1%) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 14px 18px !important;
  border-top: 1px solid hsl(240 5.9% 90%) !important;
  background: hsl(0 0% 98%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .paperdesk-decision-actions button {
  height: 34px !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  border: 1px solid hsl(240 5.9% 90%) !important;
  border-radius: 9px !important;
  background: hsl(0 0% 100%) !important;
  color: hsl(240 10% 3.9%) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .danger-action {
  border-color: transparent !important;
  background: hsl(0 84.2% 60.2% / 0.14) !important;
  color: hsl(0 72.2% 50.6%) !important;
}

.paperdesk-decision-dialog.reui-sonner-confirm.paperdesk-delete-confirm-dialog .danger-action:hover {
  background: hsl(0 84.2% 60.2% / 0.2) !important;
}

/* Compact shadcn-style switches for the settings modal. */
#settingsDialog.settings-dialog {
  --pd-switch-width: 28px;
  --pd-switch-height: 16px;
  --pd-switch-thumb: 14px;
}

#settingsDialog.settings-dialog .settings-checkbox {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #18181b !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}

#settingsDialog.settings-dialog .settings-checkbox input[type="checkbox"] {
  width: var(--pd-switch-width) !important;
  min-width: var(--pd-switch-width) !important;
  max-width: var(--pd-switch-width) !important;
  height: var(--pd-switch-height) !important;
  min-height: var(--pd-switch-height) !important;
  max-height: var(--pd-switch-height) !important;
  flex: 0 0 var(--pd-switch-width) !important;
}

#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox,
#settingsDialog.settings-dialog .settings-panel .column-settings-toggle-group .settings-checkbox,
#settingsDialog.settings-dialog .settings-panel .column-settings-advanced-group .settings-checkbox {
  min-height: 20px !important;
}

#settingsDialog.settings-dialog .settings-panel .column-settings-toggle-group,
#settingsDialog.settings-dialog .settings-panel .column-validation-controls {
  gap: 6px 10px !important;
  align-items: center !important;
}

/* Right detail Files tab: all file actions are visible, no overflow menu. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  display: none !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 44px !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-bottom: 1px solid #2563eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group {
  display: grid !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  gap: 4px !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button > span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button > span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:first-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:first-child {
  border-radius: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:hover {
  background: transparent !important;
  color: #2563eb !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton {
  color: #dc2626 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton:hover {
  color: #b91c1c !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:disabled,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:disabled {
  opacity: 0.5 !important;
}

.document-file-action-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.document-file-group-separator {
  display: none !important;
}

/* USER UPDATE: Tremor-style document file upload with read-only attachment path. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field input[readonly],
.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field textarea[readonly],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field input[readonly],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field textarea[readonly] {
  min-height: 38px !important;
  resize: none !important;
  cursor: default !important;
  background: #f8fafc !important;
  color: #475569 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .detail-field-resize-handle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .detail-field-resize-handle {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 188px !important;
  padding: 30px 18px !important;
  justify-items: center !important;
  align-content: center !important;
  overflow: hidden !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy strong,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-dropzone-copy strong {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0 4px !important;
  max-width: 100% !important;
  text-align: center !important;
  overflow-wrap: anywhere !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section h4,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section h4 {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-list-section .document-file-current {
  min-height: 48px !important;
  padding: 8px 0 10px !important;
  border-width: 0 0 1px 0 !important;
  background: transparent !important;
}

/* USER UPDATE: document drawer editable tags and compact one-line text fields. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field.detail-tag-entry-mode,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-field.detail-tag-entry-mode {
  display: grid !important;
  gap: 6px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-source,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-source {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-row,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 6px !important;
  width: 100% !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-input,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-entry-input {
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 6px 10px !important;
  resize: none !important;
  overflow: hidden !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-add-button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-add-button {
  display: inline-grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-add-button:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-add-button:hover {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-add-button:disabled,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-add-button:disabled {
  opacity: 0.48 !important;
  cursor: not-allowed !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-list,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-list[hidden],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-list[hidden] {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  max-width: 100% !important;
  min-height: 28px !important;
  padding: 0 8px !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  font-size: 0.86rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-text,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove {
  display: inline-grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  font-size: 13px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .tag-field-resize-handle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .tag-field-resize-handle {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"] {
  min-height: 38px !important;
}

/* USER UPDATE: document drawer footer actions mirror the right-detail tab navigation style in three parts. */
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 0 !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border-top: 1px solid #dbeafe !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 1 auto !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #64748b !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete {
  width: 100% !important;
  color: #64748b !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"] {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-left: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #64748b !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-open #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-closing #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body[class$="-theme"] #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button:hover,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button:focus-visible {
  color: #2563eb !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:hover,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:focus-visible {
  color: #dc2626 !important;
}

#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::before,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"]::after,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete::before,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete::after,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close::before,
#itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-close::after {
  content: none !important;
  display: none !important;
}

/* USER UPDATE: completed upload row is inline content, not a shell/card row. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status {
  margin: 0 !important;
  padding: 0 !important;
}

/* USER UPDATE: remove legacy narrow text limits from the Files tab content. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card,
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-items: start !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-files-card-header > small {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: normal !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 10px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* USER UPDATE: right-detail tabs use a visible baseline plus active tab guide. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  position: relative !important;
  border-bottom: 1px solid #dbeafe !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before {
  content: "" !important;
  position: absolute !important;
  right: 16px !important;
  bottom: -1px !important;
  left: 16px !important;
  z-index: 1 !important;
  display: block !important;
  height: 1px !important;
  background: #dbeafe !important;
  pointer-events: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab.is-active::after {
  display: block !important;
  bottom: -1px !important;
  z-index: 2 !important;
  background: #2563eb !important;
}

/* USER UPDATE: Reference / number is single-line and not field-resizable. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"],
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="numberInput"] {
  min-height: 38px !important;
  height: 38px !important;
  resize: none !important;
  overflow: hidden !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="numberInput"]) > .detail-field-resize-handle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="numberInput"]) > .detail-field-resize-handle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="numberInput"]) > .detail-field-resize-handle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="numberInput"]) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="numberInput"]) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="numberInput"]) > .detail-field-resize-handle {
  display: none !important;
}

/* USER UPDATE: right detail section headers collapse metadata until the title is clicked. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  white-space: normal !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header:focus-visible,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header:focus-visible,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header:focus-visible,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header:focus-visible,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header:focus-visible {
  border-radius: 6px !important;
  outline: 2px solid #2563eb !important;
  outline-offset: 3px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header h3 {
  order: 1 !important;
  flex: 1 1 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.2 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-kicker {
  display: none !important;
  order: 2 !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  margin: 4px 0 0 !important;
  padding-left: 0 !important;
  border-left: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
  color: #64748b !important;
  font-size: 0.78rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header p {
  display: none !important;
  order: 3 !important;
  flex: 1 1 100% !important;
  min-width: 0 !important;
  margin: 3px 0 0 !important;
  padding-left: 0 !important;
  border-left: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded {
  flex-wrap: wrap !important;
  row-gap: 4px !important;
  column-gap: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3 {
  flex: 0 0 auto !important;
  max-width: none !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker {
  display: inline-flex !important;
  align-items: baseline !important;
  margin: 0 0 0 8px !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before {
  content: "|" !important;
  margin-right: 8px !important;
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p {
  display: inline !important;
  flex: 0 1 auto !important;
  margin: 0 0 0 8px !important;
  white-space: normal !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before {
  content: "|" !important;
  margin-right: 8px !important;
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

/* AppDataGrid pagination page-number input needs foreground contrast. */
[data-app-data-grid-page-input],
input[aria-label^="Go to page"] {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  opacity: 1 !important;
}

/* USER UPDATE: compact animated text-loop wordmark on the right edge of the top toolbar. */
.toolbar > .toolbar-text-loop,
body[class$="-theme"] .toolbar > .toolbar-text-loop {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: calc(18ch + 24px) !important;
  width: auto !important;
  max-width: none !important;
  height: 30px !important;
  margin-left: auto !important;
  padding: 0 11px !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--pd-app-frame-border-soft, #e5e7eb) 76%, transparent) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(90deg, rgba(37, 99, 235, 0.06), rgba(124, 58, 237, 0.08), rgba(14, 165, 233, 0.05)) !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04) !important;
  appearance: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

.toolbar > .toolbar-text-loop + .toolbar-actions,
body[class$="-theme"] .toolbar > .toolbar-text-loop + .toolbar-actions {
  margin-left: 8px !important;
}

.toolbar .toolbar-text-loop-stage,
body[class$="-theme"] .toolbar .toolbar-text-loop-stage {
  --toolbar-text-loop-width: 18ch;
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  min-width: var(--toolbar-text-loop-width) !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.toolbar .toolbar-text-loop-text,
body[class$="-theme"] .toolbar .toolbar-text-loop-text {
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
  white-space: nowrap !important;
  background: linear-gradient(90deg, #0f172a 0%, #2563eb 36%, #7c3aed 68%, #0ea5e9 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  font-family: "Inter Latin", "Inter Variable", Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: lowercase !important;
  animation: toolbarTextLoopGradient 5.6s linear infinite !important;
}

.toolbar .toolbar-text-loop-cursor,
body[class$="-theme"] .toolbar .toolbar-text-loop-cursor {
  display: none !important;
  flex: 0 0 auto !important;
  width: 2px !important;
  height: 16px !important;
  margin-left: 2px !important;
  border-radius: 999px !important;
  background: #7c3aed !important;
  animation: toolbarTextLoopCursor 0.9s steps(2, start) infinite !important;
}

@keyframes toolbarTextLoopType {
  0%,
  8% {
    width: 0;
  }
  44%,
  72% {
    width: var(--toolbar-text-loop-width);
  }
  94%,
  100% {
    width: 0;
  }
}

@keyframes toolbarTextLoopGradient {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 220% 50%;
  }
}

@keyframes toolbarTextLoopCursor {
  0%,
  45% {
    opacity: 1;
  }
  46%,
  100% {
    opacity: 0;
  }
}

@media (max-width: 980px) {
  .toolbar > .toolbar-text-loop,
  body[class$="-theme"] .toolbar > .toolbar-text-loop {
    display: none !important;
  }

  .toolbar > .toolbar-text-loop + .toolbar-actions,
  body[class$="-theme"] .toolbar > .toolbar-text-loop + .toolbar-actions {
    margin-left: auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .toolbar .toolbar-text-loop-text,
  body[class$="-theme"] .toolbar .toolbar-text-loop-text {
    width: var(--toolbar-text-loop-width) !important;
    animation: none !important;
  }

  .toolbar .toolbar-text-loop-cursor,
  body[class$="-theme"] .toolbar .toolbar-text-loop-cursor {
    display: none !important;
    animation: none !important;
  }
}

/* USER UPDATE: move the animated toolbar wordmark to the far right edge. */
.toolbar > .toolbar-actions,
body[class$="-theme"] .toolbar > .toolbar-actions {
  order: 90 !important;
  margin-left: auto !important;
}

.toolbar > .toolbar-text-loop,
body[class$="-theme"] .toolbar > .toolbar-text-loop {
  order: 100 !important;
  margin-left: 8px !important;
  margin-right: 0 !important;
}

.toolbar > .toolbar-text-loop + .toolbar-actions,
body[class$="-theme"] .toolbar > .toolbar-text-loop + .toolbar-actions {
  margin-left: auto !important;
}

/* USER UPDATE: make the toolbar wordmark clickable and toggle a Mantine-style workspace overlay. */
.workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] {
  position: relative !important;
}

/* USER FIX: shadcn main inset keeps rounded unboxed app shell corners. */
.workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] {
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.workspace[data-slot="sidebar-inset"] > .toolbar,
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] > .toolbar {
  position: relative !important;
  z-index: 90 !important;
}

/* USER FIX: shadcn toolbar bottom divider only.
   The SidebarInset header should not inherit legacy boxed toolbar borders. */
.workspace[data-slot="sidebar-inset"] > .toolbar,
body[class$="-theme"] .workspace[data-slot="sidebar-inset"] > .toolbar {
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid var(--pd-app-frame-border-soft, #e5e7eb) !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.toolbar > .toolbar-text-loop:focus-visible,
body[class$="-theme"] .toolbar > .toolbar-text-loop:focus-visible {
  outline: 2px solid #2563eb !important;
  outline-offset: 2px !important;
}

.toolbar > .toolbar-text-loop[aria-pressed="true"],
body[class$="-theme"] .toolbar > .toolbar-text-loop[aria-pressed="true"] {
  border-color: color-mix(in srgb, #2563eb 36%, var(--pd-app-frame-border-soft, #e5e7eb)) !important;
  box-shadow:
    0 8px 22px rgba(37, 99, 235, 0.12),
    0 0 0 1px rgba(37, 99, 235, 0.08) !important;
}

.workspace-click-overlay,
body[class$="-theme"] .workspace-click-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482500 !important;
  display: block !important;
  border-radius: 0 !important;
  background-color: rgba(15, 23, 42, 0.44) !important;
  backdrop-filter: blur(2px) saturate(0.96) !important;
  -webkit-backdrop-filter: blur(2px) saturate(0.96) !important;
  opacity: 1 !important;
  transition: opacity 160ms ease !important;
  pointer-events: auto !important;
}

.workspace-click-overlay[hidden],
body[class$="-theme"] .workspace-click-overlay[hidden] {
  display: none !important;
}

body.workspace-overlay-open .workspace[data-slot="sidebar-inset"] > .content-grid,
body[class$="-theme"].workspace-overlay-open .workspace[data-slot="sidebar-inset"] > .content-grid {
  user-select: none !important;
}

/* Shared right-detail shell for non-document menu forms.
   Documents remains the benchmark; Officials and generic menu details reuse the
   same header, tab, field, and footer metrics without changing their data logic. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100% !important;
  height: 100% !important;
  gap: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 !important;
  background: #fff !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form][hidden] {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 22px 28px 18px !important;
  border-bottom: 1px solid #e5eaf2 !important;
  background: #fff !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading .eyebrow {
  margin: 0 0 6px !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading h2 {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: clamp(1.45rem, 2.1vw, 1.95rem) !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle {
  margin: 8px 0 0 !important;
  color: #64748b !important;
  font-size: 0.86rem !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: 10px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  max-width: 100% !important;
  padding: 2px 9px !important;
  border: 1px solid #dbe5f3 !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 0.74rem !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading .detail-quick-action-group,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading [data-detail-drawer-close] {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-actions {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  margin: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs {
  position: relative !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 28px !important;
  border-bottom: 1px solid #e5eaf2 !important;
  background: #fff !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before {
  content: "" !important;
  position: absolute !important;
  right: 28px !important;
  bottom: -1px !important;
  left: 28px !important;
  z-index: 1 !important;
  display: block !important;
  height: 1px !important;
  background: #dbeafe !important;
  pointer-events: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 44px !important;
  padding: 0 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #475569 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  cursor: default !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab.is-active {
  color: #2563eb !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab.is-active::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: #2563eb !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-section-header,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .inspector-detail-section-header,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .placeholder-detail-section-header {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: baseline !important;
  gap: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 18px 28px 10px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header h3 {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 42% !important;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  order: 1 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header .right-detail-section-kicker {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  margin-left: 8px !important;
  padding-left: 8px !important;
  border-left: 1px solid #cbd5e1 !important;
  color: #64748b !important;
  font-size: 0.78rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  order: 2 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header p {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 0 0 8px !important;
  padding-left: 8px !important;
  border-left: 1px solid #cbd5e1 !important;
  color: #64748b !important;
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  order: 3 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header h3::after,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header .right-detail-section-kicker::after {
  content: none !important;
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .inspector-fields,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > label,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .photo-detail-panel,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .attachment-tools,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .attachment-status,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .record-meta {
  margin-right: 28px !important;
  margin-left: 28px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .inspector-fields {
  display: grid !important;
  gap: 12px !important;
  padding: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .inspector-fields label {
  display: grid !important;
  gap: 6px !important;
  margin-top: 0 !important;
  color: #334155 !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input:not(.right-detail-wrap-source),
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] select {
  width: 100% !important;
  min-height: 38px !important;
  border: 1px solid #d8e2f0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #0f172a !important;
  font-size: 0.86rem !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea {
  min-height: 44px !important;
  resize: vertical !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .photo-detail-panel {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 12px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .attachment-tools {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 8px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .secondary-action,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .primary-action,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .icon-button {
  min-height: 32px !important;
  border-radius: 8px !important;
  font-size: 0.78rem !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .record-meta {
  display: grid !important;
  gap: 10px !important;
  padding: 14px 0 22px !important;
  border-top: 1px solid #eef2f7 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .record-meta > div {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 30px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .form-actions,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions {
  order: 999 !important;
  position: sticky !important;
  top: auto !important;
  bottom: 0 !important;
  z-index: 12 !important;
  flex: 0 0 auto !important;
  margin: auto 0 0 !important;
  padding: 0 12px !important;
  border-top: 1px solid #dbeafe !important;
  border-bottom: 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 -8px 20px rgba(15, 23, 42, 0.04) !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions {
  display: block !important;
  padding: 0 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions > .right-detail-bottom-actions {
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  z-index: auto !important;
  margin: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  min-height: 44px !important;
  gap: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-action,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] button.right-detail-footer-action,
.detail-panel #deleteInspectorButton.right-detail-footer-action,
.detail-panel #deleteWorkItemButton.right-detail-footer-action {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 1 auto !important;
  gap: 5px !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  text-transform: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-action:hover,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-action:focus-visible {
  color: #2563eb !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-delete:hover,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-delete:focus-visible {
  color: #dc2626 !important;
  background: transparent !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-action::before,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-footer-action::after,
.detail-panel #deleteInspectorButton.right-detail-footer-action::before,
.detail-panel #deleteInspectorButton.right-detail-footer-action::after,
.detail-panel #deleteWorkItemButton.right-detail-footer-action::before,
.detail-panel #deleteWorkItemButton.right-detail-footer-action::after,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] button.detail-save-icon-button[type="submit"]::before,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] button.detail-save-icon-button[type="submit"]::after {
  content: none !important;
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-action-icon,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-save-icon,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form] .document-form-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-top: 1px solid #eef2f7 !important;
  background: #fff !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form] .document-form-actions:empty {
  display: none !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form] .document-form-actions:not(:has(button:not([hidden]))) {
  display: none !important;
}

/* USER UPDATE: align every non-document right drawer to the document drawer shell.
   This keeps menu-specific fields/actions intact while matching the benchmark
   document drawer rhythm for header, tabs, content gutters, and footer. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] {
  min-height: 100% !important;
  height: auto !important;
  padding: 0 !important;
  color: #0f172a !important;
  background: #fff !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading {
  position: sticky !important;
  top: 0 !important;
  z-index: 8 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
  padding: 18px 18px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child {
  display: grid !important;
  min-width: 0 !important;
  gap: 7px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading .eyebrow,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading .eyebrow {
  display: block !important;
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading h2,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading h2 {
  margin: 0 !important;
  max-width: none !important;
  color: #0f172a !important;
  font-size: clamp(1.18rem, 2.1vw, 1.55rem) !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle {
  margin: 0 !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta {
  margin-top: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs {
  position: sticky !important;
  top: 78px !important;
  z-index: 7 !important;
  gap: 22px !important;
  min-height: 46px !important;
  padding: 0 18px !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: rgba(255, 255, 255, 0.98) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::-webkit-scrollbar,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before {
  right: 18px !important;
  left: 18px !important;
  background: #e5e7eb !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab {
  flex: 0 0 auto !important;
  min-height: 46px !important;
  color: #64748b !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

/* USER UPDATE: officials detail tabs stay in one menu-1-style scrollable row. */
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .right-detail-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  min-height: 46px !important;
  height: 46px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .right-detail-tabs .right-detail-tab {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 112px !important;
  min-height: 46px !important;
  white-space: nowrap !important;
}

/* USER UPDATE: documents and tasks menu tabs stay in one menu-1-style scrollable row. */
.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] > .right-detail-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  min-height: 46px !important;
  height: 46px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] > .right-detail-tabs .right-detail-tab {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 112px !important;
  min-height: 46px !important;
  white-space: nowrap !important;
}

/* USER UPDATE: every non-document right drawer tab row uses one horizontal scroll row. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #dbeafe !important;
  background: #ffffff !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs::before {
  right: 0 !important;
  left: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 112px !important;
  min-height: 46px !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-section-header,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .inspector-detail-section-header,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .placeholder-detail-section-header,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-section-header,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .inspector-detail-section-header,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .placeholder-detail-section-header {
  padding: 16px 18px 8px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .inspector-fields,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > label,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .photo-detail-panel,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .attachment-tools,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .attachment-status,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .record-meta,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .inspector-fields,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > label,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .photo-detail-panel,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .attachment-tools,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .attachment-status,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .record-meta {
  margin-right: 18px !important;
  margin-left: 18px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .inspector-fields label,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .inspector-fields label {
  gap: 7px !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input:not(.right-detail-wrap-source),
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] select,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input:not(.right-detail-wrap-source),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] select {
  border-color: #dbe3ef !important;
  border-radius: 11px !important;
  font-size: 0.9rem !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.02) !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input:focus,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea:focus,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] select:focus,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input:focus,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea:focus,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] select:focus {
  border-color: #94a3b8 !important;
  box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.18) !important;
  outline: none !important;
}

/* USER UPDATE: final document footer reset so Close/Delete/Save share the same flat three-tab layout. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions {
  position: sticky !important;
  inset: auto auto 0 auto !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  margin: auto 0 0 !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-top: 1px solid #dbeafe !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  flex: none !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #2563eb !important;
  text-decoration: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action::before,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action::after,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action::before,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action::after,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action::after,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action::after {
  content: none !important;
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}

/* USER UPDATE: compact long document drawer title while preserving full wrapping text. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2#detailTitle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2#detailTitle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2#detailTitle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2#detailTitle,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2#detailTitle,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2#detailTitle {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-block: 0.02em 0.06em !important;
  color: #0f172a !important;
  font-size: clamp(0.98rem, 1.35vw, 1.2rem) !important;
  font-weight: 650 !important;
  line-height: 1.36 !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: break-word !important;
}

/* USER UPDATE: document drawer tabs fill edge-to-edge in three equal compartments. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #dbeafe !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs::before {
  right: 0 !important;
  left: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs .right-detail-tab {
  width: 100% !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

/* USER UPDATE: compact document footer actions edge-to-edge so the row visibly differs from old buttons. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #475569 !important;
  font: inherit !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .right-detail-action-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions .detail-save-icon {
  width: 13px !important;
  height: 13px !important;
  flex: 0 0 13px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.85 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #2563eb !important;
  text-decoration: none !important;
}

/* USER UPDATE: keep document footer Delete visually matched with Close and Save. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete {
  color: #475569 !important;
  text-decoration: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active) {
  color: #2563eb !important;
  text-decoration: none !important;
}

/* USER UPDATE: let completed upload paths use the full Files panel width before wrapping. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  align-self: stretch !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  align-items: start !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] [data-right-detail-panel="files"] .document-file-completed-list .document-file-current > .attachment-status {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  overflow: visible !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.35 !important;
  hyphens: none !important;
}

/* USER UPDATE: right detail footer labels share one sans font and title case. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.detail-save-icon-button[type="submit"] {
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action > span,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action > span,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > .right-detail-footer-action > span {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  font-style: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: none !important;
}

/* USER UPDATE: all right drawer footer actions match the legal document drawer. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions {
  position: sticky !important;
  inset: auto auto 0 auto !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions {
  display: block !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > button.right-detail-footer-action,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > .right-detail-footer-action,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > button.right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > .right-detail-footer-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > .right-detail-footer-action {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #475569 !important;
  font: inherit !important;
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-action-icon,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .detail-save-icon,
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-action-icon,
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .detail-save-icon,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-action-icon,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .detail-save-icon {
  width: 13px !important;
  height: 13px !important;
  flex: 0 0 13px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.85 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-action:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > button.right-detail-footer-action:is(:hover, :focus-visible, :active) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #2563eb !important;
  text-decoration: none !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-delete,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-delete {
  color: #475569 !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-delete:is(:hover, :focus-visible, :active) {
  color: #2563eb !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-action::before,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-action::after,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > button.right-detail-footer-action::before,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > button.right-detail-footer-action::after {
  content: none !important;
  display: none !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > .right-detail-footer-action[disabled],
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > button.right-detail-footer-action[disabled] {
  color: #94a3b8 !important;
  cursor: not-allowed !important;
  opacity: 0.65 !important;
}

/* USER UPDATE: stretch completed upload path toward the Files panel edge before wrapping. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  justify-items: stretch !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card {
  grid-template-columns: minmax(0, 1fr) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current > .attachment-status,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current > .attachment-status,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current > .attachment-status {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  min-inline-size: 0 !important;
  justify-self: stretch !important;
  overflow: visible !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  white-space: normal !important;
  hyphens: none !important;
}

/* USER UPDATE: match right detail editable tag chips to left sidebar tag badges. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 24px !important;
  height: auto !important;
  padding: 2px 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #475569 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:focus-within,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:hover,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:focus-within,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:hover,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:focus-within,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip:focus-within {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-text,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-text,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-text,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-text {
  display: inline-block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove {
  display: inline-grid !important;
  place-items: center !important;
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: currentColor !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  opacity: 0.72 !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:focus-visible,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:focus-visible,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-tag-entry-mode .detail-tag-chip-remove:focus-visible {
  background: transparent !important;
  color: currentColor !important;
  opacity: 1 !important;
}

/* USER UPDATE: keep expanded document section header metadata on one line. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: baseline !important;
  gap: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded h3 {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: baseline !important;
  min-width: 0 !important;
  margin: 0 0 0 6px !important;
  white-space: nowrap !important;
  font-size: 0.74rem !important;
  line-height: 1.2 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded .right-detail-section-kicker::before {
  margin-right: 6px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p {
  display: inline-block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 0 0 6px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 0.74rem !important;
  line-height: 1.2 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-section-header.is-expanded p::before {
  margin-right: 6px !important;
}

/* USER UPDATE: document title, notes, and attachment path auto-fit content instead of scrolling or manual resizing. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"],
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"] {
  min-height: 38px !important;
  max-height: none !important;
  resize: none !important;
  overflow: hidden !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput::-webkit-scrollbar,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]::-webkit-scrollbar,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput::-webkit-scrollbar,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]::-webkit-scrollbar,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput::-webkit-scrollbar,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]::-webkit-scrollbar,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput::-webkit-scrollbar,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #notesInput::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]::-webkit-scrollbar {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> #notesInput) > .detail-field-resize-handle,
.detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]) > .detail-field-resize-handle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> #notesInput) > .detail-field-resize-handle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]) > .detail-field-resize-handle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> #notesInput) > .detail-field-resize-handle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]) > .detail-field-resize-handle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> #notesInput) > .detail-field-resize-handle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> #notesInput) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> #notesInput) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label:has(> .right-detail-wrap-textarea[data-detail-resize-key="titleInput"]) > .detail-field-resize-handle {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"],
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"] {
  min-height: 38px !important;
  max-height: none !important;
  resize: none !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  white-space: pre-wrap !important;
  word-break: normal !important;
  line-height: 1.35 !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]::-webkit-scrollbar,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]::-webkit-scrollbar,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]::-webkit-scrollbar,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]::-webkit-scrollbar,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .document-file-path-field .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]::-webkit-scrollbar {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] label.document-file-path-field:has(> .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]) > .detail-field-resize-handle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label.document-file-path-field:has(> .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]) > .detail-field-resize-handle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label.document-file-path-field:has(> .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]) > .detail-field-resize-handle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] label.document-file-path-field:has(> .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] label.document-file-path-field:has(> .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]) > .detail-field-resize-handle,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] label.document-file-path-field:has(> .right-detail-wrap-textarea[data-detail-resize-key="attachmentInput"]) > .detail-field-resize-handle {
  display: none !important;
}

/* USER UPDATE: hard-lock left shell metrics while the right detail drawer overlays; isolate the right detail drawer so it never animates the left sidebar shell. */
body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"],
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"],
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"],
body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"] > .sidebar-gap[data-slot="sidebar-gap"],
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] > .sidebar-gap[data-slot="sidebar-gap"],
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"] > .sidebar-gap[data-slot="sidebar-gap"],
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] > .sidebar-gap[data-slot="sidebar-gap"],
body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"] > .sidebar[data-slot="sidebar"],
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] > .sidebar[data-slot="sidebar"],
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"] > .sidebar[data-slot="sidebar"],
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] > .sidebar[data-slot="sidebar"],
body.right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"],
body.right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"].right-detail-drawer-open .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"].right-detail-drawer-closing .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"] {
  transition: none !important;
}

body.right-detail-drawer-open .workspace[data-slot="sidebar-inset"],
body.right-detail-drawer-closing .workspace[data-slot="sidebar-inset"],
body.right-detail-drawer-open .workspace,
body.right-detail-drawer-closing .workspace,
body:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace[data-slot="sidebar-inset"],
body:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace,
body[class$="-theme"].right-detail-drawer-open .workspace[data-slot="sidebar-inset"],
body[class$="-theme"].right-detail-drawer-closing .workspace[data-slot="sidebar-inset"],
body[class$="-theme"].right-detail-drawer-open .workspace,
body[class$="-theme"].right-detail-drawer-closing .workspace,
body[class$="-theme"]:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace[data-slot="sidebar-inset"],
body[class$="-theme"]:has(.content-grid:not(.dashboard-mode):not(.detail-collapsed)) .workspace {
  width: auto !important;
  margin-right: var(--pd-app-frame-gap, 8px) !important;
  transform: none !important;
  transition: none !important;
}

/* USER UPDATE: document file header actions use the right-detail tab visual language; Remove file is no longer visible. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: rgba(255, 255, 255, 0.98) !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"][data-active-right-detail-tab="files"] > .right-detail-file-actions.document-file-action-group {
  display: grid !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]),
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]),
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]) {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]):hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]):focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]):hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]):focus-visible {
  color: #2563eb !important;
  background: transparent !important;
  outline: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]) > span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > button:not([hidden]) > span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton[hidden],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton[hidden],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton[hidden],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton[hidden],
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton[hidden],
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group > #removeAttachmentButton[hidden] {
  display: none !important;
}

/* USER UPDATE: Tremor-like Files tab in-progress and completed upload lists. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card {
  gap: 18px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section[hidden],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section[hidden],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section[hidden],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section[hidden] {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-list-section {
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-items,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-items,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-items,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-items {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-row,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-row,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-row,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-row {
  display: grid !important;
  gap: 8px !important;
  padding: 8px 0 14px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: transparent !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-row-main,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-row-main,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-row-main,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-row-main,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current {
  min-height: 44px !important;
  padding: 6px 0 10px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-icon {
  display: inline-grid !important;
  min-width: 30px !important;
  height: 30px !important;
  place-items: center !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon[hidden],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon[hidden] {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #0f172a !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-size,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-size,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-size,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-size {
  min-height: 1em !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-line,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-line,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-line,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-line {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-track,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-track,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-track,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-track {
  display: block !important;
  height: 5px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: #bfdbfe !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-bar,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-bar,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-bar,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-bar {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: #3b82f6 !important;
  transition: width 180ms ease !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-percent,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-percent,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-percent,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-progress-percent {
  color: #475569 !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button {
  display: inline-grid !important;
  width: 28px !important;
  height: 28px !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #94a3b8 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button {
  color: #ef4444 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button:focus-visible {
  color: #475569 !important;
  background: #f1f5f9 !important;
  outline: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button:focus-visible {
  color: #dc2626 !important;
  background: #fef2f2 !important;
  outline: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button svg,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button svg,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-cancel-button svg,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button[hidden],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button[hidden],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button[hidden],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button[hidden] {
  display: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card.is-drag-over .document-file-dropzone,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card.is-drag-over .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card.is-drag-over .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card.is-drag-over .document-file-dropzone {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

/* USER UPDATE: completed upload row keeps PDF, wrapped text, and trash aligned. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: start !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current-icon,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-remove-button {
  align-self: start !important;
  justify-self: center !important;
  margin-top: 0 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-meta {
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-upload-file-name,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .attachment-status.document-upload-file-name {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.35 !important;
}

/* USER UPDATE: move Attachment path below the upload and completed file activity. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field {
  margin-top: 14px !important;
  margin-bottom: 0 !important;
}


/* USER UPDATE: document drawer header stays above tabs and file actions. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  order: 2 !important;
  top: 0 !important;
  z-index: 12 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  order: 3 !important;
  position: relative !important;
  top: auto !important;
  z-index: 8 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  order: 1 !important;
  position: relative !important;
  top: auto !important;
  z-index: 7 !important;
  padding: 14px 18px 12px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel {
  order: 4 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions {
  order: 5 !important;
}

/* USER UPDATE: keep Files-tab header rows between the document header and Document files. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  flex: 0 0 auto !important;
  position: relative !important;
  inset: auto !important;
  margin: 0 !important;
  background: #ffffff !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  order: 2 !important;
  z-index: 14 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  order: 3 !important;
  z-index: 13 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  flex: 0 0 auto !important;
  order: 1 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tab-panel {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

/* USER UPDATE: calendar filter drawer uses the shared right-detail shell.
   Keep the floating drawer look while preserving resize width persistence. */
.content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]),
body.right-detail-drawer-open .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]),
body.right-detail-drawer-closing .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]),
body[class$="-theme"] .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) {
  position: fixed !important;
  top: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  left: auto !important;
  z-index: 96 !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  width: min(var(--detail-width, 420px), calc(100vw - 32px)) !important;
  min-width: min(340px, calc(100vw - 32px)) !important;
  max-width: min(920px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 28px) !important;
  padding: 0 !important;
  border: 1px solid #d8dee8 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  overflow: hidden !important;
  animation: none !important;
}

.content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > #resizeHandle.right-navigation-resize-handle,
body.right-detail-drawer-open .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > #resizeHandle.right-navigation-resize-handle,
body.right-detail-drawer-closing .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > #resizeHandle.right-navigation-resize-handle,
body[class$="-theme"] .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > #resizeHandle.right-navigation-resize-handle {
  display: flex !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > form,
body.right-detail-drawer-open .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > form,
body.right-detail-drawer-closing .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > form,
body[class$="-theme"] .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) > form {
  display: none !important;
}

.content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) [data-calendar-right-panel],
body.right-detail-drawer-open .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) [data-calendar-right-panel],
body.right-detail-drawer-closing .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) [data-calendar-right-panel],
body[class$="-theme"] .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) [data-calendar-right-panel] {
  display: flex !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 22px 24px 24px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
}

.content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) .calendar-right-heading,
body.right-detail-drawer-open .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) .calendar-right-heading,
body.right-detail-drawer-closing .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) .calendar-right-heading,
body[class$="-theme"] .content-grid.calendar-dashboard-mode > .detail-panel.calendar-detail-mode:not([hidden]) .calendar-right-heading {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 4px 0 12px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* USER UPDATE: officials right drawer uses real six-tab panels with requested field grouping. */
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel[hidden],
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel[hidden],
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel[hidden],
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel[hidden] {
  display: none !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .right-detail-section-header,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .right-detail-history-section > .right-detail-section-header,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .right-detail-section-header,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .right-detail-section-header,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .right-detail-section-header {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-tab-fields,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-tab-fields,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-tab-fields,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-tab-fields {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* USER UPDATE: Menu 3 right drawer uses real six-tab panels with requested field grouping. */
.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] #taskFields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] #taskFields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] #taskFields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] #taskFields {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel[hidden],
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel[hidden],
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel[hidden],
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel[hidden] {
  display: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel > .right-detail-section-header,
.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel > .right-detail-history-section > .right-detail-section-header,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-detail-tab-panel > .right-detail-section-header {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-tab-fields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-tab-fields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-tab-fields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-tab-fields {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-row,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 10px 12px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-copy,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-copy {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-copy > span,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-copy > span {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  color: #64748b !important;
  font-size: 0.78rem !important;
  line-height: 1.35 !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: break-word !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions {
  display: grid !important;
  gap: 8px !important;
  align-items: start !important;
  justify-items: stretch !important;
  min-width: 86px !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions > .secondary-action,
.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions .document-form-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions > .secondary-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions .document-form-action {
  width: 100% !important;
  min-height: 34px !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions > .document-form-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-preview-detail-actions > .document-form-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 6px !important;
  padding: 0 !important;
  border-top: 0 !important;
  background: transparent !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-file-actions-panel > .document-form-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-file-actions-panel > .document-form-actions {
  padding: 0 !important;
  border-top: 0 !important;
  background: transparent !important;
}

/* USER UPDATE: Operation Tracking assignment actions use the shared Files button-row styling. */
.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-action {
  display: inline-flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 34px !important;
  padding: 7px 10px !important;
  border: 1px solid #dbe4f0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #334155 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  font-size: 0.78rem !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-action:hover,
.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-action:focus-visible,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-action:hover,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-action:focus-visible {
  border-color: #bfdbfe !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  outline: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions :is(.document-form-save-action, .document-form-print-action, .document-form-telegram-action),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions :is(.document-form-save-action, .document-form-print-action, .document-form-telegram-action) {
  border-color: #dbe4f0 !important;
  background: #ffffff !important;
  color: #334155 !important;
}

.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-save-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-save-action {
  text-transform: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-print-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-print-action {
  text-transform: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-telegram-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="operationTracking"] #workAssignmentFields > .document-form-actions .document-form-telegram-action {
  text-transform: none !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > label,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .photo-detail-panel,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .attachment-tools,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .attachment-status,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel .record-meta,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > label,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .photo-detail-panel,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .attachment-tools,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .attachment-status,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel .record-meta,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > label,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .photo-detail-panel,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .attachment-tools,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .attachment-status,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel .record-meta {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* USER UPDATE: officials photo field keeps the label outside and gives the image more room. */
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-label,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-label,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-label {
  margin: 0 0 6px !important;
  color: #1f2937 !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .photo-detail-panel,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .photo-detail-panel,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .right-detail-tab-panel > .photo-detail-panel {
  grid-template-columns: 104px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 10px 12px !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview {
  width: 96px !important;
  height: 96px !important;
  min-width: 96px !important;
  border-radius: 999px !important;
  align-self: center !important;
  border-color: #cbd5e1 !important;
  background: #ffffff !important;
  color: #2563eb !important;
  font-size: 1.55rem !important;
  line-height: 1 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06) !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview img,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview img,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview img {
  border-radius: inherit !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body {
  display: flex !important;
  min-height: 98px !important;
  align-items: stretch !important;
  justify-content: flex-end !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body > strong,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body > strong,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body > strong,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body > p,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body > p,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-body > p {
  display: none !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-tools,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-tools,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-tools {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: 86px !important;
  min-width: 0 !important;
  gap: 6px !important;
  margin-top: 0 !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-tools > .secondary-action,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-tools > .secondary-action,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-tools > .secondary-action {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 28px !important;
  padding: 3px 6px !important;
  font-size: 0.7rem !important;
  line-height: 1.1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* USER UPDATE: officials photo upload uses a circular progress ring. */
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring],
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring],
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring] {
  --photo-upload-progress: 0%;
  --photo-upload-ring-color: #2563eb;
  --photo-upload-ring-track: #dbeafe;
  box-sizing: border-box !important;
  border: 4px solid transparent !important;
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    conic-gradient(var(--photo-upload-ring-color) var(--photo-upload-progress), var(--photo-upload-ring-track) 0) border-box !important;
  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="empty"],
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="empty"],
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="empty"] {
  --photo-upload-progress: 0%;
  --photo-upload-ring-color: #93c5fd;
  --photo-upload-ring-track: #e2e8f0;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="uploading"],
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="uploading"],
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="uploading"] {
  --photo-upload-ring-color: #2563eb;
  --photo-upload-ring-track: #dbeafe;
  box-shadow: 0 0 0 5px rgba(37, 99, 235, 0.12), 0 8px 18px rgba(37, 99, 235, 0.16) !important;
  animation: officialPhotoProgressRingPulse 1100ms ease-in-out infinite !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="complete"],
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring].has-photo,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="complete"],
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring].has-photo,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="complete"],
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring].has-photo {
  --photo-upload-progress: 100%;
  --photo-upload-ring-color: #2563eb;
  --photo-upload-ring-track: #dbeafe;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring] img,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring] img,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring] img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 999px !important;
  object-fit: cover !important;
}

@keyframes officialPhotoProgressRingPulse {
  0%,
  100% {
    transform: scale(1);
    filter: saturate(1);
  }

  50% {
    transform: scale(1.025);
    filter: saturate(1.15);
  }
}

@media (prefers-reduced-motion: reduce) {
  .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="uploading"],
  body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="uploading"],
  body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .photo-detail-preview[data-photo-progress-ring][data-photo-upload-state="uploading"] {
    animation: none !important;
  }
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-profile-info-row,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-discipline-detail-row,
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-composition-detail-row,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-profile-info-row,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-discipline-detail-row,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-composition-detail-row,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-profile-info-row,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-discipline-detail-row,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] .inspector-composition-detail-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  align-items: center !important;
}

/* USER UPDATE: use the legal-document right drawer as the visual benchmark
   for officials and generic menu records. Menus keep their own field groups and
   dropdown logic; this only normalizes the drawer shell, tabs, and scroll. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form]:not([hidden]),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form]:not([hidden]),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form]:not([hidden]),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form]:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  min-height: 100% !important;
  max-height: 100% !important;
  padding: 0 !important;
  color: #0f172a !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading {
  order: 1 !important;
  position: relative !important;
  top: auto !important;
  z-index: 7 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 14px 18px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-heading h2,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-heading h2 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: clamp(1.18rem, 2.1vw, 1.55rem) !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .panel-arrow-toggle,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .panel-switch-button,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .panel-arrow-toggle,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .panel-switch-button {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual {
  order: 2 !important;
  position: relative !important;
  inset: auto !important;
  z-index: 14 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::-webkit-scrollbar,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::-webkit-scrollbar,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::-webkit-scrollbar,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  gap: 5px !important;
  width: auto !important;
  min-width: 112px !important;
  min-height: 44px !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab-icon,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab > span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab > span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab:hover,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab:hover,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"] {
  color: #2563eb !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active::after,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active::after,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"]::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: #2563eb !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > #placeholderFields,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > #placeholderFields,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > #placeholderFields,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > #placeholderFields {
  order: 3 !important;
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 12px 20px 18px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels::-webkit-scrollbar,
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > #placeholderFields::-webkit-scrollbar,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > #inspectorFields.inspector-detail-tab-panels::-webkit-scrollbar,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > #placeholderFields::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .placeholder-detail-section-header,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .placeholder-detail-section-header,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .placeholder-detail-section-header,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .placeholder-detail-section-header {
  display: none !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .record-meta,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .record-meta,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .record-meta,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .record-meta {
  order: 3 !important;
  flex: 0 0 auto !important;
  margin: 0 20px 12px !important;
}

/* USER UPDATE: non-document right drawers keep Tags and notes on Detail/Info only. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid #e5edf6 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel #inspectorForm[data-detail-drawer-form="officials"][data-active-right-detail-tab]:not([data-active-right-detail-tab="detail"]) #inspectorTagsNotesSection,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"][data-active-right-detail-tab]:not([data-active-right-detail-tab="detail"]) #inspectorTagsNotesSection,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"][data-active-right-detail-tab]:not([data-active-right-detail-tab="detail"]) #inspectorTagsNotesSection,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"][data-active-right-detail-tab]:not([data-active-right-detail-tab="detail"]) #inspectorTagsNotesSection,
.detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-active-right-detail-tab]:not([data-active-right-detail-tab="info"]) #placeholderTagsNotesSection,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-active-right-detail-tab]:not([data-active-right-detail-tab="info"]) #placeholderTagsNotesSection,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-active-right-detail-tab]:not([data-active-right-detail-tab="info"]) #placeholderTagsNotesSection,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-active-right-detail-tab]:not([data-active-right-detail-tab="info"]) #placeholderTagsNotesSection {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header h3,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header h3 {
  flex: 0 0 auto !important;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 0.98rem !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-kicker,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-kicker {
  flex: 0 0 auto !important;
  color: #64748b !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
  text-transform: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-kicker::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-kicker::before,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header p::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header p::before {
  content: "|" !important;
  margin-right: 8px !important;
  color: #cbd5e1 !important;
  font-weight: 500 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header p,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-section-header p {
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #64748b !important;
  font-size: 0.82rem !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-field,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-field {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-field > span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section .right-detail-field > span {
  color: #334155 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section input,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section textarea,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section input,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section textarea {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 0 !important;
  border: 1px solid #d8e2ee !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.035) !important;
  box-sizing: border-box !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section textarea,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section textarea {
  min-height: 42px !important;
  resize: vertical !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section input:focus,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section textarea:focus,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section input:focus,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-shared-notes-section textarea:focus {
  background: #ffffff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), inset 0 1px 2px rgba(15, 23, 42, 0.025) !important;
  outline: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel[hidden],
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel[hidden],
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel[hidden],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-tab-panel[hidden] {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions {
  order: 4 !important;
  flex: 0 0 auto !important;
  margin: auto 0 0 !important;
}

/* USER UPDATE: non-document Delete footer action must stay flat like menu 1. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #475569 !important;
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
  transform: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete:is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete:is(:hover, :focus-visible, :active) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #2563eb !important;
  outline: none !important;
  text-decoration: none !important;
  transform: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete::before,
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .form-actions.right-detail-bottom-actions > #deleteButton.right-detail-footer-delete::after,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete::before,
.detail-panel #inspectorForm[data-detail-drawer-form] > .form-actions.right-detail-bottom-actions > #deleteInspectorButton.right-detail-footer-delete::after,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete::before,
.detail-panel #placeholderForm[data-detail-drawer-form] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions > #deleteWorkItemButton.right-detail-footer-delete::after {
  content: none !important;
  display: none !important;
}

/* USER UPDATE: non-document right drawer long fields use menu 1 document-title chrome, not the old resizable textarea. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-wrap-textarea,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-wrap-textarea,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-wrap-textarea,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-wrap-textarea {
  min-height: 38px !important;
  max-height: none !important;
  border-color: #dbe3ef !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.02) !important;
  color: #0f172a !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
  resize: none !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  white-space: pre-wrap !important;
  word-break: normal !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea::-webkit-scrollbar,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-wrap-textarea::-webkit-scrollbar,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] textarea::-webkit-scrollbar,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-wrap-textarea::-webkit-scrollbar {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> textarea) > .detail-field-resize-handle,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> .right-detail-wrap-textarea) > .detail-field-resize-handle,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> textarea) > .detail-field-resize-handle,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> .right-detail-wrap-textarea) > .detail-field-resize-handle,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> textarea) > .detail-field-resize-handle,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> .right-detail-wrap-textarea) > .detail-field-resize-handle,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> textarea) > .detail-field-resize-handle,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] label:has(> .right-detail-wrap-textarea) > .detail-field-resize-handle {
  content: none !important;
  display: none !important;
}

/* USER UPDATE: non-document right drawer controls inherit the legal-library field, dropdown, tags, and notes chrome. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field > span,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field label > span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field > span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field label > span {
  color: #334155 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input) {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 0 !important;
  border: 1px solid #d8e2ee !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.035) !important;
  box-sizing: border-box !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
  outline: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not(.right-detail-wrap-source), textarea, .right-detail-wrap-textarea, .detail-tag-entry-input)::placeholder,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not(.right-detail-wrap-source), textarea, .right-detail-wrap-textarea, .detail-tag-entry-input)::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input):focus,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input):focus {
  background: #ffffff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), inset 0 1px 2px rgba(15, 23, 42, 0.025) !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field.detail-tag-entry-mode,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-field.detail-tag-entry-mode {
  display: grid !important;
  gap: 6px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-source,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-source {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-entry-row,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-entry-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 6px !important;
  width: 100% !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-entry-input,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-entry-input {
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 6px 10px !important;
  resize: none !important;
  overflow: hidden !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-add-button,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-add-button {
  display: inline-grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-add-button:hover,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-add-button:hover {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-add-button:disabled,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-add-button:disabled {
  opacity: 0.48 !important;
  cursor: not-allowed !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-list,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-list[hidden],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-list[hidden] {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 24px !important;
  height: auto !important;
  padding: 2px 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #475569 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip:hover,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip:focus-within,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip:hover,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip:focus-within {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-text,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-text {
  display: inline-block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-remove,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-remove {
  display: inline-grid !important;
  place-items: center !important;
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: currentColor !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  opacity: 0.72 !important;
  cursor: pointer !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-remove:focus-visible,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-remove:hover,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-tag-entry-mode .detail-tag-chip-remove:focus-visible {
  background: transparent !important;
  color: currentColor !important;
  opacity: 1 !important;
}

body .right-detail-dropdown-popover {
  padding: 5px !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12) !important;
}

body .right-detail-dropdown-option {
  min-height: 36px !important;
  padding: 7px 10px !important;
  border-radius: 9px !important;
  color: #0f172a !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
}

body .right-detail-dropdown-option:hover,
body .right-detail-dropdown-option.is-active {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

body .right-detail-dropdown-empty {
  padding: 10px !important;
  color: #64748b !important;
  font-size: 0.86rem !important;
}

/* USER UPDATE: force every right detail footer action to menu 1 flat chrome. */
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

/* USER UPDATE: non-document footers must center like the legal document drawer. */
.detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .form-actions.right-detail-bottom-actions,
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .form-actions.right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #inspectorForm[data-detail-drawer-form="officials"] > .form-actions.right-detail-bottom-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .right-detail-bottom-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 0 !important;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton),
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton),
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton) {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #475569 !important;
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  opacity: 1 !important;
  transform: none !important;
  cursor: pointer !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):is(:hover, :focus-visible, :active) {
  border: 0 !important;
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #2563eb !important;
  outline: none !important;
  text-decoration: none !important;
  transform: none !important;
}

/* USER UPDATE: non-document right sidebar tabs use the same hover color as menu 1. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab:is(:hover, :focus-visible),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab:is(:hover, :focus-visible),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab:is(:hover, :focus-visible),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab:is(:hover, :focus-visible),
body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab:is(:hover, :focus-visible),
body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs .right-detail-tab:is(:hover, :focus-visible) {
  color: #2563eb !important;
  cursor: pointer !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(#deleteButton, #deleteInspectorButton, #deleteWorkItemButton, .right-detail-footer-delete):disabled,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(#deleteButton, #deleteInspectorButton, #deleteWorkItemButton, .right-detail-footer-delete)[disabled],
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(#deleteButton, #deleteInspectorButton, #deleteWorkItemButton, .right-detail-footer-delete):disabled,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(#deleteButton, #deleteInspectorButton, #deleteWorkItemButton, .right-detail-footer-delete)[disabled] {
  border: 0 !important;
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #94a3b8 !important;
  opacity: 0.72 !important;
  cursor: not-allowed !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)::before,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)::after {
  content: none !important;
  display: none !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions :is(.right-detail-action-icon, .detail-save-icon) {
  width: 13px !important;
  height: 13px !important;
  flex: 0 0 13px !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
}

/* USER UPDATE: right sidebar icon hover cards mirror the AppDataGrid action tool hover. */
.detail-panel [data-right-detail-hover-card="true"] {
  cursor: pointer;
}

.right-detail-hover-card-portal {
  --pd-right-detail-hover-arrow-left: 18px;
  position: fixed;
  z-index: 2147482500;
  width: min(260px, calc(100vw - 16px));
  max-width: min(260px, calc(100vw - 16px));
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(226, 232, 240, 0.86);
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transform: translateY(-4px) scale(0.98);
  transform-origin: top left;
  transition:
    opacity 80ms ease,
    transform 80ms ease,
    visibility 0s linear 100ms;
}

.right-detail-hover-card-portal.is-measuring {
  display: grid;
  opacity: 0;
  visibility: hidden;
}

.right-detail-hover-card-portal.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  transition-delay: 0s;
}

.right-detail-hover-card-portal::before {
  content: "";
  position: absolute;
  left: var(--pd-right-detail-hover-arrow-left);
  width: 10px;
  height: 10px;
  border: 1px solid rgba(226, 232, 240, 0.86);
  background: #ffffff;
  transform: rotate(45deg);
}

.right-detail-hover-card-portal[data-side="bottom"]::before {
  top: -5px;
  border-right: 0;
  border-bottom: 0;
}

.right-detail-hover-card-portal[data-side="top"]::before {
  bottom: -5px;
  border-left: 0;
  border-top: 0;
}

.right-detail-hover-card-title {
  min-width: 0;
  color: #0f172a;
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0;
  line-height: 1.25;
}

.right-detail-hover-card-description {
  min-width: 0;
  color: #64748b;
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.35;
}

.right-detail-hover-card-description[hidden] {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .right-detail-hover-card-portal {
    transition: none;
    transform: none;
  }
}

/* USER UPDATE: all non-document right sidebar fields use menu 1 filled, compact input chrome. */
/* USER UPDATE: non-document wrapped source inputs stay hidden and never create drawer overflow. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.inspector-tab-fields, .task-tab-fields, .task-detail-tab-panel, .right-detail-shared-notes-section, #placeholderAttachmentBlock),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.inspector-tab-fields, .task-tab-fields, .task-detail-tab-panel, .right-detail-shared-notes-section, #placeholderAttachmentBlock),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.inspector-tab-fields, .task-tab-fields, .task-detail-tab-panel, .right-detail-shared-notes-section, #placeholderAttachmentBlock),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.inspector-tab-fields, .task-tab-fields, .task-detail-tab-panel, .right-detail-shared-notes-section, #placeholderAttachmentBlock) {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.inspector-tab-fields, .task-tab-fields, .task-detail-tab-panel, .right-detail-shared-notes-section, #placeholderAttachmentBlock) > label,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.right-detail-field, .inspector-file-path-field, .operation-point-detail-field, .training-people-field, .training-skill-focus-field, .assignment-recommend-field, .reui-avatar-select-field, .task-meeting-event-field),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.inspector-tab-fields, .task-tab-fields, .task-detail-tab-panel, .right-detail-shared-notes-section, #placeholderAttachmentBlock) > label,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.right-detail-field, .inspector-file-path-field, .operation-point-detail-field, .training-people-field, .training-skill-focus-field, .assignment-recommend-field, .reui-avatar-select-field, .task-meeting-event-field) {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #334155 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.right-detail-field > span, .right-detail-field label > span),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.right-detail-field > span, .right-detail-field label > span) {
  color: #334155 !important;
  font-size: 0.82rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input, .reui-avatar-select-trigger),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input, .reui-avatar-select-trigger),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input, .reui-avatar-select-trigger),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input, .reui-avatar-select-trigger) {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid #d8e2ee !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.035) !important;
  box-sizing: border-box !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  outline: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(textarea, .right-detail-wrap-textarea),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(textarea, .right-detail-wrap-textarea) {
  min-height: 38px !important;
  max-height: none !important;
  resize: none !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  white-space: pre-wrap !important;
  word-break: normal !important;
}

/* USER UPDATE: empty non-document auto-fit textareas must stay as compact as menu 1 inputs. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(textarea, .right-detail-wrap-textarea)[data-detail-auto-fit="true"]:not([data-detail-has-content="true"]),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(textarea, .right-detail-wrap-textarea)[data-detail-auto-fit="true"]:not([data-detail-has-content="true"]),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(textarea, .right-detail-wrap-textarea)[data-detail-auto-fit="true"]:not([data-detail-has-content="true"]),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(textarea, .right-detail-wrap-textarea)[data-detail-auto-fit="true"]:not([data-detail-has-content="true"]) {
  height: 38px !important;
  min-height: 38px !important;
  padding-block: 8px !important;
  overflow: hidden !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not(.right-detail-wrap-source), textarea, .right-detail-wrap-textarea, .detail-tag-entry-input)::placeholder,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not(.right-detail-wrap-source), textarea, .right-detail-wrap-textarea, .detail-tag-entry-input)::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input, .reui-avatar-select-trigger):is(:focus, :focus-within),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not(.detail-tag-chip-source):not(.right-detail-wrap-source), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input, .reui-avatar-select-trigger):is(:focus, :focus-within) {
  background: #ffffff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), inset 0 1px 2px rgba(15, 23, 42, 0.025) !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.operation-point-field-row, .training-people-field-row, .assignment-recommend-field-row, .task-meeting-event-field-row, .inspector-profile-info-row, .inspector-discipline-detail-row, .inspector-composition-detail-row),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.operation-point-field-row, .training-people-field-row, .assignment-recommend-field-row, .task-meeting-event-field-row, .inspector-profile-info-row, .inspector-discipline-detail-row, .inspector-composition-detail-row) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: stretch !important;
  gap: 6px !important;
  min-width: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.operation-point-field-row, .training-people-field-row, .assignment-recommend-field-row, .task-meeting-event-field-row, .inspector-profile-info-row, .inspector-discipline-detail-row, .inspector-composition-detail-row) > button,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(.operation-point-field-row, .training-people-field-row, .assignment-recommend-field-row, .task-meeting-event-field-row, .inspector-profile-info-row, .inspector-discipline-detail-row, .inspector-composition-detail-row) > button {
  min-height: 38px !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .assignment-recommend-field-row > :is(input, textarea, select, .reui-avatar-select-trigger),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .assignment-recommend-field-row > :is(input, textarea, select, .reui-avatar-select-trigger) {
  min-width: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .assignment-recommend-button,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .assignment-recommend-button {
  padding-inline: 10px !important;
}

/* USER UPDATE: Property Assignment Provider/Supplier render as one two-column row. */
.detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"],
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] > :not(.property-assignment-two-column-field),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] > :not(.property-assignment-two-column-field) {
  grid-column: 1 / -1 !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] > .property-assignment-two-column-field,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] > .property-assignment-two-column-field {
  grid-column: auto !important;
}

@media (max-width: 520px) {
  .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"],
  body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] {
    grid-template-columns: 1fr !important;
  }

  .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] > .property-assignment-two-column-field,
  body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] [data-work-detail-fields="assignment"] > .property-assignment-two-column-field {
    grid-column: 1 / -1 !important;
  }
}

/* USER UPDATE: hard-lock hidden wrapped source inputs after non-document drawer chrome. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input.right-detail-wrap-source,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input.right-detail-wrap-source,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input.right-detail-wrap-source,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] input.right-detail-wrap-source {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 1px !important;
  min-width: 1px !important;
  max-width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  max-height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.assignment-recommendation-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.42);
  backdrop-filter: blur(6px);
}

.assignment-recommendation-dialog {
  width: min(720px, calc(100vw - 48px));
  max-height: min(760px, calc(100vh - 48px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid #d8e2ee;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.28);
}

.assignment-recommendation-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid #e2e8f0;
}

.assignment-recommendation-header p,
.assignment-recommendation-header h3,
.assignment-recommendation-header small {
  margin: 0;
  letter-spacing: 0;
}

.assignment-recommendation-header p {
  color: #2563eb;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.assignment-recommendation-header h3 {
  margin-top: 3px;
  color: #0f172a;
  font-size: 1.08rem;
  font-weight: 760;
  line-height: 1.25;
}

.assignment-recommendation-header small {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 0.82rem;
}

.assignment-recommend-close {
  width: 34px;
  height: 34px;
  border: 1px solid #d8e2ee;
  border-radius: 10px;
  background: #f8fafc;
  color: #0f172a;
  cursor: pointer;
}

.assignment-recommendation-list {
  display: grid;
  gap: 10px;
  min-height: 0;
  padding: 14px;
  overflow: auto;
}

.assignment-recommendation-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid #dbe7f5;
  border-radius: 12px;
  background: #f8fbff;
}

.assignment-recommend-avatar {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #d8e2ee;
  border-radius: 999px;
  background: #eaf2ff;
  color: #1d4ed8;
  font-size: 0.8rem;
  font-weight: 800;
}

.assignment-recommend-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.assignment-recommendation-card-body {
  min-width: 0;
}

.assignment-recommendation-card-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.assignment-recommendation-card-title strong {
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 0.95rem;
  line-height: 1.25;
}

.assignment-recommendation-card-title span {
  min-width: 36px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  font-size: 0.78rem;
  font-weight: 800;
  text-align: center;
}

.assignment-recommendation-card small,
.assignment-recommendation-card p {
  display: block;
  margin: 3px 0 0;
  color: #64748b;
  font-size: 0.8rem;
  line-height: 1.35;
}

.assignment-recommendation-empty {
  display: grid;
  gap: 4px;
  padding: 24px;
  border: 1px dashed #cbd5e1;
  border-radius: 12px;
  color: #475569;
  text-align: center;
}

.assignment-recommendation-excluded {
  padding: 12px 18px 16px;
  border-top: 1px solid #e2e8f0;
  color: #64748b;
  font-size: 0.82rem;
}

/* USER UPDATE: documents/tasks meeting link uses full-width input with action buttons below. */
.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 6px !important;
  min-width: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > :is(input, textarea, select),
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > :is(input, textarea, select),
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > :is(input, textarea, select),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > :is(input, textarea, select) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > .task-meeting-event-open-button,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > .task-meeting-event-open-button,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > .task-meeting-event-open-button,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="documentsAndTasks"] .task-meeting-event-field-row > .task-meeting-event-open-button {
  width: 100% !important;
  min-width: 0 !important;
  padding-inline: 8px !important;
  text-align: center !important;
}

/* USER UPDATE: non-document right drawer section headers use menu 1 one-line click toggle. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"],
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"],
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  white-space: normal !important;
  cursor: pointer !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"]:focus-visible,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"]:focus-visible {
  border-radius: 6px !important;
  outline: 2px solid #2563eb !important;
  outline-offset: 3px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] h3,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] h3 {
  order: 1 !important;
  flex: 1 1 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] .right-detail-section-kicker,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] p,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] .right-detail-section-kicker,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"] p {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded {
  flex-wrap: nowrap !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded h3,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded h3 {
  flex: 0 1 auto !important;
  max-width: 42% !important;
  white-space: nowrap !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded .right-detail-section-kicker,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded .right-detail-section-kicker {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: baseline !important;
  min-width: 0 !important;
  margin: 0 0 0 6px !important;
  padding: 0 !important;
  border-left: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 0.74rem !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded .right-detail-section-kicker::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded .right-detail-section-kicker::before {
  content: "|" !important;
  margin-right: 6px !important;
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded p,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded p {
  display: inline-block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 0 0 6px !important;
  padding: 0 !important;
  border-left: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 0.74rem !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded p::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-section-header[data-right-detail-section-header="toggle"].is-expanded p::before {
  content: "|" !important;
  margin-right: 6px !important;
  color: #94a3b8 !important;
  font-weight: 400 !important;
}


/* USER UPDATE: generic menu footer actions must divide evenly like menu 1. */
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"],
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"],
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"],
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"] {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"] > .right-detail-footer-close {
  grid-column: 1 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"] > #deleteWorkItemButton {
  grid-column: 2 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"] > .row-save-action {
  grid-column: 3 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] > .form-actions.placeholder-form-actions > .row-data-actions.right-detail-bottom-actions[data-detail-actions="generic"] > #newWorkItemButton[hidden] {
  display: none !important;
}

/* USER UPDATE: non-document History tabs mirror menu 1 compact record activity. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"],
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"],
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] {
  align-content: start !important;
  grid-auto-rows: max-content !important;
  gap: 10px !important;
  min-height: 0 !important;
  height: auto !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-history-section,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-history-section,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-history-section,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-history-section {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 10px !important;
  min-height: 0 !important;
  height: auto !important;
  padding-bottom: 10px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-section-header,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-section-header,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-section-header,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .right-detail-section-header {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 34px !important;
  padding: 7px 0 !important;
  border-bottom: 1px solid rgba(203, 213, 225, 0.55) !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div:last-child,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div:last-child,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div:last-child,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta > div:last-child {
  border-bottom: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta span,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta strong,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta span,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta strong,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta span,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta strong,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] [data-right-detail-panel="history"] .record-meta strong {
  min-width: 0 !important;
  line-height: 1.35 !important;
}

/* USER UPDATE: non-document right sidebar tabs divide and snap complete tab pages. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form],
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form],
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form],
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] {
  container: right-detail-form / inline-size;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual {
  --pd-right-detail-tab-count: 6;
  --pd-right-detail-visible-tabs: 6;
  --pd-right-detail-tab-edge-guard: 0px;
  justify-content: stretch !important;
  scroll-padding-inline: 0 !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  isolation: isolate !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab {
  flex: 0 0 calc((100% + var(--pd-right-detail-tab-edge-guard)) / var(--pd-right-detail-visible-tabs)) !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::after,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::after,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::after,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 2 !important;
  display: block !important;
  width: var(--pd-right-detail-tab-edge-guard) !important;
  height: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  background: #ffffff !important;
  pointer-events: none !important;
}

@container right-detail-form (max-width: 640px) {
  .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
  body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
  body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
  body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual {
    --pd-right-detail-visible-tabs: 5;
    --pd-right-detail-tab-edge-guard: 10px;
  }
}

@container right-detail-form (max-width: 460px) {
  .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
  body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
  body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
  body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual {
    --pd-right-detail-visible-tabs: 3;
    --pd-right-detail-tab-edge-guard: 16px;
  }
}

/* USER UPDATE: right detail footer actions use one icon-label format. */
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions,
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions,
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions {
  --pd-right-detail-footer-icon-size: 14px !important;
  --pd-right-detail-footer-label-size: 12px !important;
  --pd-right-detail-footer-label-weight: 500 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton),
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton),
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton) {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: stretch !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #334155 !important;
  font-family: var(--font-sans, "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans Khmer", sans-serif) !important;
  font-size: var(--pd-right-detail-footer-label-size, 12px) !important;
  font-weight: var(--pd-right-detail-footer-label-weight, 500) !important;
  font-style: normal !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  font-synthesis: none !important;
  -webkit-font-smoothing: antialiased !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
  opacity: 1 !important;
  transform: none !important;
  cursor: pointer !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton) > span,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton) > span {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  color: currentColor !important;
  font-family: inherit !important;
  font-size: var(--pd-right-detail-footer-label-size, 12px) !important;
  font-weight: var(--pd-right-detail-footer-label-weight, 500) !important;
  font-style: normal !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  font-synthesis: none !important;
  -webkit-font-smoothing: antialiased !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions :is(.right-detail-action-icon, .detail-save-icon),
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions :is(.right-detail-action-icon, .detail-save-icon),
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions :is(.right-detail-action-icon, .detail-save-icon),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions :is(.right-detail-action-icon, .detail-save-icon) {
  display: block !important;
  width: var(--pd-right-detail-footer-icon-size, 14px) !important;
  min-width: var(--pd-right-detail-footer-icon-size, 14px) !important;
  height: var(--pd-right-detail-footer-icon-size, 14px) !important;
  min-height: var(--pd-right-detail-footer-icon-size, 14px) !important;
  flex: 0 0 var(--pd-right-detail-footer-icon-size, 14px) !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  color: currentColor !important;
  pointer-events: none !important;
  transform: none !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
}

/* USER UPDATE: right detail footer close icon matches delete/save optical weight. */
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-footer-close > .right-detail-action-icon,
body.right-detail-drawer-open .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-footer-close > .right-detail-action-icon,
body.right-detail-drawer-closing .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-footer-close > .right-detail-action-icon,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions .right-detail-footer-close > .right-detail-action-icon {
  stroke-width: 2 !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)::before,
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)::after,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)::before,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)::after {
  content: none !important;
  display: none !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):is(:hover, :focus-visible, :active),
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):is(:hover, :focus-visible, :active) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #2563eb !important;
  outline: none !important;
  text-decoration: none !important;
  transform: none !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):focus-visible,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):focus-visible {
  box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.22) !important;
}

.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)[disabled],
.detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):disabled,
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton)[disabled],
body[class$="-theme"] .detail-panel :is(#itemForm, #inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-bottom-actions > :is(.right-detail-footer-action, .detail-save-icon-button, #deleteButton, #deleteInspectorButton, #deleteWorkItemButton):disabled {
  color: #94a3b8 !important;
  opacity: 0.72 !important;
  cursor: not-allowed !important;
}

/* USER UPDATE: shared non-document Files tabs use the legal document drag/drop card. */
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card,
body.right-detail-drawer-open .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card,
body.right-detail-drawer-closing .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card {
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 14px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-files-card-header,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-files-card-header {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-files-card-header span,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-files-card-header span {
  color: #0f172a !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-files-card-header small,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-files-card-header small {
  color: #64748b !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone,
body.right-detail-drawer-open .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone {
  display: grid !important;
  place-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
  min-height: 188px !important;
  padding: 28px 18px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 14px !important;
  background: #fbfdff !important;
  color: #0f172a !important;
  text-align: center !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone:hover,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone:focus-visible,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card.is-drag-over .document-file-dropzone,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone:hover,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone:focus-visible {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
  outline: none !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-icon,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-icon {
  display: inline-grid !important;
  width: 48px !important;
  height: 48px !important;
  place-items: center !important;
  border-radius: 16px !important;
  background: #eef2f7 !important;
  color: #94a3b8 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-icon svg,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-icon svg {
  width: 32px !important;
  height: 32px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy {
  display: grid !important;
  gap: 4px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  justify-items: center !important;
  overflow: visible !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy strong,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy strong {
  display: block !important;
  max-width: 100% !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  color: #0f172a !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy strong span,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy strong span {
  color: #2563eb !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy small,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy small {
  display: block !important;
  max-width: 100% !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  color: #64748b !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-list-section,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-list-section {
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-list-section h4,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-list-section h4 {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-current,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-current {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: start !important;
  gap: 10px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
  min-height: 42px !important;
  padding: 6px 0 10px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-current-icon,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-current-icon {
  display: inline-grid !important;
  min-width: 30px !important;
  height: 30px !important;
  place-items: center !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-current-icon[hidden],
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-current-icon[hidden],
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button[hidden],
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button[hidden] {
  display: none !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-file-meta,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-file-meta {
  display: grid !important;
  gap: 2px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
}

.detail-panel #inspectorSupportDocumentsDropZone .document-file-support-list,
body[class$="-theme"] .detail-panel #inspectorSupportDocumentsDropZone .document-file-support-list {
  display: grid !important;
  gap: 0 !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
}

.detail-panel #inspectorSupportDocumentsDropZone .document-upload-file-detail,
body[class$="-theme"] .detail-panel #inspectorSupportDocumentsDropZone .document-upload-file-detail {
  display: block !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

.detail-panel #inspectorSupportDocumentsDropZone .document-file-current.is-empty,
body[class$="-theme"] .detail-panel #inspectorSupportDocumentsDropZone .document-file-current.is-empty {
  grid-template-columns: minmax(0, 1fr) !important;
}

.detail-panel #inspectorSupportDocumentsDropZone .document-file-current.inspector-support-document-row,
body[class$="-theme"] .detail-panel #inspectorSupportDocumentsDropZone .document-file-current.inspector-support-document-row {
  grid-template-columns: max-content minmax(0, 1fr) !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .attachment-status.document-upload-file-name {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-overflow: clip !important;
  white-space: normal !important;
  color: #0f172a !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button {
  display: inline-grid !important;
  width: 28px !important;
  height: 28px !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #ef4444 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button:hover,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button:focus-visible,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button:hover,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button:focus-visible {
  color: #dc2626 !important;
  background: #fef2f2 !important;
  outline: none !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button svg,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-upload-remove-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* USER UPDATE: the document Files tab opens files from the completed upload row, not a separate action strip. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-file-actions.document-file-action-group {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open] {
  cursor: default !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file {
  cursor: pointer !important;
  border-radius: 8px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file:hover,
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file:focus-visible,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file:hover,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file:focus-visible,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file:hover,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-current[data-document-upload-open].has-file:focus-visible {
  background: #f8fafc !important;
  box-shadow: inset 0 0 0 1px #bfdbfe !important;
  outline: none !important;
}

/* USER UPDATE: shared Files tabs open uploaded rows directly, matching the legal document Files tab. */
.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open],
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open],
body.right-detail-drawer-closing .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open],
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open] {
  cursor: default !important;
}

.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file,
body.right-detail-drawer-closing .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file {
  cursor: pointer !important;
  border-radius: 8px !important;
}

.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file:hover,
.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file:focus-visible,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file:hover,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file:focus-visible,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file:hover,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current[data-document-upload-open].has-file:focus-visible {
  background: #f8fafc !important;
  box-shadow: inset 0 0 0 1px #bfdbfe !important;
  outline: none !important;
}

/* USER UPDATE: legal document Files layout is one full-width stack: upload, completed uploads, then attachment path. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-files-section,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-files-section,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-files-section,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-files-section,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-files-section,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .right-detail-files-section {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-dropzone,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-dropzone,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-dropzone,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-dropzone,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-dropzone {
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list {
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-files-card + .document-file-path-field {
  display: grid !important;
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  margin-top: 0 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-path-field,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-path-field {
  margin-top: 2px !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.inspector-file-actions, .placeholder-file-actions),
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.inspector-file-actions, .placeholder-file-actions) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* USER UPDATE: shared Files tabs match the legal document Files arrangement. */
.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .right-detail-files-section,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .right-detail-files-section,
body.right-detail-drawer-closing .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .right-detail-files-section,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .right-detail-files-section {
  display: grid !important;
  grid-auto-rows: max-content !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
}

.detail-panel :is(#taskFileAttachmentMount, .task-file-attachment-mount, [data-work-detail-fields="files"]) {
  display: grid !important;
  grid-auto-rows: max-content !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
}

.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row,
body.right-detail-drawer-closing .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button,
body.right-detail-drawer-closing .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button {
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 34px !important;
  padding: 7px 10px !important;
  border: 1px solid #dbe4f0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #334155 !important;
  font-size: 0.78rem !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button:hover,
.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button:focus-visible,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button:hover,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-action-row > button:focus-visible {
  border-color: #bfdbfe !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  outline: none !important;
}

.detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-path-field,
body.right-detail-drawer-open .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-path-field,
body.right-detail-drawer-closing .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-path-field,
body[class$="-theme"] .detail-panel :is(#inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .shared-files-path-field {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* USER UPDATE: generic Files tabs stack one logical item per row instead of looking like two grids. */
.detail-panel #placeholderDetailPanelFiles,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  justify-items: stretch !important;
}

.detail-panel #placeholderDetailPanelFiles :is(.right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount, #placeholderAttachmentBlock.document-files-card, #placeholderAttachmentBlock .task-support-documents-panel, #placeholderAttachmentBlock .document-file-list-section, #placeholderAttachmentBlock .document-file-completed-list, #placeholderAttachmentBlock .document-file-support-list),
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles :is(.right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount, #placeholderAttachmentBlock.document-files-card, #placeholderAttachmentBlock .task-support-documents-panel, #placeholderAttachmentBlock .document-file-list-section, #placeholderAttachmentBlock .document-file-completed-list, #placeholderAttachmentBlock .document-file-support-list),
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles :is(.right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount, #placeholderAttachmentBlock.document-files-card, #placeholderAttachmentBlock .task-support-documents-panel, #placeholderAttachmentBlock .document-file-list-section, #placeholderAttachmentBlock .document-file-completed-list, #placeholderAttachmentBlock .document-file-support-list),
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles :is(.right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount, #placeholderAttachmentBlock.document-files-card, #placeholderAttachmentBlock .task-support-documents-panel, #placeholderAttachmentBlock .document-file-list-section, #placeholderAttachmentBlock .document-file-completed-list, #placeholderAttachmentBlock .document-file-support-list) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.detail-panel #placeholderDetailPanelFiles :is(.shared-files-action-row, .shared-files-path-field, .document-file-path-field),
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles :is(.shared-files-action-row, .shared-files-path-field, .document-file-path-field),
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles :is(.shared-files-action-row, .shared-files-path-field, .document-file-path-field),
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles :is(.shared-files-action-row, .shared-files-path-field, .document-file-path-field),
.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .task-support-documents-panel, .attachment-status),
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .task-support-documents-panel, .attachment-status),
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .task-support-documents-panel, .attachment-status),
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .task-support-documents-panel, .attachment-status) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
}

.detail-panel #placeholderDetailPanelFiles .shared-files-action-row,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles .shared-files-action-row,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles .shared-files-action-row,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles .shared-files-action-row {
  grid-template-columns: minmax(0, 1fr) !important;
}

/* USER UPDATE: keep task Files upload card in upload-before-completed order. */
.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-files-card-header,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-files-card-header,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-files-card-header,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-files-card-header {
  order: 1 !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone {
  order: 2 !important;
  display: grid !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-file-completed-list,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > .document-file-completed-list {
  order: 3 !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsStatus,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsStatus,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsStatus,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsStatus {
  display: none !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsPanel,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsPanel,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsPanel,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock > #taskSupportDocumentsPanel {
  order: 4 !important;
}

/* USER UPDATE: officials Files tab stacks one full-width item per row like generic Files tabs. */
.detail-panel #inspectorDetailPanelFiles,
body.right-detail-drawer-open .detail-panel #inspectorDetailPanelFiles,
body.right-detail-drawer-closing .detail-panel #inspectorDetailPanelFiles,
body[class$="-theme"] .detail-panel #inspectorDetailPanelFiles {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  justify-items: stretch !important;
}

.detail-panel #inspectorDetailPanelFiles :is(.right-detail-files-section, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #inspectorAttachmentDropZone .document-file-list-section, #inspectorSupportDocumentsDropZone .document-file-list-section, #inspectorAttachmentDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-support-list),
body.right-detail-drawer-open .detail-panel #inspectorDetailPanelFiles :is(.right-detail-files-section, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #inspectorAttachmentDropZone .document-file-list-section, #inspectorSupportDocumentsDropZone .document-file-list-section, #inspectorAttachmentDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-support-list),
body.right-detail-drawer-closing .detail-panel #inspectorDetailPanelFiles :is(.right-detail-files-section, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #inspectorAttachmentDropZone .document-file-list-section, #inspectorSupportDocumentsDropZone .document-file-list-section, #inspectorAttachmentDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-support-list),
body[class$="-theme"] .detail-panel #inspectorDetailPanelFiles :is(.right-detail-files-section, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #inspectorAttachmentDropZone .document-file-list-section, #inspectorSupportDocumentsDropZone .document-file-list-section, #inspectorAttachmentDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-completed-list, #inspectorSupportDocumentsDropZone .document-file-support-list) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.detail-panel #inspectorDetailPanelFiles :is(.shared-files-action-row, .inspector-file-path-field),
body.right-detail-drawer-open .detail-panel #inspectorDetailPanelFiles :is(.shared-files-action-row, .inspector-file-path-field),
body.right-detail-drawer-closing .detail-panel #inspectorDetailPanelFiles :is(.shared-files-action-row, .inspector-file-path-field),
body[class$="-theme"] .detail-panel #inspectorDetailPanelFiles :is(.shared-files-action-row, .inspector-file-path-field),
.detail-panel #inspectorDetailPanelFiles :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone) > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .attachment-status),
body.right-detail-drawer-open .detail-panel #inspectorDetailPanelFiles :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone) > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .attachment-status),
body.right-detail-drawer-closing .detail-panel #inspectorDetailPanelFiles :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone) > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .attachment-status),
body[class$="-theme"] .detail-panel #inspectorDetailPanelFiles :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone) > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .attachment-status) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
}

.detail-panel #inspectorDetailPanelFiles .shared-files-action-row,
body.right-detail-drawer-open .detail-panel #inspectorDetailPanelFiles .shared-files-action-row,
body.right-detail-drawer-closing .detail-panel #inspectorDetailPanelFiles .shared-files-action-row,
body[class$="-theme"] .detail-panel #inspectorDetailPanelFiles .shared-files-action-row {
  grid-template-columns: minmax(0, 1fr) !important;
}

.detail-panel #inspectorDetailPanelFiles .shared-files-action-row > button,
body.right-detail-drawer-open .detail-panel #inspectorDetailPanelFiles .shared-files-action-row > button,
body.right-detail-drawer-closing .detail-panel #inspectorDetailPanelFiles .shared-files-action-row > button,
body[class$="-theme"] .detail-panel #inspectorDetailPanelFiles .shared-files-action-row > button {
  width: 100% !important;
  inline-size: 100% !important;
  justify-self: stretch !important;
}

/* USER UPDATE: Menu 3 support documents get the same inline drag/drop affordance as main files. */
.detail-panel #placeholderAttachmentBlock.document-files-card .task-support-documents-panel[hidden],
body[class$="-theme"] .detail-panel #placeholderAttachmentBlock.document-files-card .task-support-documents-panel[hidden] {
  display: none !important;
}

.detail-panel #placeholderAttachmentBlock .task-support-documents-panel,
body.right-detail-drawer-open .detail-panel #placeholderAttachmentBlock .task-support-documents-panel,
body.right-detail-drawer-closing .detail-panel #placeholderAttachmentBlock .task-support-documents-panel,
body[class$="-theme"] .detail-panel #placeholderAttachmentBlock .task-support-documents-panel {
  display: grid !important;
  grid-auto-rows: max-content !important;
  gap: 10px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
  margin-top: 2px !important;
  padding-top: 10px !important;
  border-top: 1px solid #e2e8f0 !important;
}

.detail-panel #placeholderAttachmentBlock .task-support-documents-panel.is-disabled,
body[class$="-theme"] .detail-panel #placeholderAttachmentBlock .task-support-documents-panel.is-disabled {
  opacity: 0.72 !important;
}

.detail-panel #placeholderAttachmentBlock .task-support-documents-panel.is-drag-over .document-file-dropzone,
body[class$="-theme"] .detail-panel #placeholderAttachmentBlock .task-support-documents-panel.is-drag-over .document-file-dropzone {
  border-color: #60a5fa !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

.detail-panel #placeholderAttachmentBlock .task-support-documents-panel .document-file-dropzone[disabled],
body[class$="-theme"] .detail-panel #placeholderAttachmentBlock .task-support-documents-panel .document-file-dropzone[disabled] {
  cursor: not-allowed !important;
  opacity: 0.64 !important;
}

/* USER UPDATE: all right-sidebar drag/drop upload cards use the Menu 1 blue glow. */
.detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone,
body.right-detail-drawer-open .detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone,
body[class$="-theme"] .detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
  outline: none !important;
}

/* USER UPDATE: inner upload buttons keep the same glow when shared drag handlers mark them directly. */
.detail-panel .document-file-dropzone.is-drag-over,
body.right-detail-drawer-open .detail-panel .document-file-dropzone.is-drag-over,
body.right-detail-drawer-closing .detail-panel .document-file-dropzone.is-drag-over,
body[class$="-theme"] .detail-panel .document-file-dropzone.is-drag-over {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
  outline: none !important;
}

/* USER UPDATE: every right-sidebar upload dropzone uses one hover/focus/drag-over active state. */
.detail-panel .document-file-dropzone:hover,
.detail-panel .document-file-dropzone:focus-visible,
.detail-panel .document-file-dropzone.is-drag-over,
.detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone,
body.right-detail-drawer-open .detail-panel .document-file-dropzone:hover,
body.right-detail-drawer-open .detail-panel .document-file-dropzone:focus-visible,
body.right-detail-drawer-open .detail-panel .document-file-dropzone.is-drag-over,
body.right-detail-drawer-open .detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel .document-file-dropzone:hover,
body.right-detail-drawer-closing .detail-panel .document-file-dropzone:focus-visible,
body.right-detail-drawer-closing .detail-panel .document-file-dropzone.is-drag-over,
body.right-detail-drawer-closing .detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone,
body[class$="-theme"] .detail-panel .document-file-dropzone:hover,
body[class$="-theme"] .detail-panel .document-file-dropzone:focus-visible,
body[class$="-theme"] .detail-panel .document-file-dropzone.is-drag-over,
body[class$="-theme"] .detail-panel :is(.document-files-card.is-drag-over, .task-support-documents-panel.is-drag-over) .document-file-dropzone {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
  outline: none !important;
}

/* USER UPDATE: shared right-sidebar upload cards wrap copy and stretch attachment rows. */
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy :is(strong, small),
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card .document-file-dropzone-copy :is(strong, small) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-align: center !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-list-section, .document-file-completed-list, .document-file-support-list, .document-file-current, .document-upload-file-meta),
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-list-section, .document-file-completed-list, .document-file-support-list, .document-file-current, .document-upload-file-meta) {
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
}

.detail-panel #inspectorSupportDocumentsDropZone .document-upload-file-detail,
body[class$="-theme"] .detail-panel #inspectorSupportDocumentsDropZone .document-upload-file-detail {
  width: 100% !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

/* USER UPDATE: shared completed-upload rows follow the legal document Files row. */
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list),
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) {
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  justify-self: stretch !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: start !important;
  justify-items: stretch !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  min-height: 44px !important;
  padding: 6px 0 10px !important;
  border: 0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* USER UPDATE: filled shared upload rows must keep the legal Files row grid. */
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file {
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  justify-self: stretch !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-upload-file-meta,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-upload-file-meta {
  grid-column: auto !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current:not(.has-file),
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current:not(.has-file) {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 34px !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current:not(.has-file) .document-upload-file-meta,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current:not(.has-file) .document-upload-file-meta {
  grid-column: 1 / -1 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current-icon,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-upload-remove-button,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current-icon,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-upload-remove-button {
  align-self: start !important;
  justify-self: center !important;
  margin-top: 0 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-upload-file-meta,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-upload-file-meta {
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  overflow: visible !important;
}

/* USER UPDATE: support-document previews reveal a download action on hover. */
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-row-actions,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  align-self: start !important;
  justify-self: end !important;
  min-width: 60px !important;
  max-width: max-content !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button {
  display: inline-grid !important;
  width: 28px !important;
  height: 28px !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #2563eb !important;
  box-shadow: none !important;
  cursor: pointer !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(1px) !important;
  transition: opacity 140ms ease, transform 140ms ease, background-color 140ms ease, color 140ms ease !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file:hover .document-file-hover-download-button,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file:focus-visible .document-file-hover-download-button,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file:focus-within .document-file-hover-download-button,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file:hover .document-file-hover-download-button,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file:focus-visible .document-file-hover-download-button,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file:focus-within .document-file-hover-download-button {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button:hover,
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button:focus-visible,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button:hover,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button:focus-visible {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  outline: none !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button svg,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

@media (hover: none) {
  .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button,
  body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-hover-download-button {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }
}

/* USER UPDATE: shared support-document rows show Menu 1 style file-size metadata and delete affordance. */
.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-upload-file-size,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-upload-file-size {
  display: block !important;
  min-height: 1em !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .attachment-status.document-upload-file-name {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current:not(.has-file) .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel :is(#inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).document-files-card :is(.document-file-completed-list, .document-file-support-list) .document-file-current:not(.has-file) .attachment-status.document-upload-file-name {
  color: #64748b !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
}

/* USER UPDATE: Menu 1 completed-upload filenames wrap without clipping long names. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: start !important;
  justify-items: stretch !important;
  column-gap: 10px !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-meta,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-meta,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-meta {
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .attachment-status.document-upload-file-name,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .attachment-status.document-upload-file-name,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .attachment-status.document-upload-file-name {
  display: block !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.35 !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-size,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-size,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-size,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file .document-upload-file-size {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* USER UPDATE: non-document drawer header matches the legal document top chrome. */
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading {
  order: 1 !important;
  position: relative !important;
  top: auto !important;
  z-index: 7 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 14px 18px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading .eyebrow,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading .eyebrow {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-heading h2,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-heading h2,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-heading h2,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-heading h2 {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-block: 0.02em 0.06em !important;
  color: #0f172a !important;
  font-size: clamp(0.98rem, 1.35vw, 1.2rem) !important;
  font-weight: 650 !important;
  line-height: 1.36 !important;
  letter-spacing: 0 !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: break-word !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-subtitle {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-quick-action-group,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-quick-action-group,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-quick-action-group,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .detail-quick-action-group {
  display: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  max-width: 100% !important;
  padding: 2px 9px !important;
  border: 1px solid #dbe5f3 !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 0.74rem !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual {
  order: 2 !important;
  position: relative !important;
  z-index: 14 !important;
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #dbeafe !important;
  background: #ffffff !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::before,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::before,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::before,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual::before {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 0 !important;
  display: block !important;
  height: 1px !important;
  background: #dbeafe !important;
  pointer-events: none !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab {
  position: relative !important;
  z-index: 1 !important;
  min-height: 44px !important;
}

.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active::after,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active::after,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"]::after,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active::after,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"]::after,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab.is-active::after,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab[aria-selected="true"]::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  z-index: 2 !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: #2563eb !important;
  pointer-events: none !important;
}

/* Share access panel: authenticated workspace sharing without changing table layout. */
.toolbar-actions-executive .share-workspace-shell,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-shell {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
}

body.share-workspace-panel-open .workspace[data-slot="sidebar-inset"],
body[class$="-theme"].share-workspace-panel-open .workspace[data-slot="sidebar-inset"] {
  overflow: visible !important;
}

body.share-workspace-panel-open .workspace[data-slot="sidebar-inset"] > .toolbar,
body[class$="-theme"].share-workspace-panel-open .workspace[data-slot="sidebar-inset"] > .toolbar {
  z-index: 2147482600 !important;
  overflow: visible !important;
}

.toolbar-actions-executive,
body[class$="-theme"] .toolbar-actions-executive {
  position: relative !important;
  z-index: 12 !important;
  overflow: visible !important;
}

.toolbar-actions-executive .share-workspace-shell.is-open,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-shell.is-open {
  z-index: 2147482601 !important;
}

body.share-workspace-panel-open .toolbar > .toolbar-text-loop,
body[class$="-theme"].share-workspace-panel-open .toolbar > .toolbar-text-loop {
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  margin-left: 0 !important;
  padding-inline: 0 !important;
  border-color: transparent !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

.toolbar-actions-executive .share-workspace-button,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 13px !important;
  border: 1px solid #d7e2f0 !important;
  border-radius: 8px !important;
  background: #111827 !important;
  color: #ffffff !important;
  font: 600 13px/1.1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
  box-shadow: 0 7px 18px rgba(15, 23, 42, 0.14) !important;
  cursor: pointer !important;
}

.toolbar-actions-executive .share-workspace-button svg,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-button svg {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
}

.toolbar-actions-executive .share-workspace-button:hover,
.toolbar-actions-executive .share-workspace-button[aria-expanded="true"],
body[class$="-theme"] .toolbar-actions-executive .share-workspace-button:hover,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-button[aria-expanded="true"] {
  background: #0f172a !important;
  border-color: #0f172a !important;
}

.toolbar-actions-executive .share-workspace-panel,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-panel {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  right: 0 !important;
  z-index: 2147482602 !important;
  display: grid !important;
  width: min(380px, calc(100vw - 28px)) !important;
  gap: 14px !important;
  padding: 14px !important;
  border: 1px solid #e3eaf4 !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  color: #0f172a !important;
  box-shadow: 0 20px 56px rgba(15, 23, 42, 0.18), 0 2px 8px rgba(15, 23, 42, 0.08) !important;
  backdrop-filter: blur(14px) !important;
}

.toolbar-actions-executive .share-workspace-panel[hidden],
body[class$="-theme"] .toolbar-actions-executive .share-workspace-panel[hidden] {
  display: none !important;
}

.share-panel-invite-row,
body[class$="-theme"] .share-panel-invite-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 92px 74px !important;
  gap: 8px !important;
  align-items: center !important;
}

.share-panel-invite-row input,
.share-panel-invite-row select,
.share-panel-invite-row button,
.share-link-row input,
.share-link-row button,
.share-access-option button,
.share-person-permission,
.share-person-remove,
body[class$="-theme"] .share-panel-invite-row input,
body[class$="-theme"] .share-panel-invite-row select,
body[class$="-theme"] .share-panel-invite-row button,
body[class$="-theme"] .share-link-row input,
body[class$="-theme"] .share-link-row button,
body[class$="-theme"] .share-access-option button,
body[class$="-theme"] .share-person-permission,
body[class$="-theme"] .share-person-remove {
  min-height: 34px !important;
  border: 1px solid #d9e5f3 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font: 500 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

.share-panel-invite-row input,
.share-link-row input,
body[class$="-theme"] .share-panel-invite-row input,
body[class$="-theme"] .share-link-row input {
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 10px !important;
}

.share-panel-invite-row select,
.share-person-permission,
body[class$="-theme"] .share-panel-invite-row select,
body[class$="-theme"] .share-person-permission {
  padding: 0 8px !important;
}

.share-panel-invite-row button,
.share-link-row button,
.share-access-option button,
body[class$="-theme"] .share-panel-invite-row button,
body[class$="-theme"] .share-link-row button,
body[class$="-theme"] .share-access-option button {
  padding: 0 12px !important;
  cursor: pointer !important;
}

.share-panel-invite-row button,
.share-link-row button,
body[class$="-theme"] .share-panel-invite-row button,
body[class$="-theme"] .share-link-row button {
  background: #111827 !important;
  border-color: #111827 !important;
  color: #ffffff !important;
}

.share-access-block,
body[class$="-theme"] .share-access-block {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.share-panel-label,
body[class$="-theme"] .share-panel-label {
  margin: 0 !important;
  color: #64748b !important;
  font: 600 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

.share-access-option,
body[class$="-theme"] .share-access-option {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
}

.share-access-icon,
body[class$="-theme"] .share-access-icon {
  display: inline-flex !important;
  width: 36px !important;
  height: 36px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #dbe6f4 !important;
  border-radius: 10px !important;
  color: #475569 !important;
  background: #f8fafc !important;
}

.share-access-icon svg,
body[class$="-theme"] .share-access-icon svg {
  width: 18px !important;
  height: 18px !important;
}

.share-access-option strong,
.share-access-option small,
body[class$="-theme"] .share-access-option strong,
body[class$="-theme"] .share-access-option small {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.share-access-option strong,
body[class$="-theme"] .share-access-option strong {
  font: 700 13px/1.25 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.share-access-option small,
body[class$="-theme"] .share-access-option small {
  color: #64748b !important;
  font: 500 11px/1.25 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.share-people-list,
body[class$="-theme"] .share-people-list {
  display: grid !important;
  gap: 10px !important;
  max-height: 230px !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

.share-person-row,
body[class$="-theme"] .share-person-row {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 86px 34px !important;
  gap: 9px !important;
  align-items: center !important;
  min-width: 0 !important;
}

.share-person-avatar,
body[class$="-theme"] .share-person-avatar {
  display: inline-flex !important;
  width: 32px !important;
  height: 32px !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  font: 700 12px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.share-person-avatar img,
body[class$="-theme"] .share-person-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.share-person-main,
body[class$="-theme"] .share-person-main {
  min-width: 0 !important;
}

.share-person-name,
.share-person-email,
body[class$="-theme"] .share-person-name,
body[class$="-theme"] .share-person-email {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.share-person-name,
body[class$="-theme"] .share-person-name {
  color: #0f172a !important;
  font: 700 13px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.share-person-email,
body[class$="-theme"] .share-person-email {
  color: #64748b !important;
  font: 500 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.share-person-remove,
body[class$="-theme"] .share-person-remove {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  padding: 0 !important;
  color: #ef4444 !important;
  background: #fff7f7 !important;
  border-color: #fecaca !important;
  cursor: pointer !important;
}

.share-person-owner-label,
body[class$="-theme"] .share-person-owner-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748b !important;
  background: #f8fafc !important;
  cursor: default !important;
}

.share-person-remove.is-placeholder,
body[class$="-theme"] .share-person-remove.is-placeholder {
  visibility: hidden !important;
  pointer-events: none !important;
}

.share-link-row,
body[class$="-theme"] .share-link-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 98px !important;
  gap: 8px !important;
  align-items: center !important;
}

.share-panel-muted,
.share-panel-status,
body[class$="-theme"] .share-panel-muted,
body[class$="-theme"] .share-panel-status {
  margin: 0 !important;
  color: #64748b !important;
  font: 500 12px/1.35 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.share-panel-status.is-error,
body[class$="-theme"] .share-panel-status.is-error {
  color: #b91c1c !important;
}

.share-panel-status.is-success,
body[class$="-theme"] .share-panel-status.is-success {
  color: #047857 !important;
}

@media (max-width: 680px) {
  .share-panel-invite-row,
  body[class$="-theme"] .share-panel-invite-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .share-access-option,
  body[class$="-theme"] .share-access-option {
    grid-template-columns: 36px minmax(0, 1fr) !important;
  }

  .share-access-option button,
  body[class$="-theme"] .share-access-option button {
    grid-column: 1 / -1 !important;
  }

  .share-person-row,
  body[class$="-theme"] .share-person-row {
    grid-template-columns: 34px minmax(0, 1fr) 34px !important;
  }

  .share-person-permission,
  body[class$="-theme"] .share-person-permission {
    grid-column: 2 / -1 !important;
  }
}

/* USER UPDATE: share panel focused access-card redesign. */
.toolbar-actions-executive .share-workspace-panel,
body[class$="-theme"] .toolbar-actions-executive .share-workspace-panel {
  width: min(408px, calc(100vw - 24px)) !important;
  max-height: min(620px, calc(100vh - 84px)) !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden auto !important;
  border: 1px solid #dce6f3 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22), 0 3px 12px rgba(15, 23, 42, 0.08) !important;
  backdrop-filter: none !important;
}

.share-panel-header,
body[class$="-theme"] .share-panel-header {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 14px 14px 12px !important;
  border-bottom: 1px solid #e6edf7 !important;
  background: #f8fafc !important;
}

.share-panel-header-icon,
body[class$="-theme"] .share-panel-header-icon {
  display: inline-flex !important;
  width: 34px !important;
  height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 8px !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

.share-panel-header-icon svg,
body[class$="-theme"] .share-panel-header-icon svg {
  width: 18px !important;
  height: 18px !important;
}

.share-panel-header-copy,
body[class$="-theme"] .share-panel-header-copy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

.share-panel-header-copy strong,
body[class$="-theme"] .share-panel-header-copy strong {
  overflow: hidden !important;
  color: #0f172a !important;
  font: 800 14px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.share-panel-header-copy small,
body[class$="-theme"] .share-panel-header-copy small {
  overflow: hidden !important;
  color: #64748b !important;
  font: 600 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.share-panel-invite-row,
body[class$="-theme"] .share-panel-invite-row {
  grid-template-columns: minmax(0, 1fr) 116px !important;
  gap: 8px !important;
  padding: 14px !important;
  border-bottom: 1px solid #eef2f7 !important;
  background: #ffffff !important;
}

.share-panel-invite-row input,
body[class$="-theme"] .share-panel-invite-row input {
  grid-column: 1 / -1 !important;
  min-height: 38px !important;
}

.share-panel-invite-row select,
.share-panel-invite-row button,
body[class$="-theme"] .share-panel-invite-row select,
body[class$="-theme"] .share-panel-invite-row button {
  min-height: 36px !important;
}

.share-panel-invite-row button,
body[class$="-theme"] .share-panel-invite-row button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 800 !important;
}

.share-access-block,
body[class$="-theme"] .share-access-block {
  gap: 8px !important;
  padding: 12px 14px !important;
  border-bottom: 1px solid #eef2f7 !important;
  background: #ffffff !important;
}

.share-panel-label,
body[class$="-theme"] .share-panel-label {
  color: #475569 !important;
  font: 800 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-transform: uppercase !important;
}

.share-access-option,
body[class$="-theme"] .share-access-option {
  grid-template-columns: 38px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding: 10px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
}

.share-access-option button,
body[class$="-theme"] .share-access-option button {
  min-height: 32px !important;
  border-color: #dbe5f3 !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-weight: 800 !important;
}

.share-people-list,
body[class$="-theme"] .share-people-list {
  gap: 6px !important;
  max-height: 190px !important;
  padding: 0 !important;
  overflow: auto !important;
}

.share-person-row,
body[class$="-theme"] .share-person-row {
  grid-template-columns: 34px minmax(0, 1fr) 78px 30px !important;
  gap: 8px !important;
  padding: 8px !important;
  border: 1px solid #e8eef7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
}

.share-person-row.is-owner,
body[class$="-theme"] .share-person-row.is-owner {
  background: #f8fafc !important;
}

.share-person-permission,
.share-person-owner-label,
body[class$="-theme"] .share-person-permission,
body[class$="-theme"] .share-person-owner-label {
  min-height: 30px !important;
  height: 30px !important;
  border-color: #bfdbfe !important;
  border-radius: 7px !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-align: center !important;
}

.share-person-remove,
body[class$="-theme"] .share-person-remove {
  width: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  border-radius: 7px !important;
  font-size: 0 !important;
}

.share-person-remove::before,
body[class$="-theme"] .share-person-remove::before {
  content: "x" !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.share-link-block,
body[class$="-theme"] .share-link-block {
  border-bottom: 0 !important;
  background: #f8fafc !important;
}

.share-link-row,
body[class$="-theme"] .share-link-row {
  grid-template-columns: minmax(0, 1fr) 104px !important;
  gap: 8px !important;
}

.share-link-row input,
.share-link-row button,
body[class$="-theme"] .share-link-row input,
body[class$="-theme"] .share-link-row button {
  min-height: 38px !important;
}

.share-panel-status,
body[class$="-theme"] .share-panel-status {
  min-height: 18px !important;
  padding: 0 14px 12px !important;
  background: #f8fafc !important;
}

@media (max-width: 460px) {
  .toolbar-actions-executive .share-workspace-panel,
  body[class$="-theme"] .toolbar-actions-executive .share-workspace-panel {
    right: -8px !important;
    width: calc(100vw - 20px) !important;
  }

  .share-panel-invite-row,
  .share-link-row,
  body[class$="-theme"] .share-panel-invite-row,
  body[class$="-theme"] .share-link-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .share-access-option,
  body[class$="-theme"] .share-access-option {
    grid-template-columns: 36px minmax(0, 1fr) !important;
  }

  .share-access-option button,
  body[class$="-theme"] .share-access-option button {
    grid-column: 1 / -1 !important;
  }

  .share-person-row,
  body[class$="-theme"] .share-person-row {
    grid-template-columns: 34px minmax(0, 1fr) 30px !important;
  }

  .share-person-permission,
  .share-person-owner-label,
  body[class$="-theme"] .share-person-permission,
  body[class$="-theme"] .share-person-owner-label {
    grid-column: 2 / -1 !important;
  }
}

/* USER UPDATE: unified uploaded-file hover download design across all file surfaces. */
.detail-panel .document-file-current.has-file,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file,
body[class$="-theme"] .detail-panel .document-file-current.has-file,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file {
  cursor: pointer !important;
}

.official-profile-dialog .official-profile-documents-wrap,
body[class$="-theme"] .official-profile-dialog .official-profile-documents-wrap {
  max-height: 330px !important;
  padding: 8px !important;
  overflow: auto !important;
  border: 1px solid var(--line, #d8e2ef) !important;
  border-radius: 10px !important;
  background: #ffffff !important;
}

.official-profile-dialog .official-profile-upload-file-list,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list {
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
}

.official-profile-dialog .official-profile-upload-file-list .document-file-current,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: start !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 8px 0 10px !important;
  border: 0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.official-profile-dialog .official-profile-upload-file-list .document-file-current:last-child,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current:last-child {
  border-bottom: 0 !important;
}

.official-profile-dialog .official-profile-upload-file-list .document-file-current.is-empty,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.is-empty {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 34px !important;
}

.official-profile-dialog .official-profile-upload-file-list .document-file-current-icon,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #0f4c81 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
}

.detail-panel .document-file-current > .document-file-row-actions,
.official-profile-dialog .official-profile-upload-file-list .document-file-row-actions,
body[class$="-theme"] .detail-panel .document-file-current > .document-file-row-actions,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  align-self: start !important;
  justify-self: end !important;
  min-width: 60px !important;
  max-width: max-content !important;
}

.detail-panel .document-file-current > .document-file-row-actions[hidden],
.official-profile-dialog .official-profile-upload-file-list .document-file-row-actions[hidden],
body[class$="-theme"] .detail-panel .document-file-current > .document-file-row-actions[hidden],
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-row-actions[hidden] {
  display: none !important;
}

.detail-panel .document-file-current .document-file-hover-download-button,
.official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button,
body[class$="-theme"] .detail-panel .document-file-current .document-file-hover-download-button,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button {
  display: inline-grid !important;
  width: 28px !important;
  height: 28px !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #2563eb !important;
  box-shadow: none !important;
  cursor: pointer !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(1px) !important;
  transition: opacity 140ms ease, transform 140ms ease, background-color 140ms ease, color 140ms ease !important;
}

.detail-panel .document-file-current.has-file:hover .document-file-hover-download-button,
.detail-panel .document-file-current.has-file:focus-visible .document-file-hover-download-button,
.detail-panel .document-file-current.has-file:focus-within .document-file-hover-download-button,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:hover .document-file-hover-download-button,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-visible .document-file-hover-download-button,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-within .document-file-hover-download-button,
body[class$="-theme"] .detail-panel .document-file-current.has-file:hover .document-file-hover-download-button,
body[class$="-theme"] .detail-panel .document-file-current.has-file:focus-visible .document-file-hover-download-button,
body[class$="-theme"] .detail-panel .document-file-current.has-file:focus-within .document-file-hover-download-button,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:hover .document-file-hover-download-button,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-visible .document-file-hover-download-button,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-within .document-file-hover-download-button {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

.detail-panel .document-file-current .document-file-hover-download-button:hover,
.detail-panel .document-file-current .document-file-hover-download-button:focus-visible,
.official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button:hover,
.official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button:focus-visible,
body[class$="-theme"] .detail-panel .document-file-current .document-file-hover-download-button:hover,
body[class$="-theme"] .detail-panel .document-file-current .document-file-hover-download-button:focus-visible,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button:hover,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button:focus-visible {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  outline: none !important;
}

.detail-panel .document-file-current .document-file-hover-download-button svg,
.official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button svg,
body[class$="-theme"] .detail-panel .document-file-current .document-file-hover-download-button svg,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.dark-theme .official-profile-dialog .official-profile-documents-wrap {
  background: rgba(15, 23, 42, 0.74) !important;
  border-color: rgba(148, 163, 184, 0.25) !important;
}

body.dark-theme .official-profile-dialog .official-profile-upload-file-list .document-file-current {
  border-bottom-color: rgba(148, 163, 184, 0.25) !important;
}

body.dark-theme .official-profile-dialog .official-profile-upload-file-list .document-file-current-icon {
  color: #bfdbfe !important;
  background: rgba(15, 23, 42, 0.92) !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
}

@media (hover: none) {
  .detail-panel .document-file-current .document-file-hover-download-button,
  .official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button,
  body[class$="-theme"] .detail-panel .document-file-current .document-file-hover-download-button,
  body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-hover-download-button {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }
}

/* USER UPDATE: Menu 1 Files rows share the same final uploaded-file design. */
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  align-items: start !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  min-inline-size: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 8px 8px 9px !important;
  border: 1px solid #d8e7f7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.035) !important;
  cursor: pointer !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file:hover,
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file:focus-visible,
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file:focus-within,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:hover,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-visible,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-within,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file:hover,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file:focus-visible,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file:focus-within,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:hover,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-visible,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file:focus-within {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  box-shadow: inset 0 0 0 1px #bfdbfe, 0 1px 2px rgba(15, 23, 42, 0.035) !important;
  outline: none !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-file-current-icon,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-file-current-icon,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-file-current-icon,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-file-current-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  align-self: start !important;
  justify-self: start !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #0f4c81 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-upload-file-meta,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-meta,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-upload-file-meta,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-meta {
  display: grid !important;
  gap: 2px !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .attachment-status.document-upload-file-name,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .attachment-status.document-upload-file-name,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .attachment-status.document-upload-file-name {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  text-overflow: clip !important;
  white-space: normal !important;
  color: #0f172a !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-upload-file-size,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-size,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-upload-file-size,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-size {
  display: block !important;
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-upload-file-detail,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file .document-upload-file-detail {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  text-overflow: clip !important;
  white-space: normal !important;
  color: #64748b !important;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  line-height: 1.32 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  align-self: start !important;
  justify-self: end !important;
  min-width: 60px !important;
  max-width: max-content !important;
}

/* USER UPDATE: file-row download action stays beside delete action. */
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  width: max-content !important;
  inline-size: max-content !important;
  min-width: max-content !important;
  max-width: max-content !important;
  align-self: start !important;
  justify-self: end !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button),
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button) {
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  margin: 0 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button {
  order: 1 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button {
  order: 2 !important;
}

/* USER UPDATE: completed upload rows keep compact icon-to-text spacing. */
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file {
  align-items: start !important;
  column-gap: 7px !important;
  min-height: 42px !important;
  padding: 6px 7px !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-file-current-icon,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-file-current-icon,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-file-current-icon,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-file-current-icon {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  align-self: start !important;
  border-radius: 7px !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-upload-file-meta,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-meta,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-upload-file-meta,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-meta {
  gap: 1px !important;
  align-self: start !important;
}

/* USER UPDATE: uploaded file-row controls align to the top of wrapped filenames. */
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file > .document-file-row-actions,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions {
  align-self: start !important;
  margin-top: -1px !important;
}

/* USER UPDATE: uploaded file-row action icons share one optical baseline. */
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button),
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > :is(button, .document-file-hover-download-button, .document-upload-remove-button) {
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .attachment-status.document-upload-file-name,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .attachment-status.document-upload-file-name,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .attachment-status.document-upload-file-name,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .attachment-status.document-upload-file-name {
  line-height: 1.28 !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-upload-file-size,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-size,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) :is(.document-file-completed-list, .document-file-support-list) .document-file-current.has-file .document-upload-file-size,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file .document-upload-file-size {
  line-height: 1.15 !important;
}

/* USER UPDATE: upload row action buttons share one hover/focus affordance across all menus. */
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > :is(.document-file-hover-download-button, .document-upload-remove-button),
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > :is(.document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > :is(.document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > :is(.document-file-hover-download-button, .document-upload-remove-button) {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: background-color 140ms ease, color 140ms ease, opacity 140ms ease, transform 140ms ease !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:hover,
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:focus-visible,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:hover,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:focus-visible,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:hover,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:focus-visible,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:hover,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:focus-visible {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  outline: none !important;
}

.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:hover,
.detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:focus-visible,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:hover,
.official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:focus-visible,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:hover,
body[class$="-theme"] .detail-panel :is(#rightDetailPanelFiles, #inspectorDetailPanelFiles, #placeholderDetailPanelFiles) .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:focus-visible,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:hover,
body[class$="-theme"] .official-profile-dialog .official-profile-upload-file-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:focus-visible {
  color: #dc2626 !important;
  background: #fef2f2 !important;
  outline: none !important;
}

/* USER UPDATE: Menu 1 completed upload actions use the same two-icon row as generated support rows. */
.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions {
  display: inline-flex !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  width: max-content !important;
  inline-size: max-content !important;
  min-width: max-content !important;
  max-width: max-content !important;
  align-self: start !important;
  justify-self: end !important;
  margin: -1px 0 0 !important;
}

.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > :is(.document-file-hover-download-button, .document-upload-remove-button),
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > :is(.document-file-hover-download-button, .document-upload-remove-button) {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button {
  order: 1 !important;
}

.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button {
  order: 2 !important;
}

.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:hover,
.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:focus-visible,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:hover,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-file-hover-download-button:focus-visible {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  outline: none !important;
}

.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:hover,
.detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:focus-visible,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:hover,
body[class$="-theme"] .detail-panel #rightDetailPanelFiles .document-file-completed-list .document-file-current.has-file > .document-file-row-actions > .document-upload-remove-button:focus-visible {
  color: #dc2626 !important;
  background: #fef2f2 !important;
  outline: none !important;
}

/* USER UPDATE: column setting checkbox switches keep smooth shadcn motion. */
#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-self: end !important;
  flex: 0 0 var(--pd-switch-width) !important;
  width: var(--pd-switch-width) !important;
  min-width: var(--pd-switch-width) !important;
  max-width: var(--pd-switch-width) !important;
  height: var(--pd-switch-height) !important;
  min-height: var(--pd-switch-height) !important;
  max-height: var(--pd-switch-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: #e2e8f0 !important;
  color: transparent !important;
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.2), 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  cursor: pointer !important;
  outline: none !important;
  vertical-align: middle !important;
  transition: background-color 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 180ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 180ms cubic-bezier(0.22, 1, 0.36, 1), opacity 180ms ease !important;
}

#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"]::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 1px !important;
  display: block !important;
  width: var(--pd-switch-thumb) !important;
  height: var(--pd-switch-thumb) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18) !important;
  transform: translate3d(0, -50%, 0) !important;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 180ms cubic-bezier(0.22, 1, 0.36, 1) !important;
  will-change: transform !important;
}

#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"]:checked {
  background: var(--pd-settings-accent, #2563eb) !important;
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12), 0 1px 2px rgba(37, 99, 235, 0.16) !important;
}

#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"]:checked::before {
  transform: translate3d(calc(var(--pd-switch-width) - var(--pd-switch-thumb) - 2px), -50%, 0) !important;
}

#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"]:focus-visible {
  border-color: rgba(37, 99, 235, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.13) !important;
}

#settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"]:disabled {
  cursor: not-allowed !important;
  opacity: 0.48 !important;
}

@media (prefers-reduced-motion: reduce) {
  #settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"],
  #settingsDialog.settings-dialog .settings-panel .inspector-column-row .settings-checkbox.column-settings-switch-row input[type="checkbox"]::before {
    transition-duration: 1ms !important;
  }
}

/* USER UPDATE: Users / Password now manages the sidebar account avatar. */
#settingsDialog.settings-dialog .settings-add-row.user-row,
#settingsDialog.settings-dialog .settings-list-row.user-settings-row {
  grid-template-columns:
    minmax(120px, 1fr)
    minmax(220px, 280px)
    minmax(120px, 1fr)
    minmax(140px, 1fr)
    120px
    128px
    auto !important;
  align-items: center !important;
}

#settingsDialog.settings-dialog .user-avatar-settings-control {
  display: grid !important;
  grid-template-columns: 32px minmax(68px, 1fr) 34px auto auto !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 34px !important;
  margin: 0 !important;
}

#settingsDialog.settings-dialog .user-avatar-settings-preview {
  display: inline-grid !important;
  place-items: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  border: 1px solid #dbe4ef !important;
  border-radius: 999px !important;
  background: var(--pd-user-avatar-color, #2563eb) !important;
  color: #ffffff !important;
  overflow: hidden !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

#settingsDialog.settings-dialog .user-avatar-settings-preview.is-default-avatar {
  background: #ffffff !important;
  color: #475569 !important;
}

#settingsDialog.settings-dialog .user-avatar-settings-preview img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

#settingsDialog.settings-dialog .user-avatar-settings-preview i {
  display: inline-grid !important;
  place-items: center !important;
  width: 1em !important;
  height: 1em !important;
  line-height: 1 !important;
}

#settingsDialog.settings-dialog .user-avatar-icon-select {
  width: 100% !important;
  min-width: 0 !important;
}

#settingsDialog.settings-dialog .user-avatar-color-input {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 3px !important;
  cursor: pointer !important;
}

#settingsDialog.settings-dialog .user-avatar-photo-input {
  display: none !important;
}

#settingsDialog.settings-dialog .user-avatar-photo-button,
#settingsDialog.settings-dialog .user-avatar-photo-clear {
  display: inline-grid !important;
  place-items: center !important;
  height: 34px !important;
  min-height: 34px !important;
  border: 1px solid #dbe4ef !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-family: "Khmer OS Siemreap", "PaperDesk Inter Latin", Arial, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

#settingsDialog.settings-dialog .user-avatar-photo-button {
  min-width: 52px !important;
  padding: 0 10px !important;
}

#settingsDialog.settings-dialog .user-avatar-photo-clear {
  width: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
}

#settingsDialog.settings-dialog .user-avatar-settings-control:not(.has-avatar-photo) .user-avatar-photo-clear,
#settingsDialog.settings-dialog .user-avatar-photo-clear[hidden] {
  display: none !important;
}

#settingsDialog.settings-dialog .user-avatar-photo-button:hover,
#settingsDialog.settings-dialog .user-avatar-photo-clear:hover {
  border-color: rgba(37, 99, 235, 0.45) !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

#settingsDialog.settings-dialog .app-password-tools {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

#settingsDialog.settings-dialog .app-password-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

#settingsDialog.settings-dialog #openUserAuditLogButton {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

@media (max-width: 900px) {
  #settingsDialog.settings-dialog .settings-add-row.user-row,
  #settingsDialog.settings-dialog .settings-list-row.user-settings-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #settingsDialog.settings-dialog .app-password-tools,
  #settingsDialog.settings-dialog .app-password-actions {
    align-items: stretch !important;
    flex-direction: column !important;
  }
}
.app-lock-otp-modal-fallback {
  width: min(440px, calc(100vw - 32px));
  padding: 0;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.app-lock-otp-modal-fallback::backdrop {
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(3px);
}

.app-lock-otp-modal-shell {
  display: grid;
  gap: 16px;
  padding: 20px 22px 22px;
  font-family: "Khmer OS Siemreap", "PaperDesk Inter Latin", Arial, sans-serif;
}

.app-lock-otp-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.app-lock-otp-modal-kicker {
  color: #2563eb;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.app-lock-otp-modal-header h2 {
  margin: 2px 0 0;
  color: #0f172a;
  font-size: 20px;
  line-height: 1.25;
}

.app-lock-otp-modal-close,
.app-lock-otp-modal-back,
.app-lock-otp-modal-submit {
  border: 1px solid #d8e2f0;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  font: inherit;
  cursor: pointer;
}

.app-lock-otp-modal-close {
  width: 32px;
  height: 32px;
}

.app-lock-otp-modal-copy,
.app-lock-otp-modal-error {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}

.app-lock-otp-modal-copy {
  color: #64748b;
}

.app-lock-otp-modal-error {
  color: #dc2626;
  font-weight: 700;
}

.app-lock-otp-modal-input {
  width: 100%;
  height: 48px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  color: #0f172a;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0;
  text-align: center;
  outline: none;
}

.app-lock-otp-modal-input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16);
}

.app-lock-otp-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.app-lock-otp-modal-back,
.app-lock-otp-modal-submit {
  min-height: 36px;
  padding: 0 14px;
}

.app-lock-otp-modal-submit {
  border-color: #2563eb;
  background: #2563eb;
  color: #ffffff;
  font-weight: 700;
}

/* USER UPDATE: final runtime order for Menu 3 Files upload card after JS moves it into the drawer form. */
.detail-panel #placeholderForm #placeholderAttachmentBlock > .document-files-card-header,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-files-card-header,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-files-card-header,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-files-card-header {
  order: 1 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > #choosePlaceholderAttachmentButton.document-file-dropzone {
  order: 2 !important;
  display: grid !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-completed-list,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-completed-list {
  order: 3 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-path-field,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-path-field,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-path-field,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > .document-file-path-field {
  order: 4 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock > .placeholder-file-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > .placeholder-file-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > .placeholder-file-actions,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > .placeholder-file-actions {
  order: 5 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsStatus,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsStatus,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsStatus,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsStatus {
  display: none !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsPanel,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsPanel,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsPanel,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock > #taskSupportDocumentsPanel {
  order: 6 !important;
}

/* USER UPDATE: final all-menu right-sidebar dropzone hover owner.
   Menu 1, official profiles, generic menu records, and task support documents
   all keep the same blue active affordance on cursor hover, keyboard focus, and
   drag-over state. */
.detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:hover,
.detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:focus-visible,
.detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone.is-drag-over,
.detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).is-drag-over > .document-file-dropzone,
.detail-panel #taskSupportDocumentsPanel.is-drag-over > .document-file-dropzone,
body.right-detail-drawer-open .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:hover,
body.right-detail-drawer-open .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:focus-visible,
body.right-detail-drawer-open .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone.is-drag-over,
body.right-detail-drawer-open .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).is-drag-over > .document-file-dropzone,
body.right-detail-drawer-open .detail-panel #taskSupportDocumentsPanel.is-drag-over > .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:hover,
body.right-detail-drawer-closing .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:focus-visible,
body.right-detail-drawer-closing .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone.is-drag-over,
body.right-detail-drawer-closing .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).is-drag-over > .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #taskSupportDocumentsPanel.is-drag-over > .document-file-dropzone,
body[class$="-theme"] .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:hover,
body[class$="-theme"] .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone:focus-visible,
body[class$="-theme"] .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock, #taskSupportDocumentsPanel) .document-file-dropzone.is-drag-over,
body[class$="-theme"] .detail-panel :is(#attachmentDropZone, #inspectorAttachmentDropZone, #inspectorSupportDocumentsDropZone, #placeholderAttachmentBlock).is-drag-over > .document-file-dropzone,
body[class$="-theme"] .detail-panel #taskSupportDocumentsPanel.is-drag-over > .document-file-dropzone {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
  outline: none !important;
}

/* USER UPDATE: right-sidebar document upload dropzones show progress in the border.
   The border reuses the official photo progress-ring pattern so upload progress
   is visible directly on the active drag/drop target while row progress remains. */
.detail-panel .document-file-dropzone[data-document-upload-progress-border],
body.right-detail-drawer-open .detail-panel .document-file-dropzone[data-document-upload-progress-border],
body.right-detail-drawer-closing .detail-panel .document-file-dropzone[data-document-upload-progress-border],
body[class$="-theme"] .detail-panel .document-file-dropzone[data-document-upload-progress-border] {
  --document-upload-progress: 0%;
  --document-upload-ring-color: #2563eb;
  --document-upload-ring-track: #dbeafe;
  box-sizing: border-box !important;
  border: 2px solid transparent !important;
  background:
    linear-gradient(#fbfdff, #fbfdff) padding-box,
    conic-gradient(from -90deg, var(--document-upload-ring-color) var(--document-upload-progress), var(--document-upload-ring-track) 0) border-box !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10), 0 10px 24px rgba(37, 99, 235, 0.12) !important;
  outline: none !important;
}

.detail-panel .document-file-dropzone[data-document-upload-state="uploading"],
body.right-detail-drawer-open .detail-panel .document-file-dropzone[data-document-upload-state="uploading"],
body.right-detail-drawer-closing .detail-panel .document-file-dropzone[data-document-upload-state="uploading"],
body[class$="-theme"] .detail-panel .document-file-dropzone[data-document-upload-state="uploading"] {
  --document-upload-ring-color: #2563eb;
  --document-upload-ring-track: #dbeafe;
  animation: documentDropzoneProgressBorderPulse 1100ms ease-in-out infinite !important;
}

.detail-panel .document-file-dropzone[data-document-upload-state="complete"],
body.right-detail-drawer-open .detail-panel .document-file-dropzone[data-document-upload-state="complete"],
body.right-detail-drawer-closing .detail-panel .document-file-dropzone[data-document-upload-state="complete"],
body[class$="-theme"] .detail-panel .document-file-dropzone[data-document-upload-state="complete"] {
  --document-upload-progress: 100%;
  --document-upload-ring-color: #2563eb;
  --document-upload-ring-track: #dbeafe;
}

.detail-panel .document-file-dropzone[data-document-upload-state="failed"],
body.right-detail-drawer-open .detail-panel .document-file-dropzone[data-document-upload-state="failed"],
body.right-detail-drawer-closing .detail-panel .document-file-dropzone[data-document-upload-state="failed"],
body[class$="-theme"] .detail-panel .document-file-dropzone[data-document-upload-state="failed"] {
  --document-upload-ring-color: #ef4444;
  --document-upload-ring-track: #fee2e2;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.10), 0 10px 24px rgba(239, 68, 68, 0.12) !important;
}

@keyframes documentDropzoneProgressBorderPulse {
  0%,
  100% {
    filter: saturate(1);
  }

  50% {
    filter: saturate(1.16);
  }
}

@media (prefers-reduced-motion: reduce) {
  .detail-panel .document-file-dropzone[data-document-upload-state="uploading"],
  body.right-detail-drawer-open .detail-panel .document-file-dropzone[data-document-upload-state="uploading"],
  body.right-detail-drawer-closing .detail-panel .document-file-dropzone[data-document-upload-state="uploading"],
  body[class$="-theme"] .detail-panel .document-file-dropzone[data-document-upload-state="uploading"] {
    animation: none !important;
  }
}

/* USER UPDATE: generic right-sidebar Files panels follow the Menu 1 file layout.
   Meeting/Event, Training, Routine, Property, Financial, and other generic menus
   keep upload, completed files, attachment path, and file actions in one full-width
   stack even after the runtime moves legacy placeholder nodes into the Files tab. */
.detail-panel #placeholderDetailPanelFiles,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
}

.detail-panel #placeholderDetailPanelFiles :is(#workFilesFields, .right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount),
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles :is(#workFilesFields, .right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount),
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles :is(#workFilesFields, .right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount),
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles :is(#workFilesFields, .right-detail-files-section, .task-file-actions-panel, #taskFileAttachmentMount, .task-file-attachment-mount) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card {
  order: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .task-support-documents-panel, .attachment-status),
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .task-support-documents-panel, .attachment-status),
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .task-support-documents-panel, .attachment-status),
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > :is(.document-files-card-header, .document-file-dropzone, .document-file-list-section, .document-file-completed-list, .document-file-support-list, .task-support-documents-panel, .attachment-status) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-files-card-header,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-files-card-header,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-files-card-header,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-files-card-header {
  order: 1 !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #choosePlaceholderAttachmentButton.document-file-dropzone,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #choosePlaceholderAttachmentButton.document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #choosePlaceholderAttachmentButton.document-file-dropzone,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #choosePlaceholderAttachmentButton.document-file-dropzone {
  order: 2 !important;
  display: grid !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-file-completed-list,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > .document-file-completed-list {
  order: 3 !important;
}

.detail-panel #placeholderDetailPanelFiles :is(.shared-files-path-field, .document-file-path-field),
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles :is(.shared-files-path-field, .document-file-path-field),
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles :is(.shared-files-path-field, .document-file-path-field),
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles :is(.shared-files-path-field, .document-file-path-field) {
  order: 4 !important;
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

.detail-panel #placeholderDetailPanelFiles .shared-files-action-row,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles .shared-files-action-row,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles .shared-files-action-row,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles .shared-files-action-row {
  order: 5 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 8px !important;
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

.detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button {
  width: 100% !important;
  inline-size: 100% !important;
  min-height: 34px !important;
  justify-content: center !important;
  border: 1px solid #d7e2f0 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #334155 !important;
  font-family: var(--pd-font-latin, "PaperDesk Inter Latin"), Inter, "Inter Variable", "Khmer OS Siemreap", var(--pd-font-khmer, "Noto Sans Khmer"), ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.04) !important;
}

.detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button:hover,
.detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button:focus-visible,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button:hover,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button:focus-visible,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button:hover,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles .shared-files-action-row > button:focus-visible {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  color: #1d4ed8 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsStatus,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsStatus,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsStatus,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsStatus {
  display: none !important;
}

.detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsPanel,
body.right-detail-drawer-open .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsPanel,
body.right-detail-drawer-closing .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsPanel,
body[class$="-theme"] .detail-panel #placeholderDetailPanelFiles #placeholderAttachmentBlock.document-files-card > #taskSupportDocumentsPanel {
  order: 6 !important;
}

.detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]),
body.right-detail-drawer-open .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]),
body.right-detail-drawer-closing .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]),
body[class$="-theme"] .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
}

.detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel),
body.right-detail-drawer-open .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel),
body.right-detail-drawer-closing .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel),
body[class$="-theme"] .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}

.detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions,
body[class$="-theme"] .detail-panel #placeholderForm > #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 8px !important;
}

/* USER UPDATE: generic right-sidebar reload fallback keeps Files controls stacked.
   When the page reloads with a generic drawer open, the placeholder upload card
   can render inside #placeholderFields before the runtime moves it to Files. */
.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]),
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]),
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]),
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel),
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel),
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel),
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > :is(.document-files-card-header, .document-file-dropzone, .document-file-completed-list, .document-file-path-field, .placeholder-file-actions, #taskSupportDocumentsPanel) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-files-card-header,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-files-card-header,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-files-card-header,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-files-card-header {
  order: 1 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-dropzone,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-dropzone,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-dropzone,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-dropzone {
  order: 2 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-completed-list,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-completed-list,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-completed-list,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-completed-list {
  order: 3 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-path-field,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-path-field,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-path-field,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .document-file-path-field {
  order: 4 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions {
  order: 5 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 8px !important;
  width: 100% !important;
  inline-size: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions > button,
body.right-detail-drawer-open .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions > button,
body.right-detail-drawer-closing .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions > button,
body[class$="-theme"] .detail-panel #placeholderForm #placeholderAttachmentBlock.placeholder-files-card:not([data-shared-files-panel-mounted="true"]) > .placeholder-file-actions > button {
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
}

/* Menu 3 work-type summary carousel above the AppDataGrid toolbar. */
.menu3-worktype-carousel,
body[class$="-theme"] .menu3-worktype-carousel {
  width: 100%;
  margin: 0 0 12px;
  padding: 10px 12px 12px;
  border: 1px solid #d9e2ef;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.88);
  font-family: var(--pd-font-latin, "PaperDesk Inter Latin"), Inter, "Inter Variable", "Khmer OS Siemreap", var(--pd-font-khmer, "Noto Sans Khmer"), ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
}

.menu3-worktype-carousel-toolbar {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
}

.menu3-worktype-scroll-button,
.menu3-worktype-clear-button,
.menu3-worktype-marquee-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  border: 1px solid #d5deeb;
  border-radius: 7px;
  background: #ffffff;
  color: #0f172a;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.04);
  cursor: pointer;
  transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
}

.menu3-worktype-clear-button,
.menu3-worktype-marquee-button {
  padding: 0 11px;
}

.menu3-worktype-scroll-button:hover,
.menu3-worktype-clear-button:hover,
.menu3-worktype-marquee-button:hover,
.menu3-worktype-scroll-button:focus-visible,
.menu3-worktype-clear-button:focus-visible,
.menu3-worktype-marquee-button:focus-visible,
.menu3-worktype-marquee-button.is-active {
  border-color: #9ec5fe;
  background: #f8fbff;
  color: #0b5ed7;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.menu3-worktype-scroll-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
  box-shadow: none;
}

.menu3-worktype-carousel-track {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 4px 0 0;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

.menu3-worktype-carousel-track.is-marquee-enabled {
  --paperdesk-marquee-gap: 10px;
  gap: 0;
  overflow: hidden;
  scroll-snap-type: none;
  scrollbar-width: none;
}

.menu3-worktype-carousel-track::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.menu3-worktype-carousel-track.is-marquee-enabled::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.menu3-worktype-carousel-track::-webkit-scrollbar-track {
  background: transparent;
}

.menu3-worktype-carousel-track::-webkit-scrollbar-thumb {
  border-radius: 999px;
  border: 2px solid transparent;
  background: #aeb8c6;
  background-clip: padding-box;
}

@keyframes paperdesk-menu3-worktype-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(-50% - var(--paperdesk-marquee-gap) / 2));
  }
}

.menu3-worktype-marquee-content {
  display: flex;
  flex: 0 0 auto;
  gap: var(--paperdesk-marquee-gap);
  width: max-content;
  min-width: max-content;
  animation: paperdesk-menu3-worktype-marquee 52000ms linear infinite;
}

.menu3-worktype-carousel.is-marquee-enabled:hover .menu3-worktype-marquee-content {
  animation-play-state: paused;
}

.menu3-worktype-card {
  position: relative;
  flex: 0 0 292px;
  min-width: 292px;
  min-height: 96px;
  scroll-snap-align: start;
  display: grid;
  gap: 9px;
  align-content: space-between;
  overflow: hidden;
  padding: 11px 11px 11px 13px;
  border: 1px solid #d6e1ee;
  border-radius: 8px;
  background: #ffffff;
  color: #102033;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.menu3-worktype-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: #64748b;
  opacity: 0.7;
}

.menu3-worktype-card.is-total-task::before {
  background: #0f766e;
  opacity: 0.92;
}

.menu3-worktype-card.is-active {
  border-color: #2563eb;
  background: #f8fbff;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18), 0 8px 20px rgba(15, 23, 42, 0.08);
}

.menu3-worktype-card.is-active::before {
  background: #2563eb;
  opacity: 1;
}

.menu3-worktype-card-title {
  min-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.menu3-worktype-card-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(82px, 1fr));
  gap: 6px;
}

.menu3-worktype-stat {
  min-height: 44px;
  min-width: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px 7px;
  border: 1px solid #d6e2f0;
  border-radius: 7px;
  background: #f8fafc;
  color: #334155;
  text-align: center;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
  transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.menu3-worktype-stat strong,
.menu3-worktype-stat span {
  display: block;
  line-height: 1.2;
}

.menu3-worktype-stat strong {
  font-size: 15px;
  font-weight: 800;
  color: #0f172a;
}

.menu3-worktype-stat span {
  margin-top: 3px;
  overflow: visible;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
  text-transform: uppercase;
  color: #64748b;
}

.menu3-worktype-stat:hover,
.menu3-worktype-stat:focus-visible,
.menu3-worktype-stat.is-active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
  transform: translateY(-1px);
}

.menu3-worktype-stat:hover strong,
.menu3-worktype-stat:focus-visible strong,
.menu3-worktype-stat.is-active strong,
.menu3-worktype-stat:hover span,
.menu3-worktype-stat:focus-visible span,
.menu3-worktype-stat.is-active span {
  color: #1d4ed8;
}

@media (prefers-reduced-motion: reduce) {
  .menu3-worktype-marquee-content {
    animation: none;
  }
}

@media (max-width: 760px) {
  .menu3-worktype-carousel {
    padding: 10px 10px 12px;
  }

  .menu3-worktype-card {
    flex-basis: 272px;
    min-width: 272px;
  }

  .menu3-worktype-card-stats {
    grid-template-columns: repeat(3, minmax(76px, 1fr));
    gap: 6px;
  }
}

/* Work Progress summary carousel reuses the Menu 3 carousel shell above AppDataGrid. */
.menu4-progress-carousel,
body[class$="-theme"] .menu4-progress-carousel {
  margin-bottom: 12px;
}

.menu4-progress-carousel-track,
body[class$="-theme"] .menu4-progress-carousel-track {
  align-items: stretch;
}

.menu4-progress-card,
body[class$="-theme"] .menu4-progress-card {
  min-height: 134px;
}

.menu4-progress-card.is-total-task::before,
body[class$="-theme"] .menu4-progress-card.is-total-task::before {
  background: #0f766e;
  opacity: 0.95;
}

.menu4-progress-card-stats,
body[class$="-theme"] .menu4-progress-card-stats {
  grid-template-columns: repeat(3, minmax(82px, 1fr));
}

.menu4-progress-card-meta,
body[class$="-theme"] .menu4-progress-card-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(70px, 1fr));
  gap: 6px;
}

.menu4-progress-meta-button,
.menu4-progress-meta-value,
body[class$="-theme"] .menu4-progress-meta-button,
body[class$="-theme"] .menu4-progress-meta-value {
  min-width: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 5px 6px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #ffffff;
  color: #334155;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.menu4-progress-meta-button,
body[class$="-theme"] .menu4-progress-meta-button {
  cursor: pointer;
  transition: background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.menu4-progress-meta-button:hover,
.menu4-progress-meta-button:focus-visible,
body[class$="-theme"] .menu4-progress-meta-button:hover,
body[class$="-theme"] .menu4-progress-meta-button:focus-visible {
  border-color: #2563eb;
  background: #eff6ff;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
  transform: translateY(-1px);
}

.menu4-progress-meta-button strong,
.menu4-progress-meta-value strong,
body[class$="-theme"] .menu4-progress-meta-button strong,
body[class$="-theme"] .menu4-progress-meta-value strong {
  display: block;
  overflow: hidden;
  max-width: 100%;
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.menu4-progress-meta-button span,
.menu4-progress-meta-value span,
body[class$="-theme"] .menu4-progress-meta-button span,
body[class$="-theme"] .menu4-progress-meta-value span {
  display: block;
  margin-top: 2px;
  color: #64748b;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.15;
  text-transform: uppercase;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .menu4-progress-card {
    min-height: 138px;
  }

  .menu4-progress-card-meta {
    grid-template-columns: repeat(3, minmax(64px, 1fr));
  }
}


/* USER UPDATE: Routine right sidebar uses document-style drawer chrome. */
.detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual {
  --pd-right-detail-tab-count: 3;
  --pd-right-detail-visible-tabs: 3;
  --pd-right-detail-tab-edge-guard: 0px;
  justify-content: stretch !important;
  border-bottom: 1px solid #dbeafe !important;
  overflow-x: hidden !important;
  scroll-padding-inline: 0 !important;
  scroll-snap-type: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual .right-detail-tab {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  scroll-snap-align: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual::after,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual::after,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual::after,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] > .right-detail-tabs.right-detail-tabs-visual::after {
  display: none !important;
  width: 0 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"][data-active-right-detail-tab="details"] #placeholderTagsNotesSection,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"][data-active-right-detail-tab="details"] #placeholderTagsNotesSection,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"][data-active-right-detail-tab="details"] #placeholderTagsNotesSection,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"][data-active-right-detail-tab="details"] #placeholderTagsNotesSection {
  display: grid !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] #taskFields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] #taskFields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] #taskFields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] #taskFields {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields > .task-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields > .task-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields > .task-detail-tab-panel,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields > .task-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel[hidden],
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel[hidden],
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel[hidden],
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel[hidden] {
  display: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel > .right-detail-section-header,
.detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel > .right-detail-history-section > .right-detail-section-header,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .task-detail-tab-panel > .right-detail-section-header {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .task-tab-fields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .task-tab-fields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] .task-tab-fields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .task-tab-fields {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields .task-tab-fields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields .task-tab-fields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields .task-tab-fields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="routine"] #taskFields .task-tab-fields {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 34px !important;
  justify-content: center !important;
  border: 1px solid #d7e2f0 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.04) !important;
}

.detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action:hover,
.detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action:focus-visible,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action:hover,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action:focus-visible,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action:hover,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="routine"] .routine-detail-actions > .secondary-action:focus-visible {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  color: #1d4ed8 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

/* USER UPDATE: Property right sidebar reuses the Menu 3 enterprise detail rhythm. */
.detail-panel #placeholderForm[data-detail-menu="property"] #taskFields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] #taskFields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] #taskFields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] #taskFields {
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields > .task-detail-tab-panel,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields > .task-detail-tab-panel,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields > .task-detail-tab-panel,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields > .task-detail-tab-panel {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel[hidden],
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel[hidden],
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel[hidden],
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel[hidden] {
  display: none !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel > .right-detail-section-header,
.detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel > .right-detail-history-section > .right-detail-section-header,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .task-detail-tab-panel > .right-detail-section-header {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .task-tab-fields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .task-tab-fields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .task-tab-fields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .task-tab-fields {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields .task-tab-fields,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields .task-tab-fields,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields .task-tab-fields,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"][data-detail-menu="property"] #taskFields .task-tab-fields {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-field,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-field,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-field,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-field {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-row,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-row,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-row,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-number,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-number,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-number,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-number {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 36px !important;
  width: 100% !important;
  padding: 0 12px !important;
  border: 1px solid #dbe5f1 !important;
  border-radius: 7px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  box-sizing: border-box !important;
  user-select: text !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-manage-button,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-manage-button,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-manage-button,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-stock-detail-manage-button {
  min-width: 76px !important;
  min-height: 36px !important;
  justify-content: center !important;
  padding-inline: 12px !important;
  border-radius: 7px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action,
body.right-detail-drawer-closing .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 34px !important;
  justify-content: center !important;
  border: 1px solid #d7e2f0 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.04) !important;
}

.detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action:hover,
.detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action:focus-visible,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action:hover,
body.right-detail-drawer-open .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action:focus-visible,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action:hover,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-menu="property"] .property-detail-actions > .secondary-action:focus-visible {
  border-color: #bfdbfe !important;
  background: #f8fbff !important;
  color: #1d4ed8 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

/* USER UPDATE: document drawer long-title hardening for mixed Khmer/English records. */
.detail-panel #itemForm[data-detail-drawer-form="documents"],
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"],
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"],
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] {
  --pd-right-detail-document-heading-max-block: 118px;
  --pd-right-detail-document-tabs-sticky-top: var(--pd-right-detail-document-heading-max-block);
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  min-height: 92px !important;
  max-height: var(--pd-right-detail-document-heading-max-block) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading .eyebrow,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading .eyebrow,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading .eyebrow,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading .eyebrow,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-heading h2 {
  display: -webkit-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
  max-height: 2.4em !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-subtitle {
  display: -webkit-box !important;
  max-height: 2.7em !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-actions,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-actions,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-actions,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .detail-actions {
  flex: 0 0 auto !important;
  min-width: 36px !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  top: var(--pd-right-detail-document-tabs-sticky-top, 118px) !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .right-detail-tabs {
  top: auto !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] :is(.right-detail-tab-panel, .right-detail-section, .right-detail-field-grid, .right-detail-field, .form-grid, label, .document-custom-fields, .attachment-tools, .attachment-status, .record-meta),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(.right-detail-tab-panel, .right-detail-section, .right-detail-field-grid, .right-detail-field, .form-grid, label, .document-custom-fields, .attachment-tools, .attachment-status, .record-meta),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(.right-detail-tab-panel, .right-detail-section, .right-detail-field-grid, .right-detail-field, .form-grid, label, .document-custom-fields, .attachment-tools, .attachment-status, .record-meta),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(.right-detail-tab-panel, .right-detail-section, .right-detail-field-grid, .right-detail-field, .form-grid, label, .document-custom-fields, .attachment-tools, .attachment-status, .record-meta) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]), select, textarea, .right-detail-wrap-textarea, .detail-tag-entry-input) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] :is(textarea, .right-detail-wrap-textarea),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(textarea, .right-detail-wrap-textarea),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(textarea, .right-detail-wrap-textarea),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(textarea, .right-detail-wrap-textarea) {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: pre-wrap !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] input.right-detail-wrap-source,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] input.right-detail-wrap-source,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] input.right-detail-wrap-source,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] input.right-detail-wrap-source {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  min-width: 1px !important;
  max-width: 1px !important;
  min-height: 1px !important;
  max-height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  pointer-events: none !important;
}

/* USER FIX: right detail header stacks title and chips without overlap. */
.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading {
  grid-template-rows: auto !important;
  align-items: start !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading > div:first-child,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child,
body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading > div:first-child {
  display: grid !important;
  min-width: 0 !important;
  max-width: 100% !important;
  gap: 5px !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] :is(#detailTitle, .right-detail-drawer-subtitle),
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(#detailTitle, .right-detail-drawer-subtitle),
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(#detailTitle, .right-detail-drawer-subtitle),
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(#detailTitle, .right-detail-drawer-subtitle),
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(#detailTitle, .right-detail-drawer-subtitle),
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] :is(#detailTitle, .right-detail-drawer-subtitle),
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle, .right-detail-drawer-subtitle),
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle, .right-detail-drawer-subtitle),
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle, .right-detail-drawer-subtitle),
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle, .right-detail-drawer-subtitle),
body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle, .right-detail-drawer-subtitle),
body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle, .right-detail-drawer-subtitle) {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: normal !important;
  -webkit-box-orient: initial !important;
  -webkit-line-clamp: unset !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta,
body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 6px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin-top: 1px !important;
  overflow: visible !important;
}

.detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] .right-detail-drawer-meta > span,
.detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta > span,
body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta > span,
body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta > span,
body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta > span,
body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta > span,
body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] .right-detail-drawer-meta > span {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

@media (max-width: 560px) {
  .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
  body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
  body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
  body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
  body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
  body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] > .detail-heading,
  .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
  body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
  body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
  body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
  body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading,
  body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] > .detail-heading {
    gap: 8px !important;
    padding: 14px 12px 11px !important;
  }

  .detail-panel #itemForm[data-detail-drawer-form="documents"] #detailTitle,
  body.right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #detailTitle,
  body.right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #detailTitle,
  body[class$="-theme"] .detail-panel #itemForm[data-detail-drawer-form="documents"] #detailTitle,
  body[class$="-theme"].right-detail-drawer-open .detail-panel #itemForm[data-detail-drawer-form="documents"] #detailTitle,
  body[class$="-theme"].right-detail-drawer-closing .detail-panel #itemForm[data-detail-drawer-form="documents"] #detailTitle,
  .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle),
  body.right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle),
  body.right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle),
  body[class$="-theme"] .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle),
  body[class$="-theme"].right-detail-drawer-open .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle),
  body[class$="-theme"].right-detail-drawer-closing .detail-panel :is(#inspectorForm, #placeholderForm)[data-detail-drawer-form] :is(#inspectorDetailTitle, #placeholderDetailTitle) {
    font-size: 1rem !important;
    line-height: 1.34 !important;
  }
}

/* USER FIX: mobile/tablet app fit removes the legacy desktop body floor while preserving inner table scrolling. */
@media (max-width: 980px) {
  html,
  body,
  body[class$="-theme"] {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  .app-shell[data-slot="sidebar-wrapper"],
  body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] {
    width: 100vw !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"],
  body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"] {
    min-width: 0 !important;
    overflow-x: hidden !important;
  }
}

/* USER UPDATE: generic right drawer non-input fields should read as metadata rows, not editable blanks. */
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field {
  position: relative !important;
  padding-right: 58px !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field::after,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field::after {
  content: "Auto" !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  display: inline-flex !important;
  min-height: 18px !important;
  align-items: center !important;
  padding: 1px 7px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  background: #eff6ff !important;
  color: #2563eb !important;
  font-size: 0.68rem !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]) {
  min-height: 38px !important;
  padding: 8px 11px 8px 34px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  background-color: #f8fafc !important;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 4h8l4 4v12H8z'/%3E%3Cpath d='M16 4v4h4'/%3E%3Cpath d='M11 13h6'/%3E%3Cpath d='M11 16h4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 11px center !important;
  background-size: 15px 15px !important;
  box-shadow: none !important;
  color: #334155 !important;
  cursor: default !important;
  caret-color: transparent !important;
  font-weight: 600 !important;
  resize: none !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field :is(textarea[readonly], .right-detail-wrap-textarea[readonly]),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field :is(textarea[readonly], .right-detail-wrap-textarea[readonly]) {
  background-position: 11px 10px !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-folder :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-folder :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]) {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.75 7.5h6l1.75 2h8.75v9.75H3.75z'/%3E%3Cpath d='M3.75 7.5v-2h5.5l1.75 2'/%3E%3C/svg%3E") !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-code :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-code :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]) {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 3 8 21'/%3E%3Cpath d='M16 3l-2 18'/%3E%3Cpath d='M4 9h16'/%3E%3Cpath d='M3 15h16'/%3E%3C/svg%3E") !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-date :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-date :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]) {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M4 10h16'/%3E%3C/svg%3E") !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-stat :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]),
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-kind-stat :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly]) {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 19V9'/%3E%3Cpath d='M12 19V5'/%3E%3Cpath d='M19 19v-7'/%3E%3C/svg%3E") !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly])::placeholder,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field :is(input[readonly], textarea[readonly], .right-detail-wrap-textarea[readonly])::placeholder {
  color: #64748b !important;
  opacity: 1 !important;
  font-weight: 500 !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field input[type="number"][readonly],
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field input[type="number"][readonly] {
  appearance: textfield !important;
}

.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field input[type="number"][readonly]::-webkit-inner-spin-button,
.detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field input[type="number"][readonly]::-webkit-outer-spin-button,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field input[type="number"][readonly]::-webkit-inner-spin-button,
body[class$="-theme"] .detail-panel #placeholderForm[data-detail-drawer-form="generic"] .readonly-detail-field input[type="number"][readonly]::-webkit-outer-spin-button {
  margin: 0 !important;
  appearance: none !important;
}

/* USER UPDATE: Menu 3 progress is automatic and explains the filename rules below the field. */
#placeholderForm[data-detail-menu="documentsAndTasks"] .task-progress-auto-detail-field,
body[class$="-theme"] #placeholderForm[data-detail-menu="documentsAndTasks"] .task-progress-auto-detail-field {
  gap: 6px !important;
}

#placeholderForm[data-detail-menu="documentsAndTasks"] .task-progress-auto-help,
body[class$="-theme"] #placeholderForm[data-detail-menu="documentsAndTasks"] .task-progress-auto-help {
  margin: 2px 0 0 !important;
  color: #475569 !important;
  font-size: 0.78rem !important;
  line-height: 1.55 !important;
  white-space: normal !important;
}

/* USER FIX: SidebarInset keeps a visible right app-frame gap on every menu route.
   Some table routes keep the workspace in detail-collapsed mode, so the
   right-detail-specific margin guard does not apply there. */
.app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"],
body[class$="-theme"] .app-shell[data-slot="sidebar-wrapper"] > .workspace[data-slot="sidebar-inset"] {
  margin-right: var(--pd-app-frame-gap, 12px) !important;
}