/* ==========================================================================
   EK Takip — Tasarım token'ları (Figma "EK Takip · Renkler" koleksiyonu ile birebir)
   Renk kuralı: mavi = yapı & seçim · turuncu = CTA / vurgu · lacivert = koyu bölümler
   ========================================================================== */
:root {
  /* Marka */
  --ek-blue: #1F5BFF;
  --ek-blue-600: #1747F0;
  --ek-sky: #2D9CFF;
  --ek-orange: #FF7A1A;
  --ek-orange-600: #FF5A14;
  --ek-amber: #FFB020;

  /* Lacivert (koyu yüzeyler) */
  --ek-ink-900: #071330;
  --ek-ink-800: #0E1D45;
  --ek-ink-700: #1A2C5E;

  /* Metin */
  --ek-text: #0B1736;
  --ek-text-2: #55617D;
  --ek-muted: #97A1B8;
  --ek-inverse: #FFFFFF;

  /* Yüzeyler */
  --ek-bg: #F4F7FC;
  --ek-card: #FFFFFF;
  --ek-subtle: #EAF1FF;
  --ek-tint: #F5F8FF;
  --ek-border: #E2E8F3;
  --ek-border-strong: #C3CBDA;

  /* Durum */
  --ek-success: #12B76A;
  --ek-success-600: #0BA360;
  --ek-warning: #F79009;
  --ek-warning-700: #B54708;
  --ek-danger: #F04438;
  --ek-danger-700: #D92D20;
  --ek-purple: #7A5AF8;

  /* Gradyanlar */
  --ek-grad-blue: linear-gradient(135deg, #1747F0 0%, #2368FF 50%, #3AA6FF 100%);
  --ek-grad-orange: linear-gradient(100deg, #FFA12E 0%, #FF7A1A 50%, #FF5A14 100%);
  --ek-grad-green: linear-gradient(135deg, #0BA360 0%, #12B76A 55%, #3CD68C 100%);
  --ek-grad-red: linear-gradient(135deg, #FF6B5E 0%, #F04438 60%, #D92D20 100%);
  --ek-grad-navy: linear-gradient(135deg, #071330 0%, #1A2C5E 60%, #2368FF 100%);
  --ek-grad-hero: radial-gradient(60% 80% at 0% 0%, rgba(35, 104, 255, .55) 0%, rgba(35, 104, 255, 0) 70%),
                  radial-gradient(50% 70% at 100% 100%, rgba(255, 122, 26, .32) 0%, rgba(255, 122, 26, 0) 70%),
                  #071330;

  /* Platform gradyanları */
  --ek-grad-instagram: linear-gradient(45deg, #FEDA75 0%, #FA7E1E 25%, #D62976 55%, #962FBF 80%, #4F5BD5 100%);
  --ek-grad-tiktok: linear-gradient(135deg, #25F4EE 0%, #111111 50%, #FE2C55 100%);
  --ek-grad-x: linear-gradient(135deg, #2B2B2B 0%, #000000 100%);
  --ek-grad-youtube: linear-gradient(135deg, #FF6A5B 0%, #E00024 100%);
  --ek-grad-facebook: linear-gradient(135deg, #3B8BFF 0%, #1060E8 100%);
  --ek-grad-twitch: linear-gradient(135deg, #A970FF 0%, #6441A5 100%);
  --ek-grad-kick: linear-gradient(135deg, #53FC18 0%, #2BB800 100%);
  --ek-grad-telegram: linear-gradient(135deg, #37AEE2 0%, #1E96C8 100%);
  --ek-grad-spotify: linear-gradient(135deg, #1ED760 0%, #14A44A 100%);
  --ek-grad-linkedin: linear-gradient(135deg, #0A8BD8 0%, #0A66C2 100%);
  --ek-grad-discord: linear-gradient(135deg, #7984F5 0%, #5865F2 100%);
  --ek-grad-threads: linear-gradient(135deg, #3A3A3A 0%, #000000 100%);
  --ek-grad-steam: linear-gradient(135deg, #1B2838 0%, #2A475E 100%);
  --ek-grad-pubg: linear-gradient(135deg, #F7B500 0%, #E28A00 100%);
  --ek-grad-valorant: linear-gradient(135deg, #FF4655 0%, #BD3944 100%);
  --ek-grad-microsoft: linear-gradient(135deg, #00A4EF 0%, #0067B8 100%);

  /* Tipografi */
  --ek-font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ek-display: 'Outfit', var(--ek-font);
  --ek-mono: 'Space Grotesk', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Yarıçap */
  --ek-r-xs: 8px;
  --ek-r-sm: 10px;
  --ek-r: 14px;
  --ek-r-md: 18px;
  --ek-r-lg: 22px;
  --ek-r-xl: 28px;
  --ek-r-2xl: 32px;

  /* Gölgeler */
  --ek-shadow-xs: 0 1px 2px rgba(11, 31, 77, .06);
  --ek-shadow-sm: 0 4px 14px rgba(11, 31, 77, .06);
  --ek-shadow: 0 10px 30px rgba(11, 31, 77, .08);
  --ek-shadow-lg: 0 24px 60px rgba(11, 31, 77, .16);
  --ek-shadow-blue: 0 12px 30px rgba(31, 91, 255, .22);
  --ek-shadow-orange: 0 10px 24px rgba(255, 122, 26, .30);
  --ek-ring: 0 0 0 4px rgba(31, 91, 255, .14);
  --ek-ring-danger: 0 0 0 4px rgba(240, 68, 56, .12);
  --ek-ring-success: 0 0 0 4px rgba(18, 183, 106, .12);

  /* Hareket */
  --ek-ease: cubic-bezier(.2, .7, .2, 1);
  --ek-fast: .18s;
  --ek-med: .28s;

  /* Ölçüler */
  --ek-header-h: 84px;
  --ek-sidebar-w: 272px;
  /* Boxed düzen: geniş ekranlarda site ortalanmış bir kutu içinde (dışı --ek-page-bg) */
  --ek-box-site: 1320px;
  --ek-box-panel: 1440px;
  --ek-box-admin: 1600px;
  --ek-page-bg: #E3E9F4;
  --ek-box-shadow: 0 1px 2px rgba(7, 19, 48, .06), 0 24px 60px -24px rgba(7, 19, 48, .22);

  /* Bootstrap eşlemeleri */
  --bs-primary: #1F5BFF;
  --bs-primary-rgb: 31, 91, 255;
  --bs-body-font-family: var(--ek-font);
  --bs-body-color: var(--ek-text);
  --bs-body-bg: var(--ek-bg);
  --bs-border-color: var(--ek-border);
  --bs-link-color: var(--ek-blue);
  --bs-link-color-rgb: 31, 91, 255;
  --bs-link-hover-color: var(--ek-blue-600);
  --bs-border-radius: var(--ek-r);
  --bs-border-radius-lg: var(--ek-r-lg);
  --bs-focus-ring-color: rgba(31, 91, 255, .25);
}

/* Karanlık tema — html[data-bs-theme="dark"] */
[data-bs-theme="dark"] {
  --ek-page-bg: #02060F;
  --ek-box-shadow: 0 0 0 1px rgba(255, 255, 255, .06), 0 24px 60px -24px rgba(0, 0, 0, .7);
  --ek-text: #EAF0FF;
  --ek-text-2: #A9B5D1;
  --ek-muted: #7181A6;
  --ek-bg: #060E24;
  --ek-card: #0E1A3A;
  --ek-subtle: #15265A;
  --ek-tint: #111F45;
  --ek-border: #1E2D57;
  --ek-border-strong: #2C3E70;
  --ek-shadow-sm: 0 4px 14px rgba(0, 0, 0, .25);
  --ek-shadow: 0 10px 30px rgba(0, 0, 0, .35);
  --ek-shadow-lg: 0 24px 60px rgba(0, 0, 0, .5);
  --bs-body-color: var(--ek-text);
  --bs-body-bg: var(--ek-bg);
  --bs-border-color: var(--ek-border);
}
