/* Module and late-pass overrides split from design-system.css so shared tokens/components stay readable. */
/* ------------------------------------------------------------------ */
/* App-confirm/prompt dialog (dialogs.js CSS-string injection override) */
/* ------------------------------------------------------------------ */
.appdlg                { background: var(--surface) !important; color: var(--text) !important; }
.appdlg-head           { color: var(--text) !important; }
.appdlg-msg            { color: var(--muted) !important; }
.appdlg-input          { border-color: var(--border) !important; background: var(--surface) !important; color: var(--text) !important; }
.appdlg-input:focus    { border-color: var(--accent) !important; outline-color: var(--accent-soft, #e6f1f9) !important; }
.appdlg-btn            { border-color: var(--border) !important; background: var(--surface) !important; color: var(--text) !important; }
.appdlg-btn:hover      { background: var(--surface-soft) !important; }
.appdlg-btn.primary    { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; }
.appdlg-btn.primary:hover { background: var(--accent-dark, var(--accent)) !important; }
.appdlg-btn.danger     { background: var(--danger) !important; border-color: var(--danger) !important; color: #fff !important; }
.appdlg-btn.danger:hover  { background: var(--danger) !important; filter: brightness(.9); }

/* ------------------------------------------------------------------ */
/* Work-orders module (workorders.js CSS-string injection override)    */
/* ------------------------------------------------------------------ */
.wo-toolbar           { background: var(--surface) !important; border-bottom-color: var(--border) !important; }
.wo-empty             { color: var(--muted-2) !important; }
.wo-card:hover        { background: var(--surface-soft) !important; border-color: var(--border-strong) !important; }
.wo-card .wo-title    { color: var(--text) !important; }
.wo-card .wo-sub,
.wo-card .wo-right    { color: var(--muted) !important; }
.wo-stats             { color: var(--muted) !important; }
.wo-stats b           { color: var(--accent) !important; }
.wo-section-title     { color: var(--muted-2) !important; }
.wo-log .wo-when      { color: var(--muted-2) !important; }
.wo-log .wo-k-system  { color: var(--muted) !important; }
#wo-detail-pane             { background: var(--surface) !important; border-color: var(--border) !important; }
#wo-detail-pane .wo-dp-head { background: var(--surface) !important; border-bottom-color: var(--border) !important; }
#wo-detail-pane .wo-detail-shell { background: var(--app-bg) !important; }
#wo-detail-pane .wo-d-hero { background: var(--surface) !important; border-color: var(--border) !important; }
#wo-detail-pane .wo-d-desc { color: var(--text) !important; }
#wo-detail-pane .wo-d-kpi  { background: var(--surface) !important; border-color: var(--border) !important; }
#wo-detail-pane .wo-d-kpi .lbl { color: var(--muted) !important; }
#wo-detail-pane .wo-d-kpi .val  { color: var(--text) !important; }
#wo-detail-pane .wo-d-card { background: var(--surface) !important; border-color: var(--border) !important; }
#wo-detail-pane .wo-d-card-title { background: var(--surface-soft) !important; border-bottom-color: var(--border) !important; color: var(--text) !important; }
#wo-detail-pane .wo-d-fact .k { color: var(--muted) !important; }
#wo-detail-pane .wo-d-fact .v { color: var(--text) !important; }
#wo-detail-pane .wo-d-photos figure { border-color: var(--border) !important; background: var(--surface-soft) !important; }
#wo-detail-pane .wo-d-addphoto { background: var(--surface-soft) !important; }
#wo-detail-pane .wo-d-timeline .wo-when { color: var(--muted) !important; }
#wo-detail-pane .wo-d-timeline .wo-k-system { color: var(--muted) !important; }
#wo-detail-pane .wo-d-addnote { background: var(--surface-soft) !important; border-top-color: var(--border) !important; }
.wo-field label { color: var(--text) !important; }
.wo-check       { color: var(--text) !important; }
.wo-detail-grid .k { color: var(--muted) !important; }

/* ------------------------------------------------------------------ */
/* Net-worth module (networth.js CSS-string injection override)        */
/* ------------------------------------------------------------------ */
.nw-card .lab    { color: var(--muted) !important; }
.nw-card.assets .val  { color: var(--success) !important; }
.nw-card.liab .val    { color: var(--warning) !important; }
.nw-card.equity .val  { color: var(--accent) !important; }
.nw-card.equity.neg .val { color: var(--danger) !important; }
.nw-break        { color: var(--muted) !important; }
.nw-break b      { color: var(--text) !important; }
.nw-sec          { color: var(--muted-2) !important; }
.nw-table th     { color: var(--muted) !important; background: var(--surface-soft) !important; }
.nw-table tr:hover td { background: var(--surface-hover) !important; }
.nw-eq-pos  { color: var(--success) !important; }
.nw-eq-neg  { color: var(--danger) !important; }
.nw-own-badge { background: var(--accent-soft) !important; color: var(--accent) !important; }
.nw-warn    { color: var(--warning) !important; }
.nw-missing { background: var(--warning-bg) !important; border-color: var(--gold,#fde68a) !important; color: var(--warning) !important; }
.nw-field label { color: var(--text) !important; }

/* ------------------------------------------------------------------ */
/* Vacancy-flow module (vacancyflow.js CSS-string injection override)  */
/* ------------------------------------------------------------------ */
#dashboard-vacancy .vf-card { background: var(--surface) !important; border-color: var(--border) !important; }
#dashboard-vacancy .vf-count { color: var(--muted) !important; }
#dashboard-vacancy .vf-bar   { background: var(--surface-soft) !important; }
#dashboard-vacancy .vf-bar i { background: var(--success) !important; }
#dashboard-vacancy .vf-step.done    { color: var(--success) !important; }
#dashboard-vacancy .vf-step.todo    { color: var(--muted-2) !important; }
#dashboard-vacancy .vf-step.now,
#dashboard-vacancy .vf-step.partial { color: var(--text) !important; }
#dashboard-vacancy .vf-step .dt     { color: var(--muted) !important; }
#dashboard-vacancy .vf-cta .hint    { color: var(--muted) !important; }
#dashboard-vacancy .vf-top .right   { color: var(--muted) !important; }

/* ------------------------------------------------------------------ */
/* Messages module — unread badge                                      */
/* ------------------------------------------------------------------ */
.msg-unread-badge { background: var(--danger) !important; }

/* ------------------------------------------------------------------ */
/* Files module (files.js CSS-string injection structural override)    */
/* ------------------------------------------------------------------ */
/* File-type semantic colors (PDF=red, DOCX=blue, XLSX=green, IMG=purple)
   are left intentional. Only structural surfaces and text are tokenized. */
.fh-new-menu    { background: var(--surface) !important; }
.fh-addtag      { color: var(--muted) !important; }
.fh-addtag:hover{ background: var(--surface-soft) !important; color: var(--accent) !important; }
.fh-tag         { background: var(--surface-soft) !important; color: var(--text) !important; }
.fh-tag:hover   { background: var(--surface-hover) !important; }
.fh-tag.on      { background: var(--accent) !important; color: #fff !important; }
.fh-ctx-item.danger { color: var(--danger) !important; }
.fh-snip mark   { background: var(--gold, #fde68a) !important; }
.fh-exp.ok   { background: var(--success-bg) !important; color: var(--success) !important; }
.fh-exp.soon { background: var(--warning-bg) !important; color: var(--warning) !important; }
.fh-exp.exp  { background: var(--danger-bg)  !important; color: var(--danger)  !important; }

/* ------------------------------------------------------------------ */
/* Access-control module (CSS-string injection override)               */
/* ------------------------------------------------------------------ */
#access-control-card .ac-pill.off  { background: var(--surface-soft) !important; color: var(--muted) !important; }
#access-control-card .ac-error     { border-color: var(--danger) !important; background: var(--danger-bg) !important; color: var(--danger) !important; }

/* ------------------------------------------------------------------ */
/* Data-health module (CSS-string injection override)                  */
/* ------------------------------------------------------------------ */
#data-health-card .dh-score.good   { background: var(--success-bg) !important; color: var(--success) !important; }
#data-health-card .dh-score.warn   { background: var(--warning-bg) !important; color: var(--warning) !important; }
#data-health-card .dh-score.bad    { background: var(--danger-bg)  !important; color: var(--danger)  !important; }
#data-health-card .dh-high .dh-ic  { background: var(--danger-bg)  !important; color: var(--danger)  !important; }
#data-health-card .dh-warn .dh-ic  { background: var(--warning-bg) !important; color: var(--warning) !important; }
#data-health-card .dh-info .dh-ic  { background: var(--info-bg)    !important; color: var(--info)    !important; }

/* ------------------------------------------------------------------ */
/* Restore emoji nav icons — the redesign's monochrome line-icon boxes  */
/* (::before/::after) hid the original emoji. The icon spans are filled  */
/* with emoji in JS (sidebar: layout.js, top bar: web-topbar.js, layout  */
/* card: layout.js), so suppress the drawn boxes and let the emoji show. */
/* ------------------------------------------------------------------ */
.sidebar .sb-btn .nav-line-icon::before,
.sidebar .sb-btn .nav-line-icon::after,
#pms-topbar .pms-shortcut-icon::before,
#pms-topbar .pms-shortcut-icon::after,
#layout-card .lay-shortcut-icon::before,
#layout-card .lay-shortcut-icon::after {
  content: none !important;
  border: 0 !important;
  background: none !important;
}
.sidebar .sb-btn .nav-line-icon,
#pms-topbar .pms-shortcut-icon,
#layout-card .lay-shortcut-icon {
  font-size: 15px !important;
  line-height: 1 !important;
  color: initial !important;
}

/* ------------------------------------------------------------------ */
/* Restore file-type color coding in the Files/Documents hub.           */
/* The generic ".fh-tile { background/border !important }" rule above    */
/* and the ".fh-thumb { filter: saturate(.35) }" rule flattened the      */
/* per-type colors files.js sets (PDF=red, DOCX=blue, XLSX=green,        */
/* image/video=amber). These more-specific rules win them back.         */
/* ------------------------------------------------------------------ */
.fh-tile.t-pdf   { border-top: 3px solid #e0635e !important; background: #fdf4f3 !important; }
.fh-tile.t-docx  { border-top: 3px solid #3f6fb3 !important; background: #f2f7fd !important; }
.fh-tile.t-xlsx  { border-top: 3px solid #3f9d6b !important; background: #f1faf4 !important; }
.fh-tile.t-img   { border-top: 3px solid #e6b800 !important; background: #fff8e1 !important; }
.fh-tile.t-video { border-top: 3px solid #e6b800 !important; background: #fff8e1 !important; }
.fh-tile.t-other { border-top: 3px solid var(--border-strong) !important; }

/* Un-mute the file-type thumbnails/icons so the colors read clearly. */
.fh-folder .ic,
.fh-thumb,
.fh-mini { filter: none !important; }

/* ------------------------------------------------------------------ */
/* Compact sidebar — fit every nav item on one screen (mockup parity).  */
/* The redesign mockup's sidebar needed no scroll because it used tight  */
/* spacing and no inter-item gap. Match that density: smaller item       */
/* height, near-zero gap, tighter section labels / search / brand.       */
/* ------------------------------------------------------------------ */
.sidebar {
  padding: 8px 10px !important;
  gap: 1px !important;
  --nav-item-h: 25px;
}
.sidebar h2 {
  margin: 0 2px 5px !important;
  font-size: 12.5px !important;
}
.sidebar .sb-btn {
  height: 25px !important;
  min-height: 25px !important;
  padding: 0 10px !important;
  font-size: 12.5px !important;
}
.sidebar .section-label {
  padding: 3px 10px 1px !important;
  font-size: 9.5px !important;
}
.sidebar .sb-search-wrap {
  padding: 0 0 4px !important;
}
.sidebar .sb-search {
  padding: 5px 10px !important;
}
.sidebar .divider {
  margin: 5px 6px !important;
}

/* ------------------------------------------------------------------ */
/* Browse split: float the list and record as separate cards on the    */
/* background with a gap between them (matches the redesign mockup).    */
/* ------------------------------------------------------------------ */
@media (min-width: 901px) {
  #picker-modal.browse-split-mode > .picker-modal {
    gap: 0 14px !important;
    padding: 14px !important;
    background: var(--app-bg) !important;
    border: 0 !important;
    overflow: visible !important;
  }
  /* The list column = the filter/search header (top) plus the result table
     (bottom) joined into one rounded card. */
  #picker-modal.browse-split-mode .picker-search {
    border: 1px solid var(--border) !important;
    border-bottom: 0 !important;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important;
    background: var(--surface) !important;
  }
  #picker-modal.browse-split-mode .browse-record-pane:first-child {
    border: 1px solid var(--border) !important;
    border-top: 0 !important;
    border-radius: 0 0 var(--radius-lg) var(--radius-lg) !important;
    background: var(--surface) !important;
  }
  /* The record detail is its own card. */
  #picker-modal.browse-split-mode .browse-record-detail {
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-lg) !important;
    background: var(--surface) !important;
  }
}