/* ==========================================================================
   ANTAGRIOIN — tasarım belirteçleri
   Tek kaynak. Renk, tipografi, aralık ve hareket burada tanımlanır;
   başka hiçbir dosyada ham değer (hex, px) kullanılmaz.
   ========================================================================== */

:root {
  /* --- Tipografi aileleri ------------------------------------------------ */
  --font-display: 'Bricolage Grotesque', 'IBM Plex Sans', system-ui, sans-serif;
  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* --- Tipografi ölçeği --------------------------------------------------
     Akışkan: küçük ekranda min, geniş ekranda max değere oturur.          */
  --t-xs:    0.75rem;                              /* 12px — etiket, meta  */
  --t-sm:    0.8125rem;                            /* 13px — mono veri     */
  --t-base:  1rem;                                 /* 16px — gövde         */
  --t-md:    clamp(1.0625rem, 0.4vw + 0.95rem, 1.1875rem);
  --t-lg:    clamp(1.25rem,  0.8vw + 1.05rem, 1.5rem);
  --t-xl:    clamp(1.625rem, 1.6vw + 1.2rem,  2.25rem);
  --t-2xl:   clamp(2.125rem, 3.2vw + 1.3rem,  3.5rem);
  --t-3xl:   clamp(2.75rem,  6vw + 1rem,      6rem);
  --t-4xl:   clamp(3.25rem,  9vw + 0.5rem,    9rem);

  --lh-tight: 0.94;
  --lh-snug:  1.15;
  --lh-body:  1.6;
  --lh-loose: 1.75;

  --tr-tight: -0.035em;   /* büyük başlıklarda sıkı harf aralığı */
  --tr-snug:  -0.018em;
  --tr-wide:   0.14em;    /* mono etiketlerde geniş */

  /* --- Aralık ------------------------------------------------------------ */
  --s-1:  0.25rem;
  --s-2:  0.5rem;
  --s-3:  0.75rem;
  --s-4:  1rem;
  --s-5:  1.5rem;
  --s-6:  2rem;
  --s-7:  3rem;
  --s-8:  4rem;
  --s-9:  6rem;
  --s-10: 8rem;
  --s-11: 12rem;

  /* Bölüm arası dikey ritim — ekranla birlikte büyür */
  --section-y: clamp(4.5rem, 9vw, 9rem);

  /* --- Ölçü / kap -------------------------------------------------------- */
  --page-max: 82.5rem;    /* 1320px */
  --prose-max: 38rem;     /* okunabilir satır uzunluğu */
  --gutter: clamp(1.25rem, 4vw, 3.5rem);

  /* --- Kenar yarıçapı ---------------------------------------------------- */
  --r-sm: 3px;
  --r-md: 6px;
  --r-lg: 12px;
  --r-pill: 999px;

  /* --- Hareket ----------------------------------------------------------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur: 260ms;
  --dur-slow: 620ms;

  /* --- Katman ------------------------------------------------------------ */
  --z-base: 1;
  --z-sticky: 50;
  --z-nav: 100;
  --z-overlay: 200;
}

/* ==========================================================================
   Tema: koyu (varsayılan)
   Gece vardiyasındaki bir operatör konsolu — mürekkep zemin, tek sinyal rengi.
   ========================================================================== */
:root,
:root[data-theme='dark'] {
  color-scheme: dark;

  --bg:        #0d1012;
  --bg-panel:  #12171a;
  --bg-raised: #181e22;
  --bg-inset:  #0a0d0f;

  --line:        rgba(233, 238, 241, 0.10);
  --line-strong: rgba(233, 238, 241, 0.20);

  --fg:       #e9eef1;
  --fg-muted: #9ba5ad;
  --fg-faint: #69737b;

  /* Tek baskın vurgu. "Canlı" durumunun rengi — cimri kullanılır. */
  --signal:      #b9f227;
  --signal-ink:  #0d1012;   /* sinyal üstünde okunacak metin */
  --signal-dim:  rgba(185, 242, 39, 0.13);
  --signal-line: rgba(185, 242, 39, 0.34);

  /* İkincil vurgu — yalnızca insan/sıcak bölümlerde (müşteri işi, iletişim) */
  --warm:      #ff8a4c;
  --warm-dim:  rgba(255, 138, 76, 0.13);

  --shadow-panel: 0 1px 0 rgba(255, 255, 255, 0.03),
                  0 12px 32px -12px rgba(0, 0, 0, 0.7);
  --shadow-lift:  0 2px 0 rgba(255, 255, 255, 0.04),
                  0 28px 60px -20px rgba(0, 0, 0, 0.85);

  /* Zemin dokusu yoğunluğu */
  --grain-opacity: 0.045;
  --glow-opacity: 0.5;
}

/* ==========================================================================
   Tema: açık
   Aynı iskelet, kağıt yüzey. Sinyal rengi kontrast için koyulaşır.
   ========================================================================== */
:root[data-theme='light'] {
  color-scheme: light;

  --bg:        #f2f0ea;
  --bg-panel:  #fbfaf7;
  --bg-raised: #ffffff;
  --bg-inset:  #e8e5dd;

  --line:        rgba(13, 16, 18, 0.13);
  --line-strong: rgba(13, 16, 18, 0.26);

  --fg:       #14181b;
  --fg-muted: #4f585f;
  --fg-faint: #7a838a;

  --signal:      #3f6b00;
  --signal-ink:  #ffffff;
  --signal-dim:  rgba(63, 107, 0, 0.10);
  --signal-line: rgba(63, 107, 0, 0.30);

  --warm:      #b8410d;
  --warm-dim:  rgba(184, 65, 13, 0.10);

  --shadow-panel: 0 1px 2px rgba(13, 16, 18, 0.05),
                  0 8px 24px -14px rgba(13, 16, 18, 0.22);
  --shadow-lift:  0 2px 4px rgba(13, 16, 18, 0.06),
                  0 24px 50px -22px rgba(13, 16, 18, 0.30);

  --grain-opacity: 0.03;
  --glow-opacity: 0.22;
}

/* Kullanıcı sistem tercihini açık yapmışsa ve sitede seçim kaydedilmemişse,
   açık temaya düş. data-theme her zaman kazanır (main.js kök öğeye yazar). */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;

    --bg:        #f2f0ea;
    --bg-panel:  #fbfaf7;
    --bg-raised: #ffffff;
    --bg-inset:  #e8e5dd;

    --line:        rgba(13, 16, 18, 0.13);
    --line-strong: rgba(13, 16, 18, 0.26);

    --fg:       #14181b;
    --fg-muted: #4f585f;
    --fg-faint: #7a838a;

    --signal:      #3f6b00;
    --signal-ink:  #ffffff;
    --signal-dim:  rgba(63, 107, 0, 0.10);
    --signal-line: rgba(63, 107, 0, 0.30);

    --warm:      #b8410d;
    --warm-dim:  rgba(184, 65, 13, 0.10);

    --shadow-panel: 0 1px 2px rgba(13, 16, 18, 0.05),
                    0 8px 24px -14px rgba(13, 16, 18, 0.22);
    --shadow-lift:  0 2px 4px rgba(13, 16, 18, 0.06),
                    0 24px 50px -22px rgba(13, 16, 18, 0.30);

    --grain-opacity: 0.03;
    --glow-opacity: 0.22;
  }
}