/* prism-verse.css
 * ===============
 * Custom coloring file for the WordPress plugin
 *   "Highlighting Code Block" (https://github.com/ddryo/Highlighting-Code-Block)
 *
 * The plugin's structural CSS (_base.scss) is always loaded; only the COLORING
 * file (hcb--dark.scss / hcb--light.scss) is replaced when you set a custom
 * coloring file. Backgrounds, label colors, line numbers and scrollbars are
 * driven by CSS custom properties declared in :root — so the cleanest way to
 * theme is to override those variables here.
 *
 * Layout (provided by HCB's _base.scss, kept here for reference):
 *
 *   <div class="hcb_wrap">
 *     <pre class="prism" data-lang="..." data-file="...">
 *       <code class="language-xxx">...</code>
 *     </pre>
 *     <button class="hcb-clipboard">...</button>
 *   </div>
 *
 *   .hcb_wrap.hcb_wrap > pre,
 *   .hcb_wrap.hcb_wrap > pre > code  { background: var(--hcb--bgc); ... }
 *
 * ─────────────────────────────────────────────────────────────────────────
 * Sections
 *   1. HCB CSS variables — drives background / labels / line numbers / etc.
 *   2. Non-HCB fallback — for raw <pre><code> usage outside the plugin.
 *   3. Standard-language token colors — Prism Tomorrow Night palette.
 *   4. Verse-specific overrides — verse-dark.tmTheme.json (Epic Games / UEFN).
 * ───────────────────────────────────────────────────────────────────────── */


/* =========================================================================
   1. HCB CSS VARIABLES
   ========================================================================= */

:root {
	/* Code block — black background, light foreground */
	--hcb--c:    #d4d4d4;
	--hcb--bgc:  #000000;
	--hcb--tsh:  none;

	/* Lang / file-name label in the top-right of each pre */
	--hcb--data-label--c:   #d4d4d4;
	--hcb--data-label--bgc: #1a1a1a;

	/* Line numbers gutter */
	--hcb--line-numbers--c: #555;

	/* Highlighted-line band */
	--hcb--highlight-color: rgba(255, 255, 255, 0.06);

	/* Scrollbar */
	--hcb--scbar-track--bgc: rgba(255, 255, 255, 0.05);
	--hcb--scbar-thumb--bgc: rgba(255, 255, 255, 0.20);
}


/* =========================================================================
   2. NON-HCB FALLBACK
   When the markup is plain <pre><code class="language-xxx"> (e.g. local
   demo.html, or a page that doesn't use the HCB plugin), the .hcb_wrap
   selectors above don't apply. These rules guarantee a consistent look.
   ========================================================================= */

code[class*="language-"],
pre[class*="language-"] {
	color: #d4d4d4;
	background: none;
	text-shadow: none;
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	font-size: 1em;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

pre[class*="language-"] {
	padding: 1em;
	margin: 0.5em 0;
	overflow: auto;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
	background: #000000;
}

:not(pre) > code[class*="language-"] {
	padding: 0.1em;
	border-radius: 0.3em;
	white-space: normal;
}


/* =========================================================================
   3. STANDARD-LANGUAGE TOKEN COLORS — Prism Tomorrow Night palette
   Applies to every Prism block by default (HTML, CSS, JS, Python, ...).
   The Verse overrides in section 4 have higher specificity, so Verse blocks
   pick up Epic's official palette instead.
   ========================================================================= */

.token.block-comment,
.token.cdata,
.token.comment,
.token.doctype,
.token.prolog         { color: #999; }

.token.punctuation    { color: #ccc; }

.token.namespace      { opacity: 0.7; }

.token.attr-name,
.token.deleted,
.token.tag            { color: #e2777a; }

.token.function-name  { color: #6196cc; }

.token.boolean,
.token.function,
.token.number         { color: #f08d49; }

.token.class-name,
.token.constant,
.token.property,
.token.symbol         { color: #f8c555; }

.token.atrule,
.token.builtin,
.token.important,
.token.keyword,
.token.selector       { color: #cc99cd; }

.token.attr-value,
.token.char,
.token.regex,
.token.string,
.token.variable       { color: #7ec699; }

.token.entity,
.token.operator,
.token.url            { color: #67cdcc; }

.token.bold,
.token.important      { font-weight: 700; }

.token.italic         { font-style: italic; }

.token.entity         { cursor: help; }

.token.inserted       { color: #b4ec43; }


/* =========================================================================
   4. VERSE OVERRIDES — language-verse / language-versetest / language-vson
   Colors from `verse-dark.tmTheme.json` shipped with epicgames.verse VS Code
   extension.  Selectors include a `.language-verse` class so they beat the
   Tomorrow Night rules above by specificity.
   ─────────────────────────────────────────────────────────────────────────
     invalid                                        #f44747
     comment                                        #77B06B
     constant.language     (paths, keyword color)   #569cd6
     constant.numeric                               #c2ddb4
     constant.character.escape                      #B89047
     string                                         #C09077
     text                                  italic   #DFC79F
     keyword / keyword.control                      #569cd6
     keyword.operator                               #77AFAF
     keyword.other.unit                             #92a788
     entity.name.function                           #e5c2ff
     variable                                       #b9d6ff
     entity.name.tag                                #6F77A6
     keyword.declaration / punctuation.definition   #8499b7
     editor foreground                              #D4D4D4
   ========================================================================= */

code[class*="language-verse"],
pre[class*="language-verse"],
code[class*="language-versetest"],
pre[class*="language-versetest"],
code[class*="language-vson"],
pre[class*="language-vson"] {
	color: #d4d4d4;
	font-family: Consolas, "Courier New", Menlo, Monaco, "Liberation Mono", monospace;
}

.language-verse .token.comment,
.language-verse .token.block-comment,
.language-verse .token.line-comment,
.language-versetest .token.comment,
.language-vson .token.comment {
	color: #77B06B;
}

.language-verse .token.invalid,
.language-verse .token.invalid-token,
.language-versetest .token.invalid,
.language-vson .token.invalid {
	color: #f44747;
}

.language-verse .token.number,
.language-versetest .token.number,
.language-vson .token.number {
	color: #c2ddb4;
}

.language-verse .token.number .token.unit,
.language-versetest .token.number .token.unit,
.language-vson .token.number .token.unit {
	color: #92a788;
}

.language-verse .token.string,
.language-verse .token.char,
.language-verse .token.char-code,
.language-versetest .token.string,
.language-versetest .token.char,
.language-vson .token.string,
.language-vson .token.char {
	color: #C09077;
}

.language-verse .token.escape,
.language-verse .token.string .token.escape,
.language-verse .token.char .token.escape,
.language-verse .token.interpolation-punctuation,
.language-versetest .token.escape,
.language-vson .token.escape {
	color: #B89047;
}

.language-verse .token.markup-text,
.language-versetest .token.markup-text,
.language-vson .token.markup-text {
	color: #DFC79F;
	font-style: italic;
}

.language-verse .token.keyword,
.language-verse .token.control-keyword,
.language-verse .token.constant,
.language-verse .token.boolean,
.language-versetest .token.keyword,
.language-vson .token.keyword {
	color: #569cd6;
}

.language-verse .token.operator,
.language-verse .token.logical-operator,
.language-verse .token.arithmetic-operator,
.language-verse .token.comparison-operator,
.language-verse .token.compound-assignment,
.language-verse .token.range-operator,
.language-verse .token.pipe-operator,
.language-verse .token.fat-arrow-operator,
.language-versetest .token.operator,
.language-vson .token.operator {
	color: #77AFAF;
}

.language-verse .token.function-name,
.language-verse .token.function,
.language-versetest .token.function,
.language-vson .token.function {
	color: #e5c2ff;
}

.language-verse .token.variable,
.language-versetest .token.variable,
.language-vson .token.variable {
	color: #b9d6ff;
}

/* Paths emit `constant.language.path.verse`; in the official tmTheme that
 * scope matches the `constant.language` rule, so paths render in keyword blue. */
.language-verse .token.path,
.language-versetest .token.path,
.language-vson .token.path {
	color: #569cd6;
}

.language-verse .token.tag,
.language-verse .token.tag-name,
.language-verse .token.tag-punctuation,
.language-verse .token.attr-name,
.language-versetest .token.tag,
.language-vson .token.tag {
	color: #6F77A6;
}

.language-verse .token.declaration,
.language-verse .token.declaration-keyword,
.language-verse .token.storage-modifier,
.language-verse .token.define-operator,
.language-verse .token.punctuation,
.language-versetest .token.declaration,
.language-versetest .token.punctuation,
.language-vson .token.declaration,
.language-vson .token.punctuation {
	color: #8499b7;
}

/* Braces / brackets / parens have no scope in the official grammar — they
 * inherit the editor foreground colour. */
.language-verse .token.brace-punctuation,
.language-versetest .token.brace-punctuation,
.language-vson .token.brace-punctuation {
	color: #d4d4d4;
}