/* SARSTREAM help theme (created 2026-10-03).
   Colors: the admin page's card palette (admin.html :root). Fonts: the
   app's system stack (lite.css --font-sans / --font-mono). lite.css itself
   is NOT imported — only these values are copied. */
:root {
  --ss-bg: #0b0e13;
  --ss-panel: #121924;
  --ss-edge: #223047;
  --ss-text: #dbe7f4;
  --ss-dim: #7d8fa5;
  --ss-ok: #2ecc71;
  --ss-bad: #e74c3c;
  --ss-warn: #e0a52c;
  --ss-accent: #2563eb;
  --ss-accent2: #1d4ed8;
  --ss-link: #7ab3f5;
  --ss-callout: #ffd400;            /* same yellow as the screenshot callouts */
}

[data-md-color-scheme="slate"] {
  --md-hue: 215;
  --md-default-bg-color: var(--ss-bg);
  --md-default-bg-color--light: rgba(11, 14, 19, .54);
  --md-default-fg-color: var(--ss-text);
  --md-default-fg-color--light: var(--ss-dim);
  --md-default-fg-color--lighter: #4a5b72;
  --md-default-fg-color--lightest: var(--ss-edge);
  --md-typeset-color: var(--ss-text);
  --md-typeset-a-color: var(--ss-link);
  --md-primary-fg-color: var(--ss-panel);
  --md-primary-fg-color--light: var(--ss-edge);
  --md-primary-fg-color--dark: var(--ss-bg);
  --md-primary-bg-color: var(--ss-text);
  --md-primary-bg-color--light: var(--ss-dim);
  --md-accent-fg-color: var(--ss-link);
  --md-accent-fg-color--transparent: rgba(122, 179, 245, .12);
  --md-code-bg-color: var(--ss-panel);
  --md-code-fg-color: var(--ss-text);
  --md-footer-bg-color: var(--ss-panel);
  --md-footer-bg-color--dark: var(--ss-bg);
  --md-typeset-table-color: var(--ss-edge);
  --md-admonition-bg-color: var(--ss-panel);
}

html body {
  --md-text-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --md-code-font-family: ui-monospace, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.md-header, .md-tabs { border-bottom: 1px solid var(--ss-edge); }
.md-banner { background: #3a2a07; color: #ffe39a; }
.md-typeset { font-size: .8rem; line-height: 1.6; }
.md-typeset h1 { color: var(--ss-text); font-weight: 700; margin-bottom: .2em; }
.md-typeset h2 { font-weight: 700; }
.md-typeset code { border: 1px solid var(--ss-edge); }

/* "Last checked" line, written under the title by hooks/page_meta.py */
.md-typeset .page-meta { color: var(--ss-dim); font-size: .7rem; margin-top: 0; }

/* Screenshots: subtle frame; phone and controller shots kept to device-ish sizes */
.md-typeset img { border: 1px solid var(--ss-edge); border-radius: 8px; }
.md-typeset img.phone { max-width: 300px; display: block; }
.md-typeset img.rc { max-width: 620px; display: block; }
.md-typeset img.strip { max-width: 360px; display: block; }

/* Screenshot that is planned but not taken yet (viewer/map: needs a test mission) */
.md-typeset .shot-placeholder {
  border: 2px dashed var(--ss-edge); border-radius: 8px; padding: .8em 1em;
  color: var(--ss-dim); font-size: .7rem; margin: 1em 0;
}
.md-typeset .shot-placeholder::before { content: "📷 Screenshot coming: "; font-weight: 700; }

/* Home page: big search box + role cards */
.md-typeset .home-search { display: flex; margin: 1em 0 1.6em; }
.md-typeset .home-search input {
  flex: 1; font: inherit; font-size: .95rem; padding: .7em .9em; border-radius: 10px;
  background: var(--ss-panel); color: var(--ss-text); border: 1px solid var(--ss-edge);
}
.md-typeset .home-search input:focus { outline: 2px solid var(--ss-link); }
.md-typeset .grid.cards > ul > li, .md-typeset .grid > .card {
  background: var(--ss-panel); border-color: var(--ss-edge);
}
.md-typeset .grid.cards > ul > li:hover { border-color: var(--ss-link); }

/* Admonitions in the app's status colors */
.md-typeset .admonition.warning, .md-typeset details.warning { border-color: var(--ss-warn); }
.md-typeset .admonition.danger, .md-typeset details.danger { border-color: var(--ss-bad); }
.md-typeset .admonition.success, .md-typeset details.success { border-color: var(--ss-ok); }