/* Space Grotesk for headings — matches landing page --font-display */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

/* ===== KAGAN MKDOCS THEME ===== */
/* Aligned with landing page (kagan-landing) Khagan Night Palette */
:root,
[data-md-color-scheme="slate"] {
  /* Backgrounds — matches landing --bg, --surface, --panel, --border */
  --md-default-bg-color: #0f1419;
  --md-default-bg-color--light: #171c24;
  --md-default-bg-color--lighter: #1e2530;
  --md-default-bg-color--lightest: #2a3342;

  /* Text — matches landing --fg, --fg-muted */
  --md-default-fg-color: #c5cdd9;
  --md-default-fg-color--light: #8b949e;
  --md-default-fg-color--lighter: #8b949e80;
  --md-default-fg-color--lightest: #2a3342;

  /* Primary — Jade Green (matches landing --primary) */
  --md-primary-fg-color: #3fb58e;
  --md-primary-fg-color--light: #4ec9b0;
  --md-primary-fg-color--dark: #2d8a6a;
  --md-primary-bg-color: #0f1419;
  --md-primary-bg-color--light: #171c24;

  /* Accent — Jade Green for nav active states */
  --md-accent-fg-color: #3fb58e;
  --md-accent-fg-color--transparent: #3fb58e20;
  --md-accent-bg-color: #0f1419;

  /* Code — matches landing --bg-darker for code bg */
  --md-code-fg-color: #c5cdd9;
  --md-code-bg-color: #0a0d11;
  --md-code-hl-color: #3fb58e30;
  --md-code-hl-number-color: #d4a84b;
  --md-code-hl-keyword-color: #d4a84b;
  --md-code-hl-function-color: #3fb58e;
  --md-code-hl-string-color: #3fb58e;
  --md-code-hl-name-color: #6fa3d4;
  --md-code-hl-comment-color: #8b949e;

  /* Links */
  --md-typeset-a-color: #3fb58e;

  /* Admonitions */
  --md-admonition-fg-color: #c5cdd9;
  --md-admonition-bg-color: #171c24;

  /* Override Material's info admonition color (cyan -> jade green) */
  --md-admonition-icon--info: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2Z"/></svg>');
}

/* ===== HEADER ===== */
.md-header {
  background-color: rgba(15, 20, 25, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid #2a3342;
}

/* Logo styling - match landing */
.md-header__button.md-logo {
  color: #d4a84b; /* Gold symbol */
}

.md-header__title {
  color: #3fb58e;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-size: 13px;
}

/* ===== NAVIGATION ===== */
.md-nav__link {
  color: #8b949e !important;
  transition: color 0.15s ease;
}

.md-nav__link:hover {
  color: #3fb58e !important;
}

.md-nav__link--active,
.md-nav__item--active > .md-nav__link,
.md-nav__link[href="."] {
  color: #3fb58e !important;
  font-weight: 500;
}

/* Left sidebar - primary nav */
.md-nav--primary .md-nav__link--active,
.md-nav--primary .md-nav__item--active > .md-nav__link {
  color: #3fb58e !important;
}

/* TOC (right sidebar) */
.md-nav--secondary .md-nav__link--active {
  color: #3fb58e !important;
}

/* ===== CONTENT ===== */
/* Headings — Space Grotesk matches landing page display font */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
  font-family: 'Space Grotesk', 'IBM Plex Sans', sans-serif;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.md-typeset h1 {
  color: #c5cdd9 !important;
}

.md-typeset h2 {
  color: #d4a84b !important;
  border-bottom: 1px solid #2a3342;
  padding-bottom: 0.4em;
}

.md-typeset h3,
.md-typeset h4 {
  color: #c5cdd9 !important;
}

/* Links */
.md-typeset a {
  color: #3fb58e;
}

.md-typeset a:hover {
  color: #4ec9b0;
}

/* ===== CODE BLOCKS ===== */
.md-typeset code {
  background-color: #171c24;
  border: 1px solid #2a3342;
  color: #3fb58e;
  border-radius: 0;
}

.md-typeset pre {
  border-radius: 0;
}

.md-typeset pre > code {
  border: 1px solid #2a3342;
}

/* Copy button */
.md-clipboard {
  color: #8b949e;
}

.md-clipboard:hover {
  color: #3fb58e;
}

/* ===== TABLES ===== */
.md-typeset table:not([class]) {
  border: 1px solid #2a3342;
  border-radius: 0;
}

.md-typeset table:not([class]) th {
  background-color: #171c24;
  color: #8b949e;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 0.75em;
  letter-spacing: 0.1em;
}

.md-typeset table:not([class]) td {
  border-top: 1px solid #2a3342;
}

.md-typeset table:not([class]) tr:hover td {
  background-color: #1e253020;
}

/* Keyboard keys in tables */
.md-typeset kbd {
  background-color: #171c24;
  border: 1px solid #2a3342;
  border-radius: 0;
  color: #d4a84b;
  box-shadow: none;
}

/* ===== ADMONITIONS ===== */
/* Base admonition styling */
.md-typeset .admonition,
.md-typeset details {
  border-left-width: 4px;
  border-left-style: solid;
}

/* Info admonition - jade green instead of cyan */
.md-typeset .admonition.info,
.md-typeset details.info {
  border-color: #3fb58e !important;
}

.md-typeset .info > .admonition-title,
.md-typeset .info > summary {
  background-color: rgba(63, 181, 142, 0.1) !important;
}

.md-typeset .info > .admonition-title::before,
.md-typeset .info > summary::before {
  background-color: #3fb58e !important;
}

/* Also target the SVG icon directly */
.md-typeset .admonition.info .admonition-title .twemoji svg,
.md-typeset .admonition.info > .admonition-title::before {
  color: #3fb58e !important;
  fill: #3fb58e !important;
  background-color: #3fb58e !important;
}

/* Note admonition - Tengri Blue */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: #6fa3d4 !important;
}

.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: rgba(111, 163, 212, 0.1) !important;
}

.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
  background-color: #6fa3d4 !important;
}

/* Warning admonition - Pale Amber (matches landing --warning: #e6c07b) */
.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-color: #e6c07b !important;
}

.md-typeset .warning > .admonition-title,
.md-typeset .warning > summary {
  background-color: rgba(230, 192, 123, 0.1) !important;
}

.md-typeset .warning > .admonition-title::before,
.md-typeset .warning > summary::before {
  background-color: #e6c07b !important;
}

/* Tip admonition - Turquoise */
.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-color: #4ec9b0 !important;
}

.md-typeset .tip > .admonition-title,
.md-typeset .tip > summary {
  background-color: rgba(78, 201, 176, 0.1) !important;
}

.md-typeset .tip > .admonition-title::before,
.md-typeset .tip > summary::before {
  background-color: #4ec9b0 !important;
}

/* Danger/Error - Red */
.md-typeset .admonition.danger,
.md-typeset details.danger,
.md-typeset .admonition.error,
.md-typeset details.error {
  border-color: #e85535 !important;
}

.md-typeset .danger > .admonition-title,
.md-typeset .danger > summary,
.md-typeset .error > .admonition-title,
.md-typeset .error > summary {
  background-color: rgba(232, 85, 53, 0.1) !important;
}

.md-typeset .danger > .admonition-title::before,
.md-typeset .danger > summary::before,
.md-typeset .error > .admonition-title::before,
.md-typeset .error > summary::before {
  background-color: #e85535 !important;
}

/* ===== SEARCH ===== */
.md-search__input {
  background-color: #171c24 !important;
  border: 1px solid #2a3342;
  color: #c5cdd9 !important;
  caret-color: #3fb58e;
}

.md-search__input::placeholder {
  color: #8b949e !important;
}

.md-search__input:hover {
  border-color: #3a4555;
}

.md-search__input:focus {
  border-color: #3fb58e;
}

/* Search icon */
.md-search__icon {
  color: #8b949e !important;
}

/* Search results */
.md-search__output {
  background-color: #171c24 !important;
  border: 1px solid #2a3342;
}

.md-search-result__meta {
  background-color: #1e2530 !important;
  color: #8b949e !important;
}

.md-search-result__item {
  border-bottom: 1px solid #2a3342;
}

.md-search-result__link {
  background-color: transparent !important;
}

.md-search-result__link:hover {
  background-color: #1e2530 !important;
}

.md-search-result__title {
  color: #c5cdd9 !important;
}

.md-search-result__teaser {
  color: #8b949e !important;
}

/* ===== FOOTER ===== */
.md-footer {
  background-color: #0a0d11;
  border-top: 1px solid #2a3342;
}

/* ===== SIDEBAR SECTIONS ===== */
.md-nav__title {
  color: #8b949e;
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #0f1419;
}

::-webkit-scrollbar-thumb {
  background: #2a3342;
  border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
  background: #3fb58e;
}

/* ===== SELECTION ===== */
::selection {
  background: rgba(63, 181, 142, 0.65);
  color: #0f1419;
}

/* ===== REPO STATS (top right) ===== */
.md-source {
  color: #8b949e;
}

.md-source:hover {
  color: #c5cdd9;
}

.md-source__repository {
  color: #c5cdd9;
}

/* ===== BUTTONS ===== */
.md-button--primary {
  background-color: #3fb58e;
  border-color: #3fb58e;
  color: #0f1419;
  border-radius: 0;
}

.md-button--primary:hover {
  background-color: #4ec9b0;
  border-color: #4ec9b0;
}

/* ===== TABBED CONTENT ===== */
/* Matches landing page install tab aesthetics */
.md-typeset .tabbed-labels {
  border-bottom-color: #2a3342;
}

.md-typeset .tabbed-labels > label {
  color: #8b949e;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-bottom-color: transparent;
}

.md-typeset .tabbed-labels > label:hover {
  color: #c5cdd9;
}

.md-typeset .tabbed-labels > .tabbed-labels__active,
.md-typeset .tabbed-labels > label.active {
  color: #c5cdd9;
  border-bottom-color: #3fb58e;
}

/* Tab indicator line */
.md-typeset .tabbed-labels .tabbed-labels__active {
  color: #c5cdd9;
}

/* ===== HORIZONTAL RULES ===== */
.md-typeset hr {
  border-color: #2a3342;
}
