/* ─── Base Styles ────────────────────────────────────────── */
code[class*="language-"],
pre[class*="language-"] {
    color: var(--text-2);
    background: none;
    font-family: var(--font-mono);
    font-size: 13px;
    line-height: 1.9;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    tab-size: 4;
    hyphens: none;
}

:not(pre)>code[class*="language-"] {
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--accent-10);
    color: var(--accent);
    font-size: .88em;
}

/* ─── Token Colors (Mapping zu DebugPHP Styles) ─────────── */

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: var(--text-3);
    font-style: italic;
}

.token.keyword,
.token.control,
.token.directive,
.token.important {
    color: var(--purple);
}

.token.string,
.token.char,
.token.attr-value,
.token.regex,
.token.inserted {
    color: var(--accent);
}

.token.number,
.token.boolean,
.token.constant {
    color: var(--orange);
}

.token.variable,
.token.symbol {
    color: var(--orange);
}

.token.function,
.token.function-variable {
    color: var(--blue);
}

.token.class-name,
.token.builtin,
.token.maybe-class-name {
    color: var(--orange);
}

.token.property,
.token.method,
.token.property-access {
    color: var(--yellow);
}

.token.operator,
.token.punctuation {
    color: var(--text-2);
}

.token.package {
    color: var(--blue);
}

.token.namespace {
    color: var(--text);
}

.token.selector,
.token.tag {
    color: var(--blue);
}

.token.attr-name {
    color: var(--yellow);
}

.token.deleted {
    color: var(--red);
}

.token.url {
    color: var(--accent);
    text-decoration: underline;
}

.token.scope {
    color: var(--blue);
}

.token.function {
    color: var(--yellow);
}

/* ─── PHP-spezifische Tokens ─────────────────────────────── */

.language-php .token.delimiter,
.language-php .token.php {
    color: var(--text-3);
}

.language-php .token.operator.double-colon {
    color: var(--text-2);
}

.language-php .token.operator.arrow {
    color: var(--text-2);
}

.language-php .token.variable {
    color: var(--orange);
}

/* ─── JavaScript-spezifische Tokens ──────────────────────── */

.language-javascript .token.console {
    color: var(--blue);
}

.language-javascript .token.dom {
    color: var(--yellow);
}

/* ─── CSS-spezifische Tokens ─────────────────────────────── */

.language-css .token.property {
    color: var(--blue);
}

.language-css .token.selector {
    color: var(--yellow);
}

.language-css .token.unit {
    color: var(--orange);
}

/* ─── Bash/Shell-spezifische Tokens ──────────────────────── */

.language-bash .token.function {
    color: var(--blue);
}

.language-bash .token.parameter {
    color: var(--text-2);
}

/* ─── Line Highlighting (optional) ───────────────────────── */
.line-highlight {
    background: rgba(0, 232, 157, 0.08);
    border-left: 3px solid var(--accent);
    margin-top: 0;
    margin-bottom: 0;
}

/* ─── Line Numbers Plugin (optional) ─────────────────────── */
.line-numbers .line-numbers-rows {
    border-right: 1px solid var(--border);
    padding-right: 10px;
    margin-right: 10px;
}

.line-numbers-rows>span:before {
    color: var(--text-3);
}

/* ─── Inline Color Preview (optional) ────────────────────── */
.token.color {
    display: inline-block;
    height: 1em;
    width: 1em;
    border-radius: 3px;
    vertical-align: middle;
}

/* ─── Bold/Italic in Code ────────────────────────────────── */
.token.bold {
    font-weight: 600;
}

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

/* ─── Entity References ──────────────────────────────────── */
.token.entity {
    cursor: help;
}

/* ─── Overrides für deine .code-block Wrapper ────────────── */
.code-block pre[class*="language-"] {
    margin: 0;
    padding: 18px 20px;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border-2) transparent;
    -webkit-overflow-scrolling: touch;
}

.code-block code[class*="language-"] {
    background: none;
    padding: 0;
    border-radius: 0;
    font-size: inherit;
}