/* Color experiment. The original teal palette remains in modern.css.
   Enable with <html data-palette="graphite-cyan">; remove the attribute to revert. */
:root[data-palette="graphite-cyan"] {
  --color-primary: #0891b2;
  --color-primary-hover: #0e7490;
  --color-secondary: #cffafe;
  --color-accent: #06b6d4;
  --color-ink: #18181b;
  --color-text: #18181b;
  --color-text-muted: #52525b;
  --color-background: #fafafa;
  --color-surface: #ffffff;
  --color-surface-alt: var(--color-secondary);
  --color-border: #e4e4e7;
  --color-danger: #d94a4a;
  --color-warning: #d98a24;
  --color-success: #27865f;
  --navbar-surface: var(--color-ink);
  --shadow-panel: 0 4px 18px rgb(24 24 27 / 5%);
  --shadow-hover: 0 8px 24px rgb(24 24 27 / 9%);
  --focus-ring: 0 0 0 3px rgb(6 182 212 / 25%);
  /* Flat background for the minimalist experiment; original gradients remain available. */
  --ocean-pearl-layer1: none;
  --ocean-pearl-layer2: none;
  --bs-link-color-rgb: 8, 145, 178;
  --bs-link-hover-color-rgb: 14, 116, 144;
  --bs-primary-rgb: 8, 145, 178;
  /* Graphite labels remain legible on the bright cyan interaction surfaces. */
  --button-primary-text: var(--color-ink);
  --button-primary-hover: var(--color-accent);
  --button-ghost-text: var(--color-primary-hover);
}
:root[data-palette="graphite-cyan"] .site-navbar .nav-item.active .nav-link,
:root[data-palette="graphite-cyan"] .site-navbar .nav-link.active,
:root[data-palette="graphite-cyan"] .list-group-item.section-header,
:root[data-palette="graphite-cyan"] .list-group-title,
:root[data-palette="graphite-cyan"] .list-group-title a,
:root[data-palette="graphite-cyan"] .list-group-title .bi,
:root[data-palette="graphite-cyan"] .list-group-title strong,
:root[data-palette="graphite-cyan"] .upload-carousel-pages [aria-current="true"] {
  color: var(--color-ink);
}