/* TORUS on MkDocs Material.
   Identity per TORUS/site/images/logos/README.md: Field Green plus white is
   the identity, Ink is the one-colour fallback. Coyote is held in reserve and
   is deliberately absent. */

:root {
  --torus-field-green: #3f4c2e;
  --torus-field-green-light: #55663d;
  --torus-low-vis: #23271f;
  --torus-ink: #14181f;
  --torus-sand: #b8a888;

  --md-primary-fg-color: var(--torus-field-green);
  --md-primary-fg-color--light: var(--torus-field-green-light);
  --md-primary-fg-color--dark: var(--torus-low-vis);
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #ffffffb3;

  --md-accent-fg-color: #6c8449;
  --md-accent-fg-color--transparent: #6c84491a;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: var(--torus-low-vis);
  --md-primary-fg-color--light: var(--torus-field-green);
  --md-primary-fg-color--dark: var(--torus-ink);
  --md-accent-fg-color: #9bb36a;
  --md-accent-fg-color--transparent: #9bb36a1a;
  --md-hue: 215;
}

/* The wordmark is drawn to a fixed proportion and must not be stretched. */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.5rem;
  width: auto;
}

/* ── Document status strip ───────────────────────────────────────────── */

.torus-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.2rem;
  align-items: center;
  margin: 0 0 1.2rem;
  padding: 0.5rem 0.8rem;
  border-left: 3px solid var(--md-primary-fg-color);
  background: var(--md-code-bg-color);
  font-size: 0.7rem;
  font-family: var(--md-code-font-family);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}

.torus-meta strong {
  color: var(--md-default-fg-color);
  font-weight: 600;
}

.torus-meta .torus-flag {
  padding: 0.1rem 0.4rem;
  border: 1px solid var(--torus-sand);
  color: var(--torus-sand);
  border-radius: 2px;
}

/* ── Key/value specification strip ───────────────────────────────────── */

.torus-kv {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.8rem;
  margin: 1.2rem 0;
}

.torus-kv > div {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 4px;
  padding: 0.7rem 0.8rem;
  background: var(--md-default-bg-color);
}

.torus-kv .k {
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--md-primary-fg-color);
  font-family: var(--md-code-font-family);
}

[data-md-color-scheme="slate"] .torus-kv .k {
  color: var(--md-accent-fg-color);
}

.torus-kv .v {
  font-size: 0.95rem;
  font-weight: 600;
  margin-top: 0.15rem;
  line-height: 1.25;
}

.torus-kv .n {
  font-size: 0.68rem;
  color: var(--md-default-fg-color--light);
  margin-top: 0.2rem;
  line-height: 1.35;
}

/* ── Figures ─────────────────────────────────────────────────────────── */

.md-typeset figure {
  margin: 1.2rem 0;
}

.md-typeset figure img {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 4px;
  background: var(--md-code-bg-color);
}

.md-typeset figcaption {
  font-size: 0.7rem;
  color: var(--md-default-fg-color--light);
  max-width: none;
  margin-top: 0.35rem;
  text-align: left;
}

/* Portrait renders and wide drawings share a grid, so cap the box and
   letterbox rather than stretching a row to the tallest asset. */
.torus-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  margin: 1.2rem 0;
}

.torus-grid figure {
  margin: 0;
}

.torus-grid { align-items: start; }

.torus-grid figure img {
  width: 100%;
  height: 200px;
  object-fit: contain;
  background: var(--md-code-bg-color);
}

/* ── Tables ──────────────────────────────────────────────────────────── */

.md-typeset table:not([class]) {
  font-size: 0.72rem;
}

.md-typeset table:not([class]) th {
  background: var(--md-code-bg-color);
  font-weight: 600;
}

.md-typeset .num,
.md-typeset td:has(> .num) {
  font-family: var(--md-code-font-family);
  font-variant-numeric: tabular-nums;
}

/* ── Status pills ────────────────────────────────────────────────────── */

.pill {
  display: inline-block;
  padding: 0.05rem 0.4rem;
  border-radius: 2px;
  font-size: 0.6rem;
  font-family: var(--md-code-font-family);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  vertical-align: middle;
  border: 1px solid currentcolor;
}

.pill.ok { color: #4c7a34; }
.pill.dev { color: #9a7b2f; }
.pill.gated { color: #9a5a2f; }
.pill.na { color: var(--md-default-fg-color--light); }

[data-md-color-scheme="slate"] .pill.ok { color: #8fc06a; }
[data-md-color-scheme="slate"] .pill.dev { color: #d6b45c; }
[data-md-color-scheme="slate"] .pill.gated { color: #d69a5c; }

/* ── Print ───────────────────────────────────────────────────────────── */

@media print {
  .torus-meta { border-left-color: #000; }
  .md-typeset figure img { max-height: 200px; }
}

.torus-meta > span:not(.torus-flag) {
  padding-right: 1rem;
  border-right: 1px solid var(--md-default-fg-color--lightest);
}

.torus-meta > span:last-child { border-right: 0; padding-right: 0; }

/* ── Block-diagram / task-mapping cards ──────────────────────────────── */

.md-typeset .torus-blk {
  padding: 0.9rem 1rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-top: 3px solid var(--md-primary-fg-color);
  background: var(--md-code-bg-color);
  border-radius: 2px;
}

.md-typeset .torus-blk > :first-child { margin-top: 0; }
.md-typeset .torus-blk > :last-child { margin-bottom: 0; }
.md-typeset .torus-blk ul { margin-left: 0; font-size: 0.72rem; }
.md-typeset .torus-blk li { margin-bottom: 0.2em; }

/* ── Power calculator ────────────────────────────────────────────────── */
/* The calculator markup was authored against a different design system and
   carries inline styles referencing these token names. Map them onto Material
   so it themes with the rest of the site instead of rewriting 15 kB of markup. */

.torus-calc {
  --surface-1: var(--md-default-bg-color);
  --surface-2: var(--md-code-bg-color);
  --border: var(--md-default-fg-color--lighter);
  --radius: 6px;
  --text-primary: var(--md-default-fg-color);
  --text-secondary: var(--md-default-fg-color--light);
  --text-success: #2F6B3A;
  --text-warning: #8A6206;
  --text-danger: #A33028;
  font-size: 0.78rem;
  line-height: 1.5;
}

[data-md-color-scheme="slate"] .torus-calc {
  --text-success: #7FBF8A;
  --text-warning: #E3B458;
  --text-danger: #E08579;
}

.torus-calc input[type="range"] { accent-color: var(--md-primary-fg-color); width: 100%; }
.torus-calc input[type="checkbox"] { accent-color: var(--md-primary-fg-color); }

.torus-calc select {
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  border: 1px solid var(--md-default-fg-color--lighter);
  border-radius: 4px;
  padding: 4px 6px;
  font-family: inherit;
  font-size: inherit;
}

.torus-calc select:focus-visible,
.torus-calc input:focus-visible {
  outline: 2px solid var(--md-primary-fg-color);
  outline-offset: 1px;
}

.torus-calc table { width: 100%; border-collapse: collapse; }
.torus-calc label { display: block; }

/* The wordmark already reads TORUS, so the site-name topic beside it is
   duplicate. The page-title topic that replaces it on scroll is kept. */
.md-header__topic:first-child .md-ellipsis { display: none; }
