/* highlight.js token colors driven by site theme (dark default, light override).
   Loaded before page inline styles; tokens are spans so they win over code-level color. */

:root {
  --hl-base: #e4e4e7;
  --hl-comment: #8b949e;
  --hl-keyword: #ff7b72;
  --hl-function: #d2a8ff;
  --hl-constant: #79c0ff;
  --hl-string: #a5d6ff;
  --hl-attr: #ffa657;
  --hl-tag: #7ee787;
}

html[data-theme="light"] {
  --hl-base: #3f3f46;
  --hl-comment: #6e7781;
  --hl-keyword: #cf222e;
  --hl-function: #8250df;
  --hl-constant: #0550ae;
  --hl-string: #0a3069;
  --hl-attr: #953800;
  --hl-tag: #116329;
}

.md-rendered .hljs {
  color: var(--hl-base);
}

.md-rendered .hljs-comment,
.md-rendered .hljs-quote {
  color: var(--hl-comment);
  font-style: italic;
}

.md-rendered .hljs-keyword,
.md-rendered .hljs-selector-tag,
.md-rendered .hljs-doctag,
.md-rendered .hljs-formula {
  color: var(--hl-keyword);
}

.md-rendered .hljs-title,
.md-rendered .hljs-title.function_,
.md-rendered .hljs-section,
.md-rendered .hljs-name {
  color: var(--hl-function);
}

.md-rendered .hljs-title.class_,
.md-rendered .hljs-type,
.md-rendered .hljs-class .hljs-title {
  color: var(--hl-constant);
}

.md-rendered .hljs-number,
.md-rendered .hljs-literal,
.md-rendered .hljs-symbol,
.md-rendered .hljs-built_in,
.md-rendered .hljs-selector-id,
.md-rendered .hljs-selector-class,
.md-rendered .hljs-template-tag,
.md-rendered .hljs-addition {
  color: var(--hl-constant);
}

.md-rendered .hljs-string,
.md-rendered .hljs-char.escape_,
.md-rendered .hljs-regexp,
.md-rendered .hljs-link,
.md-rendered .hljs-meta .hljs-string {
  color: var(--hl-string);
}

.md-rendered .hljs-attr,
.md-rendered .hljs-attribute,
.md-rendered .hljs-variable,
.md-rendered .hljs-template-variable,
.md-rendered .hljs-params,
.md-rendered .hljs-property,
.md-rendered .hljs-deletion,
.md-rendered .hljs-meta .hljs-keyword {
  color: var(--hl-attr);
}

.md-rendered .hljs-tag,
.md-rendered .hljs-selector-attr,
.md-rendered .hljs-selector-pseudo {
  color: var(--hl-tag);
}

.md-rendered .hljs-strong {
  font-weight: 700;
}

.md-rendered .hljs-emphasis {
  font-style: italic;
}

.md-rendered .hljs-bullet {
  color: var(--hl-constant);
}
