/* genimg docs: paper-cut warm. Cream page, dark header, fox orange accents. */
[data-md-color-scheme="default"] {
  --md-default-bg-color: #fbf7ee;
  /* Material's deep-orange primary is ~3:1 on this cream and its amber accent ~1.8:1,
     so links and their hover/focus state both get AA-compliant overrides. */
  --md-typeset-a-color: #b23c17;
  --md-accent-fg-color: #8f2f12;
  --md-accent-fg-color--transparent: rgba(143, 47, 18, 0.1);
  --md-code-bg-color: #f3ede0;
  --md-typeset-table-color: rgba(0, 0, 0, .08);
}
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #1c1917;
  --md-default-fg-color: #f5efe6;
  --md-code-bg-color: #262220;
}
.md-header, .md-tabs { background-color: #1c1917; }
.md-header__title { font-weight: 600; }
.md-typeset h1, .md-typeset h2 { letter-spacing: -.01em; }
.md-typeset figure img { border-radius: 10px; }
/* The mark is charcoal + orange; give it a cream tile so it reads on the dark header.
   Size the button too, so the tile cannot outgrow its box and shove the title. */
.md-header__button.md-logo {
  width: 2.2rem; height: 2.2rem; padding: 0; margin-right: .2rem;
}
.md-header__button.md-logo img {
  width: 100%; height: 100%;
  background: #fbf7ee; border-radius: 9px; padding: 3px; box-sizing: border-box;
}
/* Header text and icons must be light on the dark header regardless of the primary colour. */
.md-header, .md-tabs {
  --md-primary-bg-color: #f5efe6;
  --md-primary-bg-color--light: #cfc8bc;
  color: #f5efe6;
}
/* The search trigger draws its text, icon and fill from the page scheme, so in light mode it
   was near-black on the charcoal header. Give it the light-on-dark tokens dark mode resolves to. */
[data-md-color-scheme="default"] .md-header .md-search__button {
  --md-default-fg-color: #f5efe6;
  --md-default-fg-color--lightest: rgba(245, 239, 230, .12);
  --md-default-fg-color--lighter: rgba(245, 239, 230, .32);
  --md-default-bg-color--light: rgba(28, 25, 23, .54);
}
.md-header .md-search__button:focus-visible { outline: 2px solid #f5efe6; outline-offset: 2px; }
/* A picture or clip that stands alone in its paragraph sits centred in the column. */
.md-typeset p > img:only-child,
.md-typeset video { display: block; margin-left: auto; margin-right: auto; max-width: 100%; }
/* Shell snippets: javascripts/shell.js marks the command and its flags; strings keep the theme's
   green. The "\" continuations step back so the flags carry the eye. */
.md-typeset :is(.language-bash, .language-sh, .language-shell, .language-zsh, .language-text) {
  --gi-cmd: #b23c17;
  --gi-flag: #1d5fa0;
  --gi-quiet: #a3988a;
}
[data-md-color-scheme="slate"] .md-typeset :is(.language-bash, .language-sh, .language-shell, .language-zsh, .language-text) {
  --gi-cmd: #ff9466;
  --gi-flag: #82b6ff;
  --gi-quiet: #6f665f;
}
.md-typeset :is(.language-bash, .language-sh, .language-shell, .language-zsh, .language-text) .gi-cmd { color: var(--gi-cmd); font-weight: 600; }
.md-typeset :is(.language-bash, .language-sh, .language-shell, .language-zsh, .language-text) .gi-flag { color: var(--gi-flag); }
.md-typeset :is(.language-bash, .language-sh, .language-shell, .language-zsh, .language-text) .se { color: var(--gi-quiet); }
