/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════════════════════
   TEMA RENK BELİRTEÇLERİ — TEK KAYNAK (01.11.2026; önceki yeri master.css, 17.10.2026 Aşama 5).
   Açık değerler :root'ta, koyu değerler html[data-theme="dark"] altında. Tema includes/tema.php ile <html data-theme="light|dark"> olarak
   seçilir: kullanıcının hesabındaki tercih (Açık · Koyu · Otomatik); Otomatik cihazın / tarayıcının görünümünü izler.
   Panel düzeni (includes/layout.php), hata ekranları ve düzen dışı panel sayfaları (Fiber V2, Fiber Ayarlar, denetim raporu …) bu dosyayı
   master.css'ten ÖNCE yükler — modül kendi açık / koyu renk setini YAZMAZ, buradaki adları kullanır.

   Palet: açık tema kırık beyaz yüzey + açık gri zemin (bembeyaz değil); koyu tema orta koyulukta antrasit / gri (siyah değil, lacivert değil).
   Kurumsal mavi / lacivert vurgular ve durum renkleri (başarılı · uyarı · hata · çevrimiçi / çevrimdışı · OLT sinyal) iki temada da korunur.

   Adlar (yeni kod kısa adları kullanır; eski adlar aynı değere bağlı):
     zemin  --bg (--background-color) · yüzey / kart --panel (--card-background) · ikinci yüzey --panel-2 · alt yüzey --light-color · üzerine gelme --hover-color
     yazı   --text (--dark-color) · ikincil --muted (--text-muted) · soluk --faint
     çizgi  --line (--border-color) · belirgin çizgi --line-2 (--line-strong-color)
     pencere --modal-zemin · açılır menü --menu-zemin · perde --perde
     tablo  --tablo-bas-zemin · --tablo-cizgi · seçili satır --secili-zemin (--secili-zemin-ust üzerine gelince)
     form   --form-zemin · --form-zemin-pasif · --form-kenar · --yer-tutucu · odak halkası --odak-halka
     düğme  --primary-dolu (beyaz yazılı mavi) · --ok-dolu · --bad-dolu · --teal-dolu · --turuncu
     bağlantı / vurgu yazısı --bs-link-color · --vurgu-metin · lacivert yazı --navy-metin
     durum  --ok / --ok-bg · --warn / --warn-bg · --bad / --bad-bg (= --durum-*), petrol --teal / --teal-soft
     kabuk  --kabuk-ust (header) · --kabuk-yan / --kabuk-yan-panel (menü) · --kabuk-kenar · sayfa dokusu --zemin-dokusu, --zemin-top-1/2
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════════════════════ */

:root {
    color-scheme: light;
    /* Kurumsal ve durum renkleri */
    --primary-color: #1e40af;          /* koyu mavi — ana renk (düğmeler) */
    --secondary-color: #5b6778;        /* ikincil gri */
    --success-color: #059669;
    --danger-color: #dc2626;
    --warning-color: #d97706;
    --info-color: #0891b2;
    --accent-color: #1f5fc9;           /* vurgu mavisi */
    /* Yüzeyler: açık gri zemin, kırık beyaz kart (bembeyaz değil), aralarında okunur fark */
    --background-color: #eceef1;
    --card-background: #fafbfc;
    --panel-2: #f2f4f6;
    --light-color: #e9ecf0;
    --hover-color: #e5e9ee;
    /* Yazı */
    --dark-color: #1b2433;             /* ana yazı: kartta 15:1 */
    --text-muted: #5b6778;             /* ikincil yazı: zeminde ve alt yüzeyde ≥ 4,7:1 */
    --faint-color: #7b8697;            /* soluk (ipucu, pasif, ayraç): zeminde 3,1:1, kartta 3,5:1 */
    /* Çizgiler */
    --border-color: #dce1e7;
    --line-strong-color: #c8cfd9;
    /* Lacivert / petrol */
    --navy-color: #17305f;
    --navy-metin: #17305f;
    --teal-color: #0f7a74;
    --teal-soft: #e6f4f2;
    /* Durum (yazı / zemin) */
    --durum-iyi: #157a43;   --durum-iyi-zemin: #e5f4eb;
    --durum-uyari: #9a5a00; --durum-uyari-zemin: #fcf1dd;
    --durum-kotu: #c62f2f;  --durum-kotu-zemin: #fbe8e8;
    /* Beyaz yazı taşıyan dolu zeminler */
    --primary-dolu: #1e40af; --ok-dolu: #157a43; --bad-dolu: #c62f2f; --teal-dolu: #0f7a74; --turuncu: #d9661f;
    /* Bileşen yüzeyleri */
    --modal-zemin: var(--card-background);
    --menu-zemin: var(--card-background);
    --perde: rgba(23, 32, 48, 0.45);
    --tablo-bas-zemin: var(--panel-2);
    --tablo-cizgi: var(--border-color);
    --secili-zemin: #e3ebf8;
    --secili-zemin-ust: #d7e2f5;
    --form-zemin: #ffffff;
    --form-zemin-pasif: #eef0f3;
    --form-kenar: var(--line-strong-color);
    --yer-tutucu: #6f7a8a;
    --odak-halka: rgba(31, 95, 201, 0.32);
    --vurgu-metin: #1f5fc9;
    /* Gölgeler (lacivert tonlu, iki katlı) */
    --shadow-light: 0 1px 2px rgba(23, 48, 95, 0.06), 0 1px 3px rgba(23, 48, 95, 0.08);
    --shadow-medium: 0 2px 4px rgba(23, 48, 95, 0.06), 0 4px 12px rgba(23, 48, 95, 0.08);
    --shadow-heavy: 0 4px 8px rgba(23, 48, 95, 0.06), 0 10px 28px rgba(23, 48, 95, 0.16);
    /* Kabuk (header + sol menü): kurumsal lacivert */
    --kabuk-ust: linear-gradient(135deg, #0f172a 0%, #1e3a5f 50%, #1e40af 100%);
    --kabuk-yan: linear-gradient(180deg, rgba(16, 34, 56, .97), rgba(7, 23, 39, .98));
    --kabuk-yan-panel: linear-gradient(180deg, rgba(16, 34, 56, .98), rgba(7, 23, 39, .99));
    --kabuk-kenar: rgba(59, 130, 246, .22);
    /* Sayfa dokusu (ekrana sabit .fluid-mesh-bg ve bulanık toplar): nötr, renk cümbüşü yok */
    --zemin-dokusu: linear-gradient(160deg, #eff1f4 0%, #eceef1 50%, #e8ebef 100%);
    --zemin-top-1: #dfe6f1;
    --zemin-top-2: #e3e6ee;
    /* Kaydırma çubuğu (kök çubuk dahil) */
    --kaydirma-iz: #c3cad4; --kaydirma-iz-ust: #9aa4b2; --kaydirma-iz-basili: #6b7685; --kaydirma-oluk: #e9ecf0; --kaydirma-cizgi: #dce1e7;
    /* Bootstrap açık değerleri (form, tablo, bağlantı) */
    --bs-body-color: #1b2433; --bs-body-color-rgb: 27, 36, 51;
    --bs-secondary-color: rgba(27, 36, 51, 0.75); --bs-secondary-color-rgb: 27, 36, 51;
    --bs-link-color: #1f5fc9; --bs-link-color-rgb: 31, 95, 201; --bs-link-hover-color: #17305f; --bs-link-hover-color-rgb: 23, 48, 95;
    --bs-border-color: #cfd6e0;
    --bs-code-color: var(--teal);      /* Bootstrap'in pembe kod rengi yerine (01.11.2026; panelde mor / pembe yok) */
    /* Kısa adlar (docs/mockups) — değerleri yukarıdan; koyu temada kendiliğinden değişir */
    --bg: var(--background-color); --panel: var(--card-background); --line: var(--border-color); --line-2: var(--line-strong-color);
    --text: var(--dark-color); --muted: var(--text-muted); --faint: var(--faint-color); --navy: var(--navy-color); --blue: var(--primary-color);
    --teal: var(--teal-color); --ok: var(--durum-iyi); --ok-bg: var(--durum-iyi-zemin); --warn: var(--durum-uyari); --warn-bg: var(--durum-uyari-zemin);
    --bad: var(--durum-kotu); --bad-bg: var(--durum-kotu-zemin);
    /* Renkli kenar / zemin türevleri */
    --blue-zemin: color-mix(in srgb, var(--blue) 10%, var(--panel)); --blue-kenar: color-mix(in srgb, var(--blue) 35%, var(--panel));
    --ok-kenar: color-mix(in srgb, var(--ok) 35%, var(--panel)); --warn-kenar: color-mix(in srgb, var(--warn) 40%, var(--panel));
    --bad-kenar: color-mix(in srgb, var(--bad) 35%, var(--panel)); --teal-kenar: color-mix(in srgb, var(--teal) 35%, var(--panel));
    /* Yazı tipi temaya bağlı değil — Bootstrap bileşenleri de panelin yazı tipi */
    --bs-font-sans-serif: var(--font-sans);
    --bs-font-monospace: var(--font-mono);
    --bs-body-font-family: var(--bs-font-sans-serif);
}

/* ── Koyu tema: orta koyulukta antrasit (siyah ve lacivert değil). Bootstrap 5.3 koyu teması data-bs-theme ile açılır, renkleri bu sete çekilir. ── */
html[data-theme="dark"] {
    color-scheme: dark;
    /* --success/danger/warning/info/secondary-color eski CSS'te çoğunlukla beyaz yazılı dolgu (rozet, düğme): koyu temada da aynı kalır;
       koyu zeminde yazı rengi için --durum-* kullanılır */
    --primary-color: #5b8de6;          /* yazı (kartta 4:1) ve beyaz yazılı dolgu (31 yerde) — ikisine de yeten orta ton; küçük yazı / bağlantı için --vurgu-metin */
    --accent-color: #7aa3ec;           /* vurgu yazısı: kartta 5,2:1 */
    --secondary-color: #64748b;
    --background-color: #24272c;
    --card-background: #2c3036;
    --panel-2: #32363d;
    --light-color: #363b42;
    --hover-color: #3b4148;
    --dark-color: #e6e8eb;             /* kartta 11:1 */
    --text-muted: #abb3bd;             /* kartta 6,4:1, alt yüzeyde 5,4:1 */
    --faint-color: #858e99;
    --border-color: #40464e;
    --line-strong-color: #4f565f;
    --navy-color: #1e3b70;
    --navy-metin: #a9c2f0;
    --teal-color: #3aaea5;
    --teal-soft: #213634;
    --durum-iyi: #46c47f;   --durum-iyi-zemin: #233a2d;
    --durum-uyari: #e6a43f; --durum-uyari-zemin: #3e3424;
    --durum-kotu: #f07d7d;  --durum-kotu-zemin: #432b2c;
    --primary-dolu: #3566c4; --ok-dolu: #1f7a47; --bad-dolu: #b33a3a; --teal-dolu: #1d7f78; --turuncu: #ec8a4a;
    --modal-zemin: #30343a;
    --menu-zemin: #30343a;
    --perde: rgba(12, 14, 17, 0.62);
    --secili-zemin: #2f3a4a;
    --secili-zemin-ust: #354257;
    --form-zemin: #25292e;
    --form-zemin-pasif: #2f3338;
    --yer-tutucu: #858e99;
    --odak-halka: rgba(122, 163, 236, 0.4);
    --vurgu-metin: #8db0f0;
    --shadow-light: 0 1px 2px rgba(0, 0, 0, 0.28), 0 1px 3px rgba(0, 0, 0, 0.22);
    --shadow-medium: 0 2px 4px rgba(0, 0, 0, 0.25), 0 6px 14px rgba(0, 0, 0, 0.28);
    --shadow-heavy: 0 6px 12px rgba(0, 0, 0, 0.3), 0 14px 32px rgba(0, 0, 0, 0.42);
    --kabuk-ust: linear-gradient(135deg, #1c1f23 0%, #22262b 55%, #263142 100%);
    --kabuk-yan: linear-gradient(180deg, rgba(34, 37, 42, .98), rgba(28, 31, 35, .99));
    --kabuk-yan-panel: linear-gradient(180deg, rgba(36, 39, 44, .99), rgba(30, 33, 37, .99));
    --kabuk-kenar: rgba(255, 255, 255, .08);
    --zemin-dokusu: linear-gradient(160deg, #262a2f 0%, #24272c 50%, #222529 100%);
    --zemin-top-1: #2b3442;
    --zemin-top-2: #2a2f39;
    --kaydirma-iz: #4f565f; --kaydirma-iz-ust: #5e6670; --kaydirma-iz-basili: #6f7782; --kaydirma-oluk: #212428; --kaydirma-cizgi: var(--border-color);
    --bs-body-bg: #24272c; --bs-body-bg-rgb: 36, 39, 44; --bs-body-color: #e6e8eb; --bs-body-color-rgb: 230, 232, 235; --bs-emphasis-color: #f6f7f8; --bs-emphasis-color-rgb: 246, 247, 248;
    --bs-secondary-color: rgba(230, 232, 235, 0.72); --bs-secondary-color-rgb: 230, 232, 235; --bs-secondary-bg: #2c3036; --bs-secondary-bg-rgb: 44, 48, 54;
    --bs-tertiary-color: rgba(230, 232, 235, 0.5); --bs-tertiary-bg: #32363d; --bs-tertiary-bg-rgb: 50, 54, 61;
    --bs-border-color: #40464e; --bs-border-color-translucent: rgba(171, 179, 189, 0.2); --bs-heading-color: inherit;   /* Bootstrap'teki gibi: renkli şeritteki başlık beyaz yazıyı alsın */
    --bs-code-color: var(--teal);
    --bs-link-color: #8db0f0; --bs-link-color-rgb: 141, 176, 240; --bs-link-hover-color: #b3cbf5; --bs-link-hover-color-rgb: 179, 203, 245;
    --bs-primary-text-emphasis: #b3cbf5; --bs-primary-bg-subtle: #283750; --bs-primary-border-subtle: #3a5480;
    --bs-success-text-emphasis: #8fe0b4; --bs-success-bg-subtle: #233a2d; --bs-success-border-subtle: #2f5a40;
    --bs-danger-text-emphasis: #f7b0b0; --bs-danger-bg-subtle: #432b2c; --bs-danger-border-subtle: #6c3a3b;
    --bs-warning-text-emphasis: #f2c98a; --bs-warning-bg-subtle: #3e3424; --bs-warning-border-subtle: #6c5530;
    --bs-info-text-emphasis: #98dcf6; --bs-info-bg-subtle: #213a45; --bs-info-border-subtle: #2f5a6b;
    --bs-secondary-text-emphasis: #ccd2da; --bs-secondary-bg-subtle: #363b42; --bs-secondary-border-subtle: #4f565f;
    --bs-light-text-emphasis: #e6e8eb; --bs-light-bg-subtle: #363b42; --bs-light-border-subtle: #4f565f;
    --bs-dark-text-emphasis: #e6e8eb; --bs-dark-bg-subtle: #1d2024; --bs-dark-border-subtle: #40464e;
}

/* ── Mor uyumluluk değişkenleri (sayfalarda var(--mor-<renk>, <eski mor>); tools/tema_acik_mor.py, PHP temaMor()) — 01.11.2026'dan beri iki tema da burada.
   Açıkta lacivert / petrol / mavi (17.10.2026 eşlemesi); koyuda aynı ailenin antrasit kartta okunur tonu (yazı / çizgi / simge) ve çok açık mor zeminler
   için koyu petrol yüzey. DOLGU (beyaz yazılı zemin) bu değişkenleri KULLANMAZ: --teal-dolu / --primary-dolu / --navy-color (aynı değişken hem yazı hem
   dolgu olunca koyu temada biri okunmuyordu). Panelde mor yok. ── */
:root {
    --mor-4338ca: #17305f; --mor-4f46e5: #17305f; --mor-5a32a3: #0b5f5a; --mor-5b21b6: #0b5f5a; --mor-6366f1: #1f5fc9; --mor-667eea: #1f5fc9;
    --mor-6d28d9: #0b5f5a; --mor-6f42c1: #0f7a74; --mor-764ba2: #17305f; --mor-7c3aed: #0f7a74; --mor-7e22ce: #0b5f5a; --mor-8b5cf6: #1d8079;
    --mor-8e44ad: #0f7a74; --mor-9333ea: #0f7a74; --mor-9b59b6: #1d8079; --mor-a78bfa: #5fbfb8; --mor-a855f7: #1d8079; --mor-c084fc: #5fbfb8;
    --mor-c4b5fd: #9fd8d3; --mor-d8b4fe: #9fd8d3; --mor-ddd6fe: #cfe9e6; --mor-e9d5ff: #cfe9e6; --mor-ede9fe: #e6f4f2; --mor-f3e8ff: #e6f4f2;
    --mor-f5f3ff: #e6f4f2; --mor-faf5ff: #e6f4f2; --mor-8b5cf6-20: rgba(42, 157, 149, 0.2); --mor-8b5cf6-30: rgba(42, 157, 149, 0.3);
    --mor-c4b5fd-13: rgba(159, 216, 211, 0.13); --mor-667eea-15: rgba(31, 95, 201, 0.15); --mor-667eea-30: rgba(31, 95, 201, 0.3);
    --mor-667eea-40: rgba(31, 95, 201, 0.4); --mor-667eea-5: rgba(31, 95, 201, 0.05); --mor-7c3aed-10: rgba(15, 122, 116, 0.1);
    --mor-7c3aed-80: rgba(15, 122, 116, 0.8); --mor-8b5cf6-10: rgba(42, 157, 149, 0.1); --mor-6f42c1-13: rgba(15, 122, 116, 0.13);
    --mor-7c3aed-13: rgba(15, 122, 116, 0.13); --mor-6366f1-12: rgba(31, 95, 201, 0.12); --mor-6366f1-25: rgba(31, 95, 201, 0.25);
    --mor-6366f1-30: rgba(31, 95, 201, 0.3);
}
html[data-theme="dark"] {
    --mor-4338ca: #a9c2f0; --mor-4f46e5: #a9c2f0; --mor-5a32a3: #4fbfb4; --mor-5b21b6: #4fbfb4; --mor-6366f1: #8db0f0; --mor-667eea: #8db0f0;
    --mor-6d28d9: #4fbfb4; --mor-6f42c1: #4fbfb4; --mor-764ba2: #a9c2f0; --mor-7c3aed: #4fbfb4; --mor-7e22ce: #4fbfb4; --mor-8b5cf6: #4fbfb4;
    --mor-8e44ad: #4fbfb4; --mor-9333ea: #4fbfb4; --mor-9b59b6: #4fbfb4; --mor-a78bfa: #7fd3cb; --mor-a855f7: #4fbfb4; --mor-c084fc: #7fd3cb;
    --mor-c4b5fd: #9fd8d3; --mor-d8b4fe: #9fd8d3; --mor-ddd6fe: #2a4744; --mor-e9d5ff: #2a4744; --mor-ede9fe: var(--teal-soft);
    --mor-f3e8ff: var(--teal-soft); --mor-f5f3ff: var(--teal-soft); --mor-faf5ff: var(--teal-soft); --mor-8b5cf6-20: rgba(79, 191, 180, 0.2);
    --mor-8b5cf6-30: rgba(79, 191, 180, 0.3); --mor-c4b5fd-13: rgba(159, 216, 211, 0.13); --mor-667eea-15: rgba(141, 176, 240, 0.15);
    --mor-667eea-30: rgba(141, 176, 240, 0.3); --mor-667eea-40: rgba(141, 176, 240, 0.4); --mor-667eea-5: rgba(141, 176, 240, 0.05);
    --mor-7c3aed-10: rgba(79, 191, 180, 0.1); --mor-7c3aed-80: rgba(79, 191, 180, 0.8); --mor-8b5cf6-10: rgba(79, 191, 180, 0.1);
    --mor-6f42c1-13: rgba(79, 191, 180, 0.13); --mor-7c3aed-13: rgba(79, 191, 180, 0.13); --mor-6366f1-12: rgba(141, 176, 240, 0.12);
    --mor-6366f1-25: rgba(141, 176, 240, 0.25); --mor-6366f1-30: rgba(141, 176, 240, 0.3);
}

/* ── MikroTik switch ön paneli (03.11.2026; bileşen mikrotik/assets/mt.css .swp, model kataloğu mikrotik/lib/SwitchKatalog.php) — yalnız switch sayfalarının kökünde
   (.sw-sayfa). Yuva (soket) iki temada koyu; LED renkleri bu yüzden iki temada aynı, yüzey / kenar / fiş temaya göre. Bileşen sabit renk YAZMAZ, bu adları kullanır.
   Ölçülen karşıtlık (03.11.2026, başsız Chromium, hesaplanmış renk; grafik ≥ 3:1): açık — LED / yuva: yeşil 3,83 · 100M 5,13 · PoE 5,72 · PoE kapalı 3,48 ·
   bilinmiyor 3,36; SFP kafesi / yüzey 3,67 · koyu — LED / yuva 5,88–10,01; yuva kenarı / yüzey 3,35 (yuvanın biçimi kenardan okunur), SFP kafesi 3,12.
   Sönük LED kasıtlı olarak yuvaya yakın (yanmıyor). Ölçüm: tests/mikrotik/switch_liste_panel_tarayici.py ── */
.sw-sayfa {
    --sw-yuz: #dfe3e8; --sw-yuz-kenar: #b9c1ca; --sw-soket: #39404a; --sw-soket-kenar: #262b32; --sw-fis: #cdd5de; --sw-kafes: #6b7480; --sw-modul: #d5dbe2;
    --sw-bilinmiyor: #6f7883; --sw-kapali-cizgi: #9aa3ad; --sw-uplink: var(--vurgu-metin);
    --sw-led-hizli: #22b35e; --sw-led-yavas: #F5A524; --sw-led-poe: #FFB020; --sw-led-poe-kapali: #FF5D5D; --sw-led-sonuk: #2E3540; --sw-led-bilinmiyor: #8a939e;
    --sw-plaka-ust: #e9edf2; --sw-plaka-alt: #d5dbe3; --sw-plaka-kenar: #c3cbd5;   /* 04.11.2026 liste kartının geniş ön paneli (boyut 'kart'; mockup yüzeyi) */
    --sw-plaka-yazi: #4b5563; --sw-plaka-uyari: #7a4700;   /* yüzeydeki özet / tazelik yazısı (--muted / --warn yüzeyin alt tonunda 4,5:1'in altında kalıyordu) */
}
html[data-theme="dark"] .sw-sayfa {
    --sw-yuz: #23272c; --sw-yuz-kenar: #4a515a; --sw-soket: #121519; --sw-soket-kenar: #7a838e; --sw-fis: #9aa5b1; --sw-kafes: #77808b; --sw-modul: #a9b3be;
    --sw-bilinmiyor: #8a939e; --sw-kapali-cizgi: #6f7883; --sw-uplink: var(--vurgu-metin);
    --sw-led-hizli: #46c47f; --sw-led-yavas: #F5A524; --sw-led-poe: #FFB020; --sw-led-poe-kapali: #FF5D5D; --sw-led-sonuk: #2E3540; --sw-led-bilinmiyor: #8a939e;
    --sw-plaka-ust: #30353b; --sw-plaka-alt: #262a30; --sw-plaka-kenar: #4f565f;   /* mockup'ın #363b42 → #2a2e34'ünden bir ton koyu: yuva kenarı / SFP kafesi ≥ 3:1 kalsın */
    --sw-plaka-yazi: #a9b1bb; --sw-plaka-uyari: var(--durum-uyari);
}

/* ── Evrensel Panel aktarımı, 1. etap (11.11.2026) ─────────────────────────────────────────────────────────────────────────────
   Giriş ekranı (--giris-*): sayfanın tamamı markanın koyu zemininde, iki temada AYNI (oturumdan önce kullanıcı tercihi bilinmez;
   onaylı görünüm tek). Yeni panel çerçevesi önizlemesi (--ev-*): sidebar · üst bar aynı tonda; açık temada paketin koyu laciverti,
   koyu temada içerik zemininin (--bg) hafif koyusu — aynı renk ailesi, siyaha yakın değil. Değerler Evrensel Panel 0.20.0 lacivert paketi. */
:root {
    --giris-zemin: #1e263b; --giris-metin: #dce3ef; --giris-soluk: #98a9c4;
    --giris-kutu: #fdfdfe; --giris-kutu-metin: #111522; --giris-kutu-soluk: #536684; --giris-kutu-kenar: #536684;
    --giris-dugme: #98a9c4; --giris-dugme-metin: #111522; --giris-odak: #98a9c4; --giris-ikincil: #303d59;
    --giris-hata-zemin: #3a1a1c; --giris-hata-metin: #f6a3a3; --giris-uyari-zemin: #33270c; --giris-uyari-metin: #f5cb72;
    --ev-yan: #1e263b; --ev-yan-metin: #dce3ef; --ev-yan-soluk: #98a9c4; --ev-yan-uzeri: #2a3450; --ev-yan-secili: #3e465a; --ev-yan-kenar: #303d59; --ev-yan-vurgu: #98a9c4;
}
html[data-theme="dark"] {
    --ev-yan: color-mix(in srgb, var(--background-color) 80%, #000); --ev-yan-metin: var(--dark-color); --ev-yan-soluk: var(--text-muted);
    --ev-yan-uzeri: color-mix(in srgb, var(--background-color) 88%, #fff); --ev-yan-secili: color-mix(in srgb, var(--background-color) 78%, #fff);
    --ev-yan-kenar: var(--border-color); --ev-yan-vurgu: var(--vurgu-metin);
}
/* Yeni çerçeve önizlemesi açıkken (html[data-cerceve="evrensel"], yalnız süper yönetici) kabuk belirteçleri Evrensel tonlarına bağlanır:
   sidebar ve üst bar AYNI düz ton (geçiş yok). Kapalıyken bu kural hiçbir sayfaya uygulanmaz. */
html[data-cerceve="evrensel"] { --kabuk-ust: var(--ev-yan); --kabuk-yan: var(--ev-yan); --kabuk-yan-panel: var(--ev-yan); --kabuk-kenar: var(--ev-yan-kenar); }