/* ============================================================
   tokens.css — Merkezi Tasarım Token'ları
   ────────────────────────────────────────────────────────────
   Güneş Restaurant — Sun Palette
   
   YAPILANDIRMA:
   - Tüm CSS değişkenleri (renk, tipografi, boşluk, köşe) burada.
   - Birincil prefix: --br-* (daha yaygın kullanım, 78+)
   - Geriye uyumluluk: --gr-* alias'ları korunur
   - Bu dosya header.php'de EN BAŞTA yüklenir.
   - Diğer CSS dosyalarındaki :root tanımları kademeli olarak
     buraya taşınacak (Adım 4).
============================================================ */

:root {
    /* ─────────────────────────────────────
       RENK — Zemin (warm dark, mavi-siyah değil)
       ───────────────────────────────────── */
    --br-bg-1: #1a1410;
    --br-bg-2: #261b13;
    --br-bg-3: #332417;
    --br-bg-elev: rgba(232, 199, 102, 0.06);

    /* ─────────────────────────────────────
       RENK — Krem (yazı katmanları)
       ───────────────────────────────────── */
    --br-cream: #fff4e6;
    --br-cream-soft:  rgba(255, 244, 230, 0.78);
    --br-cream-muted: rgba(255, 244, 230, 0.55);
    --br-cream-dim:   rgba(255, 244, 230, 0.32);

    /* ─────────────────────────────────────
       RENK — Altın (primary action)
       ───────────────────────────────────── */
    --br-gold:       #E8C766;
    --br-gold-light: #F2D58F;
    --br-gold-dark:  #C9A847;
    --br-gold-deep:  #8a6d2e;
    --br-gold-soft:  rgba(232, 199, 102, 0.12);
    --br-gold-line:  rgba(232, 199, 102, 0.22);
    --br-gold-glow:  rgba(232, 199, 102, 0.45);

    /* ─────────────────────────────────────
       RENK — Marka turuncu (Sun Palette primary)
       ───────────────────────────────────── */
    --br-orange:       #e67e22;
    --br-orange-dark:  #8a4b14;
    --br-orange-light: #f0b17a;
    --br-orange-soft:  rgba(230, 126, 34, 0.10);

    /* ─────────────────────────────────────
       RENK — Sarı/portakal (accent — eski --gr-accent)
       ───────────────────────────────────── */
    --br-accent:      #f9b423;
    --br-accent-dark: #d35400;

    /* ─────────────────────────────────────
       RENK — Kullanım yardımcıları
       ───────────────────────────────────── */
    --br-text-on-primary: #ffffff;

    /* ─────────────────────────────────────
       TİPOGRAFİ
       ───────────────────────────────────── */
    --br-font-serif: 'Playfair Display', 'EB Garamond', Georgia, 'Times New Roman', serif;
    --br-font-sans:  'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

    /* ─────────────────────────────────────
       BOŞLUK RİTMİ
       ───────────────────────────────────── */
    --br-space-xs: 4px;
    --br-space-sm: 8px;
    --br-space-md: 14px;
    --br-space-lg: 22px;
    --br-space-xl: 32px;

    /* ─────────────────────────────────────
       KÖŞE YUVARLATMA
       ───────────────────────────────────── */
    --br-radius-sm:   8px;
    --br-radius-md:   12px;
    --br-radius-lg:   18px;
    --br-radius-pill: 999px;

    /* ============================================================
       GERIYE UYUMLULUK — --gr-* alias'ları
       ────────────────────────────────────────────────────────────
       Eski --gr-* kullanımları çalışmaya devam eder.
       Yeni kod yazarken --br-* tercih edin.
       Bu alias'lar ileride (Adım 5+ sırasında) kademeli olarak
       view dosyalarından temizlenebilir.
    ============================================================ */
    --gr-primary:         var(--br-orange);
    --gr-primary-dark:    var(--br-orange-dark);
    --gr-primary-light:   var(--br-orange-light);
    --gr-accent:          var(--br-accent);
    --gr-accent-dark:     var(--br-accent-dark);
    --gr-cream:           var(--br-cream);
    --gr-cream-muted:     var(--br-cream-muted);
    --gr-cream-dim:       var(--br-cream-dim);
    --gr-bg-1:            var(--br-bg-1);
    --gr-bg-2:            var(--br-bg-2);
    --gr-bg-3:            var(--br-bg-3);
    --gr-text-on-primary: var(--br-text-on-primary);
}