/* ────────────────────────────────────────────────────────────────────
   RaceLink theme — matches racelink.dev branding
   Primary: #FF5722 (deep-orange-500), Accent: #FFC107 (amber-500)
   Headlines: Oswald, Body: Roboto, Dark BG: #1E1E1E, Light BG: #f0f2f1
   Source CSS: ~/Dev/racelink web/.../custom.260408153827.css
   ──────────────────────────────────────────────────────────────────── */

/* Pull in Oswald — racelink.dev uses it for headlines.
   Roboto comes from MkDocs Material's font config. */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&display=swap');

/* ── Brand-exact accent overrides ──
   MkDocs Material's "deep orange" preset is close to but not identical
   with racelink.dev's #FF5722. Override the few core variables. */
:root {
  --md-primary-fg-color:        #FF5722;
  --md-primary-fg-color--light: #FF7043;
  --md-primary-fg-color--dark:  #E64A19;
  --md-accent-fg-color:         #FFC107;
  --md-accent-fg-color--transparent: rgba(255, 193, 7, 0.1);

  /* Light mode body / tonal greys taken from racelink.dev */
  --md-default-bg-color:        #ffffff;
  --md-default-fg-color:        #1E1E1E;
}

/* Dark mode (slate scheme) — bring the BG to racelink.dev's #1E1E1E */
[data-md-color-scheme="slate"] {
  --md-default-bg-color:        #1E1E1E;
  --md-default-bg-color--light: #2A2A2A;
  --md-default-bg-color--lighter: #333333;
  --md-default-bg-color--lightest: #3D3D3D;
  --md-default-fg-color:        #f0f2f1;
  --md-default-fg-color--light: #cacccb;
  --md-default-fg-color--lighter: #9a9c9b;
  --md-default-fg-color--lightest: #575757;
  --md-code-bg-color:           #2A2A2A;

  /* Slightly tone the orange in dark mode so it doesn't burn the eyes */
  --md-primary-fg-color:        #FF5722;
  --md-accent-fg-color:         #FFC107;
}

/* ── Typography — Oswald for headlines, Roboto for body ── */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-header__topic {
  font-family: 'Oswald', 'Roboto', sans-serif;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.md-typeset h1 {
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.md-typeset h2 {
  border-bottom: 2px solid var(--md-accent-fg-color);
  padding-bottom: 0.2em;
  margin-top: 2em;
}

/* Body text: keep MkDocs default (Roboto), no override needed. */

/* ── Inline code / link tweaks to match racelink.dev's tone ── */
.md-typeset a:not(.md-button):not(.md-source):not(.md-icon) {
  color: var(--md-primary-fg-color);
  border-bottom: 1px dotted transparent;
  transition: border-color 0.15s ease;
}
.md-typeset a:not(.md-button):not(.md-source):not(.md-icon):hover {
  color: var(--md-primary-fg-color--dark);
  border-bottom-color: var(--md-accent-fg-color);
}

/* ── Header bar: a touch more presence ── */
.md-header {
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}
[data-md-color-scheme="slate"] .md-header {
  background-color: #1E1E1E;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
}

/* ── Tighten spec-style tables (PROTOCOL.md, body layouts) ── */
.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
  padding: 0.4em 0.75em;
  font-size: 0.92em;
}
.md-typeset table:not([class]) th {
  background-color: var(--md-default-bg-color--light, #f0f2f1);
  font-family: 'Oswald', 'Roboto', sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 0.85em;
}
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background-color: #2A2A2A;
}

/* ── Admonition flair: the brand orange for `note` ── */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: var(--md-primary-fg-color);
}
.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: rgba(255, 87, 34, 0.1);
}

/* Tip / success: keep green standard (#28a745 in racelink.dev) */
.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-color: #28a745;
}

/* Warning: amber (matches accent) */
.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-color: var(--md-accent-fg-color);
}

/* Danger: red from racelink.dev */
.md-typeset .admonition.danger,
.md-typeset details.danger {
  border-color: #bd2130;
}

/* ── Code blocks: subtle amber line on the left for the brand cue ── */
.md-typeset pre > code {
  border-left: 2px solid var(--md-accent-fg-color);
}