/* Claude-gallery consistency layer.
   This file does not redefine Kirchhoff's component system; it closes the
   recurring layout/overflow details visible when the full 50-screen gallery is
   reviewed as one product. Keep it after enterprise.css/brand.css and before
   browser-qa-responsive.css. */

/* Every flex/grid record surface must be allowed to shrink without forcing the
   work area wider than its shell. */
.kd-main,
.kd-content,
.kd-page,
.kd-page-header,
.kd-page-header > *,
.kd-grid,
.kd-grid > *,
.kd-card,
.kd-card-header,
.kd-card-header > *,
.kd-row,
.kd-row > *,
.kd-erp-record-header,
.kd-erp-record-header > *,
.kd-erp-worklist,
.kd-erp-worklist-head,
.kd-erp-worklist-head > *,
.kd-topbar-title,
.kd-topbar-search {
  min-width: 0;
}

/* Financial/operational figures should not visibly shift as values update. */
.kd-stat-value,
.kd-num,
.kd-mono,
.kd-nav-count,
.kd-badge,
.kd-table td,
.kd-table th,
input[type="number"] {
  font-variant-numeric: tabular-nums;
}

/* Preserve the gallery's crisp page-header hierarchy at every module. */
.kd-page-header > div:first-child {
  flex: 1 1 360px;
  min-width: 0;
}

.kd-page-header h2,
.kd-card-header h3,
.kd-topbar-title h1,
.kd-brand-name,
.kd-brand-tag {
  overflow: hidden;
  text-overflow: ellipsis;
}

.kd-page-actions {
  margin-left: auto;
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* The command/search bar in the accepted gallery never overlaps title/actions. */
.kd-topbar-search > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kd-topbar-actions {
  flex: none;
}

/* Dense worklists need a reliable stacking context for sticky headers. */
.kd-table-wrap {
  isolation: isolate;
  max-width: 100%;
}

.kd-table thead th {
  z-index: 2;
}

.kd-table tbody td,
.kd-table thead th {
  vertical-align: middle;
}

/* A long identifier should truncate locally rather than expand an entire card. */
.kd-table td,
.kd-erp-record-meta > *,
.kd-stat-label,
.kd-stat-foot,
.kd-subtle,
.kd-muted {
  overflow-wrap: anywhere;
}

.kd-badge {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Tabs and enterprise-center navigation remain one-line, scrollable work-center
   selectors instead of wrapping into irregular rows. */
.kd-tabs,
.kd-erp-subtabs,
.kd-enterprise-centers {
  overscroll-behavior-x: contain;
}

.kd-tab,
.kd-erp-subtab,
.kd-enterprise-center-tab {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Modal/board scrolling should stay inside the active work surface. */
.kd-modal-body,
.kd-palette-list,
.kd-kanban,
.kd-table-wrap {
  overscroll-behavior: contain;
}

.kd-modal-body,
.kd-palette-list {
  scrollbar-gutter: stable;
}

.kd-kanban-scroll {
  min-width: 0;
  max-width: 100%;
}

/* The merged Jobs board is click-to-open, not drag-and-drop. Do not advertise
   a drag affordance until a real status-move workflow exists. */
.kd-kanban-card[data-open],
.kd-row-clickable[data-open] {
  cursor: pointer;
}

.kd-kanban-card[data-open] {
  border-top-width: 2px;
}

/* Empty states in the gallery are compact worklist states, not marketing hero
   sections. Avoid consuming most of a desktop viewport for zero records. */
.kd-card .kd-empty,
.kd-erp-worklist .kd-empty {
  min-height: 88px;
  padding-top: 22px;
  padding-bottom: 22px;
}

/* Interactive record rows should expose keyboard focus as clearly as hover. */
.kd-row-clickable:focus-visible,
.kd-kanban-card:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

/* Keep dark mode's accepted gallery geometry crisp; borders—not glow—separate
   neighboring record surfaces. */
:root[data-theme="dark"] .kd-card,
:root[data-theme="dark"] .kd-stat,
:root[data-theme="dark"] .kd-stat-card,
:root[data-theme="dark"] .kd-erp-worklist,
:root[data-theme="dark"] .kd-erp-record-header,
:root[data-theme="dark"] .kd-table-wrap {
  box-shadow: none;
}

/* Security is still available from navigation in narrow browser QA. Hiding the
   verbose live AAL indicator prevents it from consuming the entire command bar
   in an iPhone/tablet inspection viewport. Electron desktop is unaffected. */
@media (max-width: 980px) {
  html[data-kirchhoff-browser-qa="true"] #kd-security-indicator {
    display: none !important;
  }
}
