/* 🎨 Renk ve tasarım teması (Riven 25 Eyl · KOCI_5_Tema_Kod_Paketi).
   Mevcut GÖRÜNÜM MODLARI (Klasik/Dinamik/Relax/Sakin/Koçi Özel) ve TV düzeni AYRI ayardır ve olduğu gibi durur;
   bu katman yalnız renk/köşe/tipografi değiştirir. Seçim yokken (data-koci-tema yok) hiçbir kural işlemez,
   uygulama eskisi gibi görünür.
   Bu dosya tema renklerinin tek kaynağıdır; eski üretici betiğin kaynak paketi artık yok.

   Seçici düzeni: :root[data-koci-tema="…"] mevcut :root ve :root[data-theme="dark"] kurallarıyla aynı
   özgüllükte; bu dosya style.css'ten SONRA yüklendiği için kazanır. Koyu şemalı temalarda karanlık mod
   bileşen kuralları da burada yeniden verilir (yoksa açık zemin kartları koyu temada beyaz kalırdı). */


/* ── Sıcak Turuncu · Samimi ve güçlü (light) */
:root[data-koci-tema="sicak-turuncu"] { --bg:#FFF9F3; --card:#FFFFFF; --ink:#223547; --navy:#223547; --muted:#526170; --line:#D8C6BA; --primary:#BE4721; --primary-dk:#A83C19; --ok:#17603D; --ok-bg:#EAF6EE; --bad:#B42318; --bad-bg:#FFF1F0; --warn:#7A4900; --warn-bg:#FFF5DC; --radius:22px;
  --koci-accent:#E5693F; --koci-hero:#FFE3D1; --koci-hero-ink:#223547;
  --koci-on-primary:#FFFFFF; --koci-focus:#9A3B1A; --koci-golge:0 8px 26px rgba(100,55,27,.08);
  --koci-yuzey-alt:#FFF0E6; --koci-radius-btn:16px; --koci-radius-sm:12px;
  --koci-font-govde:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-font-baslik:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-baslik-kalin:750; }
:root[data-koci-tema="sicak-turuncu"] body { background:#FFF0E6; font-family:system-ui, -apple-system, "Segoe UI", sans-serif; }
:root[data-koci-tema="sicak-turuncu"] h1, :root[data-koci-tema="sicak-turuncu"] h2, :root[data-koci-tema="sicak-turuncu"] h3, :root[data-koci-tema="sicak-turuncu"] h4,
:root[data-koci-tema="sicak-turuncu"] .big, :root[data-koci-tema="sicak-turuncu"] .q, :root[data-koci-tema="sicak-turuncu"] .greet,
:root[data-koci-tema="sicak-turuncu"] .hero-emoji + h1, :root[data-koci-tema="sicak-turuncu"] .ogr-n, :root[data-koci-tema="sicak-turuncu"] .hk-n,
:root[data-koci-tema="sicak-turuncu"] .n, :root[data-koci-tema="sicak-turuncu"] .top { font-family:system-ui, -apple-system, "Segoe UI", sans-serif; font-weight:750; }
:root[data-koci-tema="sicak-turuncu"] .btn { box-shadow:0 4px 0 var(--primary-dk); }

/* ── Gece Laciverti · Odaklı ve modern (dark) */
:root[data-koci-tema="gece-laciverti"] { --bg:#101C30; --card:#1C2C45; --ink:#F8FAFC; --navy:#F8FAFC; --muted:#B8C7DA; --line:#57728F; --primary:#59D5DE; --primary-dk:#83E4EA; --ok:#9DE2B3; --ok-bg:#1D4038; --bad:#FFB4AB; --bad-bg:#482A34; --warn:#FFD58A; --warn-bg:#493C28; --radius:16px;
  --koci-accent:#59D5DE; --koci-hero:#213C56; --koci-hero-ink:#F8FAFC;
  --koci-on-primary:#101C30; --koci-focus:#8BEAF0; --koci-golge:0 10px 28px rgba(0,0,0,.22);
  --koci-yuzey-alt:#233752; --koci-radius-btn:12px; --koci-radius-sm:12px;
  --koci-font-govde:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-font-baslik:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-baslik-kalin:750; }
:root[data-koci-tema="gece-laciverti"] body { background:#233752; font-family:system-ui, -apple-system, "Segoe UI", sans-serif; }
:root[data-koci-tema="gece-laciverti"] h1, :root[data-koci-tema="gece-laciverti"] h2, :root[data-koci-tema="gece-laciverti"] h3, :root[data-koci-tema="gece-laciverti"] h4,
:root[data-koci-tema="gece-laciverti"] .big, :root[data-koci-tema="gece-laciverti"] .q, :root[data-koci-tema="gece-laciverti"] .greet,
:root[data-koci-tema="gece-laciverti"] .hero-emoji + h1, :root[data-koci-tema="gece-laciverti"] .ogr-n, :root[data-koci-tema="gece-laciverti"] .hk-n,
:root[data-koci-tema="gece-laciverti"] .n, :root[data-koci-tema="gece-laciverti"] .top { font-family:system-ui, -apple-system, "Segoe UI", sans-serif; font-weight:750; }
:root[data-koci-tema="gece-laciverti"] .btn { box-shadow:0 0 0 1px rgba(255,255,255,.08), 0 2px 10px rgba(0,0,0,.35); }

/* ── Sakin Yeşil · Sade ve dengeli (light) */
:root[data-koci-tema="sakin-yesil"] { --bg:#EEF5EF; --card:#FFFFFF; --ink:#16382D; --navy:#16382D; --muted:#4B6258; --line:#B6C9BD; --primary:#215846; --primary-dk:#174433; --ok:#17603D; --ok-bg:#EAF6EE; --bad:#B42318; --bad-bg:#FFF1F0; --warn:#7A4900; --warn-bg:#FFF5DC; --radius:16px;
  --koci-accent:#7A9E8F; --koci-hero:#DCECE0; --koci-hero-ink:#16382D;
  --koci-on-primary:#FFFFFF; --koci-focus:#215846; --koci-golge:0 4px 16px rgba(28,69,48,.04);
  --koci-yuzey-alt:#E2EDE5; --koci-radius-btn:14px; --koci-radius-sm:12px;
  --koci-font-govde:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-font-baslik:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-baslik-kalin:750; }
:root[data-koci-tema="sakin-yesil"] body { background:#E2EDE5; font-family:system-ui, -apple-system, "Segoe UI", sans-serif; }
:root[data-koci-tema="sakin-yesil"] h1, :root[data-koci-tema="sakin-yesil"] h2, :root[data-koci-tema="sakin-yesil"] h3, :root[data-koci-tema="sakin-yesil"] h4,
:root[data-koci-tema="sakin-yesil"] .big, :root[data-koci-tema="sakin-yesil"] .q, :root[data-koci-tema="sakin-yesil"] .greet,
:root[data-koci-tema="sakin-yesil"] .hero-emoji + h1, :root[data-koci-tema="sakin-yesil"] .ogr-n, :root[data-koci-tema="sakin-yesil"] .hk-n,
:root[data-koci-tema="sakin-yesil"] .n, :root[data-koci-tema="sakin-yesil"] .top { font-family:system-ui, -apple-system, "Segoe UI", sans-serif; font-weight:750; }
:root[data-koci-tema="sakin-yesil"] .btn { box-shadow:0 2px 8px rgba(28,69,48,.18); }

/* ── Krem Defter · Düzenli ve zamansız (light) */
:root[data-koci-tema="krem-defter"] { --bg:#F7F1E6; --card:#FFFCF6; --ink:#293A4B; --navy:#293A4B; --muted:#5B615F; --line:#C9BBA7; --primary:#A7442D; --primary-dk:#903520; --ok:#17603D; --ok-bg:#EAF6EE; --bad:#B42318; --bad-bg:#FFF1F0; --warn:#7A4900; --warn-bg:#FFF5DC; --radius:10px;
  --koci-accent:#BA5B42; --koci-hero:#F0E5D4; --koci-hero-ink:#293A4B;
  --koci-on-primary:#FFFFFF; --koci-focus:#A7442D; --koci-golge:0 4px 14px rgba(59,43,23,.05);
  --koci-yuzey-alt:#EEE5D7; --koci-radius-btn:9px; --koci-radius-sm:12px;
  --koci-font-govde:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-font-baslik:Georgia, "Times New Roman", serif; --koci-baslik-kalin:700; }
:root[data-koci-tema="krem-defter"] body { background:#EEE5D7; font-family:system-ui, -apple-system, "Segoe UI", sans-serif; }
:root[data-koci-tema="krem-defter"] h1, :root[data-koci-tema="krem-defter"] h2, :root[data-koci-tema="krem-defter"] h3, :root[data-koci-tema="krem-defter"] h4,
:root[data-koci-tema="krem-defter"] .big, :root[data-koci-tema="krem-defter"] .q, :root[data-koci-tema="krem-defter"] .greet,
:root[data-koci-tema="krem-defter"] .hero-emoji + h1, :root[data-koci-tema="krem-defter"] .ogr-n, :root[data-koci-tema="krem-defter"] .hk-n,
:root[data-koci-tema="krem-defter"] .n, :root[data-koci-tema="krem-defter"] .top { font-family:Georgia, "Times New Roman", serif; font-weight:700; }
:root[data-koci-tema="krem-defter"] .btn { box-shadow:0 1px 0 rgba(0,0,0,.28); }

/* ── Canlı Mor · Enerjik ve çağdaş (light) */
:root[data-koci-tema="canli-mor"] { --bg:#FAF8FF; --card:#FFFFFF; --ink:#2F1B4B; --navy:#2F1B4B; --muted:#665877; --line:#C6B9E0; --primary:#6246C8; --primary-dk:#5136B2; --ok:#17603D; --ok-bg:#EAF6EE; --bad:#B42318; --bad-bg:#FFF1F0; --warn:#7A4900; --warn-bg:#FFF5DC; --radius:24px;
  --koci-accent:#F7CF68; --koci-hero:#E7E1FB; --koci-hero-ink:#2F1B4B;
  --koci-on-primary:#FFFFFF; --koci-focus:#6246C8; --koci-golge:0 8px 24px rgba(77,49,147,.10);
  --koci-yuzey-alt:#EDE7FC; --koci-radius-btn:24px; --koci-radius-sm:12px;
  --koci-font-govde:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-font-baslik:system-ui, -apple-system, "Segoe UI", sans-serif; --koci-baslik-kalin:750; }
:root[data-koci-tema="canli-mor"] body { background:#EDE7FC; font-family:system-ui, -apple-system, "Segoe UI", sans-serif; }
:root[data-koci-tema="canli-mor"] h1, :root[data-koci-tema="canli-mor"] h2, :root[data-koci-tema="canli-mor"] h3, :root[data-koci-tema="canli-mor"] h4,
:root[data-koci-tema="canli-mor"] .big, :root[data-koci-tema="canli-mor"] .q, :root[data-koci-tema="canli-mor"] .greet,
:root[data-koci-tema="canli-mor"] .hero-emoji + h1, :root[data-koci-tema="canli-mor"] .ogr-n, :root[data-koci-tema="canli-mor"] .hk-n,
:root[data-koci-tema="canli-mor"] .n, :root[data-koci-tema="canli-mor"] .top { font-family:system-ui, -apple-system, "Segoe UI", sans-serif; font-weight:750; }
:root[data-koci-tema="canli-mor"] .btn { box-shadow:0 6px 18px rgba(98,70,200,.32); }


/* ── Tema seçiliyken ortak yüzeyler (mod geometrisine dokunmaz: yalnız renk, köşe, gölge) */
:root[data-koci-tema] .phone { background:var(--bg); box-shadow:var(--koci-golge); }
:root[data-koci-tema] .card { background:var(--card); border-color:var(--line); border-radius:var(--radius); box-shadow:var(--koci-golge); }
:root[data-koci-tema] .card.hero, :root[data-koci-tema] .hero { background:var(--koci-hero); color:var(--koci-hero-ink); }
:root[data-koci-tema] .card.hero h1, :root[data-koci-tema] .hero h1 { color:var(--koci-hero-ink); }
:root[data-koci-tema] .btn { border-radius:var(--koci-radius-btn); }
:root[data-koci-tema] .btn:not(.secondary):not(.ghost):not(.ok):not(.bad) { background:var(--primary); color:var(--koci-on-primary); }
:root[data-koci-tema] .btn.secondary { background:var(--koci-yuzey-alt); color:var(--ink); border:1px solid var(--line); box-shadow:none; }
:root[data-koci-tema] .btn.ghost { background:none; color:var(--muted); box-shadow:none; }
:root[data-koci-tema] .btn.ok { background:var(--ok); color:var(--koci-on-ok, #fff); box-shadow:none; }
:root[data-koci-tema] .btn.bad { background:var(--bad); color:var(--koci-on-bad, #fff); box-shadow:none; }
:root[data-koci-tema] .opt, :root[data-koci-tema] .tile, :root[data-koci-tema] .chip, :root[data-koci-tema] .tile-btn,
:root[data-koci-tema] .item, :root[data-koci-tema] .mic, :root[data-koci-tema] .streak,
:root[data-koci-tema] input:not([type=checkbox]):not([type=radio]), :root[data-koci-tema] textarea, :root[data-koci-tema] select {
  background:var(--card); color:var(--ink); border-color:var(--line); border-radius:var(--koci-radius-sm); }
:root[data-koci-tema] .opt.sel, :root[data-koci-tema] .chip.on { border-color:var(--primary); background:var(--koci-yuzey-alt); }
:root[data-koci-tema] .tag { background:var(--koci-yuzey-alt); color:var(--ink); }
:root[data-koci-tema] .tag.blue { background:var(--koci-hero); color:var(--koci-hero-ink); }
:root[data-koci-tema] .nav { background:var(--card); border-top-color:var(--line); }
:root[data-koci-tema] .nav button.on { color:var(--primary); }
:root[data-koci-tema] .top { color:var(--ink); }
:root[data-koci-tema] .icon { color:var(--primary); }
:root[data-koci-tema] .sh-bar { background:var(--koci-yuzey-alt); }
:root[data-koci-tema] .sh-bar b { background:var(--primary); }
:root[data-koci-tema] .muted, :root[data-koci-tema] .small:not(.speak) { color:var(--muted); }
:root[data-koci-tema] :focus-visible { outline:3px solid var(--koci-focus); outline-offset:2px; }
:root[data-koci-tema] .pn-metin { background:var(--koci-yuzey-alt); border-color:var(--line); }
/* Sabit renkli kalan parçalar: koyu şemalı temada okunmuyorlardı (ölçüm: kontrast 1.05 ve 1.75).
   Zemini temadan alır, yazı rengi zemine göre belirlenir. */
:root[data-koci-tema] .fb-banner { background:var(--warn-bg); border-color:var(--warn); color:var(--ink); }
:root[data-koci-tema] .fb-banner button { color:var(--ink); opacity:.7; }
:root[data-koci-tema] .koci-mic, :root[data-koci-tema] .ke-rozet, :root[data-koci-tema] .rec {
  background:var(--primary); color:var(--koci-on-primary); }
:root[data-koci-tema] .badge, :root[data-koci-tema] .rozet { color:var(--koci-on-primary); }

/* ── Ana sayfa ve sık kullanılan kutular: bunlar .card değil kendi sınıflarını kullanıyor, bu yüzden
   tema kuralları onlara ayrıca bağlanır (yoksa ana sayfa temadan etkilenmiyordu). */
:root[data-koci-tema] .ev-onc, :root[data-koci-tema] .sema-kart, :root[data-koci-tema] .kesfet,
:root[data-koci-tema] .ogr-card, :root[data-koci-tema] .lv-card, :root[data-koci-tema] .mode-card,
:root[data-koci-tema] .stat .card, :root[data-koci-tema] .book, :root[data-koci-tema] .beceri {
  background:var(--card); border-color:var(--line); border-radius:var(--radius); color:var(--ink); }
:root[data-koci-tema] .ke-ok, :root[data-koci-tema] .ke-geri, :root[data-koci-tema] .koci-mic {
  background:var(--koci-yuzey-alt); color:var(--ink); }
:root[data-koci-tema] .koci-mic { background:var(--primary); color:var(--koci-on-primary); }

/* ── Vurgu rengi (accent): panolarda ikinci renk ilerleme ve başarı işaretlerinde kullanılıyor.
   Canlı Mor'da sarı, Sıcak Turuncu'da açık turuncu gibi. */
:root[data-koci-tema] .sema-bar i, :root[data-koci-tema] .xp-bar i, :root[data-koci-tema] .bar i {
  background:linear-gradient(90deg, var(--primary), var(--koci-accent)); }
:root[data-koci-tema] .tag.yeni, :root[data-koci-tema] .ke-rozet, :root[data-koci-tema] .streak {
  background:var(--koci-accent); color:var(--koci-on-accent, var(--ink)); border-color:transparent; }
/* Erişilebilirlik: azaltılmış hareket isteyen kullanıcıda geçişler kapanır */
/* Sayısı 1: sonsuz döngü .01 ms'de her karede rastgele evrede çizilip titrer (azaltılmış hareketin tersi). */
@media (prefers-reduced-motion: reduce) { :root[data-koci-tema] * { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }

/* ── Okunurluk jetonları (Riven 30 Eyl: "her renk temasına bak, böyle yazılar gözükmesin"). ELLE eklendi.
   Bu dosya artık tek kaynak (docs/build_temalar_css.py'nin tema paketi kaynağı yok; betik çalışmaz, yukarıdaki küçük değişiklikler betiğe de işlendi).
   --koci-on-ok / --koci-on-bad: yeşil/kırmızı dolgu üstündeki yazı (Gece Laciverti'de dolgular açık: beyaz yazı 1.5–1.7 idi).
   --koci-on-accent: vurgu dolgusu (seri, "yeni" rozeti) üstündeki yazı (Gece 1.67, Krem Defter 2.59 idi).
   --bg2: küçük numara yuvarlakları (müfredat, test satırı) — tanımsızken sabit açık bej kalıyordu. */
:root[data-koci-tema] { --bg2:var(--koci-yuzey-alt); }
:root[data-koci-tema="gece-laciverti"] { --koci-on-ok:#101C30; --koci-on-bad:#101C30; --koci-on-accent:#101C30; }
:root[data-koci-tema="krem-defter"] { --koci-on-accent:#FFFFFF; }

