/* Code block theming - ensures proper contrast in light and dark modes */

/* Base code block styling using theme colors */
pre {
    background-color: var(--surface-color, #f5f5f5) !important;
    color: var(--text-color, #2c2c2c) !important;
    padding: 1rem !important;
    border-radius: 0.375rem !important;
    overflow-x: auto !important;
    border: 1px solid color-mix(in srgb, var(--neutral-color, #ccc) 30%, transparent) !important;
}

pre code {
    background-color: transparent !important;
    color: inherit !important;
    padding: 0 !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
}

/* Inline code */
code {
    background-color: color-mix(in srgb, var(--surface-color, #f5f5f5) 80%, transparent) !important;
    color: var(--text-color, #2c2c2c) !important;
    padding: 0.125rem 0.375rem !important;
    border-radius: 0.25rem !important;
    font-size: 0.875em !important;
    font-family: 'Courier New', Courier, monospace !important;
}

/* Override highlight.js background when it conflicts */
.hljs {
    background: transparent !important;
    color: inherit !important;
}

/* Syntax highlighting that works with theme colors */
.hljs-keyword,
.hljs-selector-tag,
.hljs-built_in {
    color: var(--primary-color, #8b4513) !important;
    font-weight: bold !important;
}

.hljs-string,
.hljs-title,
.hljs-section,
.hljs-attribute {
    color: var(--success-color, #16a34a) !important;
}

.hljs-comment,
.hljs-quote,
.hljs-meta {
    color: var(--text-secondary-color, #6b7280) !important;
    font-style: italic !important;
}

.hljs-number,
.hljs-literal {
    color: var(--accent-color, #f59e0b) !important;
}

.hljs-name,
.hljs-variable {
    color: var(--info-color, #3b82f6) !important;
}

.hljs-tag {
    color: var(--error-color, #dc2626) !important;
}