/* =================================================================
   TRENDMETRIK — GLOBAL SPACING SSOT (tm-spacing)
   -----------------------------------------------------------------
   FAZ-0 altyapı katmanı. ADDITIVE — hiçbir mevcut sayfayı DEĞİŞTİRMEZ.
   Amaç: "tüm sayfalarda container'lar arası farklı boşluk/padding var"
   sorununu tek bir kanonik boşluk ölçeği + semantik alias seti ile
   çözmek. Bu dosya YENİ px/rem üretmez; zaten var olan iki paralel
   ölçeği (v2/tokens.css `--tm-space-*` ve design-system.css `--space-*`)
   TEK KANONİK KAYNAK altında toplar ve eksik semantik alias'ları ekler.
   FAZ-1'de sayfa-özel hardcoded değerler bu token'lara migrate edilecek
   (bkz. docs/global-spacing.md).

   ┌── YÜKLEME SIRASI ──────────────────────────────────────────────┐
   │ base.html'de v2 bundle'ından (v2/v2.css → tokens.css) SONRA,     │
   │ tm-page-shell.css'ten ÖNCE yüklenir. Böylece:                    │
   │  - --tm-space-* ve --tm-page-padding-x/--tm-section-card-gap...  │
   │    (v2/tokens.css) TANIMLIDIR → alias'lar onlara bağlanır.       │
   │  - Yeni semantik alias'lar (--tm-page-gap, --tm-card-pad ...)    │
   │    page-shell / empty-state / FAZ-1 sayfaları tarafından         │
   │    kullanılabilir.                                                │
   └────────────────────────────────────────────────────────────────┘

   KURAL (FAZ-1): sayfa CSS/şablonlarında `padding: 16px` / `gap: 20px`
   gibi sabit değer YAZMA → semantik alias veya ölçek token'ı kullan:
     padding: var(--tm-card-pad);      /* yerine: padding: 20px */
     gap:     var(--tm-section-gap);   /* yerine: gap: 20px      */
     gap:     var(--tm-space-4);       /* yerine: gap: 16px      */

   Dark/Light: boşluk tema-bağımsızdır → tema değişkeni YOK.
   ================================================================= */

:root {
  /* =============================================================
     1) KANONİK BOŞLUK ÖLÇEĞİ (8px-uyumlu 4px-grid) — SSOT
     -------------------------------------------------------------
     v2/tokens.css içindeki --tm-space-* ölçeği KANONİK ilan edilir.
     Değerler oradaki tanımla BYTE-BYTE aynıdır; burada yeniden
     TANIMLANMAZ (tek gerçek kaynak = v2/tokens.css). Referans için
     ölçek özeti (yalnız yorum):

       --tm-space-0  = 0
       --tm-space-1  = 0.25rem  (4px)
       --tm-space-2  = 0.5rem   (8px)
       --tm-space-3  = 0.75rem  (12px)
       --tm-space-4  = 1rem     (16px)
       --tm-space-5  = 1.25rem  (20px)
       --tm-space-6  = 1.5rem   (24px)
       --tm-space-8  = 2rem     (32px)
       --tm-space-10 = 2.5rem   (40px)
       --tm-space-12 = 3rem     (48px)
       --tm-space-16 = 4rem     (64px)
       --tm-space-20 = 5rem     (80px)
       --tm-space-24 = 6rem     (96px)

     Not: design-system.css ayrıca aynı değerlerle bir --space-*
     ölçeği tanımlar. İkisi de aynı 4px-grid → çakışma YOK. FAZ-1'de
     yeni kod --tm-space-* kullanmalı; --space-* geriye-uyum içindir.
     ============================================================= */

  /* =============================================================
     2) SEMANTİK ALIAS'LAR (container boşluk sözleşmesi)
     -------------------------------------------------------------
     Kullanıcı "global bir boşluk miktarı olmalı" dedi. Aşağıdaki
     semantik isimler, sayfa/section/kart bağlamında HANGİ ölçek
     adımının kullanılacağını TEK yerde sabitler. Var olan v2/tokens
     semantik token'larına (--tm-page-padding-x, --tm-section-card-gap
     vb.) bağlanır → tek gerçek kaynak korunur, yeni paralel sistem
     AÇILMAZ. Fallback literal'ler yalnız izole fixture (tokens.css
     yüklü değil) senaryosu içindir.
     ============================================================= */

  /* --- Sayfa kabuğu (page shell) --- */
  /* Sayfa yatay iç boşluğu (gutter). Mevcut --tm-page-padding-x = 24px */
  --tm-page-pad-x: var(--tm-page-padding-x, 1.5rem);
  /* Sayfa dikey iç boşluğu. Mevcut --tm-page-padding-y = 20px */
  --tm-page-pad-y: var(--tm-page-padding-y, 1.25rem);
  /* Sayfa içi bölümler arası dikey ritim (page-level stack gap). 20px */
  --tm-page-gap:   var(--tm-section-card-gap, var(--tm-section-gap, 1.25rem));

  /* --- Bölüm (section) --- */
  /* Section-card iç padding'i (kart tüm-kenar). 20px */
  --tm-section-pad: var(--tm-section-padding, 1.25rem);
  /* NOT: --tm-section-gap ve --tm-card-gap v2/tokens.css'te ZATEN tanımlı
     (20px / 16px). Burada yeniden tanımlanmaz → tek kaynak korunur;
     FAZ-1'de doğrudan var(--tm-section-gap) / var(--tm-card-gap) kullan. */

  /* --- Kart (card) --- */
  /* Kart iç padding'i (comfortable). 20px */
  --tm-card-pad:  var(--tm-section-padding, 1.25rem);
  /* Kart iç sıkı padding (dense/compact kart). 16px */
  --tm-card-pad-sm: var(--tm-space-4, 1rem);
  /* NOT: --tm-card-inner-gap (12px) ve --tm-card-item-gap (16px)
     v2/tokens.css'te ZATEN tanımlı → kart içi öğe yığını için onları
     kullan; burada tekrar üretilmez. */

  /* --- Form / kontrol --- */
  /* Form alanları arası dikey boşluk. 16px */
  --tm-form-gap:    var(--tm-space-4, 1rem);
  /* Yan-yana buton/kontrol arası boşluk. 8px */
  --tm-control-gap: var(--tm-space-2, 0.5rem);
}
