/* Quiet Turn Ivory color theme.
   This file owns color only: semantic roles for light and dark modes. It must
   not contain component selectors or layout rules. */
:root[data-color-theme="quiet-turn-ivory"] {
  --paper: #fcf9f2;
  --ink: #1c1c18;
  --muted: #434845;
  --line: #c3c8c4;
  --card: #f1eee7;
  --surface-low: #f6f3ec;
  --surface-high: #e5e2db;

  --accent: #17201c;
  --accent-dk: #25190f;
  --accent-text: #17201c;
  --accent-2: #6c5b4d;
  --accent-contrast: #fcf9f2;
  --primary-hover-bg: #365344;
  --primary-hover-text: #fcf9f2;
  --editorial-highlight: #d8c3b2;
  --assessment-progress: #57605c;
  --link: #17201c;
  --link-hover: #6c5b4d;
  --focus-ring: #6c5b4d;
  --ring: rgba(87, 96, 92, 0.5);

  --accent-tint: rgba(216, 195, 178, 0.34);
  --accent-2-tint: rgba(108, 91, 77, 0.14);
  --accent-tint-2: rgba(216, 195, 178, 0.46);
  --accent-tint-3: rgba(216, 195, 178, 0.62);

  --nav-bg: #17201c;
  --nav-text: #fcf9f2;
  --nav-cta-bg: #526f61;
  --nav-cta-text: #fcf9f2;
  --nav-toggle-hover-bg: #d8c3b2;
  --nav-toggle-hover-text: #25190f;
  --on-dark: #fcf9f2;
  --on-dark-muted: rgba(252, 249, 242, 0.74);
  --on-accent-muted: rgba(252, 249, 242, 0.2);
  --on-dark-shadow: rgba(252, 249, 242, 0.04);

  --surface-stripe: rgba(23, 32, 28, 0.025);
  --shadow-soft: 0 1px 2px rgba(23, 32, 28, 0.06);
  --shadow-card: 0 10px 32px rgba(23, 32, 28, 0.1);
  --shadow-start: 0 16px 44px rgba(23, 32, 28, 0.14);
  --shadow-sticky: 0 -4px 16px rgba(23, 32, 28, 0.12);
  --shadow-float: 0 3px 12px rgba(23, 32, 28, 0.16);
  --shadow-slider: 0 1px 4px rgba(23, 32, 28, 0.16);
  --video-play-bg: rgba(252, 249, 242, 0.16);
  --overlay-dark: rgba(23, 32, 28, 0.58);

  --diagram-bg: #17201c;
  --diagram-line: rgba(216, 195, 178, 0.3);
  --diagram-muted: #bec9c2;
  --diagram-highlight: #d8c3b2;
  --diagram-node: #fcf9f2;
  --diagram-mermaid-line: #bec9c2;
  --chart-tooltip-bg: #17201c;
  --chart-tooltip-fg: #fcf9f2;

  --facet-leader: #6c5b4d;
  --facet-organization: #17201c;
  --facet-conditions: #4f6b5e;
  --cohort-band: rgba(23, 32, 28, 0.1);
}

:root[data-color-theme="quiet-turn-ivory"][data-mode="dark"] {
  --paper: #111413;
  --ink: #e1e3e1;
  --muted: #d1c4bb;
  --line: #4e453f;
  --card: #1d201f;
  --surface-low: #191c1b;
  --surface-high: #282b29;

  --accent: #5f8f73;
  --accent-dk: #dce7e0;
  --accent-text: #bec9c2;
  --accent-2: #d8c3b2;
  --accent-contrast: #111413;
  --primary-hover-bg: #85b197;
  --primary-hover-text: #111413;
  --editorial-highlight: #d8c3b2;
  --assessment-progress: #bec9c2;
  --link: #bec9c2;
  --link-hover: #dce7e0;
  --focus-ring: #bec9c2;
  --ring: rgba(190, 201, 194, 0.56);

  --accent-tint: rgba(190, 201, 194, 0.14);
  --accent-2-tint: rgba(216, 195, 178, 0.12);
  --accent-tint-2: rgba(190, 201, 194, 0.18);
  --accent-tint-3: rgba(190, 201, 194, 0.26);

  --nav-bg: #0c0f0e;
  --nav-text: #e1e3e1;
  --nav-cta-bg: #5f8f73;
  --nav-cta-text: #111413;
  --nav-toggle-hover-bg: #dce7e0;
  --nav-toggle-hover-text: #111413;
  --on-dark: #e1e3e1;
  --on-dark-muted: rgba(225, 227, 225, 0.74);
  --on-accent-muted: rgba(190, 201, 194, 0.22);
  --on-dark-shadow: rgba(225, 227, 225, 0.04);

  --surface-stripe: rgba(190, 201, 194, 0.035);
  --shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.18);
  --shadow-card: 0 10px 32px rgba(0, 0, 0, 0.28);
  --shadow-start: 0 16px 44px rgba(0, 0, 0, 0.34);
  --shadow-sticky: 0 -4px 16px rgba(0, 0, 0, 0.34);
  --shadow-float: 0 3px 12px rgba(0, 0, 0, 0.32);
  --shadow-slider: 0 1px 4px rgba(0, 0, 0, 0.3);
  --video-play-bg: rgba(225, 227, 225, 0.14);
  --overlay-dark: rgba(0, 0, 0, 0.62);

  --diagram-bg: #0c0f0e;
  --diagram-line: rgba(190, 201, 194, 0.3);
  --diagram-muted: #d8c3b2;
  --diagram-highlight: #bec9c2;
  --diagram-node: #1d201f;
  --diagram-mermaid-line: #d8c3b2;
  --chart-tooltip-bg: #0c0f0e;
  --chart-tooltip-fg: #e1e3e1;

  --facet-leader: #d8c3b2;
  --facet-organization: #bec9c2;
  --facet-conditions: #9fc4b1;
  --cohort-band: rgba(225, 227, 225, 0.14);
}
