/**
 * İndirip Muhasebe — Design Tokens v2
 *
 * Kurumsal fintech SaaS dili: indigo (marka) + slate/navy (finans güveni)
 * Tüm bileşenler bu token setini kullanır. Dark mode için sadece :root[data-theme="dark"]
 * override edilir (gelecek faz).
 */

:root {
  /* ─────────── BRAND (indigo, mevcut kimlik korundu) ─────────── */
  --brand-50:  #eef2ff;
  --brand-100: #e0e7ff;
  --brand-200: #c7d2fe;
  --brand-400: #818cf8;
  --brand-500: #6366f1;
  --brand-600: #4f46e5;  /* PRIMARY */
  --brand-700: #4338ca;
  --brand-800: #3730a3;
  --brand-900: #312e81;

  /* ─────────── FINANCE (slate — güven, kurumsal) ─────────── */
  --slate-50:  #f8fafc;
  --slate-100: #f1f5f9;
  --slate-200: #e2e8f0;
  --slate-300: #cbd5e1;
  --slate-400: #94a3b8;
  --slate-500: #64748b;
  --slate-600: #475569;
  --slate-700: #334155;
  --slate-800: #1e293b;
  --slate-900: #0f172a;
  --slate-950: #020617;

  /* ─────────── SEMANTIC ─────────── */
  --success-50:  #ecfdf5;
  --success-100: #d1fae5;
  --success-500: #10b981;
  --success-600: #059669;
  --success-700: #047857;

  --warning-50:  #fffbeb;
  --warning-100: #fef3c7;
  --warning-500: #f59e0b;
  --warning-600: #d97706;
  --warning-700: #b45309;

  --danger-50:   #fef2f2;
  --danger-100:  #fee2e2;
  --danger-500:  #ef4444;
  --danger-600:  #dc2626;
  --danger-700:  #b91c1c;

  --info-50:     #eff6ff;
  --info-100:    #dbeafe;
  --info-500:    #3b82f6;
  --info-600:    #2563eb;
  --info-700:    #1d4ed8;

  /* ─────────── SURFACE ─────────── */
  --surface-page:    var(--slate-50);    /* sayfa arka plan */
  --surface-card:    #ffffff;            /* kart arka plan */
  --surface-hover:   var(--slate-100);   /* hover state */
  --surface-active:  var(--slate-200);   /* pressed/active */
  --surface-dark:    var(--slate-900);   /* dark accent */
  --surface-overlay: rgba(15, 23, 42, 0.6); /* modal/drawer backdrop */

  /* ─────────── TEXT ─────────── */
  --text-primary:   var(--slate-900);
  --text-secondary: var(--slate-600);
  --text-tertiary:  var(--slate-400);
  --text-on-brand:  #ffffff;
  --text-on-dark:   var(--slate-100);
  --text-link:      var(--brand-600);
  --text-link-hover: var(--brand-700);

  /* ─────────── BORDER ─────────── */
  --border-default: var(--slate-200);
  --border-strong:  var(--slate-300);
  --border-focus:   var(--brand-600);
  --border-success: var(--success-500);
  --border-warning: var(--warning-500);
  --border-danger:  var(--danger-500);

  /* ─────────── TYPOGRAPHY ─────────── */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
               'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco,
               Consolas, 'Liberation Mono', monospace;

  /* Type scale (1.250 ratio) */
  --text-xs:    11px;
  --text-sm:    13px;
  --text-base:  14px;
  --text-md:    15px;
  --text-lg:    17px;
  --text-xl:    20px;
  --text-2xl:   24px;
  --text-3xl:   30px;
  --text-4xl:   36px;
  --text-5xl:   48px;

  --leading-tight: 1.2;
  --leading-snug:  1.4;
  --leading-base:  1.55;
  --leading-loose: 1.75;

  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-wider:  0.08em;

  /* Font weights */
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-extra:    800;

  /* ─────────── SPACING (4px base) ─────────── */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ─────────── RADIUS ─────────── */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius:    8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 999px;

  /* ─────────── SHADOWS ─────────── */
  --shadow-xs:  0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-sm:  0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow:     0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
  --shadow-md:  0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.05);
  --shadow-lg:  0 20px 25px -5px rgba(15, 23, 42, 0.10), 0 8px 10px -6px rgba(15, 23, 42, 0.06);
  --shadow-xl:  0 25px 50px -12px rgba(15, 23, 42, 0.18);

  /* Inset shadows (for inputs) */
  --shadow-inner: inset 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-focus: 0 0 0 3px rgba(99, 102, 241, 0.18);

  /* ─────────── TIMING / EASING ─────────── */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.4, 0, 1, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --duration-fast:   100ms;
  --duration-base:   180ms;
  --duration-slow:   250ms;
  --duration-slower: 400ms;

  /* ─────────── Z-INDEX ─────────── */
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-overlay:   900;
  --z-modal:     1000;
  --z-toast:     1100;
  --z-tooltip:   1200;

  /* ─────────── LAYOUT ─────────── */
  --layout-sidebar:        260px;
  --layout-sidebar-mini:   72px;
  --layout-topbar:         60px;
  --layout-page-max:       1440px;
  --layout-content-pad:    24px;
}

/* Reduced motion — animasyonlar kapatılır */
@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast:   0ms;
    --duration-base:   0ms;
    --duration-slow:   0ms;
    --duration-slower: 0ms;
  }
}
