/*
 * highlight.js theme matched to prism-tomorrow colors.
 * Maps hljs token classes to the exact same color values used by PrismJS's
 * "Tomorrow Night" theme so that in-editor (hljs) and rendered (Prism)
 * code blocks look identical.
 *
 * Prism-tomorrow palette:
 *   background  #2d2d2d
 *   foreground  #ccc
 *   comment     #999
 *   punctuation #ccc
 *   tag/attr    #e2777a
 *   function    #6196cc
 *   bool/num    #f08d49
 *   class/const #f8c555
 *   keyword/sel #cc99cd
 *   string/var  #7ec699
 *   operator    #67cdcc
 */

pre code.hljs {
    display: block;
    overflow-x: auto;
    padding: 1em;
}

code.hljs {
    padding: 3px 5px;
}

.hljs {
    background: #2d2d2d;
    color: #ccc;
}

/* ── Comments ──────────────────────────────────────────────────────────── */
.hljs-comment,
.hljs-quote {
    color: #999;
}

/* ── Keywords, selectors, built-ins (purple) ───────────────────────────── */
.hljs-keyword,
.hljs-selector-tag,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-built_in,
.hljs-meta {
    color: #cc99cd;
}

/* ── Strings, regex (green) ────────────────────────────────────────────── */
.hljs-string,
.hljs-regexp,
.hljs-addition,
.hljs-variable,
.hljs-template-variable {
    color: #7ec699;
}

/* ── Numbers, booleans, literals (orange) ──────────────────────────────── */
.hljs-number,
.hljs-literal {
    color: #f08d49;
}

/* ── Function/class/title names (blue) ─────────────────────────────────── */
.hljs-title,
.hljs-title.class_,
.hljs-title.function_ {
    color: #6196cc;
}

/* ── Class names, constants, symbols (yellow) ──────────────────────────── */
.hljs-type,
.hljs-symbol,
.hljs-bullet {
    color: #f8c555;
}

/* ── Tags, attributes (red/salmon) ─────────────────────────────────────── */
.hljs-tag,
.hljs-name,
.hljs-attr,
.hljs-deletion {
    color: #e2777a;
}

/* ── Operators, entities (teal) ────────────────────────────────────────── */
.hljs-operator,
.hljs-link {
    color: #67cdcc;
}

/* ── Punctuation (same as foreground) ──────────────────────────────────── */
.hljs-punctuation {
    color: #ccc;
}

/* ── Properties ────────────────────────────────────────────────────────── */
.hljs-property {
    color: #f8c555;
}

/* ── Substrings, char escapes ──────────────────────────────────────────── */
.hljs-subst,
.hljs-char {
    color: #ccc;
}

/* ── Section headings ──────────────────────────────────────────────────── */
.hljs-section {
    color: #6196cc;
}

/* ── Emphasis / strong ─────────────────────────────────────────────────── */
.hljs-emphasis {
    font-style: italic;
}

.hljs-strong {
    font-weight: bold;
}