/* ============================================================
   TAKVIMERA DESIGN TOKENS — tek kaynak (Faz 0)
   Tüm sayfalar bu dosyayı yükler; her sayfanın yerel :root
   değişkenleri (--mor, --accent, --p ...) bu primitiflere bağlanır.
   index.html tema motoru (6 tema) korunur: tema blokları bu
   token'ları referans alır veya kendi accent'ini override eder.
   Katmanlar: 1) primitif token'lar  2) semantik alias'lar
              3) tk-* bileşen sınıfları  4) global a11y
   ============================================================ */
:root{
  /* ── LAVANTA skalası (marka moru — kalibrasyon 2. tur) ──
     Eski marka moru #7c6fa0/#8b7ab5 = ton 257°, doygunluk %21-28 (gerçek lavanta).
     İlk deneme #8B5CF6 aynı tonda ama %90 doygunluktu → mor okundu, reddedildi.
     Bu skala: ton 257° SABİT, doygunluk ~%34 (eskinin "hafif canlısı"), 500 buton
     kontrastı beyaz metinle 4.6:1 (eski 4.5:1 — lavanta VE daha erişilebilir). */
  --violet-50:#F6F4FA; --violet-100:#E8E3F2; --violet-200:#D3CCE6;
  --violet-300:#B6AAD4; --violet-400:#9C8CC5; --violet-500:#7E69B5;
  --violet-600:#6851A4; --violet-700:#57428A; --violet-800:#45356E; --violet-900:#362956;
  /* Kullanım kuralı: buton/link zemini 500-600 · küçük metin 600-700 ·
     dekoratif/glow/rozet 300-400 · hover ring / açık zemin 50-100 */

  /* ── Premium accent: soft gold (Pro rozetinin #f4c873 resmileşmesi) ── */
  --gold-100:#FAF0DC; --gold-300:#F6D693; --gold-400:#F4C873;
  --gold-500:#D9A84E; --gold-700:#8A6A2E;

  /* ── Sıcak-nötr skala (köprü zemin: krem sıcaklığı + menekşe alt ton) ── */
  --warm-0:#FFFFFF;  --warm-50:#FAF9FC;  --warm-100:#F3F1F7;
  --warm-200:#E9E5F0; --warm-300:#D9D4E3; --warm-400:#A9A3B4;
  --warm-600:#6E6880; --warm-700:#4E4860; --warm-900:#2D2A37;
  /* Kontrast: warm-600 muted metin ≈5.1:1, warm-900 ana metin ≈13:1 (warm-50 üzerinde) */

  /* ── Semantik durum renkleri (metin/ikon = koyu, dolgu = -fill, zemin = -light) ── */
  --success:#16A34A; --success-fill:#22C55E; --success-light:#DCFCE7; --success-ink:#15803D;
  --warn:#D97706;    --warn-fill:#F59E0B;    --warn-light:#FEF3C7;    --warn-ink:#92400E;
  --danger:#DC2626;  --danger-fill:#EF4444;  --danger-light:#FEE2E2;  --danger-ink:#B91C1C;
  --info:#2563EB;    --info-fill:#3B82F6;    --info-light:#DBEAFE;    --info-ink:#1D4ED8;

  /* ── Gölge sistemi (sıcak-menekşe gölge tonu: rgba(23,20,43)) ── */
  --shadow-xs:0 1px 2px rgba(23,20,43,.05);
  --shadow-sm:0 1px 3px rgba(23,20,43,.04),0 4px 14px rgba(23,20,43,.05);
  --shadow-md:0 2px 6px rgba(23,20,43,.06),0 10px 28px rgba(23,20,43,.09);
  --shadow-lg:0 4px 12px rgba(23,20,43,.08),0 20px 48px rgba(23,20,43,.14);
  --shadow-glow:0 0 0 1px var(--violet-100),0 8px 28px rgba(126,105,181,.16);
  /* Geriye uyumluluk alias'ları (mevcut var(--shadow)/var(--shadow-hover) kullanımı) */
  --shadow:var(--shadow-sm); --shadow-hover:var(--shadow-md);

  /* ── Radius sistemi ── */
  --radius-sm:8px; --radius:12px; --radius-lg:16px; --radius-xl:20px; --radius-full:999px;

  /* ── Spacing skalası (4px taban) ── */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px;

  /* ── Hareket ── */
  --dur-fast:120ms; --dur:180ms; --dur-slow:260ms;
  --ease:cubic-bezier(.4,0,.2,1);

  /* ── Tipografi (marka: Playfair yalnız büyük başlık/marka anları; UI = DM Sans) ── */
  --font-display:'Playfair Display',Georgia,serif;
  --font-body:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

/* ============================================================
   GLOBAL ERİŞİLEBİLİRLİK
   ============================================================ */
:focus-visible{outline:2px solid var(--violet-500);outline-offset:2px;border-radius:2px;}
::selection{background:var(--violet-200);color:var(--warm-900);}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}

/* ============================================================
   TK-* BİLEŞEN KATMANI (çakışma önlemek için ad-alanlı)
   Mevcut sayfa sınıfları (.btn, .fc, .card ...) korunur; yeni ve
   refactor edilen markup kademeli olarak tk-* sınıflarına geçer.
   ============================================================ */

/* ── Buton varyantları ── */
.tk-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 16px;border-radius:10px;border:1px solid transparent;cursor:pointer;font-family:var(--font-body);font-size:14px;font-weight:500;line-height:1.2;text-decoration:none;transition:all var(--dur) var(--ease);}
.tk-btn:active{transform:scale(.98);}
.tk-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;}
.tk-btn-primary{background:var(--violet-500);color:#fff;box-shadow:var(--shadow-xs);}
.tk-btn-primary:hover{background:var(--violet-600);transform:translateY(-1px);box-shadow:var(--shadow-md);}
.tk-btn-ghost{background:transparent;border-color:var(--warm-200);color:var(--warm-700);}
.tk-btn-ghost:hover{border-color:var(--violet-400);color:var(--violet-600);background:var(--violet-50);}
.tk-btn-danger{background:var(--danger-fill);color:#fff;}
.tk-btn-danger:hover{background:var(--danger);}
.tk-btn-gold{background:linear-gradient(135deg,var(--gold-400),var(--gold-500));color:#4a3a14;font-weight:600;}
.tk-btn-sm{padding:6px 12px;font-size:13px;border-radius:var(--radius-sm);}

/* ── Input / select ── */
.tk-input{width:100%;padding:10px 13px;border:1px solid var(--warm-200);border-radius:10px;font-family:var(--font-body);font-size:14px;color:var(--warm-900);background:var(--warm-0);outline:none;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.tk-input:focus{border-color:var(--violet-500);box-shadow:0 0 0 3px var(--violet-100);}
.tk-input::placeholder{color:var(--warm-400);}
.tk-input:disabled{background:var(--warm-100);color:var(--warm-400);cursor:not-allowed;}

/* ── Kart ── */
.tk-card{background:var(--warm-0);border:1px solid var(--warm-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);}
.tk-card-hover{transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease);}
.tk-card-hover:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
.tk-card-vurgu{border-color:var(--violet-200);box-shadow:var(--shadow-glow);}

/* ── Badge sistemi ── */
.tk-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:var(--radius-full);font-size:11.5px;font-weight:600;letter-spacing:.2px;line-height:1.6;white-space:nowrap;}
.tk-badge-success{background:var(--success-light);color:var(--success-ink);}
.tk-badge-warn{background:var(--warn-light);color:var(--warn-ink);}
.tk-badge-danger{background:var(--danger-light);color:var(--danger-ink);}
.tk-badge-info{background:var(--info-light);color:var(--info-ink);}
.tk-badge-violet{background:var(--violet-100);color:var(--violet-700);}
.tk-badge-gold{background:var(--gold-100);color:var(--gold-700);}
.tk-badge-neutral{background:var(--warm-100);color:var(--warm-700);}

/* ── Skeleton (yükleme) ── */
.tk-skl{position:relative;overflow:hidden;background:var(--warm-100);border-radius:var(--radius-sm);min-height:12px;}
.tk-skl::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:tk-shimmer 1.3s var(--ease) infinite;}
.tk-skl-text{height:13px;margin:6px 0;}
.tk-skl-title{height:20px;width:40%;margin-bottom:10px;}
.tk-skl-circle{border-radius:50%;}
@keyframes tk-shimmer{100%{transform:translateX(100%);}}

/* ── Boş durum ── */
.tk-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;gap:4px;}
.tk-empty-ic{width:52px;height:52px;border-radius:50%;background:var(--violet-50);color:var(--violet-500);display:flex;align-items:center;justify-content:center;margin-bottom:8px;}
.tk-empty-ic svg{width:24px;height:24px;}
.tk-empty-title{font-weight:600;font-size:14.5px;color:var(--warm-900);}
.tk-empty-desc{font-size:13px;color:var(--warm-600);max-width:340px;line-height:1.55;}
.tk-empty .tk-btn{margin-top:12px;}
