/* ==========================================================================
   Code syntax highlighting — warm, muted palette
   Works for both light and dark mode via CSS custom properties
   ========================================================================== */

:root {
    --code-text: #3c3836;
    --code-comment: #928374;
    --code-keyword: #8B3A3A;
    --code-string: #5A7A3A;
    --code-number: #875F3A;
    --code-function: #3A5A7A;
    --code-variable: #6B5A8A;
    --code-operator: #6B6560;
}

[data-theme="dark"] {
    --code-text: #E8E4DE;
    --code-comment: #6B6560;
    --code-keyword: #C4736C;
    --code-string: #A9B665;
    --code-number: #D8A657;
    --code-function: #7DAEA3;
    --code-variable: #B39DDB;
    --code-operator: #8A857D;
}

pre code {
    color: var(--code-text);
}

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

.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
    color: var(--code-keyword);
}

.hljs-string,
.hljs-attr {
    color: var(--code-string);
}

.hljs-number,
.hljs-literal {
    color: var(--code-number);
}

.hljs-title,
.hljs-function .hljs-title {
    color: var(--code-function);
}

.hljs-variable,
.hljs-template-variable {
    color: var(--code-variable);
}

.hljs-built_in,
.hljs-name {
    color: var(--code-keyword);
}

.hljs-symbol,
.hljs-bullet {
    color: var(--code-number);
}

.hljs-meta {
    color: var(--code-comment);
}

.hljs-addition {
    color: var(--code-string);
}

.hljs-deletion {
    color: var(--code-keyword);
}