/* ── Dark mode ───────────────────────────────────────────────────────────── */

[data-md-color-scheme="slate"] {
  /* Primary — #6366f1 indigo */
  --md-primary-fg-color:        #6366f1;
  --md-primary-fg-color--light: #818cf8;
  --md-primary-fg-color--dark:  #4f46e5;

  /* Accent — same indigo family */
  --md-accent-fg-color:         #818cf8;

  /* Background — match landing page #0a0e17 */
  --md-default-bg-color:        #0a0e17;
  --md-default-bg-color--light: #0d1117;

  /* Code blocks */
  --md-code-bg-color:           #0d1117;
  --md-code-fg-color:           #e2e8f0;

  /* Sidebar + header surfaces */
  --md-footer-bg-color:         #0d1117;
  --md-footer-bg-color--dark:   #070b12;

  --rl-header-bg:               rgba(10, 14, 23, 0.92);
  --rl-header-border:           rgba(99, 102, 241, 0.12);
  --rl-tabs-bg:                 #0d1117;
  --rl-table-th-bg:             #1e293b;
  --rl-table-th-color:          #e2e8f0;
}

/* ── Light mode ──────────────────────────────────────────────────────────── */

[data-md-color-scheme="default"] {
  --md-primary-fg-color:        #6366f1;
  --md-primary-fg-color--light: #818cf8;
  --md-primary-fg-color--dark:  #4f46e5;

  --md-accent-fg-color:         #6366f1;

  --md-default-bg-color:        #ffffff;
  --md-default-bg-color--light: #f8f9fc;

  --md-code-bg-color:           #f3f4ff;
  --md-code-fg-color:           #1e1b4b;

  --md-footer-bg-color:         #f0f0f7;
  --md-footer-bg-color--dark:   #e8e8f0;

  /* Text ON primary-coloured surfaces (header, footer).
     Material defaults this to white (assumes a dark primary bg).
     We override the header/footer bg to near-white, so text must be dark. */
  --md-primary-bg-color:        #1e293b;
  --md-primary-bg-color--light: rgba(30, 41, 59, 0.54);

  /* Footer text */
  --md-footer-fg-color:         #1e293b;
  --md-footer-fg-color--light:  rgba(30, 41, 59, 0.75);
  --md-footer-fg-color--lighter: rgba(30, 41, 59, 0.54);

  --rl-header-bg:               rgba(255, 255, 255, 0.92);
  --rl-header-border:           rgba(99, 102, 241, 0.15);
  --rl-tabs-bg:                 #f8f9fc;
  --rl-table-th-bg:             #ede9fe;
  --rl-table-th-color:          #3730a3;
}

/* ── Header bar ──────────────────────────────────────────────────────────── */

.md-header {
  background-color: var(--rl-header-bg);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--rl-header-border);
  box-shadow: none;
}

/* ── Nav tabs ────────────────────────────────────────────────────────────── */

.md-tabs {
  background-color: var(--rl-tabs-bg);
  border-bottom: 1px solid var(--rl-header-border);
}

.md-tabs__link--active,
.md-tabs__link:hover {
  color: #818cf8;
}

/* Sidebar */
.md-nav__link--active {
  color: #818cf8 !important;
  font-weight: 600;
}

.md-nav__link:hover {
  color: #818cf8;
}

/* Admonition — match landing page border style */
.md-typeset .admonition,
.md-typeset details {
  border-left-color: #6366f1;
  background-color: rgba(99, 102, 241, 0.06);
}

.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-left-color: #f59e0b;
  background-color: rgba(245, 158, 11, 0.06);
}

.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-left-color: #22c55e;
  background-color: rgba(34, 197, 94, 0.06);
}

/* Code copy button */
.md-clipboard:hover {
  color: #818cf8;
}

/* Table header */
.md-typeset table:not([class]) th {
  background-color: var(--rl-table-th-bg);
  color: var(--rl-table-th-color);
}

/* Inline code */
.md-typeset code {
  background-color: rgba(99, 102, 241, 0.1);
  color: #818cf8;
  border-radius: 4px;
  padding: 0.1em 0.35em;
}

/* Selection */
::selection {
  background: #6366f1;
  color: #fff;
}

/* Scroll to top button */
.md-top {
  background-color: #6366f1;
}

/* ── Terminal output blocks ── */
.rl-terminal {
  background-color: #0d1117;
  border: 1px solid rgba(99, 102, 241, 0.18);
  border-radius: 8px;
  overflow: hidden;
  margin: 1.2em 0;
  font-size: 0.82em;
}

.rl-terminal-bar {
  background-color: #161b22;
  border-bottom: 1px solid rgba(99, 102, 241, 0.12);
  padding: 0.45em 1em;
  color: #e2e8f0;
  font-family: "JetBrains Mono", monospace;
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.rl-terminal-bar::before {
  content: "● ● ●";
  font-size: 0.7em;
  color: rgba(255,255,255,0.15);
  letter-spacing: 0.2em;
  margin-right: 0.6em;
}

.rl-terminal pre {
  margin: 0;
  padding: 1em 1.2em;
  background: transparent;
  color: #c9d1d9;
  font-family: "JetBrains Mono", monospace;
  overflow-x: auto;
  line-height: 1.55;
}

.rl-terminal .rl-p   { color: #818cf8; font-weight: 600; }
.rl-terminal .rl-ok  { color: #22c55e; }
.rl-terminal .rl-warn{ color: #f59e0b; }
.rl-terminal .rl-bad { color: #ef4444; }
.rl-terminal .rl-dim { color: #6b7280; }
.rl-terminal .rl-info{ color: #60a5fa; }
.rl-terminal .rl-mag { color: #c084fc; }
.rl-terminal em      { color: #e2e8f0; font-style: normal; }

/* Mermaid diagram theming */
.mermaid {
  text-align: center;
  margin: 1.5em 0;
}