/* style.css */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    /* --- VARSAYILAN: DARK MODE (Karanlık) --- */
    
    /* Zemin Renkleri */
    --bg-body: #0f172a;       /* Slate 900 */
    --bg-panel: #1e293b;      /* Slate 800 */
    --bg-input: #020617;      /* Slate 950 */
    --border-color: #334155;  /* Slate 700 */

    /* Ana Renk (Mavi) */
    --color-primary: #3b82f6; 
    --color-primary-hover: #2563eb;

    /* Yazı Renkleri */
    --text-main: #cbd5e1;     /* Slate 300 */
    --text-muted: #64748b;    /* Slate 500 */
    --text-heading: #ffffff;  /* Beyaz */

    /* CKEditor Özel */
    --ck-bg: var(--bg-body);
    --ck-panel: var(--bg-panel);
    --ck-text: #e2e8f0;
}

/* --- LIGHT MODE (Aydınlık) --- */
[data-theme="light"] {
    /* Zemin Renkleri */
    --bg-body: #f1f5f9;       /* Slate 100 */
    --bg-panel: #ffffff;      /* Beyaz */
    --bg-input: #f8fafc;      /* Slate 50 */
    --border-color: #cbd5e1;  /* Slate 300 */

    /* Yazı Renkleri */
    --text-main: #334155;     /* Slate 700 */
    --text-muted: #94a3b8;    /* Slate 400 */
    --text-heading: #0f172a;  /* Slate 900 */

    /* CKEditor Özel */
    --ck-bg: #ffffff;
    --ck-panel: #f8fafc;
    --ck-text: #334155;
}

/* --- TEMEL AYARLAR --- */
body {
    background-color: var(--bg-body);
    color: var(--text-main);
    font-family: 'Inter', sans-serif;
    transition: background-color 0.3s, color 0.3s; /* Yumuşak geçiş */
}

/* Başlıklar */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-heading);
}

/* Navigasyon Aktif Durumu */
.nav-item.active {
    background: rgba(59, 130, 246, 0.1);
    color: var(--color-primary);
    border-left: 3px solid var(--color-primary);
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-body); }
::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-primary); }

/* Form Inputları */
input, select, textarea {
    background-color: var(--bg-input) !important; /* Tailwind'i ezmek için */
    border-color: var(--border-color) !important;
    color: var(--text-main) !important;
}

.form-input:focus, input:focus, select:focus, textarea:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 1px var(--color-primary) !important;
    outline: none;
}

/* --- CKEDITOR AYARLARI (Değişkenlere Bağlı) --- */

/* Editör Genel */
.ck-editor__editable_inline {
    min-height: 400px;
    background-color: var(--ck-bg) !important;
    color: var(--ck-text) !important;
    border-color: var(--border-color) !important;
}

/* Toolbar */
.ck-toolbar {
    background-color: var(--ck-panel) !important;
    border-color: var(--border-color) !important;
}

/* Butonlar */
.ck-button {
    color: var(--text-muted) !important;
}
.ck-button:hover, .ck-button.ck-on {
    background-color: var(--border-color) !important;
    color: var(--text-heading) !important;
}

/* İçerik Başlıkları */
.ck-content h2, .ck-content h3, .ck-content h4 {
    color: var(--text-heading);
}

/* Linkler */
.ck-content a {
    color: var(--color-primary);
}

/* Odaklanma */
.ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2) !important;
}

/* Listeler */
.ck-content ul { list-style-type: disc; padding-left: 20px; }
.ck-content ol { list-style-type: decimal; padding-left: 20px; }

/* Dropdown Menüler */
.ck.ck-list {
    background: var(--ck-panel) !important;
    border-color: var(--border-color) !important;
}
.ck.ck-list__item .ck-button:hover {
    background-color: var(--border-color) !important;
}