/* 
 * QuantSpace Code Syntax Highlighting
 * Global styles for all code blocks across the site
 * Supports light/dark themes with Nord color palette
 */

/* Light theme (default) */
:root {
    --syntax-bg: #ECEFF4;
    --syntax-fg: #2E3440;
    --syntax-comment: #4C566A;
    --syntax-keyword: #5E81AC;
    --syntax-type: #8FBCBB;
    --syntax-function: #88C0D0;
    --syntax-variable: #2E3440;
    --syntax-string: #A3BE8C;
    --syntax-number: #D08770;
    --syntax-operator: #81A1C1;
    --syntax-builtin: #5E81AC;
    --syntax-attribute: #B48EAD;
    --syntax-error: #BF616A;
}

/* Dark theme */
.dark {
    --syntax-bg: #2E3440;
    --syntax-fg: #ECEFF4;
    --syntax-comment: #616E88;
    --syntax-keyword: #81A1C1;
    --syntax-type: #8FBCBB;
    --syntax-function: #88C0D0;
    --syntax-variable: #D8DEE9;
    --syntax-string: #A3BE8C;
    --syntax-number: #D08770;
    --syntax-operator: #ECEFF4;
    --syntax-builtin: #81A1C1;
    --syntax-attribute: #B48EAD;
    --syntax-error: #BF616A;
}

/* Code block container */
pre {
    background: var(--syntax-bg) !important;
    border: 1px solid rgba(128, 128, 128, 0.2) !important;
    border-radius: 6px !important;
    padding: 1.25rem !important;
    overflow-x: auto !important;
    margin: 1.5rem 0 !important;
}

pre code {
    background: transparent !important;
    color: var(--syntax-fg) !important;
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace !important;
    font-size: 0.875rem !important;
    line-height: 1.7 !important;
}

/* Inline code */
code {
    background: var(--syntax-bg) !important;
    color: var(--syntax-fg) !important;
    padding: 0.2em 0.4em !important;
    border-radius: 3px !important;
    font-size: 0.9em !important;
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace !important;
}

/* Comments */
code span.co,
code .hljs-comment {
    color: var(--syntax-comment) !important;
    font-style: italic !important;
}

/* Keywords (if, for, while, def, class, import, etc.) */
code span.kw,
code span.cf,
code .hljs-keyword {
    color: var(--syntax-keyword) !important;
    font-weight: 600 !important;
}

/* Data types */
code span.dt,
code .hljs-type {
    color: var(--syntax-type) !important;
}

/* Function names and imports */
code span.fu,
code span.im,
code .hljs-title.function,
code .hljs-built_in {
    color: var(--syntax-function) !important;
    font-weight: 600 !important;
}

/* Variables and attributes */
code span.va,
code span.at,
code .hljs-variable,
code .hljs-attr {
    color: var(--syntax-variable) !important;
}

/* Strings */
code span.st,
code span.ss,
code .hljs-string {
    color: var(--syntax-string) !important;
}

/* Numbers */
code span.dv,
code span.fl,
code span.bn,
code .hljs-number,
code .hljs-literal {
    color: var(--syntax-number) !important;
}

/* Operators */
code span.op,
code .hljs-operator {
    color: var(--syntax-operator) !important;
}

/* Built-in functions */
code span.bu,
code span.ot,
code .hljs-built_in {
    color: var(--syntax-builtin) !important;
}

/* Decorators / annotations */
code span.an,
code .hljs-meta {
    color: var(--syntax-attribute) !important;
}

/* Errors */
code span.er,
code span.al,
code .hljs-deletion {
    color: var(--syntax-error) !important;
    font-weight: bold !important;
}

/* Class names */
code .hljs-title.class {
    color: var(--syntax-type) !important;
    font-weight: 600 !important;
}

/* Parameters */
code .hljs-params {
    color: var(--syntax-variable) !important;
}

/* Remove any background from syntax spans */
code span,
code .hljs-* {
    background: none !important;
}