/*
 * Horizon Blue defines its light appearance after the shared dark palette.
 * Keep the dark palette authoritative for components that otherwise retain
 * hard-coded light-theme colours.
 */
:root[data-theme="dark"][data-visual-theme="stitch"] h1,
:root[data-theme="dark"][data-visual-theme="stitch"] h2,
:root[data-theme="dark"][data-visual-theme="stitch"] h3,
:root[data-theme="dark"][data-visual-theme="stitch"] h4,
:root[data-theme="dark"][data-visual-theme="stitch"] h5,
:root[data-theme="dark"][data-visual-theme="stitch"] h6 {
  color: var(--ink);
}

:root[data-theme="dark"][data-visual-theme="stitch"] .button-primary,
:root[data-theme="dark"][data-visual-theme="stitch"] .button-primary.button-sm,
:root[data-theme="dark"][data-visual-theme="stitch"] .hr-filter-actions .button-primary {
  color: #fff;
  border-color: #3b82f6;
  background: #2563eb;
}

:root[data-theme="dark"][data-visual-theme="stitch"] .button-primary:hover,
:root[data-theme="dark"][data-visual-theme="stitch"] .button-primary.button-sm:hover,
:root[data-theme="dark"][data-visual-theme="stitch"] .hr-filter-actions .button-primary:hover {
  color: #fff;
  border-color: #60a5fa;
  background: #1d4ed8;
}

:root[data-theme="dark"][data-visual-theme="stitch"] .tab {
  color: var(--muted);
}

:root[data-theme="dark"][data-visual-theme="stitch"] .progress-track,
:root[data-theme="dark"][data-visual-theme="stitch"] .inline-progress {
  background: var(--surface-subtle);
}

:root[data-theme="dark"][data-visual-theme="stitch"] .hr-photo-upload {
  color: var(--ink);
  border-color: var(--line);
  background: var(--surface-subtle);
}

:root[data-theme="dark"][data-visual-theme="stitch"] .hr-photo-upload:hover {
  border-color: var(--brand);
  background: var(--brand-soft);
}

:root[data-theme="dark"][data-visual-theme="stitch"] .hr-filter-heading__icon {
  color: var(--brand);
  background: var(--brand-soft);
}

/* Audit of 2026-10-08: text that fell below a readable contrast on dark surfaces. */
:root[data-theme="dark"][data-visual-theme] .button-danger,
:root[data-theme="dark"][data-visual-theme] .button.button-danger {
  background: #be123c;
  border-color: #be123c;
  color: #fff;
}
:root[data-theme="dark"][data-visual-theme] .button-danger:hover {
  background: #9f1239;
  border-color: #9f1239;
}
/* White glyphs sat on the light brand blue of the dark theme. */
:root[data-theme="dark"][data-visual-theme] .executive-period-link.is-active,
:root[data-theme="dark"][data-visual-theme] .analysis-type-switch__mark,
:root[data-theme="dark"][data-visual-theme] .system-settings-group-heading__eyebrow,
:root[data-theme="dark"][data-visual-theme] .year-company-logo,
:root[data-theme="dark"][data-visual-theme] .employee-job-title-add,
:root[data-theme="dark"][data-visual-theme] .approved-import-step__number,
:root[data-theme="dark"][data-visual-theme] .approved-import-dropzone__icon,
:root[data-theme="dark"][data-visual-theme] .job-title-import-step__number,
:root[data-theme="dark"][data-visual-theme] .job-title-import-dropzone__icon,
:root[data-theme="dark"][data-visual-theme] .structure-saved-mode__mark {
  color: #0b1220;
}
:root[data-theme="dark"][data-visual-theme] .executive-period-link.is-active * {
  color: #0b1220;
}
/* Contract paper stays white in the dark theme, so its headings stay dark. */
:root[data-theme="dark"][data-visual-theme] #contract-preview-paper h1,
:root[data-theme="dark"][data-visual-theme] #contract-preview-paper h2,
:root[data-theme="dark"][data-visual-theme] #contract-preview-paper h3,
:root[data-theme="dark"][data-visual-theme] #contract-preview-paper h4,
:root[data-theme="dark"][data-visual-theme] .contract-document h1,
:root[data-theme="dark"][data-visual-theme] .contract-document h2,
:root[data-theme="dark"][data-visual-theme] .contract-document h3,
:root[data-theme="dark"][data-visual-theme] .contract-document h4 {
  color: #0f172a;
}
:root[data-theme="dark"][data-visual-theme] .contract-remaining,
:root[data-theme="dark"][data-visual-theme] .contract-remaining * {
  color: #6b4708;
}
:root[data-theme="dark"][data-visual-theme] .contract-template-banner-icon,
:root[data-theme="dark"][data-visual-theme] .result-consistency-info-icon,
:root[data-theme="dark"][data-visual-theme] .year-accordion-chevron,
:root[data-theme="dark"][data-visual-theme] .alert-icon {
  color: #0b1220;
}
:root[data-theme="dark"][data-visual-theme] .state-icon.success {
  color: #1d4ed8;
}
:root[data-theme="dark"][data-visual-theme] .record-item nav a {
  color: #93c5fd;
}
/* The anonymous report is a white sheet in both themes. */
:root[data-theme="dark"][data-visual-theme] .anonymous-report-document h1,
:root[data-theme="dark"][data-visual-theme] .anonymous-report-document h2,
:root[data-theme="dark"][data-visual-theme] .anonymous-report-document h3,
:root[data-theme="dark"][data-visual-theme] .anonymous-report-document h4 {
  color: #0f172a;
}

/* Audit of 2026-10-09, all dark themes: every page measured, as was done for the steel gray theme. */
/* HR boxes mixed the accent into white, which left pale boxes under light text. Mix it into the surface instead. */
:root[data-theme="dark"][data-visual-theme="stitch"] .contract-page,
:root[data-theme="dark"][data-visual-theme="evaluation"] .contract-page,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .contract-page {
  --contract-tint: color-mix(in srgb, var(--contract-accent) 9%, var(--surface));
  --contract-tint-strong: color-mix(in srgb, var(--contract-accent) 18%, var(--surface));
}
/* White on a light accent: the counter, the active cycle tab, done marks, and the green theme's primary button. */
:root[data-theme="dark"][data-visual-theme] .notification-count {
  background: #be123c;
  color: #fff;
}
:root[data-theme="dark"][data-visual-theme] .cycle-local-navigation a.is-active,
:root[data-theme="dark"][data-visual-theme] .complete > span,
:root[data-theme="dark"][data-visual-theme] .annual-formula strong small,
:root[data-theme="dark"][data-visual-theme="evaluation"] .button-primary,
:root[data-theme="dark"][data-visual-theme="evaluation"] .button.button-primary {
  color: #06231b;
}
/* The mark and the chevron are filled only when active or open; at rest they sit on a dark tint. */
:root[data-theme="dark"][data-visual-theme="stitch"] .analysis-type-switch__option:not(.is-active) .analysis-type-switch__mark,
:root[data-theme="dark"][data-visual-theme="evaluation"] .analysis-type-switch__option:not(.is-active) .analysis-type-switch__mark,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .analysis-type-switch__option:not(.is-active) .analysis-type-switch__mark,
:root[data-theme="dark"][data-visual-theme="stitch"] .year-accordion-item:not([open]) .year-accordion-chevron,
:root[data-theme="dark"][data-visual-theme="evaluation"] .year-accordion-item:not([open]) .year-accordion-chevron,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .year-accordion-item:not([open]) .year-accordion-chevron {
  color: var(--brand);
}
/* Light icon tiles keep a dark blue glyph; the neon theme's tile is dark. */
:root[data-theme="dark"][data-visual-theme="stitch"] .state-icon,
:root[data-theme="dark"][data-visual-theme="evaluation"] .state-icon {
  color: #1d4ed8;
}
:root[data-theme="dark"][data-visual-theme="nexaverse"] .state-icon,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .state-icon.success {
  color: var(--brand);
}
/* More white text on the light accent, and a pale box left in the dark. */
:root[data-theme="dark"][data-visual-theme="stitch"] .average-tab.is-active b,
:root[data-theme="dark"][data-visual-theme="evaluation"] .average-tab.is-active b,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .average-tab.is-active b,
:root[data-theme="dark"][data-visual-theme="stitch"] .annual-formula > strong,
:root[data-theme="dark"][data-visual-theme="evaluation"] .annual-formula > strong,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .annual-formula > strong {
  color: #0b1220;
}
:root[data-theme="dark"][data-visual-theme="stitch"] .evaluation-workflow-year-complete__mark,
:root[data-theme="dark"][data-visual-theme="evaluation"] .evaluation-workflow-year-complete__mark,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .evaluation-workflow-year-complete__mark {
  background: #123c2a;
  color: #8ee6b5;
}
:root[data-theme="dark"][data-visual-theme="evaluation"] .manager-direct-actions .button-primary {
  color: var(--ink);
}
/* Salary and record notes used a fixed slate that is too dim on dark surfaces. */
:root[data-theme="dark"][data-visual-theme="stitch"] .pay-total small,
:root[data-theme="dark"][data-visual-theme="evaluation"] .pay-total small,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .pay-total small,
:root[data-theme="dark"][data-visual-theme="stitch"] .pay-total strong span,
:root[data-theme="dark"][data-visual-theme="evaluation"] .pay-total strong span,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .pay-total strong span,
:root[data-theme="dark"][data-visual-theme="stitch"] .pay-since,
:root[data-theme="dark"][data-visual-theme="evaluation"] .pay-since,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .pay-since,
:root[data-theme="dark"][data-visual-theme="stitch"] .pay-line dt,
:root[data-theme="dark"][data-visual-theme="evaluation"] .pay-line dt,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .pay-line dt,
:root[data-theme="dark"][data-visual-theme="stitch"] .record-notes,
:root[data-theme="dark"][data-visual-theme="evaluation"] .record-notes,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .record-notes,
:root[data-theme="dark"][data-visual-theme="stitch"] .record-archive > summary,
:root[data-theme="dark"][data-visual-theme="evaluation"] .record-archive > summary,
:root[data-theme="dark"][data-visual-theme="nexaverse"] .record-archive > summary {
  color: var(--muted);
}
