/* 
 * Syntax Highlighting Renkleri
 * Sadece kod renklendirme için - Editör stilleri main-editor.css'te
 * Highlight.js'e bağımlı değil - Manuel syntax highlighting
 */

/* Varsayılan metin rengi */
.code-editor .editor-pane code {
    color: #E6EDF3;
}

/* Keywords */
.code-editor .editor-pane code .keyword {
    color: #c792ea;
    font-style: italic;
}

/* Variables ve Identifiers */
.code-editor .editor-pane code .variable {
    color: #addb67;
}

/* Object Keys - ÖNEMLİ: Obje key'leri için tutarlı renk */
.code-editor .editor-pane code .object-key {
    color: #7fdbca;
    font-weight: 500;
}

/* Strings - HTML attribute değerleri için canlı sarı */
.code-editor .editor-pane code .string {
    color: #FFD479;
}

/* Numbers */
.code-editor .editor-pane code .number {
    color: #f78c6c;
}

/* Comments */
.code-editor .editor-pane code .comment {
    color: #6B7C8F;
    font-style: italic;
}

/* Operators */
.code-editor .editor-pane code .operator {
    color: #89DDFF;
}

/* Functions */
.code-editor .editor-pane code .function {
    color: #82aaff;
}

/* Built-in */
.code-editor .editor-pane code .builtin {
    color: #addb67;
    font-style: italic;
}

/* Template Literals */
.code-editor .editor-pane code .template {
    color: #ecc48d;
}

/* Punctuation (parantez, virgül, noktalı virgül) */
.code-editor .editor-pane code .punctuation {
    color: #d6deeb;
    opacity: 0.8;
}

/* ============================================
   HTML Syntax Highlighting Styles
   Modern ve Dengeli Renk Paleti
   ============================================ */

/* HTML Tags (< >) - Canlı Mavi */
.code-editor .editor-pane code .tag {
    color: #4FC3F7;
    font-weight: 500;
}

/* HTML Tag Names (div, span, html, etc.) - Canlı Mavi */
.code-editor .editor-pane code .tag-name {
    color: #4FC3F7;
    font-weight: 600;
}

/* HTML Attributes (class, id, href, etc.) - Canlı Yeşil */
.code-editor .editor-pane code .attribute {
    color: #A7E3A1;
    font-weight: 500;
}

/* HTML DOCTYPE - Mor */
.code-editor .editor-pane code .doctype {
    color: #C792EA;
    font-weight: 500;
}

/* ============================================
   CSS Syntax Highlighting Styles
   ============================================ */

/* CSS Selectors (@media, @keyframes, etc.) */
.code-editor .editor-pane code .selector {
    color: #c792ea;
    font-style: italic;
}

/* CSS Properties */
.code-editor .editor-pane code .property {
    color: #82aaff;
}

/* CSS Selector Characters (. # :) */
.code-editor .editor-pane code .selector-char {
    color: #ff6363;
}

/* CSS Selector Names (class, id, pseudo names) */
.code-editor .editor-pane code .selector-name {
    color: #addb67;
    font-style: italic;
}

/* CSS Element Selectors (body, h1, div, etc.) - HTML tag names in CSS */
.code-editor .editor-pane code .tag-name {
    color: #4FC3F7;
    font-weight: 500;
}

/* CSS Colors (hex, rgb, rgba, etc.) */
.code-editor .editor-pane code .color {
    color: #f78c6c;
}