/* ── Kipper brand tokens → MkDocs Material overrides ──────────────────────
   Color palette mirrors kipper-website/src/styles/global.css exactly.
   ink-*   = deep cobalt-navy ground
   teal-*  = cobalt brand primary
   electric-* = bright blue accent
   signal  = #19d98c emerald positive
   paper   = #f6f8fd light neutral background
─────────────────────────────────────────────────────────────────────────── */

/* === Dark scheme (slate) ================================================ */
[data-md-color-scheme="slate"] {
  /* Backgrounds — ink scale */
  --md-default-bg-color:           #0a1a3f;  /* ink-900 */
  --md-default-bg-color--light:    #0d2150;  /* ink-800 */
  --md-default-bg-color--lighter:  #14306a;  /* ink-700 */
  --md-default-bg-color--lightest: #1a3a7a;

  /* Primary — electric-500/600 for header, active nav */
  --md-primary-fg-color:           #3d7bff;  /* electric-500 */
  --md-primary-fg-color--light:    #5b8bff;  /* electric-400 */
  --md-primary-fg-color--dark:     #2f6bff;  /* electric-600 */
  --md-primary-bg-color:           #060f28;  /* ink-950 */
  --md-primary-bg-color--light:    #0a1a3f;  /* ink-900 */

  /* Accent — electric-300 for links, focus, hover */
  --md-accent-fg-color:            #8fb4ff;  /* electric-300 */
  --md-accent-fg-color--transparent: rgba(143, 180, 255, 0.1);
  --md-accent-bg-color:            #060f28;

  /* Typeset */
  --md-typeset-color:              #c8d8f8;
  --md-typeset-a-color:            #8fb4ff;  /* electric-300 */

  /* Code */
  --md-code-bg-color:              #060f28;  /* ink-950 */
  --md-code-fg-color:              #c8d8f8;
  --md-code-hl-color:              rgba(61, 123, 255, 0.15);

  /* Tables */
  --md-typeset-table-color:        rgba(143, 180, 255, 0.05);
  --md-typeset-table-color--light: rgba(143, 180, 255, 0.1);

  /* Shadows */
  --md-shadow-z1: 0 0 0 1px rgba(74, 143, 255, 0.1),
                  0 1px 3px rgba(6, 15, 40, 0.6);
  --md-shadow-z2: 0 0 0 1px rgba(74, 143, 255, 0.1),
                  0 4px 12px rgba(6, 15, 40, 0.8);
  --md-shadow-z3: 0 0 0 1px rgba(74, 143, 255, 0.15),
                  0 8px 24px rgba(6, 15, 40, 0.9);
}

/* === Light scheme (default) ============================================= */
[data-md-color-scheme="default"] {
  /* Backgrounds */
  --md-default-bg-color:           #f6f8fd;  /* paper */
  --md-default-bg-color--light:    #ffffff;
  --md-default-bg-color--lighter:  #eef2fb;
  --md-default-bg-color--lightest: #ffffff;

  /* Primary — teal-500/600 cobalt brand */
  --md-primary-fg-color:           #044cc4;  /* teal-500 */
  --md-primary-fg-color--light:    #3d7bff;  /* electric-500 */
  --md-primary-fg-color--dark:     #033fa3;  /* teal-600 */
  --md-primary-bg-color:           #ffffff;
  --md-primary-bg-color--light:    #f6f8fd;

  /* Accent */
  --md-accent-fg-color:            #3d7bff;  /* electric-500 */
  --md-accent-fg-color--transparent: rgba(61, 123, 255, 0.1);
  --md-accent-bg-color:            #ffffff;

  /* Typeset */
  --md-typeset-color:              #0a1a3f;  /* ink-900 */
  --md-typeset-a-color:            #044cc4;  /* teal-500 */

  /* Code */
  --md-code-bg-color:              #eef2fb;
  --md-code-fg-color:              #0a1a3f;
  --md-code-hl-color:              rgba(4, 76, 196, 0.08);

  /* Tables */
  --md-typeset-table-color:        rgba(10, 26, 63, 0.04);
  --md-typeset-table-color--light: rgba(10, 26, 63, 0.08);
}

/* === Typography — Geist family, matches kipper-website ================== */
:root {
  --md-text-font: "Geist";
  --md-code-font: "Geist Mono";
}

/* Tight tracking + semibold for headings — mirrors .font-display in kipper-website */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  letter-spacing: -0.02em;
  font-weight: 600;
}

/* Geist Mono for all table headers + tag labels — "answer, not a guess" */
.md-typeset table th,
.md-typeset .md-tag {
  font-family: "Geist Mono", ui-monospace, monospace;
  letter-spacing: 0.04em;
}

/* === Nav active link ==================================================== */
.md-nav__link--active {
  font-weight: 600;
  color: var(--md-accent-fg-color) !important;
}

/* === Links — dashed underline → solid on hover (kipper-website prose) === */
[data-md-color-scheme="default"] .md-typeset a {
  text-decoration: underline;
  text-decoration-style: dashed;
  text-decoration-color: rgba(4, 76, 196, 0.4);
  text-underline-offset: 3px;
  transition: text-decoration-color 0.2s;
}

[data-md-color-scheme="default"] .md-typeset a:hover {
  text-decoration-style: solid;
  text-decoration-color: #044cc4;
}

[data-md-color-scheme="slate"] .md-typeset a {
  text-decoration: underline;
  text-decoration-style: dashed;
  text-decoration-color: rgba(143, 180, 255, 0.4);
  text-underline-offset: 3px;
  transition: text-decoration-color 0.2s;
}

[data-md-color-scheme="slate"] .md-typeset a:hover {
  text-decoration-style: solid;
  text-decoration-color: #8fb4ff;
}

/* === Header ============================================================= */
[data-md-color-scheme="slate"] .md-header {
  background-color: #060f28;  /* ink-950 — matches kipper-website footer ground */
  border-bottom: 1px solid rgba(74, 143, 255, 0.15);
  box-shadow: 0 1px 0 rgba(74, 143, 255, 0.1);
}

[data-md-color-scheme="default"] .md-header {
  background-color: #ffffff;  /* white — lets the dark-wordmark brand logo read */
  color: #0a1a3f;
  border-bottom: 1px solid rgba(10, 26, 63, 0.08);
}

[data-md-color-scheme="default"] .md-header .md-search__input {
  background-color: rgba(10, 26, 63, 0.05);
  color: #0a1a3f;
}

[data-md-color-scheme="default"] .md-header .md-search__input::placeholder {
  color: rgba(10, 26, 63, 0.5);
}

/* Dark scheme swaps to the white-wordmark logo — the ink-950 header would
   otherwise swallow the default dark-grey wordmark. Light scheme keeps the
   canonical brand logo (dark wordmark) on the white header. */
[data-md-color-scheme="slate"] .md-header__button.md-logo img {
  content: url("logo-white.svg");
}

/* === Footer ============================================================= */
[data-md-color-scheme="slate"] .md-footer {
  background-color: #060f28;  /* ink-950 — matches kipper-website footer */
  border-top: 1px solid rgba(74, 143, 255, 0.1);
}

[data-md-color-scheme="default"] .md-footer {
  background-color: #0a1a3f;  /* ink-900 — dark footer matches kipper-website */
}

[data-md-color-scheme="default"] .md-footer__link,
[data-md-color-scheme="default"] .md-footer__title,
[data-md-color-scheme="default"] .md-footer-meta {
  color: #c8d8f8;
}

/* === Code blocks ======================================================== */
.md-typeset pre {
  border-radius: 8px;
}

[data-md-color-scheme="slate"] .md-typeset pre > code {
  border: 1px solid rgba(74, 143, 255, 0.15);
  border-radius: 8px;
}

[data-md-color-scheme="default"] .md-typeset pre > code {
  border: 1px solid rgba(10, 26, 63, 0.1);
  border-radius: 8px;
}

/* Inline code */
[data-md-color-scheme="slate"] .md-typeset code:not(pre code) {
  color: #8fb4ff;  /* electric-300 */
  background-color: rgba(74, 143, 255, 0.1);
  border-radius: 4px;
  padding: 0.1em 0.35em;
}

[data-md-color-scheme="default"] .md-typeset code:not(pre code) {
  color: #044cc4;  /* teal-500 */
  background-color: rgba(4, 76, 196, 0.07);
  border-radius: 4px;
  padding: 0.1em 0.35em;
}

/* === Tables ============================================================= */
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background-color: rgba(74, 143, 255, 0.08);
  border-bottom: 1px solid rgba(74, 143, 255, 0.2);
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

[data-md-color-scheme="default"] .md-typeset table:not([class]) th {
  background-color: rgba(4, 76, 196, 0.06);
  border-bottom: 1px solid rgba(4, 76, 196, 0.15);
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* === Admonitions — kipper-website signal colors ========================= */

/* Note → electric blue */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: #3d7bff;
}
.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: rgba(61, 123, 255, 0.1);
}
.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
  background-color: #3d7bff;
}

/* Tip → signal green (#19d98c — money/positive in kipper-website) */
.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-color: #19d98c;
}
.md-typeset .tip > .admonition-title,
.md-typeset .tip > summary {
  background-color: rgba(25, 217, 140, 0.1);
}
.md-typeset .tip > .admonition-title::before,
.md-typeset .tip > summary::before {
  background-color: #19d98c;
}

/* Warning → amber */
.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-color: #f5a623;
}
.md-typeset .warning > .admonition-title,
.md-typeset .warning > summary {
  background-color: rgba(245, 166, 35, 0.1);
}
.md-typeset .warning > .admonition-title::before,
.md-typeset .warning > summary::before {
  background-color: #f5a623;
}

/* === Search ============================================================= */
[data-md-color-scheme="slate"] .md-search__input {
  background-color: rgba(74, 143, 255, 0.08);
  border: 1px solid rgba(74, 143, 255, 0.2);
  border-radius: 8px;
}

[data-md-color-scheme="slate"] .md-search__input:focus {
  border-color: #3d7bff;
  box-shadow: 0 0 0 2px rgba(61, 123, 255, 0.2);  /* --shadow-glow from kipper-website */
}

/* === Scrollbar (webkit) ================================================= */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }

[data-md-color-scheme="slate"] ::-webkit-scrollbar-thumb {
  background: rgba(74, 143, 255, 0.2);
  border-radius: 3px;
}
[data-md-color-scheme="slate"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(74, 143, 255, 0.35);
}
[data-md-color-scheme="default"] ::-webkit-scrollbar-thumb {
  background: rgba(10, 26, 63, 0.15);
  border-radius: 3px;
}
[data-md-color-scheme="default"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(10, 26, 63, 0.25);
}
