/* =========================================================================
   Tasarım belirteçleri (design tokens) — AÇIK tema. Tüm bileşenler BUNLARI kullanır;
   bileşen CSS'inde sabit renk/boşluk yerine değişken kullanın.
   Görsel dil: Planner ile aynı (Linear tarzı, 13px yoğun tipografi, ince kenarlıklar, marka yeşili aksan).

   RENK ANLAMLARI (kalıcı kural — AI Süreç Yazılımı'ndan devralındı):
     • Yeşil (--done)   YALNIZCA "tamamlandı" demektir.
     • Turuncu (--active) "üzerinde çalışılıyor".
     • Kırmızı (--late) plan/deadline geçti, bitmedi.
     • Sarı (--risk)    riskte (deadline yakın / tahmini bitiş aşıyor / sarkma var).
     • Tür renkleri: AI mavi · ERP (Dynamics 365) mor · API pembe.
   ========================================================================= */
:root {
  /* --- marka --- */
  --brand: #499d58;
  --brand-dark: #161615;

  /* --- yüzeyler --- */
  --bg: #f4f4f5;
  --panel: #ffffff;
  --surface-2: #fafafa;
  --surface-3: #f8f8f9;
  --hover: #f4f4f6;
  --hover2: #ececef;
  --line: #e4e4e7;
  --line2: #efeff1;

  /* --- metin --- */
  --text: #18181b;
  --text2: #3f3f46;
  --muted: #71717a;
  --faint: #a1a1aa;

  /* --- aksan --- */
  --accent: #499d58;
  --accent-d: #3b844a;
  --accent-soft: #edf6ef;
  --accent-soft2: #e1f0e4;
  --ring: rgba(73, 157, 88, .30);
  --danger: #e5484d;
  --danger-soft: #fef2f2;
  --warn: #d97706;
  --warn-soft: #fff7ed;
  --amber: #b45309;
  --amber-soft: #fef3c7;
  --violet: #6d28d9;
  --violet-soft: #f5f3ff;
  --info: #2563eb;
  --info-soft: #eef4ff;

  /* --- süreç sağlığı & aşama tonları --- */
  --late: #e5484d;
  --late-soft: #fdecec;
  --risk: #d4a106;
  --risk-soft: #fdf6dc;
  --active: #ea7a17;
  --active-soft: #fff1e4;
  --idle: #a1a1aa;
  --idle-soft: #f1f1f3;
  --done: #499d58;
  --done-soft: #e8f4ea;

  /* --- süreç türleri --- */
  --t-ai: #3b6fd9;
  --t-ai-soft: #eaf0fd;
  --t-d365: #6c4bd6;
  --t-d365-soft: #f0ecfd;
  --t-api: #c2417a;
  --t-api-soft: #fcebf2;

  /* --- tipografi --- */
  --font: Inter, "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 26px;

  /* --- boşluk (4px ızgara) --- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;

  /* --- köşe, gölge --- */
  --r-sm: 5px;
  --r: 6px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --shadow: 0 1px 2px rgba(16, 16, 20, .04), 0 2px 8px rgba(16, 16, 20, .04);
  --shadow-md: 0 2px 4px rgba(16, 16, 20, .05), 0 8px 24px rgba(16, 16, 20, .07);
  --shadow-lg: 0 16px 48px rgba(16, 16, 24, .16), 0 2px 6px rgba(16, 16, 24, .06);

  /* --- yerleşim --- */
  --hdr-h: 52px;
  --fbar-h: 44px;
  --sb-w: 232px;
  --panel-w: min(720px, 54vw);

  /* --- katmanlar (z-index) --- */
  --z-panel: 50;
  --z-inbox: 800;
  --z-modal: 900;
  --z-menu: 1000;
  --z-toast: 2000;

  /* --- hareket --- */
  --ease: cubic-bezier(.3, .7, .2, 1);
}