/* Tasarim token'lari - renk, olcu, golge, tipografi, z-index degiskenleri (:root) */

/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */
:root {
  /* Brand & accent */
  --mac-blue:           #007AFF;
  --mac-blue-press:     #0064CC;
  --mac-blue-soft:      rgba(0, 122, 255, 0.08);

  /* Text */
  --text:               #1D1D1F;
  --muted:              #86868B;

  /* Surface */
  --surface:            #FFFFFF;
  --gray-surface:       #F5F5F7;
  --sidebar-bg:         rgba(246, 246, 246, 0.8);
  --hover-bg:           rgba(0, 0, 0, 0.05);
  --row-hover-bg:       rgba(0, 0, 0, 0.03);

  /* Border */
  --border:             rgba(0, 0, 0, 0.10);
  --border-soft:        rgba(0, 0, 0, 0.06);
  --border-strong:      rgba(0, 0, 0, 0.16);

  /* Focus */
  --focus-ring:         0 0 0 3px rgba(0, 122, 255, 0.20);

  /* Shadow */
  --window-shadow:      0 25px 50px rgba(0, 0, 0, 0.18), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  --card-shadow:        0 4px 15px rgba(0, 0, 0, 0.03);
  --card-shadow-hover:  0 8px 24px rgba(0, 0, 0, 0.06);

  /* Semantic */
  --green:              #34C759;
  --green-dark:         #1F7F3F;
  --green-bg:           rgba(52, 199, 89, 0.15);
  --yellow:             #FFBD2E;
  --yellow-dark:        #8A6300;
  --yellow-bg:          rgba(255, 189, 46, 0.22);
  --red:                #FF3B30;
  --red-dark:           #C42B23;
  --red-bg:             rgba(255, 59, 48, 0.14);
  --purple:             #AF52DE;
  --purple-dark:        #6E2EA4;
  --purple-bg:          rgba(175, 82, 222, 0.14);
  --orange:             #FF9500;
  --orange-soft:        rgba(255, 149, 0, 0.12);
  --orange-bg:          rgba(255, 149, 0, 0.14);
  --orange-dark:        #B45A00;
  --blue-deep:          #0040A0;
  --blue-deep-bg:       rgba(0, 64, 160, 0.15);

  /* Cam yüzey (Auth / Masaustu backdrop-blur alanları) */
  --glass-surface:      rgba(255, 255, 255, 0.74);
  --glass-strong:       rgba(255, 255, 255, 0.82);
  --glass-border:       rgba(255, 255, 255, 0.55);
  --glass-inner-border: rgba(255, 255, 255, 0.60);
  --map-veil-inner:     rgba(20, 28, 40, 0.16);
  --map-veil-outer:     rgba(20, 28, 40, 0.46);
  --map-fade-top:       rgba(255, 255, 255, 0.15);   /* Masaustu haritası üst fade */

  /* Polymorphic source colors */
  --src-tedarik:        var(--green);
  --src-tedarik-bg:     var(--green-bg);
  --src-depo-talep:     var(--mac-blue);
  --src-depo-talep-bg:  rgba(0, 122, 255, 0.15);
  --src-urun-zimmet:    var(--purple);
  --src-urun-zimmet-bg: var(--purple-bg);
  --src-depo-aktarim:   var(--blue-deep);
  --src-depo-aktarim-bg:var(--blue-deep-bg);
  --src-urun-hurda:     var(--red);
  --src-urun-hurda-bg:  var(--red-bg);
  --src-depo-sayim:     #8A6500;
  --src-depo-sayim-bg:  var(--yellow-bg);
  --src-manuel:         #8A6500;
  --src-manuel-bg:      rgba(255, 189, 46, 0.10);

  /* Typography */
  --font: -apple-system, "Inter", "SF Pro Text", BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;

  /* ----------------------------------------------------------
     YENI AILELER (2026-05-20 sertlestirme paketi)
     Detay: wiki/conventions/ui-design-system/tokens.md
     Lint: tools/css-lint.js ham hex/rgba/px yasaklar
     ---------------------------------------------------------- */

  /* Bosluk (spacing) — 4'lu skala */
  --bosluk-1:           4px;
  --bosluk-2:           8px;
  --bosluk-3:           14px;
  --bosluk-4:           20px;
  --bosluk-5:           28px;
  --bosluk-6:           40px;

  /* Koselik (radius) */
  --koselik-xs:         4px;
  --koselik-sm:         6px;
  --koselik-md:         8px;
  --koselik-lg:         12px;
  --koselik-xl:         14px;
  --koselik-2xl:        16px;
  --koselik-pill:       999px;

  /* Golge (shadow) — mevcut --card-shadow/--window-shadow yenisiyle ortak */
  --golge-durgun:       var(--card-shadow);
  --golge-yuksek:       var(--card-shadow-hover);
  --golge-yuzen:        var(--window-shadow);
  --golge-modal:        0 30px 60px rgba(0, 0, 0, 0.32), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  --golge-toast:        0 10px 30px rgba(0, 0, 0, 0.30), inset 0 0 0 1px rgba(255, 255, 255, 0.08);
  --golge-dock:         0 10px 40px rgba(0, 0, 0, 0.15), inset 0 1px 2px rgba(255, 255, 255, 0.4);
  --odak-halka:         var(--focus-ring);

  /* Motion */
  --hiz-anlik:          0.06s;
  --hiz-hizli:          0.12s ease;
  --hiz-normal:         0.15s ease;
  --hiz-yavas:          0.22s cubic-bezier(0.4, 0, 0.2, 1);
  --hiz-toast:          0.28s cubic-bezier(0.32, 0.72, 0, 1);
  --hiz-pencere:        0.3s cubic-bezier(0.25, 0.8, 0.25, 1);

  /* Vekalet rengi (Erisim Acikla ekrani + vekalet rozetleri) */
  --renk-vekalet:       #D97706;
  --renk-vekalet-soft:  rgba(217, 119, 6, 0.14);

  /* Yetki kapsam renkleri (Erisim Acikla tablosu) */
  --renk-kapsam-tum:           #16A34A;
  --renk-kapsam-tum-soft:      rgba(34, 199, 89, 0.12);
  --renk-kapsam-birim:         #7C3AED;
  --renk-kapsam-birim-soft:    rgba(139, 92, 246, 0.12);
  --renk-kapsam-spesifik:      #DB2777;
  --renk-kapsam-spesifik-soft: rgba(236, 72, 153, 0.12);
  --renk-kapsam-kendi:         #64748B;
  --renk-kapsam-kendi-soft:    rgba(100, 116, 139, 0.12);

  /* Rol kaynak rengi (mac-blue ile uyumlu) */
  --renk-rol:           var(--mac-blue);
  --renk-rol-soft:      rgba(0, 122, 255, 0.10);

  /* Trafik isiklari (pencere title-bar) — mevcut hex'lere isim verir */
  --mac-tl-red:         #FF5F56;
  --mac-tl-yellow:      #FFBD2E;
  --mac-tl-green:       #27C93F;

  /* Z-index skala (Window Manager + overlay'ler) */
  --z-breadcrumb:       4;
  --z-action-footer:    5;
  --z-suite-switcher:   6;
  --z-resize-handle:    50;
  --z-tooltip:          100;
  --z-window-base:      1000;
  --z-modal-base:       2000;
  --z-toast:            3000;
  --z-dock:             9999;
}
