/* CloudSprite brand skin for MkDocs Material.
 * Tokens from platform/brand-color-system.md — Scarlet Rush is logo-only
 * and must never appear here. */

:root {
  /* Deep Twilight */
  --cs-tw-500: #2a1a66;
  --cs-tw-700: #170851;
  --cs-tw-800: #120349;
  --cs-tw-900: #0b022f;
  --cs-tw-950: #06011a;
  /* Sky Surge */
  --cs-sky-300: #75d0f1;
  --cs-sky-400: #4ac4ed;
  --cs-sky-500: #27bceb;
  --cs-sky-600: #1898c2;
  --cs-sky-700: #137a9b;
  /* Cool Gray */
  --cs-gray-50: #f6f7fa;
  --cs-gray-100: #eceef3;
  --cs-gray-200: #dadee7;
  --cs-gray-600: #4d5670;
  --cs-gray-900: #161a26;
  /* Golden Orange — one gold element per screen */
  --cs-gold-400: #eb9c0a;
  /* Dark-mode text */
  --cs-dark-text: #f2f1fb;
  --cs-dark-text-muted: #b0aad0;
}

/* ---------- Light scheme ---------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--cs-tw-800);
  --md-primary-fg-color--light: var(--cs-tw-500);
  --md-primary-fg-color--dark: var(--cs-tw-900);
  --md-primary-bg-color: var(--cs-dark-text);
  --md-primary-bg-color--light: rgba(242, 241, 251, 0.7);

  --md-accent-fg-color: var(--cs-sky-700);
  --md-accent-fg-color--transparent: rgba(24, 152, 194, 0.1);

  --md-default-bg-color: var(--cs-gray-50);
  --md-default-fg-color: var(--cs-gray-900);
  --md-default-fg-color--light: var(--cs-gray-600);
  --md-default-fg-color--lighter: rgba(22, 26, 38, 0.32);
  --md-default-fg-color--lightest: rgba(22, 26, 38, 0.07);

  --md-typeset-a-color: var(--cs-sky-600);
  --md-typeset-mark-color: rgba(235, 156, 10, 0.3);

  --md-code-bg-color: var(--cs-gray-100);
  --md-code-fg-color: var(--cs-gray-900);
  --md-typeset-table-color: rgba(22, 26, 38, 0.12);

  --md-footer-bg-color: var(--cs-tw-800);
  --md-footer-bg-color--dark: var(--cs-tw-900);
}

/* ---------- Dark scheme (landing-hero twilight, not Material navy) ---------- */
[data-md-color-scheme="slate"] {
  --md-hue: 254; /* fallback hue for any derived colors */

  --md-primary-fg-color: var(--cs-tw-900);
  --md-primary-fg-color--light: var(--cs-tw-500);
  --md-primary-fg-color--dark: var(--cs-tw-950);
  --md-primary-bg-color: var(--cs-dark-text);
  --md-primary-bg-color--light: rgba(242, 241, 251, 0.7);

  --md-accent-fg-color: var(--cs-sky-300);
  --md-accent-fg-color--transparent: rgba(74, 196, 237, 0.1);

  --md-default-bg-color: var(--cs-tw-950);
  --md-default-fg-color: var(--cs-dark-text);
  --md-default-fg-color--light: var(--cs-dark-text-muted);
  --md-default-fg-color--lighter: rgba(242, 241, 251, 0.32);
  --md-default-fg-color--lightest: rgba(242, 241, 251, 0.08);

  --md-typeset-a-color: var(--cs-sky-400);
  --md-typeset-mark-color: rgba(235, 156, 10, 0.35);

  --md-code-bg-color: var(--cs-tw-900);
  --md-code-fg-color: var(--cs-dark-text);
  --md-typeset-table-color: rgba(255, 255, 255, 0.12);

  --md-footer-bg-color: var(--cs-tw-900);
  --md-footer-bg-color--dark: var(--cs-tw-950);

  /* Surfaces that Material derives from --md-hue lightness */
  --md-typeset-kbd-color: var(--cs-tw-700);
  --md-admonition-bg-color: var(--cs-tw-900);
}

/* Wider content grid — Material's 61rem default reads cramped on large
 * displays next to the 1200px landing page. */
.md-grid {
  max-width: 76rem;
  padding-left: 1.6rem;
  padding-right: 1.6rem;
}

/* Header: landing nav treatment — twilight bar, hairline bottom border in dark */
[data-md-color-scheme="slate"] .md-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Link hover matches brand hover steps rather than Material's accent jump */
[data-md-color-scheme="default"] .md-typeset a:hover {
  color: var(--cs-sky-700);
}
[data-md-color-scheme="slate"] .md-typeset a:hover {
  color: var(--cs-sky-300);
}

/* Header title links home (partials/header.html override) — keep it
 * looking like the plain title */
.md-header__topic-link {
  color: inherit;
  text-decoration: none;
}
.md-header__topic-link:hover {
  color: inherit;
  opacity: 0.85;
}

/* Search input on the twilight header */
.md-search__form {
  background-color: rgba(255, 255, 255, 0.08);
}
.md-search__form:hover {
  background-color: rgba(255, 255, 255, 0.14);
}
