/*
 * =============================================================================
 * SYNTAX HIGHLIGHTING THEMES BY LANGUAGE
 * =============================================================================
 * 
 * Centralized configuration for syntax highlighting colors.
 * Each language has its own theme that can be easily modified.
 * 
 * Supported languages:
 *   - JSON (Vega Editor theme)
 *   - DAX (Power BI theme)
 *   - Power Query M (Power BI theme)
 *   - Default (for unlisted languages)
 * 
 * =============================================================================
 */

/* -----------------------------------------------------------------------------
 * CSS VARIABLES - Easy to modify theme colors
 * -------------------------------------------------------------------------- */
:root {
  /* --- JSON Theme (Vega Official Site) --- */
  --json-bg: #f5f5f5;
  --json-text: #333333;
  --json-key: #a31515; /* Red - property keys */
  --json-string: #0451a5; /* Blue - string values */
  --json-number: #098658; /* Green - numbers */
  --json-literal: #0451a5; /* Blue - true/false/null */
  --json-punctuation: #333333; /* Dark gray - brackets */
  --json-font: 'Consolas', 'Monaco', 'Menlo', monospace;

  /* --- DAX Theme (Power BI style) --- */
  --dax-bg: #1e1e1e;
  --dax-text: #d4d4d4;
  --dax-keyword: #569cd6; /* Blue - CALCULATE, SUMX, etc */
  --dax-function: #dcdcaa; /* Yellow - function names */
  --dax-string: #ce9178; /* Orange - strings */
  --dax-number: #b5cea8; /* Light green - numbers */
  --dax-operator: #d4d4d4; /* White - operators */
  --dax-comment: #6a9955; /* Green - comments */

  /* --- Power Query M Theme --- */
  --pq-bg: #1e1e1e;
  --pq-text: #d4d4d4;
  --pq-keyword: #569cd6; /* Blue - let, in, if, etc */
  --pq-function: #dcdcaa; /* Yellow - function names */
  --pq-string: #ce9178; /* Orange - strings */
  --pq-number: #b5cea8; /* Light green - numbers */
  --pq-operator: #d4d4d4; /* White - operators */
  --pq-comment: #6a9955; /* Green - comments */
}

/* -----------------------------------------------------------------------------
 * JSON - Vega Editor Theme
 * Matches: https://vega.github.io/editor/
 * -------------------------------------------------------------------------- */
.language-json.hljs,
.language-json .hljs,
code.language-json,
.highlight .language-json {
  background-color: var(--json-bg) !important;
  color: var(--json-text) !important;
  font-family: var(--json-font) !important;
  font-size: 13px;
  line-height: 1.5;
}

/* JSON Property Keys - "$schema", "data", "mark" */
.language-json .hljs-attr {
  color: var(--json-key) !important;
  font-weight: normal;
}

/* JSON String Values - "bar", "A", URLs */
.language-json .hljs-string {
  color: var(--json-string) !important;
  font-weight: normal;
}

/* JSON Numbers - 28, 55, 0.5 */
.language-json .hljs-number {
  color: var(--json-number) !important;
}

/* JSON Literals - true, false, null */
.language-json .hljs-literal {
  color: var(--json-literal) !important;
}

/* JSON Punctuation - { } [ ] : , */
.language-json .hljs-punctuation {
  color: var(--json-punctuation) !important;
}

/* -----------------------------------------------------------------------------
 * DAX - Power BI Theme (preserved from original)
 * -------------------------------------------------------------------------- */
.language-dax.hljs,
.language-dax .hljs,
code.language-dax {
  background-color: var(--dax-bg) !important;
  color: var(--dax-text) !important;
}

.language-dax .hljs-keyword {
  color: var(--dax-keyword) !important;
}

.language-dax .hljs-built_in,
.language-dax .hljs-title.function_ {
  color: var(--dax-function) !important;
}

.language-dax .hljs-string {
  color: var(--dax-string) !important;
}

.language-dax .hljs-number {
  color: var(--dax-number) !important;
}

.language-dax .hljs-comment {
  color: var(--dax-comment) !important;
  font-style: italic;
}

/* -----------------------------------------------------------------------------
 * Power Query M - Power BI Theme
 * -------------------------------------------------------------------------- */
.language-powerquery.hljs,
.language-powerquery .hljs,
.language-m.hljs,
.language-m .hljs,
code.language-powerquery,
code.language-m {
  background-color: var(--pq-bg) !important;
  color: var(--pq-text) !important;
}

.language-powerquery .hljs-keyword,
.language-m .hljs-keyword {
  color: var(--pq-keyword) !important;
}

.language-powerquery .hljs-built_in,
.language-powerquery .hljs-title.function_,
.language-m .hljs-built_in,
.language-m .hljs-title.function_ {
  color: var(--pq-function) !important;
}

.language-powerquery .hljs-string,
.language-m .hljs-string {
  color: var(--pq-string) !important;
}

.language-powerquery .hljs-number,
.language-m .hljs-number {
  color: var(--pq-number) !important;
}

.language-powerquery .hljs-comment,
.language-m .hljs-comment {
  color: var(--pq-comment) !important;
  font-style: italic;
}

/* -----------------------------------------------------------------------------
 * JavaScript - Dark Theme (for Power Query M workaround)
 * Since highlight.js doesn't support Power Query M natively, we use JavaScript
 * as a fallback language with dark theming to match DAX/Power Query aesthetic
 * -------------------------------------------------------------------------- */
.language-javascript.hljs,
.language-javascript .hljs,
code.language-javascript {
  background-color: var(--pq-bg) !important;
  color: var(--pq-text) !important;
}

.language-javascript .hljs-keyword {
  color: var(--pq-keyword) !important;
}

.language-javascript .hljs-built_in,
.language-javascript .hljs-title.function_ {
  color: var(--pq-function) !important;
}

.language-javascript .hljs-string {
  color: var(--pq-string) !important;
}

.language-javascript .hljs-number {
  color: var(--pq-number) !important;
}

.language-javascript .hljs-comment {
  color: var(--pq-comment) !important;
  font-style: italic;
}

.language-javascript .hljs-params {
  color: #9cdcfe !important; /* Light blue for parameters */
}

.language-javascript .hljs-property {
  color: #9cdcfe !important;
}