/* Align the furo docs with aitomistic.com / the Protomia docs.
   Those sites use Outfit and the --protomia-* palette; furo ships its own
   type stack and a violet brand colour, which is why the two looked like
   different products side by side. Only furo's own variables are set here,
   so the theme keeps working and this survives a furo upgrade. */

:root,
body {
  /* the shared palette, same values as the website's globals.css */
  --protomia-ink: #102033;
  --protomia-accent: #019af7;
  --protomia-accent-strong: #2344e7;
  --protomia-accent-soft: rgba(1, 154, 247, 0.14);
}

body {
  /* type */
  --font-stack: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-stack--headings: var(--font-stack);

  /* brand + links */
  --color-brand-primary: var(--protomia-accent);
  --color-brand-content: var(--protomia-accent);
  --color-brand-visited: var(--protomia-accent-strong);
  --color-link: var(--protomia-accent);
  --color-link--hover: var(--protomia-accent-strong);
  --color-link-underline: transparent;
  --color-link-underline--hover: var(--protomia-accent);

  /* text */
  --color-foreground-primary: var(--protomia-ink);
  --color-foreground-secondary: rgba(16, 32, 51, 0.72);
  --color-foreground-muted: rgba(16, 32, 51, 0.55);

  /* The left table of contents and the right on-this-page rail.
     Furo declares every --color-sidebar-* / --color-toc-* variable exactly once,
     on plain `body`, DERIVED from a base variable — --color-sidebar-background is
     var(--color-background-secondary), --color-toc-item-text is
     var(--color-foreground-secondary), and so on — and then re-declares only the
     BASE variables for dark mode. A literal light value written here is therefore
     never overridden, and the sidebar stays light while the page goes dark.
     So: derive from the same bases furo does (they already follow the theme), and
     give the few genuinely light-specific literals a dark counterpart at the
     bottom of this file. */
  --color-sidebar-background: var(--color-background-secondary);
  --color-sidebar-background-border: rgba(0, 0, 0, 0.06);
  --color-sidebar-link-text: var(--color-foreground-primary);
  --color-sidebar-link-text--top-level: var(--color-foreground-primary);
  --color-sidebar-item-background--current: var(--protomia-accent-soft);
  --color-sidebar-item-background--hover: var(--protomia-accent-soft);
  --color-sidebar-brand-text: var(--color-foreground-primary);
  --color-sidebar-search-border: rgba(0, 0, 0, 0.10);
  --color-toc-item-text: rgba(16, 32, 51, 0.70);
  --color-toc-item-text--active: var(--protomia-accent);

  /* surfaces */
  --color-background-secondary: #f7fbff;
  --color-background-border: rgba(0, 0, 0, 0.08);
}

/* Protomia's sidebar entries are pill-shaped rather than full-bleed bars. */
.sidebar-tree .reference {
  border-radius: 0.6rem;
  padding-inline: 0.65rem;
}
.sidebar-tree .current-page > .reference {
  font-weight: 600;
  color: var(--protomia-accent);
}
.toc-tree li.scroll-current > .reference { font-weight: 600; }

/* Match the softer heading weight and tighter tracking used on the other sites. */
h1, h2, h3, h4 { letter-spacing: -0.03em; font-weight: 600; }

/* Dark mode. Furo's own dark selectors — body[data-theme="dark"] and, for the
   "auto" setting, body:not([data-theme="light"]) — are (0,1,1) and so already
   outrank the (0,0,1) `body` block above for every BASE variable it sets
   (--color-foreground-*, --color-background-secondary, --color-background-border).
   Only the light-specific literals above need handing back to furo here; they are
   given furo's own derivations, so this stays correct if those bases change. */
body[data-theme="dark"] {
  --color-sidebar-background-border: var(--color-background-border);
  --color-sidebar-search-border: var(--color-background-border);
  --color-toc-item-text: var(--color-foreground-secondary);
}

@media (prefers-color-scheme: dark) {
  body:not([data-theme="light"]) {
    --color-sidebar-background-border: var(--color-background-border);
    --color-sidebar-search-border: var(--color-background-border);
    --color-toc-item-text: var(--color-foreground-secondary);
  }
}
