/* ============================================================
   NEVER FORGET — KARANLIK MOD PALETİ + ANLAM TOKEN'LARI
   ------------------------------------------------------------
   Bu blok, mevcut tokens.css VE style.css :root'larına eklenir.
   tokens.css "DEĞİŞTİRME" diyor → bu dosyayı AYRI yükle (tokens.css'ten
   SONRA), ya da içeriğini her iki :root'un altına aynen yapıştır.

   Kural özeti (KRİTİK):
   1) NÖTR ink skalası karanlıkta yeniden eşlenir (rol-çevirme). Güvenli, en
      yüksek kaldıraç: ink-tabanlı zemin/metin/kenarlık OTOMATİK döner.
   2) MARKA navy + teal skalaları DEĞİŞMEZ. Marka markadır; koyuda da
      vurgu/sidebar/buton olarak çalışır.
   3) "white" / "#fff" sabit yüzeyler otomatik DÖNMEZ → bunlar var(--surface)
      ailesine çevrilmeli (CC'nin uzun kuyruk işi). Token'lar burada hazır.
   4) Derinlik (elevation) gölgeyle değil, AÇILDIKÇA aydınlanan yüzey
      basamaklarıyla verilir: bg < surface < surface-2 < surface-3.
   ============================================================ */

/* ---- AÇIK MOD: yeni anlam token'ları (mevcut davranışı korur) ---- */
:root {
  --bg:            var(--ink-50);      /* sayfa zemini */
  --surface:       #ffffff;            /* kart / panel yüzeyi (eski "white") */
  --surface-2:     var(--ink-50);      /* iç yüzey / hover / inset */
  --surface-3:     #ffffff;            /* popover / modal / dropdown */
  --border:        var(--ink-200);
  --border-strong: var(--ink-300);
  --text:          var(--ink-900);     /* ana metin */
  --text-muted:    var(--ink-500);     /* ikincil metin */
  --text-faint:    var(--ink-400);     /* placeholder / pasif */
  --heading:       var(--navy-900);    /* başlık metni (koyuda aydınlanır) */
  --shadow:        rgba(10, 17, 40, .08);
  --shadow-lg:     rgba(10, 17, 40, .15);
  --scrim:         rgba(10, 17, 40, .45);  /* modal arka perde */
  --field:         #ffffff;            /* input/select zemini */
}

/* ============================================================
   KARANLIK MOD
   ============================================================ */
[data-theme="dark"] {
  /* --- anlam yüzeyleri (elevation merdiveni) --- */
  --bg:            #0d1430;   /* sayfa — en koyu */
  --surface:       #161f3d;   /* kart            (+1) */
  --surface-2:     #1e2950;   /* hover / inset   (+2) */
  --surface-3:     #26325e;   /* popover / modal (+3) */
  --border:        #2a3866;
  --border-strong: #3a4a80;
  --text:          #eaedf7;
  --text-muted:    #a3afcf;   /* AA: 7.4:1 @ surface */
  --text-faint:    #8693bd;
  --heading:       #f2f5fc;
  --shadow:        rgba(0, 0, 0, .45);
  --shadow-lg:     rgba(0, 0, 0, .6);
  --scrim:         rgba(3, 6, 16, .66);
  --field:         #11193550;  /* hafif koyu, surface üstünde okunur */

  /* --- NÖTR ink skalası: ROL-ÇEVİRME (smooth ramp, koyu→açık) --- */
  /* Açıkta 50=zemin … 900=metin. Koyuda rolü korur: 50=koyu yüzey … 900=açık metin. */
  --ink-50:  #0d1430;   /* eski sayfa zemini → koyu */
  --ink-100: #1a2444;   /* hover */
  --ink-200: #2a3866;   /* kenarlık */
  --ink-300: #3a4a80;   /* input kenarlık */
  --ink-400: #8693bd;   /* placeholder */
  --ink-500: #a3afcf;   /* ikincil metin */
  --ink-700: #c8d0e6;   /* ana metin (alt) */
  --ink-900: #eaedf7;   /* ana metin */

  /* navy-50/100 = açık marka TİNT zeminleri (chip / icon-chip / hover) — koyuda
     dark tint'e çevrilir ki üzerlerindeki heading/ikon (artık açık) okunabilsin.
     SADECE bu 2 en-açık ton; navy-200..900 marka olarak KORUNUR. Foreground
     kullanımı yok (doğrulandı) → güvenli. */
  --navy-50:  #1c2545;
  --navy-100: #243056;

  /* --- MARKA navy/teal: DEĞİŞMEZ (yorum amaçlı burada, override YOK) ---
     navy-* ve teal-* tokenları olduğu gibi kalır. Tek istisna aşağıda:
     navy-900 koyu sayfa zeminiyle ERİYEN primary butonlar için bileşen
     override'ı veriyoruz (skalayı bozmadan). */

  /* --- semantik renkler: koyu zeminde okunur tonlar --- */
  --ok:   #36c39a;   --warn: #f0b54e;   --err: #f06b78;
  /* tint çiftleri: koyu zemin + açık metin (açık moddakinin tersi mantık) */
  --ok-bg:   #0e3b30;  --ok-fg:   #6ee7c2;
  --warn-bg: #3d2f12;  --warn-fg: #fbd488;
  --err-bg:  #3d1820;  --err-fg:  #ffb3bd;
  --info-bg: #16245a;  --info-fg: #a8b8e0;  --info-border: #2a4198;

  /* --- chart token'ları (tokens.css'te yoksa style/tokens'a ekle) --- */
  --chart-volume:   #5b78d6;
  --chart-success:  #36c39a;
  --chart-progress: #3cc8d2;
  --chart-grid:     #2a3866;   /* grafik ızgara çizgileri */
  --chart-label:    #a3afcf;   /* eksen/etiket yazısı */

  color-scheme: dark;          /* native scrollbar/form kontrolleri koyu */
}

/* ============================================================
   BİLEŞEN OVERRIDE'LARI (karanlık) — paylaşık class'lar için
   tokens.css/style.css bileşenleri "white" sabiti kullandığı yerlerde
   token'a çevrilene kadar buradan da yakalanır.
   ============================================================ */
[data-theme="dark"] body { background: var(--bg); color: var(--text); }

/* Kart / panel / toast / dropdown: sabit white → surface */
[data-theme="dark"] .card,
[data-theme="dark"] .toast,
[data-theme="dark"] .modal,
[data-theme="dark"] .config-card,
[data-theme="dark"] .mode-dd-list { background: var(--surface); border-color: var(--border); color: var(--text); }

[data-theme="dark"] .toast { box-shadow: 0 8px 24px var(--shadow-lg); }

/* Başlıklar: navy-900/800/700 foreground koyuda erir → heading token'ı.
   (CC, başlık color'larını var(--heading)'e çevirince bu kural gereksizleşir;
   geçişte güvenlik ağı olarak burada.) */
[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3,
[data-theme="dark"] .page-head h1 { color: var(--heading); }

/* Primary buton navy-900 zeminle erir → koyuda navy-700 + görünür kenarlık */
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .pill.active,
[data-theme="dark"] .exam-pill.active {
  background: var(--navy-700);
  border: 1px solid var(--navy-500);
  color: #fff;
}
[data-theme="dark"] .btn-primary:hover { background: var(--navy-600); }

/* Outline/ghost butonlar */
[data-theme="dark"] .btn-outline { background: var(--surface); color: var(--text); border-color: var(--border-strong); }
[data-theme="dark"] .btn-outline:hover { border-color: var(--text); }
[data-theme="dark"] .btn-ghost { color: var(--text); }
[data-theme="dark"] .btn-ghost:hover { background: var(--surface-2); }

/* Inputlar: white zemin → field */
[data-theme="dark"] .input,
[data-theme="dark"] .ff-input,
[data-theme="dark"] .ff-select {
  background: var(--field);
  color: var(--text);
  border-color: var(--border-strong);
}
[data-theme="dark"] .input::placeholder { color: var(--text-faint); }

/* Sidebar zaten navy-900; koyu sayfadan ayrışsın diye sağ kenarlık */
[data-theme="dark"] .sidebar { border-right: 1px solid var(--border); }

/* Segmented / seç kutusu beyaz topuzları */
[data-theme="dark"] .pool-seg { background: var(--surface-2); }
[data-theme="dark"] .pool-seg button.active { background: var(--surface-3); color: var(--text); }

/* ============================================================
   NEVER FORGET'e ÖZEL EK OVERRIDE'LAR
   (paylaşık sayfa-içi class'lar genelde "background:white" sabiti
   kullandığı için token'a çevrilene dek buradan yakalanır)
   ============================================================ */

/* Auth FOUC guard overlay (#__nf_guard_hide) — koyu modda açık parlamasın.
   body::before/::after'ın TEK kullanıcısı bu guard (CSS taramasıyla doğrulandı). */
[data-theme="dark"] body::before { background: #0d1430 !important; }
[data-theme="dark"] body::after  { border-color: #2a3866 !important; border-top-color: #3cc8d2 !important; }

/* Sayfa iskeleti */
[data-theme="dark"] .main-content { background: var(--bg); color: var(--text); }

/* Profil/ayar/istatistik/giriş kartları (sayfa-içi <style>'larda background:white) */
[data-theme="dark"] .settings-section,
[data-theme="dark"] .profile-card,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .login-box,
[data-theme="dark"] .config-card,
[data-theme="dark"] .section-card,
[data-theme="dark"] .glass-panel { background: var(--surface); border-color: var(--border); color: var(--text); }

/* Form alanları (sayfa-içi background:white inputları) — inline style hâlâ ezebilir (QA'de yakalanır) */
[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background: var(--field);
  color: var(--text);
  border-color: var(--border-strong);
}
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder { color: var(--text-faint); }
[data-theme="dark"] select option { background: var(--surface-3); color: var(--text); }

/* navy ile boyanmış başlıklar koyuda erimesin */
[data-theme="dark"] .header h1,
[data-theme="dark"] .header h2,
[data-theme="dark"] .page-title,
[data-theme="dark"] .section-title { color: var(--heading); }

/* JS ile basılan bileşenler (kendi <style>'larında background:white — HTML dönüşümü ulaşmaz) */
/* identity_link.js — Bağlı Hesaplar kartı */
[data-theme="dark"] .nf-idl-card { background: var(--surface); border-color: var(--border); }
[data-theme="dark"] .nf-idl-btn { background: var(--surface-2); color: var(--text); border-color: var(--border-strong); }
[data-theme="dark"] .nf-idl-btn:hover { background: var(--surface-3); }
[data-theme="dark"] .nf-idl-icon-google { background: var(--surface-2); border-color: var(--border); }

/* Mobil alt-nav (student_mobile.css + teacher_bottom_nav.js: .bottom-nav background:#fff) */
[data-theme="dark"] .bottom-nav { background: var(--surface); border-top-color: var(--border); }
[data-theme="dark"] .bottom-nav .bn-item.active,
[data-theme="dark"] .bn-item.active { color: var(--heading); }

/* subscription.html — mevcut plan bandı (teal-100 zemin marka=dönmez → açık üstüne açık metin) */
[data-theme="dark"] .current-plan-banner {
  background: var(--surface);
  background: color-mix(in srgb, var(--teal-500) 13%, var(--surface));
  border-color: var(--teal-700);
  color: var(--text);
}
[data-theme="dark"] .current-plan-banner h3,
[data-theme="dark"] .current-plan-banner #planExpiry { color: var(--heading); }
[data-theme="dark"] .current-plan-banner .plan-info p,
[data-theme="dark"] .current-plan-banner p { color: var(--text-muted); }

/* AI Sohbet kutusu (chatbox.css — .nf-chat-* background:white) */
[data-theme="dark"] #nf-chat-panel { background: var(--surface); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .nf-chat-header,
[data-theme="dark"] .nf-chat-toolbar { background: var(--surface-2); border-color: var(--border); }
[data-theme="dark"] .nf-chat-level,
[data-theme="dark"] .nf-chat-subject { background: var(--surface-2); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .nf-chat-level.is-active,
[data-theme="dark"] .nf-chat-subject.is-active { background: var(--surface-3); color: var(--text); }
[data-theme="dark"] .nf-chat-bubble-wrap.from-ai .nf-chat-bubble { background: var(--surface-2); color: var(--text); }
[data-theme="dark"] .nf-chat-confirm-no { background: var(--surface-2); color: var(--text); border-color: var(--border); }
[data-theme="dark"] .nf-chat-composer { background: var(--surface-2); border-top-color: var(--border); }
[data-theme="dark"] .nf-chat-input { background: var(--field); color: var(--text); border-color: var(--border-strong); }
[data-theme="dark"] .nf-chat-input:focus { background: var(--field); }

/* nf_filter_modal (paylaşık filtre modalı — telefon tam-ekran: Soru/Konu Filtrele).
   Açık modda nf_filter_modal.css değerleri KORUNUR (beyaz kart + navy "Uygula");
   burada yalnız KARANLIK varyant. Handoff: "Soru Filtrele · Karanlık Mod".
   Kart koyuda #fff kalıyordu → tam-ekran beyaz panel bug'ı. */
[data-theme="dark"] .nf-fm-overlay > .nf-fm-card { background: var(--bg); }
[data-theme="dark"] .nf-fm-overlay > .nf-fm-card > .nf-fm-head { border-bottom-color: var(--border); }
[data-theme="dark"] .nf-fm-title { color: var(--heading); }
[data-theme="dark"] .nf-fm-x {
  background: var(--surface-2); border-color: var(--border-strong); color: var(--text-muted);
}
/* Birincil CTA: koyuda navy-900 zeminde erir → turkuaz 500 + koyu metin (handoff §9) */
[data-theme="dark"] .nf-fm-overlay > .nf-fm-card > .nf-fm-done { background: var(--teal-500); color: #052b2e; }
[data-theme="dark"] .nf-fm-overlay > .nf-fm-card > .nf-fm-done:active { background: var(--teal-400); }
/* Telefon filtre tetiği (bar içindeki "Filtrele" butonu) */
[data-theme="dark"] .nf-fm-trigger { background: var(--field); border-color: var(--border-strong); color: var(--text); }
[data-theme="dark"] .nf-fm-trigger .nf-fm-trig-val { color: var(--text); }
[data-theme="dark"] .nf-fm-trigger .nf-fm-chev { color: var(--text-faint); }
/* Global mobil kapatma × (nf_mobile_nav #nfMobileClose) açık modda beyaz; koyu
   modalda yabancı duruyordu → handoff: surface-2 + border-strong + text-muted. */
[data-theme="dark"] #nfMobileClose {
  background: var(--surface-2); border-color: var(--border-strong); color: var(--text-muted);
}

/* nf_konu_modal (NF.konuModal — "Konu Seç" çoklu-seçim modalı; nf_filter_modal'ın
   kardeşi). nf_konu_modal.css marka navy token'ları FOREGROUND olarak kullanıyor
   (navy-700 metin, navy-900 buton) → marka dönmediği için koyuda erir/okunmaz.
   Açık mod KORUNUR; yalnız karanlık varyant. */
/* Toplu seçim barı: bg --ink-50 koyuya döner ama metin --navy-700 marka=dönmez
   → koyu-üstüne-koyu. surface-2 + text ile okunur yap. */
[data-theme="dark"] .nf-km-bulk {
  background: var(--surface-2); color: var(--text); border-color: var(--border);
}
[data-theme="dark"] .nf-km-bulk:hover { background: var(--surface-3); }
/* Seçili satır etiketi: navy-900 foreground koyu navy-50 tint üstünde erir → heading */
[data-theme="dark"] .nf-km-row.on .nf-km-rowlbl { color: var(--heading); }
/* Birincil CTA "Uygula": navy-900 zemin koyu sayfaya erir → kardeş .nf-fm-done
   gibi turkuaz 500 + koyu metin (handoff §9). */
[data-theme="dark"] .nf-km-done { background: var(--teal-500); color: #052b2e; }
[data-theme="dark"] .nf-km-done:hover { background: var(--teal-400); }
[data-theme="dark"] .nf-km-done:active { background: var(--teal-400); }
/* Tetik değeri (bar içindeki seçili konu) navy-700 marka=dönmez → text */
[data-theme="dark"] .nf-km-trigger.has-val .nf-km-trig-val { color: var(--text); }

/* Konu/taksonomi autocomplete açılır listeleri (taxonomy_picker.js inline <style>
   .tx-picker-search-* + question_editor.css .konu-ac-*). Panel background:#fff SABİT
   → koyu modda beyaz panel kalıyor; path/crumb (#5b6887) soluk okunuyor. Koyu yüzeye
   + okunur metne çevir (raporlar #3/#4/#5/#7a). */
[data-theme="dark"] .tx-picker-search-dd,
[data-theme="dark"] .konu-ac-options {
  background: var(--surface-3); color: var(--text); border-color: var(--border);
}
[data-theme="dark"] .tx-picker-search-opt,
[data-theme="dark"] .konu-ac-option { color: var(--text); border-bottom-color: var(--border); }
[data-theme="dark"] .tx-picker-search-opt .tx-crumb { color: var(--text-muted); }
[data-theme="dark"] .tx-picker-search-opt:hover,
[data-theme="dark"] .tx-picker-search-opt.hl,
[data-theme="dark"] .konu-ac-option:hover,
[data-theme="dark"] .konu-ac-option.active { background: var(--surface-2); }

/* input[type=date|datetime-local|time|month] iç metni (gg.aa.yyyy / saat) koyuda
   görünmüyordu → native tarih/saat alanlarını dark-aware yap + datetime-edit parçalarını
   --text'e boya (rapor filtre tarihleri + Online Gönder/PDF ödev deadline #2). */
[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="datetime-local"],
[data-theme="dark"] input[type="time"],
[data-theme="dark"] input[type="month"] { color-scheme: dark; }
[data-theme="dark"] input[type="date"]::-webkit-datetime-edit,
[data-theme="dark"] input[type="date"]::-webkit-datetime-edit-text,
[data-theme="dark"] input[type="date"]::-webkit-datetime-edit-day-field,
[data-theme="dark"] input[type="date"]::-webkit-datetime-edit-month-field,
[data-theme="dark"] input[type="date"]::-webkit-datetime-edit-year-field,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit-text,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit-day-field,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit-month-field,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit-year-field,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit-hour-field,
[data-theme="dark"] input[type="datetime-local"]::-webkit-datetime-edit-minute-field { color: var(--text); }

/* HER İKİ MOD (unscoped): boş date/datetime input'ta "gg.aa.yyyy" ipucu görünmüyordu
   (bazı mobil tarayıcılar — Samsung Internet — boş alanı UA'nın çok soluk/şeffaf placeholder
   rengiyle çiziyor; salt `color` bunu ezmiyor). -webkit-text-fill-color ile açıkça boya:
   dolu değer = --text, boş alanlar (aria-valuenow YOK) = görünür-mat --text-muted. */
input[type="date"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit { -webkit-text-fill-color: var(--text); color: var(--text); }
input[type="date"]::-webkit-datetime-edit-day-field:not([aria-valuenow]),
input[type="date"]::-webkit-datetime-edit-month-field:not([aria-valuenow]),
input[type="date"]::-webkit-datetime-edit-year-field:not([aria-valuenow]),
input[type="datetime-local"]::-webkit-datetime-edit-day-field:not([aria-valuenow]),
input[type="datetime-local"]::-webkit-datetime-edit-month-field:not([aria-valuenow]),
input[type="datetime-local"]::-webkit-datetime-edit-year-field:not([aria-valuenow]),
input[type="datetime-local"]::-webkit-datetime-edit-hour-field:not([aria-valuenow]),
input[type="datetime-local"]::-webkit-datetime-edit-minute-field:not([aria-valuenow]) {
  -webkit-text-fill-color: var(--text-muted); color: var(--text-muted);
}

/* === Tarih/saat placeholder köprüsü (nf_date_ph.js) — TÜM tarayıcılar, iki mod ===
   iOS Safari/iPad boş date/datetime input'a HİÇ placeholder çizmiyor (bomboş görünüyor).
   JS her boş alanı .nf-dwrap ile sarıp üstüne .nf-dph görünür ipucu bindirir. */
.nf-dwrap { position: relative; display: block; min-width: 0; }
/* Input kendi genişliğini korur (width/max-width/flex bozulmasın); yalnız inline-block
   baseline boşluğunu kaldır. width'e DOKUNMA — width:100% alanlar sarmalayıcıyı doldurur,
   otomatik-genişlik alanlar (flex filtreleri) kendi doğal boyutunda kalır. */
.nf-dwrap > input { vertical-align: top; }
.nf-dph {
  position: absolute; inset: 0; z-index: 1;
  display: none; align-items: center;
  box-sizing: border-box; pointer-events: none;
  overflow: hidden; white-space: nowrap;
  color: var(--text-muted, #8a93a8);
}
.nf-dwrap.nf-empty > .nf-dph { display: flex; }
/* Çift yazı olmasın: alan BOŞKEN (.nf-empty → JS kesin biliyor) Chromium'un kendi
   soluk placeholder'ını tümüyle şeffaflaştır — yalnız bizim .nf-dph gösterilir.
   Dolu değerde .nf-empty kalkar → yerleşik değer normal (--text) görünür.
   (aria-valuenow hile'si bazı Chromium'larda boş alanı ayırt edemiyordu; container'ı
   boşken şeffaflaştırmak güvenli çünkü boşken saklanacak gerçek değer yok.) */
.nf-dwrap.nf-empty > input::-webkit-datetime-edit {
  -webkit-text-fill-color: transparent; color: transparent;
}

/* Profil "Hesap Sil" uyarı kutusu: koyu --err-bg üstünde inline color:--text-muted
   (soğuk gri) soluk → uyarı için --err-fg (açık pembe) (#9a). */
[data-theme="dark"] #deleteAccountSection p { color: var(--err-fg) !important; }

/* ============================================================
   BİLİNÇLİ BEYAZ KALACAKLAR — koyuya ÇEVİRME
   PDF/yazdırma çıktısı, rapor "kâğıdı", çizim tuvali beyaz kalır.
   Bu sınıfları kullanan kapsayıcılara .keep-light koy; içi hep açık.
   ============================================================ */
[data-theme="dark"] .keep-light,
[data-theme="dark"] .paper,
[data-theme="dark"] .pdf-page {
  background: #ffffff;
  color: #0b1020;
  --surface: #ffffff;
  --surface-2: #f7f8fb;
  --text: #0b1020;
  --text-muted: #5b6887;
  --heading: #0a1128;
  --border: #dde2ec;
}

@media print {
  /* yazdırmada her zaman açık */
  :root, [data-theme="dark"] { --bg:#fff; --surface:#fff; --text:#0b1020; }
}

/* ============================================================
   HATA DÜZELTME KATMANI — 50+ ekran taramasından (v2, paket nf20)
   Bunlar GÜVENLİK AĞI; asıl düzeltme kaynak kodda yapılır (H1–H7).
   Hepsi [data-theme=dark] kapsamında.
   ============================================================ */

/* ---- H1/H3: tüm başlıklar + yaygın başlık class'ları → --heading ---- */
[data-theme="dark"] :is(.card-title,.section-title,.panel-title,.list-title,
  .item-title,.quiz-title,.test-title,.row-title,.settings-head h3,.head-title) {
  color: var(--heading);
}

/* ---- H2: Tekrar Sistemi liste satırları + büyük sayaç ---- */
[data-theme="dark"] :is(.repeat-row,.review-row,.due-row) :is(.title,.name,b,strong) { color: var(--text); }
[data-theme="dark"] :is(.repeat-row,.review-row,.due-row) :is(.sub,.meta,.muted) { color: var(--text-muted); }
[data-theme="dark"] :is(.stat-number,.big-number,.count-number) { color: var(--heading); }

/* ---- H4: AÇIK/BEYAZ buton & pill kalıntıları → koyu yüzey ---- */
[data-theme="dark"] :is(.btn-light,.btn-white,.btn-secondary,.btn-soft,.btn-edit,
  .btn-muted,.chip-btn,.select-all-bar,.bulk-bar,.toolbar-btn) {
  background: var(--surface-2);
  color: var(--text);
  border-color: var(--border);
}
[data-theme="dark"] :is(.btn-light,.btn-white,.btn-secondary,.btn-soft,.btn-edit):hover {
  background: var(--surface-3);
}

/* ---- H4: rozet/etiket pill'leri ---- */
[data-theme="dark"] :is(.plan-badge,.exam-tag,.level-tag) {
  background: var(--surface-2);
  color: var(--text);
  border-color: var(--border);
}
[data-theme="dark"] :is(.pill,.chip,.tag).active,
[data-theme="dark"] :is(.pill,.chip,.tag)[aria-selected="true"] {
  background: var(--surface-3);
  color: var(--heading);
  border-color: var(--border-strong);
}
[data-theme="dark"] .badge.b-ok,  [data-theme="dark"] .badge.success { background: var(--ok-bg);  color: var(--ok-fg); }
[data-theme="dark"] .badge.b-warn,[data-theme="dark"] .badge.warning { background: var(--warn-bg);color: var(--warn-fg); }
[data-theme="dark"] .badge.b-err, [data-theme="dark"] .badge.danger  { background: var(--err-bg); color: var(--err-fg); }

/* ---- H4: tam beyaz KART blokları ---- */
[data-theme="dark"] :is(.admin-card,.membership-card,.info-card,.notice-card,
  .white-card,.surface-card):not(.keep-light) {
  background: var(--surface);
  color: var(--text);
  border-color: var(--border);
}

/* ---- H5: sekme segmentleri ---- */
[data-theme="dark"] :is(.tab,.seg-btn,.segment button,.tabbar button) {
  color: var(--text-muted);
}
[data-theme="dark"] :is(.tab,.seg-btn,.segment button,.tabbar button):is(.active,[aria-selected="true"]) {
  color: var(--heading);
}
[data-theme="dark"] .tab.is-ghost,
[data-theme="dark"] .tab[hidden] { display: none; }

/* ---- H7: boş/koyu ikon kareleri ---- */
[data-theme="dark"] :is(.icon-box,.avatar-box,.logo-box,.plan-icon,.thumb-box) {
  background: var(--surface-2);
}
[data-theme="dark"] :is(.icon-box,.logo-box,.plan-icon) svg { color: var(--text); }

/* ---- input/select/date alanları net kenarlık ---- */
[data-theme="dark"] :is(input,select,textarea) {
  border-color: var(--border-strong);
}
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator { filter: invert(.8); }

/* ============================================================
   nf20 KALAN KALEMLER
   ============================================================ */
/* Kategori chip token'ları: açık teal/amber TİNT → koyu tint + açık metin
   (teal-100/#fbeacf zemin koyuda kalıyordu; -bg ve -text birlikte çevrilir) */
[data-theme="dark"] {
  --cat-brans-bg:       #133e42;  --cat-brans-text:     #6eddd9;
  --cat-rehberlik-bg:   #3d2f12;  --cat-rehberlik-text: #fbd488;
}

/* "Toplu Duyuru" CTA (teacher_messages #bcTrigger — inline teal-50 zemin).
   Inline stil olduğu için !important ile koyu-teal CTA'ya çevrilir.
   color-mix desteklemeyen eski tarayıcı için düz fallback ÖNCE. */
[data-theme="dark"] #bcTrigger {
  background: var(--surface-2) !important;
  background: color-mix(in srgb, var(--teal-500) 15%, var(--surface)) !important;
  color: var(--teal-300) !important;
  border-color: var(--teal-700) !important;
}

/* H4: "Yeni Arkadaş Ekle" sekme-buton (.tab.tab-action) — v2 generic .tab kuralı
   koyuda --text-muted yapıyordu; sayfa kuralıyla eşit specificity → kaybediyordu.
   Daha yüksek specificity ile okunur yap. */
[data-theme="dark"] .tab.tab-action { color: var(--heading); }

/* ============================================================
   TELEFON KARANLIK QA TURU — öğretmen paneli (25 Haz 2026)
   Galaxy A72 denetiminde yakalanan inline/class hardcoded açık renkler.
   Hepsi [data-theme=dark] kapsamında → AÇIK MOD DOKUNULMAZ.
   ============================================================ */

/* B3: yarı-anlamlı PASTEL ZEMİN sabitleri (teacher_reports + ~24 sayfada inline
   style="background:#e0f5ee/#fbe2e5/#fbf0db"). Açık tint koyu modda kalıyordu →
   öğrenci-detay Doğru/Yanlış/Boş/Başarı stat kartları + chip/buton zeminleri.
   Koyu semantik tint'e çevir; üstündeki var(--ok/--err/--warn) + muted metin
   böylece okunur olur. Inline olduğu için !important. (PDF/kâğıt bu pastelleri
   KULLANMAZ → .keep-light riski yok.) */
[data-theme="dark"] [style*="#e0f5ee"] { background: var(--ok-bg) !important;   border-color: var(--ok-bg) !important; }
[data-theme="dark"] [style*="#fbe2e5"] { background: var(--err-bg) !important;  border-color: var(--err-bg) !important; }
[data-theme="dark"] [style*="#fbf0db"] { background: var(--warn-bg) !important; border-color: var(--warn-bg) !important; }

/* B5: taksonomi pill (teacher_pool / pool_management soru kartı "Konu" yanı —
   .tax-pill açık-gri zemin + token metin beyaza döndü → görünmez). */
[data-theme="dark"] .tax-pill { background: var(--surface-2); color: var(--text-muted); border-color: var(--border); }

/* B4: öğrenci-detay alt-sekme aktif (teacher_reports inline color:var(--teal-700)
   koyu zeminde eriyordu; teal-700 marka=dönmez). Açık teal ile okunur. */
[data-theme="dark"] .ot-subtab-btn.active { color: var(--teal-300) !important; border-bottom-color: var(--teal-400) !important; }

/* ============================================================
   ÖĞRENCİ TELEFON KARANLIK QA TURU (25 Haz 2026) — Galaxy A72
   Öğrenci tarafı denetiminde yakalanan inline/class hardcoded açık renkler +
   token GAP'leri. Hepsi [data-theme=dark] kapsamında → AÇIK MOD DOKUNULMAZ.
   ============================================================ */

/* G (SİSTEMİK): --ink-600 dark remap'te tanımsızdı → ~14 sayfada color:var(--ink-600)
   koyuda sönük (diff-chip / repetition labels / msg-act / study_plan konu /
   solve_test status / profil sekme inaktif…). Bazı sayfa lokal :root{--ink-600:light}
   redef'liyor → yüksek spesifiklik (html[data-theme=dark]=(0,1,1) > :root=(0,1,0)) ile EZ. */
html[data-theme="dark"] { --ink-600: #b5bfda; }
/* G-güvenlik: keep-light/paper bağlamında --ink-600 koyu metin kalsın (paper beyaz). */
[data-theme="dark"] .keep-light,
[data-theme="dark"] .paper,
[data-theme="dark"] .pdf-page { --ink-600: #454f6b; }

/* C (SİSTEMİK): AI Chat paneli — chatbox.css #nf-chat-panel ink skalasını LOKAL açık
   yeniden tanımlıyor → id-selector kök dark remap'i eziyor → messages/levels/başlık/
   altbaşlık/gün-ayracı/saat koyuda AÇIK kalıyordu. Lokal ink skalasını dark'a remap et
   (spesiflik (1,1,0) > lokal (1,0,0)). */
[data-theme="dark"] #nf-chat-panel {
  --ink-50:  #0d1430; --ink-100: #1a2444; --ink-200: #2a3866; --ink-300: #3a4a80;
  --ink-400: #8693bd; --ink-500: #a3afcf; --ink-600: #b5bfda; --ink-700: #c8d0e6; --ink-900: #eaedf7;
}
[data-theme="dark"] .nf-chat-btn.is-close:hover { background: var(--err-bg); }

/* K1: nfdc çizim tuvali (draw_canvas.css beyaz host+toolbar, kontrolleri var(--ink-*)
   → dark'ta flip; qcm modalında pinli ama standalone solve_test'te değildi). qcm-card
   kalıbıyla light-pin → tutarlı beyaz worksheet (tüm bağlamlar). */
[data-theme="dark"] .nfdc-host {
  color-scheme: light;
  --ink-50:#f7f8fb; --ink-100:#eef1f7; --ink-200:#dde2ec; --ink-300:#b8c0d4;
  --ink-400:#8993b0; --ink-500:#5b6887; --ink-600:#454f6b; --ink-700:#2d3657; --ink-900:#0b1020;
  --navy-50:#eef1f9; --navy-100:#d5dcf0;
  --surface:#fff; --text:#0b1020; --heading:#0a1128; --border:#dde2ec;
}

/* D1: zil paneli "Tümünü Okundu İşaretle" + bell ikonu indigo #4F46E5 (tokenize
   edilmemiş) → koyu surface'te 2.24. Scoped (#nf-notif-panel) → SA sayfalarına sızmaz. */
[data-theme="dark"] #nf-notif-panel [style*="#4F46E5"] { color: var(--teal-300) !important; }

/* student_my_questions (E) — çözüm-aksiyon pill'leri (class-tabanlı pastel) */
[data-theme="dark"] .mq-sol-btn.text        { background: var(--surface-2); color: var(--teal-300); }
[data-theme="dark"] .mq-sol-btn.send        { background: var(--warn-bg); color: var(--warn-fg); }
[data-theme="dark"] .mq-sol-btn.send.sent   { background: var(--ok-bg);   color: var(--ok-fg); }
[data-theme="dark"] .mq-sol-btn.retry       { background: var(--err-bg);  color: var(--err-fg); }
[data-theme="dark"] .mq-status-text.solving { color: var(--info-fg); }                 /* navy-600 metin→görünür */
[data-theme="dark"] .mq-return-msg { background: var(--err-bg); border-color: var(--err); color: var(--err-fg); }

/* student_pool (F) */
[data-theme="dark"] .diff-chip { color: var(--text-muted); }                            /* ink-600 fallback (G de kapsar) */
[data-theme="dark"] .qc-ders   { color: var(--teal-300); }                              /* teal-700 metin→açık teal */

/* student_test (H) — havuz dağılımı "Genel" navy-600 (bar+nokta) → chart blue.
   var(--navy-600) INLINE style ile basılıyor → inline'ı ezmek için !important ZORUNLU. */
[data-theme="dark"] #pv-dist > div[style*="--navy-600"]       { background: var(--chart-volume) !important; }
[data-theme="dark"] #pv-dist-legend span[style*="--navy-600"] { color: var(--chart-volume) !important; }

/* student_my_tests (I,J) */
[data-theme="dark"] .test-card .badge.branch     { background: var(--surface-2); color: var(--teal-300); }
[data-theme="dark"] .test-card .last-attempt.has { background: var(--ok-bg); color: var(--ok-fg); }
[data-theme="dark"] .rm-detail-card.is-wrong     { background: var(--err-bg); border-color: var(--err); }  /* görünmez metin fix */
[data-theme="dark"] .rm-detail-card.is-correct   { border-color: var(--ok); }

/* student_quiz (L) */
[data-theme="dark"] .stu-fchip.active { background: var(--surface-3) !important; color: var(--heading) !important; } /* inline ink-900 ez */
[data-theme="dark"] .quiz-status.completed { background: var(--ok-bg);  color: var(--ok-fg); }
[data-theme="dark"] .quiz-status.live      { background: var(--err-bg); color: var(--err-fg); }
[data-theme="dark"] .qrv-correct { background: var(--ok-bg);  border-color: var(--ok); }   /* görünmez label fix */
[data-theme="dark"] .qrv-wrong   { background: var(--err-bg); border-color: var(--err); }

/* student_repetition (M) */
[data-theme="dark"] .rep-acc-topic.hot .tbadge { background: var(--err-bg); color: var(--err-fg); }
[data-theme="dark"] .sr-card.learned .ic       { background: var(--ok-bg);  color: var(--ok-fg); }

/* student_messages (O) */
[data-theme="dark"] .tab.active .ct { background: var(--surface-3); color: var(--teal-300); }

/* student_assignments + study_plan_student (P) — .sp-chip VE .chip varyantları (paired
   hardcoded koyu metin → bg+color ikisini de override; B3 bg-only bozardı) */
[data-theme="dark"] .hw-src-badge.out,
[data-theme="dark"] .sp-chip.ozel, [data-theme="dark"] .chip.ozel         { background: #2a2150; color: #c4b5fd; }
[data-theme="dark"] .sp-chip.rehberlik                                    { background: var(--surface-2); color: var(--teal-300); }
[data-theme="dark"] .sp-chip.bireysel, [data-theme="dark"] .chip.bireysel { background: var(--info-bg); color: var(--info-fg); }
[data-theme="dark"] .sp-chip.done, [data-theme="dark"] .chip.st.done      { background: var(--warn-bg); color: var(--warn-fg); }
[data-theme="dark"] .chip.st.approved                                     { background: var(--ok-bg);  color: var(--ok-fg); }
[data-theme="dark"] .sp-chip.rejected, [data-theme="dark"] .chip.st.rejected,
[data-theme="dark"] .chip.due                                             { background: var(--err-bg); color: var(--err-fg); }

/* student_reports (N2) — Konu-Bazlı drill-down attempt chip'leri (teacher_reports
   ortak; class-tabanlı pastel + paired hardcoded koyu metin → bg+color override) */
[data-theme="dark"] .q-attempt-chip.correct, [data-theme="dark"] .sr-badge.ogrendi { background: var(--ok-bg);  color: var(--ok-fg);  border-color: var(--ok); }
[data-theme="dark"] .q-attempt-chip.wrong                                          { background: var(--err-bg); color: var(--err-fg); border-color: var(--err); }
[data-theme="dark"] .q-attempt-chip.empty { background: var(--surface-2); color: var(--text-muted); border-color: var(--border); }
[data-theme="dark"] .sr-badge.tekrar      { background: var(--warn-bg); color: var(--warn-fg); }

/* student_profile (Q,R) */
[data-theme="dark"] .profile-tab.active { color: var(--heading); }                       /* navy-900 metin→açık */
/* identity_link.js paylaşık gap (teacher yalnız -google kapsamış) */
[data-theme="dark"] .nf-idl-icon-email { background: var(--info-bg); color: var(--info-fg); }
[data-theme="dark"] .nf-idl-tag        { background: var(--ok-bg);   color: var(--ok-fg); }

/* ─── GRUP A dark-mode fix'leri (29.06.2026) ───────────────────────────────── */

/* A1: nfAlert / nfConfirm / nfPrompt modal (app.js — background:#fff hardcoded,
   ink-700 body text → light in dark → invisible on white bg) */
[data-theme="dark"] #nf-modal-box {
  background: var(--surface-3) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] #nf-modal-title {
  color: var(--heading) !important;
}
[data-theme="dark"] #nf-modal-body {
  color: var(--text) !important;
}
[data-theme="dark"] #nf-modal-input {
  background: var(--surface-2) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}

/* A2: quiz_manage.html — durum rozeti hardcoded açık zemin (dark'ta görsel bozulma) */
[data-theme="dark"] .badge-draft  { background: var(--warn-bg); color: var(--warn-fg); }
[data-theme="dark"] .badge-active { background: var(--ok-bg);   color: var(--ok-fg); }

/* A3: quiz_manage cevap-satırı (ans-row) hardcoded açık zemin */
[data-theme="dark"] .ans-row.correct { background: var(--ok-bg);  color: var(--ok-fg); }
[data-theme="dark"] .ans-row.wrong   { background: var(--err-bg); color: var(--err-fg); }
[data-theme="dark"] .ans-row.empty   { background: var(--surface-2); color: var(--text-muted); }

/* A4: taxonomy picker / NF.filterModal — beyaz açılır içerik (#2 konu seç modal) */
[data-theme="dark"] .nf-filter-modal-overlay,
[data-theme="dark"] .nf-filter-modal-body {
  background: var(--surface-3) !important;
  color: var(--text) !important;
}
[data-theme="dark"] .nf-filter-modal-title { color: var(--heading) !important; }
[data-theme="dark"] .nf-filter-modal-item  { color: var(--text); }
[data-theme="dark"] .nf-filter-modal-item:hover { background: var(--surface-2); }

/* A5: teacher_reports.html veli-onay rozeti hardcoded açık zemin */
[data-theme="dark"] [style*="background:#fbe2e5"][style*="color:var(--err)"] {
  background: var(--err-bg) !important;
}

/* A6: taxonomy_picker.js arama sonuç dropdown — #ffffff hardcoded (#2 konu seç beyaz-üstü-beyaz) */
[data-theme="dark"] .tx-picker-search-dd {
  background: var(--surface-3) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] .tx-picker-search-opt {
  color: var(--text) !important;
  border-bottom-color: var(--border) !important;
}
[data-theme="dark"] .tx-picker-search-opt:hover,
[data-theme="dark"] .tx-picker-search-opt.hl {
  background: var(--surface-2) !important;
}
[data-theme="dark"] .tx-crumb { color: var(--text-muted) !important; }

/* A7: genel uyarı metni siyah (#3/#9 — dark'ta okunmaz) */
[data-theme="dark"] .nf-warn, [data-theme="dark"] .upload-warn,
[data-theme="dark"] .tag-field .sik-warn { color: var(--err-fg) !important; }
[data-theme="dark"] .opt-hint { color: var(--text-muted) !important; }

/* A8: teacher_reports.html — testlerim + ödevler hardcoded açık zemin rozetleri
   (#10/#25 test adı okunmuyor; branch/exam/status badge; light bg stays light in dark) */
[data-theme="dark"] [style*="background:#e0f5ee"] {
  background: var(--ok-bg) !important;
  color: var(--ok-fg) !important;
}
[data-theme="dark"] [style*="background:#fbf0db"],
[data-theme="dark"] [style*="background:#fef3c7"] {
  background: var(--warn-bg) !important;
  color: var(--warn-fg) !important;
}

/* #11/#27: nfConfirm secondary (İptal) buton background:#fff → dark'ta beyaz ada.
   NOT: tarayıcı style attribute'unu `#fff` → `rgb(255, 255, 255)` olarak serialize eder,
   bu yüzden [style*="background:#fff"] EŞLEŞMİYORDU (İptal beyaz kalıyordu). Her iki
   serileştirmeyi de hedefle. Primary (Evet) navy-900 bg → var() literal kalır, eşleşmez. */
[data-theme="dark"] #nf-modal-btns button[style*="background:#fff"],
[data-theme="dark"] #nf-modal-btns button[style*="rgb(255, 255, 255)"] {
  background: var(--surface-2) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
}