/*
 * Syntax — parlak, uyumlu tonlar
 * Kabuk: editor.css (koyu uzay mavisi). Span: editor-simple.js
 */

.code-editor .editor-pane code {
    color: #c9d1d9;
}

/* --- JavaScript --- */
.code-editor .editor-pane code[class*='language-javascript'] .keyword {
    color: #ff7b72;
    font-style: italic;
    font-weight: 500;
}

.code-editor .editor-pane code .keyword {
    color: #ff7b72;
    font-style: italic;
}

.code-editor .editor-pane code .variable-decl,
.code-editor .editor-pane.active code .variable-decl,
.editor-pane code .variable-decl {
    color: #79c0ff !important;
    font-weight: 600;
}

.code-editor .editor-pane code .variable {
    color: #79c0ff;
}

.code-editor .editor-pane code .object-key {
    color: #e3b341;
    font-weight: 500;
}

.code-editor .editor-pane code .string {
    color: #ffa657;
}

.code-editor .editor-pane code[class*='language-javascript'] .string {
    color: #ffa657;
}

.code-editor .editor-pane code .number {
    color: #a5d6ff;
}

.code-editor .editor-pane code .comment {
    color: #8fad9e;
    font-style: italic;
    opacity: 0.88;
}

.code-editor .editor-pane code .operator {
    color: #8b949e;
}

.code-editor .editor-pane code[class*='language-javascript'] .function {
    color: #d2a8ff;
    font-weight: 500;
}

.code-editor .editor-pane code .function {
    color: #d2a8ff;
}

.code-editor .editor-pane code .builtin {
    color: #56d4dd;
    font-style: italic;
}

.code-editor .editor-pane code .template {
    color: #ffa657;
}

.code-editor .editor-pane code .punctuation {
    color: #8b949e;
}

/* --- HTML — Tokyo Night tabanlı Softyla karışımı (telifsiz palet) ---
   tag #f7768e · attr #e0af68 · string #9ece6a · keyword/doctype #7aa2f7 · comment #6a739d */
.code-editor .editor-pane code.language-html .tag-bracket,
.code-editor .editor-pane code[class*='language-html'] .tag-bracket {
    color: #f7768e;
    font-weight: 500;
}

.code-editor .editor-pane code.language-html .tag-name,
.code-editor .editor-pane code[class*='language-html'] .tag-name {
    color: #f7768e;
    font-weight: 500;
}

.code-editor .editor-pane code.language-html .tag,
.code-editor .editor-pane code[class*='language-html'] .tag {
    color: #f7768e;
    font-weight: 500;
}

.code-editor .editor-pane code.language-html .attribute,
.code-editor .editor-pane code[class*='language-html'] .attribute {
    color: #e0af68;
    font-weight: 500;
}

.code-editor .editor-pane code.language-html .string,
.code-editor .editor-pane code[class*='language-html'] .string {
    color: #9ece6a;
    font-weight: 400;
}

.code-editor .editor-pane code.language-html .operator,
.code-editor .editor-pane code[class*='language-html'] .operator {
    color: #7e84a6;
    font-weight: 400;
}

.code-editor .editor-pane code.language-html .doctype,
.code-editor .editor-pane code[class*='language-html'] .doctype {
    color: #7aa2f7;
    font-weight: 500;
}

.code-editor .editor-pane code.language-html .comment,
.code-editor .editor-pane code[class*='language-html'] .comment {
    color: #6a739d;
    font-style: italic;
    opacity: 0.95;
}

/* --- CSS — Tokyo Night uyumlu: @kurallar, özellik, seçici adı, yumuşak değer tonları --- */
.code-editor .editor-pane code[class*='language-css'] .selector {
    color: #bb9af7;
    font-weight: 500;
}

.code-editor .editor-pane code .selector {
    color: #bb9af7;
    font-weight: 500;
}

.code-editor .editor-pane code[class*='language-css'] .property {
    color: #7aa2f7;
    font-weight: 500;
}

.code-editor .editor-pane code .property {
    color: #7aa2f7;
    font-weight: 500;
}

.code-editor .editor-pane code .selector-char {
    color: #89b4fa;
}

.code-editor .editor-pane code .selector-name {
    color: #e0af68;
    font-weight: 500;
}

.code-editor .editor-pane code[class*='language-css'] .keyword {
    color: #cba6f7;
    font-style: italic;
    font-weight: 500;
}

.code-editor .editor-pane code .color {
    color: #94e2d5;
}

.code-editor .editor-pane code[class*='language-css'] .number {
    color: #dcb6cc;
}

.code-editor .editor-pane code[class*='language-css'] .string {
    color: #9ece6a;
}

.code-editor .editor-pane code[class*='language-css'] .function {
    color: #7dcfff;
    font-weight: 500;
}

.code-editor .editor-pane code[class*='language-css'] .comment {
    color: #6a739d;
    font-style: italic;
    opacity: 0.95;
}

.code-editor .editor-pane code[class*='language-css'] .operator {
    color: #7e84a6;
}

.code-editor .editor-pane code[class*='language-css'] .punctuation {
    color: #9aa5ce;
}
