/* ============================================================
   EVA DE LA MER — TASARIM TOKEN'LARI (Design Tokens)
   ------------------------------------------------------------
   Sitedeki TÜM renk, tipografi, boşluk ve ölçü değerlerinin
   TEK kaynağıdır. Bileşenlerde sabit (hardcoded) değer YAZILMAZ;
   her zaman buradaki değişkenler kullanılır.

   Palet, markanın logosundan (antika altın) ve seramik
   parçaların sıcak / topraksı tonlarından türetilmiştir.
   Tema: "minimal galeri" — kırık beyaz zemin, bol boşluk,
   ince tipografi, antika altın vurgu.
   ============================================================ */

:root {
  /* --------------------------------------------------------
     RENK PALETİ
     -------------------------------------------------------- */

  /* Zeminler */
  /* DENEME: saf beyaz galeri zemini (eski: #faf8f3 kırık beyaz — beğenilmezse geri al) */
  --color-bg: #ffffff;            /* Ana zemin */
  --color-surface: #ffffff;       /* Kart / yükseltilmiş yüzey */
  --color-surface-sunken: #f2eee5;/* Görsel placeholder / oyuk alan */
  --color-overlay: rgba(255, 255, 255, 0.92); /* Görsel üstü rozet/araç örtüsü */
  --color-overlay-soft: rgba(255, 255, 255, 0.34); /* Fotoğraf üstü metin arkası hafif ışık (menü hero) */

  /* Metin */
  --color-text: #2a2622;          /* Ana metin — sıcak antrasit */
  --color-text-muted: #6e665b;    /* İkincil metin (kategori, açıklama) */
  --color-text-faint: #a39a8b;    /* En soluk (üst başlık / etiket) */

  /* Marka vurgusu — logodaki antika altın */
  --color-accent: #9f8a4e;
  --color-accent-deep: #7e6c3c;   /* Hover / koyu varyant */
  --color-accent-soft: #e9e1cc;   /* Çok açık altın tonu (zemin vurgusu) */

  /* Çizgiler / kenarlıklar */
  --color-line: #e6e0d4;          /* İnce ayraç çizgileri */
  --color-line-strong: #d8d0c0;

  /* Durum (ürün) */
  --color-sold: #8a8175;          /* "Satıldı" etiketi */

  /* Yönetim paneli (admin) — yalnızca /admin arayüzünde */
  --color-admin-bg: #f5f3ee;      /* Admin zemini */
  --color-danger: #a23b3b;        /* Hata/sil metni */
  --color-danger-strong: #8c2f2f; /* Hata metni (koyu) */
  --color-danger-bg: #fbeaea;     /* Hata uyarısı zemini */
  --color-ok: #3c6b34;            /* Başarı metni */
  --color-ok-bg: #e9f1e6;         /* Başarı uyarısı zemini */
  --color-tag-bg: #eee7d6;        /* Etiket zemini */
  --color-tag-sold-bg: #e6e1d8;   /* "Satıldı" etiketi zemini */

  /* --------------------------------------------------------
     TİPOGRAFİ
     -------------------------------------------------------- */

  /* Aileler */
  --font-display: "Cormorant Garamond", "Times New Roman", serif; /* Başlıklar */
  --font-body: "Jost", "Segoe UI", system-ui, sans-serif;         /* Gövde / arayüz */

  /* Akıcı (responsive) ölçek — clamp(min, tercih, maks) */
  --fs-overline: 0.78rem;                       /* Üst başlık / etiket */
  --fs-sm: 0.9rem;
  --fs-base: 1.05rem;                           /* Gövde metni */
  --fs-lg: 1.25rem;
  --fs-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --fs-2xl: clamp(2.2rem, 1.6rem + 2.6vw, 3.4rem);   /* Bölüm başlığı */
  --fs-3xl: clamp(3rem, 2rem + 4vw, 5rem);           /* Kahraman başlık */

  /* Satır yüksekliği */
  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-normal: 1.6;

  /* Harf aralığı */
  --ls-overline: 0.22em;   /* Geniş aralıklı küçük etiketler */
  --ls-wide: 0.04em;
  --ls-normal: 0;

  /* Ağırlıklar */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* --------------------------------------------------------
     BOŞLUK ÖLÇEĞİ (8px tabanlı)
     -------------------------------------------------------- */
  --space-1: 0.25rem;   /* 4 */
  --space-2: 0.5rem;    /* 8 */
  --space-3: 0.75rem;   /* 12 */
  --space-4: 1rem;      /* 16 */
  --space-5: 1.5rem;    /* 24 */
  --space-6: 2rem;      /* 32 */
  --space-8: 3rem;      /* 48 */
  --space-10: 4rem;     /* 64 */
  --space-12: 6rem;     /* 96 */
  --space-16: 8rem;     /* 128 */

  /* --------------------------------------------------------
     YERLEŞİM (Layout)
     -------------------------------------------------------- */
  --container-max: 1200px;     /* İçerik maksimum genişliği */
  --container-narrow: 720px;   /* Dar metin blokları (başlık girişi) */
  --container-pad: clamp(1.25rem, 5vw, 4rem); /* Yan iç boşluk */

  /* --------------------------------------------------------
     KÖŞE / GÖLGE / GEÇİŞ
     -------------------------------------------------------- */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;

  --shadow-sm: 0 1px 2px rgba(42, 38, 34, 0.04);
  --shadow-md: 0 8px 30px rgba(42, 38, 34, 0.08);

  --transition-fast: 160ms ease;
  --transition-base: 280ms cubic-bezier(0.4, 0, 0.2, 1);

  /* --------------------------------------------------------
     Z-DÜZEYLERİ
     -------------------------------------------------------- */
  --z-header: 100;
  --z-overlay: 200;
}