/* Groundfact branding for the MkDocs Material docs site.
 *
 * The docs shipped on Material's stock "deep orange" palette long after the
 * application moved to petrol teal, so /docs read as a different product from
 * the site linking to it. This maps Material's own custom properties onto the
 * exact tokens in app/static/css/main.css -- the same hex values, not
 * approximations, because two teals that are nearly the same are worse than
 * one that is obviously different.
 *
 * Keep in step with the `:root` and `:root[data-theme="dark"]` blocks in
 * app/static/css/main.css. If the site's palette moves, this moves with it.
 *
 * Material drives its own light/dark switch through `[data-md-color-scheme]`
 * ("default" and "slate"), which is a different mechanism from the site's
 * `[data-theme]`. That is fine and is not the thing tests/test_theming.py
 * polices -- it forbids `prefers-color-scheme` in the *application's* CSS,
 * where theme must follow the explicit toggle. Nothing here uses it either.
 */

:root,
[data-md-color-scheme="default"] {
  /* --- Groundfact tokens, light ---------------------------------------- */
  --gf-bg: #f4f6f7;
  --gf-surface: #ffffff;
  --gf-ink: #14181b;
  --gf-muted: #5a666e;
  --gf-line: #dde4e7;
  --gf-accent: #0f766e;
  --gf-accent-wash: #e6f2f1;

  /* --- Material mappings ------------------------------------------------ */
  /* The header and nav bar: the logo's own green, which is what was asked for. */
  --md-primary-fg-color: var(--gf-accent);
  --md-primary-fg-color--light: #14907f;
  --md-primary-fg-color--dark: #0b5a54;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.75);

  --md-accent-fg-color: #0b5a54;
  --md-accent-fg-color--transparent: var(--gf-accent-wash);

  --md-default-bg-color: var(--gf-bg);
  --md-default-fg-color: var(--gf-ink);
  --md-default-fg-color--light: var(--gf-muted);
  --md-default-fg-color--lighter: #8c979e;
  --md-default-fg-color--lightest: var(--gf-line);

  --md-typeset-color: var(--gf-ink);
  --md-typeset-a-color: var(--gf-accent);
  --md-code-bg-color: #eef2f3;
  --md-code-fg-color: #1f2a2f;
  --md-footer-bg-color: #1b2226;
  --md-footer-bg-color--dark: #141a1d;
}

[data-md-color-scheme="slate"] {
  /* --- Groundfact tokens, dark ----------------------------------------- */
  --gf-bg: #0e1417;
  --gf-surface: #151d21;
  --gf-ink: #eef2f4;
  --gf-muted: #93a1a9;
  --gf-line: #263136;
  --gf-accent: #2dd4bf;
  --gf-accent-wash: #10221f;

  /* The header stays a filled teal band in both schemes so the brand does not
     disappear at night; the dark scheme uses the deeper teal so white header
     text keeps its contrast (white on #2dd4bf is only 1.9:1 and would fail). */
  --md-primary-fg-color: #0b5a54;
  --md-primary-fg-color--light: #0f766e;
  --md-primary-fg-color--dark: #084741;
  --md-primary-bg-color: #ffffff;

  --md-accent-fg-color: var(--gf-accent);
  --md-accent-fg-color--transparent: var(--gf-accent-wash);

  --md-default-bg-color: var(--gf-bg);
  --md-default-fg-color: var(--gf-ink);
  --md-default-fg-color--light: var(--gf-muted);
  --md-default-fg-color--lighter: #6f7d85;
  --md-default-fg-color--lightest: var(--gf-line);

  --md-typeset-color: var(--gf-ink);
  --md-typeset-a-color: var(--gf-accent);
  --md-code-bg-color: #101a1e;
  --md-code-fg-color: #d7e0e4;
  --md-footer-bg-color: #0a1013;
  --md-footer-bg-color--dark: #070c0e;
}

/* Typography: the site pairs a serif for headings with a system sans for UI.
   Material sets its own font stack, so headings are brought back into line
   here rather than by loading a webfont -- the docs are served under the same
   strict CSP as the app, and no external font request would survive it. */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--gf-ink);
}

.md-typeset h1 {
  font-size: 2rem;
}

/* Content sits on the page ground; give it the same card treatment the site
   uses for panels so the two do not read as different products. */
.md-main__inner {
  margin-top: 1.5rem;
}

.md-typeset table:not([class]) {
  border: 1px solid var(--gf-line);
  border-radius: 6px;
  overflow: hidden;
  font-size: 0.78rem;
}

.md-typeset table:not([class]) th {
  background: var(--gf-accent-wash);
  color: var(--gf-ink);
  font-weight: 600;
}

.md-typeset table:not([class]) td {
  border-top: 1px solid var(--gf-line);
}

/* Inline source favicons in sources.md: the generated page references
   /static/favicons/*.png, which Apache serves from the application's own
   static root -- keep them from inheriting the table's line-height. */
.md-typeset img[src^="/static/favicons/"] {
  width: 16px;
  height: 16px;
  vertical-align: -3px;
  border-radius: 2px;
}

/* Admonitions in the brand accent rather than Material's blue. */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: var(--gf-accent);
}

.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: var(--gf-accent-wash);
}

.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
  background-color: var(--gf-accent);
}

/* A route home. The docs are served at /docs by Apache, a different origin
   path from the app, so Material's own "back to site" affordance is a plain
   link rather than anything it manages. */
.md-header__title {
  font-weight: 600;
}