/* ===== Karanlık tema yenilemesi (19 Ekim taslağı) =====
   Talha'nın 8 Ekim'de istediği "karanlık temanın renklerini baştan düzenle" işi. Varsayılan
   tema aydınlık kalır; bu dosya yalnız kullanıcı karanlık bir tema seçtiğinde etkilidir.

   İlke: bulanık yeşil-gri yerine derin, hafif adaçayı tonlu zemin; dört belirgin yüzey basamağı;
   açık ve canlı vurgu; ana düğmede açık zemin + koyu yazı (yüksek kontrast). Durum renkleri
   (doğru/yanlış/uyarı) koyu zeminde AA üstü okunur. Üç vurgu ailesi (adaçayı, lacivert, amber)
   aynı nötr tabanı paylaşır. */

/* Nötr koyu tokenlar (--night-*, --snow-*) css/styles.css kökünde güncellendi. */

:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) {
  --bg: var(--night-950);
  --surface: var(--night-800);
  --surface-2: var(--night-900);
  --surface-3: var(--night-700);
  --border: var(--night-border);
  --text: var(--snow-100);
  --text-dim: var(--snow-300);
  --text-faint: var(--snow-500);
  --surface-text: var(--snow-100);
  --surface-text-dim: var(--snow-300);
  --surface-text-faint: var(--snow-500);
  --ok: #86c99c;
  --warn: #e2b86f;
  --bad: #ec968b;
  --info: #9dbce0;
  --amber: #e2b86f;
  --sage: #9cc9ad;
  --overlay: rgba(3, 6, 5, .72);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .45);
  --shadow-md: 0 14px 34px rgba(0, 0, 0, .45);
  --btn-secondary-bg: var(--night-700);
  --btn-secondary-hover: var(--night-600);
  --btn-secondary-border: #34413a;
  --input-bg: var(--night-900);
  color-scheme: dark;
}

/* Vurgu aileleri: ana düğme açık zemin + koyu yazı. */
:root:is([data-theme="sage-dark"]) {
  --accent: #9cc9ad; --accent-hover: #b1d6bf; --accent-active: #c3e0cd; --accent-text: var(--night-950);
  --btn-primary-bg: #9cc9ad; --btn-primary-hover: #b1d6bf; --btn-primary-active: #c3e0cd; --btn-primary-text: #0d1210;
  --focus-ring: #b1d6bf;
}
:root:is([data-theme="dark"], [data-theme="navy-dark"]) {
  --accent: #9dbce0; --accent-hover: #b3cbe8; --accent-active: #c6d8ef; --accent-text: var(--night-950);
  --btn-primary-bg: #9dbce0; --btn-primary-hover: #b3cbe8; --btn-primary-active: #c6d8ef; --btn-primary-text: #0d1210;
  --focus-ring: #b3cbe8;
}
:root:is([data-theme="amber-dark"]) {
  --accent: #e2b86f; --accent-hover: #ebc88a; --accent-active: #f1d6a3; --accent-text: var(--night-950);
  --btn-primary-bg: #e2b86f; --btn-primary-hover: #ebc88a; --btn-primary-active: #f1d6a3; --btn-primary-text: #0d1210;
  --focus-ring: #ebc88a;
}

/* --- Bileşen ayarları (yalnız karanlık temalar) --- */
/* Kenar çubuğu zeminden ayrışsın, seçili öğe net görünsün. */
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .bottom-nav { background: var(--night-900); border-color: var(--night-border); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .smooth-tab-indicator {
background: color-mix(in srgb, var(--accent) 16%, var(--night-800));
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 34%, transparent);
}
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .nav-item.active { color: var(--accent); }

/* Harita Laboratuvarı kutusu: aydınlık temadan kalan pembe-kahve geçiş yerine sakin yeşil. */
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .home-map-lab {
border-color: color-mix(in srgb, var(--subj-geo) 36%, var(--border));
background: linear-gradient(120deg, color-mix(in srgb, var(--subj-geo) 10%, var(--surface)) 0%, var(--surface) 70%);
}
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .home-practice-hero {
border-color: color-mix(in srgb, var(--accent) 26%, var(--border));
background: radial-gradient(ellipse at 90% 100%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 65%), var(--surface);
}

/* Şık seçimi ve doğru/yanlış durumları koyuda belirgin. */
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .option:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--border)); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .option.selected { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); border-color: var(--accent); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .option.correct { background: color-mix(in srgb, var(--ok) 14%, var(--surface)); border-color: var(--ok); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .option.incorrect { background: color-mix(in srgb, var(--bad) 14%, var(--surface)); border-color: var(--bad); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .q-passage { background: var(--night-900); }

/* Rozet ve segment kontrolleri. */
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .badge-neutral { background: var(--night-700); color: var(--snow-300); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .osym-seg, :root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .osym-topics { background: color-mix(in srgb, #fff 5%, transparent); }
:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) .osym-seg-btn.is-active { background: var(--night-600); }

/* Kutu dili: kenar bir tık daha görünür. */

:root:is([data-theme="dark"], [data-theme="navy-dark"], [data-theme="sage-dark"], [data-theme="amber-dark"]) {
  --box-border: color-mix(in srgb, #fff 8%, transparent);
  --box-border-hover: color-mix(in srgb, var(--accent) 40%, var(--night-border));
}