/* Quatern theme for mkdocs-material: deep teal primary, aqua accent, Geist. */

:root {
  --qt-deep: #0B2E31;
  --qt-deepest: #082427;
  --qt-line: #174A4F;
  --qt-accent: #3FE0C5;
  --qt-aqua: #CFF5EE;
  --qt-ok: #1F9D72;
  --qt-stop: #E0503F;
}

/* light */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--qt-deep);
  --md-primary-fg-color--light: #174A4F;
  --md-primary-fg-color--dark: var(--qt-deepest);
  --md-primary-bg-color: #F2F7F6;
  --md-primary-bg-color--light: rgba(242, 247, 246, .7);
  --md-accent-fg-color: #0E8F7B;
  --md-accent-fg-color--transparent: rgba(63, 224, 197, .12);
  --md-typeset-a-color: #0B7A69;           /* accent darkened for 4.5:1 on white */
  --md-default-fg-color: #12292B;
  --md-default-fg-color--light: #3F5A5C;
  --md-default-fg-color--lighter: #6F8A8B;
  --md-code-bg-color: #EEF4F3;
  --md-code-fg-color: #12292B;
  --qt-diagram-fill: #F4F9F8;
  --qt-diagram-box: #FFFFFF;
  --qt-diagram-ink: #12292B;
  --qt-diagram-muted: #4B6668;
  --qt-diagram-line: #9DB8B6;
  --qt-diagram-hi: #0B7A69;
}

/* dark */
[data-md-color-scheme="slate"] {
  --md-hue: 185;
  --md-primary-fg-color: var(--qt-deepest);
  --md-primary-fg-color--light: var(--qt-deep);
  --md-primary-fg-color--dark: #051A1C;
  --md-primary-bg-color: #F2F7F6;
  --md-accent-fg-color: var(--qt-accent);
  --md-accent-fg-color--transparent: rgba(63, 224, 197, .12);
  --md-typeset-a-color: var(--qt-accent);
  --md-default-bg-color: #0A2629;
  --md-default-fg-color: rgba(242, 247, 246, .9);
  --md-default-fg-color--light: rgba(201, 216, 214, .78);
  --md-default-fg-color--lighter: rgba(201, 216, 214, .5);
  --md-code-bg-color: var(--qt-deepest);
  --md-code-fg-color: #DCEBEA;
  --md-footer-bg-color: #051A1C;
  --md-footer-bg-color--dark: #041416;
  --qt-diagram-fill: #0D3236;
  --qt-diagram-box: #082427;
  --qt-diagram-ink: #F2F7F6;
  --qt-diagram-muted: #A9C2C0;
  --qt-diagram-line: #2F6268;
  --qt-diagram-hi: var(--qt-accent);
}

/* typography */
.md-typeset { font-size: .8rem; line-height: 1.7; }
.md-typeset h1, .md-typeset h2, .md-typeset h3 { font-weight: 600; letter-spacing: -0.02em; color: var(--md-default-fg-color); }
.md-typeset h1 { font-size: 1.9em; margin-bottom: .6em; }
.md-typeset h2 { font-size: 1.35em; margin-top: 2em; }
.md-typeset code, .md-typeset kbd { font-feature-settings: "calt" 0; }
.md-typeset .lede { font-size: 1.1em; color: var(--md-default-fg-color--light); }

/* header */
.md-header { background: var(--qt-deep); }
[data-md-color-scheme="slate"] .md-header { background: var(--qt-deepest); border-bottom: 1px solid var(--qt-line); }
.md-header__button.md-logo img { height: 1.4rem; }
.qt-site-link {
  margin: 0 .4rem 0 .8rem; padding: .2rem .7rem; border: 1px solid rgba(207, 245, 238, .35);
  border-radius: 999px; font-size: .7rem; font-weight: 500; color: var(--qt-aqua); white-space: nowrap;
}
.qt-site-link:hover { border-color: var(--qt-aqua); color: #fff; }
@media screen and (max-width: 30em) { .qt-site-link { display: none; } }

/* code blocks */
.md-typeset pre > code { border-radius: .5rem; }
.md-typeset .highlight { border-radius: .5rem; }
[data-md-color-scheme="slate"] .md-typeset pre > code { border: 1px solid var(--qt-line); }

/* numbered steps (Quickstart), in the style of a guided walkthrough */
.md-typeset .steps > ol { counter-reset: step; list-style: none; padding-left: 0; margin-left: 0; }
.md-typeset .steps > ol > li { counter-increment: step; position: relative; padding-left: 2.6rem; margin-left: 0; }
.md-typeset .steps > ol > li::before {
  content: counter(step); position: absolute; left: 0; top: .1rem; width: 1.6rem; height: 1.6rem;
  border-radius: 50%; display: grid; place-items: center; font-size: .75rem; font-weight: 600;
  background: var(--md-accent-fg-color--transparent); color: var(--md-typeset-a-color);
  border: 1px solid var(--md-accent-fg-color);
}

/* admonitions: quieter borders */
.md-typeset .admonition, .md-typeset details { border-width: 1px; border-radius: .5rem; box-shadow: none; font-size: .78rem; }

/* inline diagram */
.md-typeset figure.qt-diagram { width: 100%; max-width: 100%; }
.qt-diagram { margin: 1.5em 0; padding: 1rem; border-radius: .75rem; background: var(--qt-diagram-fill); }
.qt-diagram svg { display: block; width: 100%; height: auto; max-width: 52rem; margin: 0 auto; }
.qt-diagram .box { fill: var(--qt-diagram-box); stroke: var(--qt-diagram-line); stroke-width: 1.5; }
.qt-diagram .box.hi { stroke: var(--qt-diagram-hi); }
.qt-diagram .t { font: 600 15px Geist, system-ui, sans-serif; fill: var(--qt-diagram-ink); }
.qt-diagram .s { font: 12.5px Geist, system-ui, sans-serif; fill: var(--qt-diagram-muted); }
.qt-diagram .arrow { stroke: var(--qt-diagram-hi); stroke-width: 1.8; fill: none; }
.qt-diagram .arrowhead { fill: var(--qt-diagram-hi); }
.qt-diagram .back { stroke: var(--qt-diagram-line); stroke-width: 1.5; fill: none; stroke-dasharray: 4 4; }
.qt-diagram figcaption { margin-top: .6rem; font-size: .7rem; color: var(--md-default-fg-color--light); text-align: center; }

/* status words used across pages */
.md-typeset .qt-ok { color: var(--qt-ok); font-weight: 600; }
[data-md-color-scheme="slate"] .md-typeset .qt-ok { color: #7FE0B2; }
.md-typeset .qt-stop { color: var(--qt-stop); font-weight: 600; }
[data-md-color-scheme="slate"] .md-typeset .qt-stop { color: #FF8C80; }

/* terminal output wraps instead of scrolling; commands (bash) keep their lines */
.md-typeset .language-text pre > code { white-space: pre-wrap; overflow-wrap: anywhere; padding-right: 2.8em; }