/*
 * Dark theme of the research drafts. Light is the default; dark is <html data-theme="dark"> (set before the
 * first paint by theme-init.js, switched by theme.js). Load it after docs.css and research.css.
 *
 * 1. Shared tokens: the docs.oraclizer.io dark palette (Web/Docs/src/app/globals.css), itself the night
 *    palette of the company site's dark sections (Web/Home/src/app/globals.css: --night and --night-soft
 *    grounds, #c0cad8 body and #8c99ab secondary text, #8fb4fb blue, hairlines from --line-dark, cyan
 *    focus). docs.css already carries these values; they are repeated so any page switches with this file.
 * 2. Research tokens: the colours research.css writes as fixed light values (white cards, chips and
 *    fields, blue-grey borders and labels, text on an ink fill), each with its dark counterpart.
 * 3. Overrides: the research.css rules that use those fixed values, pointed at the tokens in the dark
 *    theme only, so the light theme stays exactly as drawn. Night sections (.rs-night) are dark in both
 *    themes and keep their own colours. Once research.css uses the tokens directly, part 3 can go.
 */

:root {
  --rs-surface: #fff;
  --rs-surface-line: #cdd8ea;
  --rs-field: #fff;
  --rs-label: #536178;
  --rs-section-blue: #e8edf5;
  --rs-on-ink: #fff;
  --rs-on-ink-muted: #aeb8c8;
  --rs-row-hover: rgba(36, 115, 255, 0.04);
  --rs-menu-shadow: 0 18px 50px rgba(5, 8, 13, 0.18);
}

html[data-theme="dark"] {
  color-scheme: dark;
  /* 1. shared tokens (docs dark theme) */
  --ink: #edf2f9;
  --ink-soft: #c0cad8;
  --muted: #8c99ab;
  --line: rgba(221, 235, 255, 0.12);
  --line-soft: rgba(221, 235, 255, 0.07);
  --line-strong: rgba(221, 235, 255, 0.22);
  --paper: #101826;
  --paper-blue: #0f1f3a;
  --white: var(--night-soft);
  --page: var(--night);
  --panel: #0e1521;
  --blue-text: #8fb4fb;
  --tint: #111b2b;
  --focus: var(--cyan);
  --link-line: rgba(143, 180, 251, 0.4);
  --mark-bg: rgba(91, 140, 255, 0.3);
  --mark-text: #e1ebff;
  --code-bg: #121c2d;
  --code-border: rgba(143, 180, 251, 0.18);
  --code-text: #b6ccf5;
  --codeblock-bg: var(--night);
  --note-bg: #0e1828;
  --note-stripe: #111d31;
  --tip-bg: #0b1b22;
  --tip-label: #6fd6ea;
  --important-label: #a9c6ff;
  --warn-bg: #12151b;
  --warning-label: #e2b25c;
  --caution-label: #f0957d;
  /* 2. research tokens */
  --rs-surface: var(--panel);
  --rs-surface-line: rgba(221, 235, 255, 0.16);
  --rs-field: #09111e;
  --rs-label: #8c99ab;
  --rs-section-blue: #111b2b;
  --rs-on-ink: #05080d;
  --rs-on-ink-muted: #59677b;
  --rs-row-hover: rgba(91, 140, 255, 0.08);
  --rs-menu-shadow: 0 18px 50px rgba(0, 0, 0, 0.55);
}

/* 3. research.css rules with fixed light colours, dark theme only */
html[data-theme="dark"] body {
  background: var(--page);
}
html[data-theme="dark"] .rs-card,
html[data-theme="dark"] .rs-output,
html[data-theme="dark"] .rs-path a {
  background: var(--rs-surface);
}
html[data-theme="dark"] .rs-card--lead {
  border-color: var(--rs-surface-line);
  background: var(--paper-blue);
}
html[data-theme="dark"] .rs-path a:hover {
  background: var(--paper-blue);
}
html[data-theme="dark"] .rs-label:not(.rs-night *):not(.rs-label--blue) {
  color: var(--rs-label);
}
html[data-theme="dark"] .rs-section--blue {
  background: var(--rs-section-blue);
}
html[data-theme="dark"] .rs-button--ink {
  color: var(--rs-on-ink);
}
html[data-theme="dark"] .rs-panel,
html[data-theme="dark"] .rs-chapter__outputs {
  border-color: var(--rs-surface-line);
}
html[data-theme="dark"] .rs-chapter__outputs a {
  border-top-color: var(--rs-surface-line);
}
html[data-theme="dark"] .rs-panel small {
  color: var(--rs-label);
}
html[data-theme="dark"] .rs-form input {
  background: var(--rs-field);
}
html[data-theme="dark"] .rs-form input::placeholder {
  color: var(--muted);
}
html[data-theme="dark"] .rs-rows a:hover {
  background: var(--rs-row-hover);
}
html[data-theme="dark"] .rs-chip:not(.rs-night *) {
  background: var(--rs-surface);
}
html[data-theme="dark"] .rs-chip[aria-current="page"]:not(.rs-night *) {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--rs-on-ink);
}
html[data-theme="dark"] .rs-chip[aria-current="page"]:not(.rs-night *) span {
  color: var(--rs-on-ink-muted);
}
/* The citation panel of the round 2 article page sets a white ground inline (r2/site.js). */
html[data-theme="dark"] .rs-after .rs-panel {
  background: var(--rs-surface) !important;
}