/*
 * QR Menü · TASARIM TOKEN'LARI — TEMEL TEMA
 *
 * Renk, tipografi, boşluk ölçeği, köşe yarıçapı, gölge ve hareket süreleri
 * burada tanımlı; hem misafir menüsü hem yönetim paneli buradan besleniyor.
 *
 * Bu dosya "Klasik — Kahve" temasıdır (Halil İbrahim Sofrası için üretildi) ve
 * aynı zamanda tüm varyasyonların tabanıdır. YENİ BİR MÜŞTERİ İÇİN BURAYI
 * DEĞİŞTİRMEYİN: themes/<slug>.css açıp yalnızca farklı olan token'ları ezin,
 * sonra panelden Restoran bilgileri → Görünüm'den seçin. Böylece ortak
 * düzeltmeler tek dosyada kalır. Ayrıntı: app/lib/Theme.php
 */

/*
 * Design tokens — the "Classical" system with the palette pulled onto the
 * logo's brown. Values are transcribed from README.md § Design Tokens.
 *
 * Colour is applied as stroke — borders, rules, underlines — never as a large
 * fill. There are no filled accent surfaces and no grey text on coloured ground.
 */

:root {
  /* Ground and ink */
  --color-bg: #fafafa;
  --color-surface: #fafafa;
  /* Ana metin rengi. Zeminle karşıtlığı 12:1 — WCAG AAA eşiğinin (7:1) bile
     üzerinde, loş restoran ışığında rahat okunur. */
  --color-text: #502a0b;

  /* Marka kahvesi. Metin ve çerçevede de kullanılıyor; zeminle 12:1. */
  --color-accent: #502a0b;
  /* Accent-coloured *text* uses this darker step. */
  --color-accent-700: #502a0b;

  /* Alfa, eski gri hairline ile aynı görsel ağırlığı versin diye seçildi:
     daha açık zemin üzerinde daha yüksek opaklık gerekiyor. */
  --color-divider: rgba(124, 87, 57, 0.26);

  --color-neutral-100: #f8f4f4;
  --color-neutral-200: #eae7e7;
  --color-neutral-300: #d7d3d3;
  /* 400–800 arası, sıcak zemin üzerinde görünen tonlar: gri ramp %22 oranında
     kahverengiye kaydırıldı. Brief "renkli zemin üzerinde gri metin yok"
     diyor; zemin ısındıkça saf gri ölü duruyor. 100–300 panel yüzeyleri
     olduğu için nötr bırakıldı. */
  --color-neutral-400: #aca19a;
  --color-neutral-500: #948982;
  /* DİKKAT — bu ton yarı saydam (%48). Zemine karıştığında karşıtlığı 2,1:1
     kalıyor, WCAG AA eşiğinin (4,5:1) epey altında. Pasif kategori sekmesi,
     gramaj ve ikincil satırlar bu tonda; loş ışıkta zor okunur. Okunurluk
     gerekiyorsa #7a5637 (saydamsız, 4,9:1) yeter. Renk müşteri tercihidir. */
  --color-neutral-600: #7a56377a;
  --color-neutral-700: #502a0b;
  --color-neutral-800: #502a0b;
  --color-neutral-900: #502a0b;

  /* Accent ramp — tints and pressed states */
  --color-accent-100: #fff3e4;
  --color-accent-200: #ffe3bf;
  --color-accent-300: #facb8d;
  --color-accent-400: #e1ad66;
  --color-accent-500: #c28d41;
  --color-accent-600: #a06f24;
  --color-accent-800: #5a3b0a;
  --color-accent-900: #3a270d;

  /* The dim behind sheets and panels */
  --dim-panel: rgba(45, 43, 43, 0.42);
  --dim-sheet: rgba(45, 43, 43, 0.46);

  /* Typography — set by next/font in app/fonts.ts */
  --font-heading: "Instrument Serif", "Instrument Serif Fallback", Georgia, serif;
  --font-body: Newsreader, "Newsreader Fallback", Georgia, serif;
  --font-arabic: Amiri, "Amiri Fallback", "Segoe UI", serif;

  /* Ana başlıkların kontur kalınlığı. Instrument Serif'in bold'u olmadığı için
     ağırlık böyle veriliyor; 0 yapmak özgün inceliğe döner. */
  --heading-stroke: 0.4px;

  /* Spacing scale */
  --space-1: 4.6px;
  --space-2: 9.2px;
  --space-3: 13.8px;
  --space-4: 18.4px;
  --space-5: 27.6px;
  --space-6: 36.8px;
  --gutter: 18px;

  /* Fotoğrafsız ürünün taramalı kutusu — zeminle aynı aileden. */
  --color-hatch-a: #ecdcc8;
  --color-hatch-b: #e4d2bc;

  --radius-sm: 6px;
  --radius-md: 4px;
  --radius-lg: 7px;

  --shadow-sm: 0 1px 2px rgba(45, 43, 43, 0.14);
  --shadow-md: 0 3px 10px rgba(45, 43, 43, 0.16);
  --shadow-lg: 0 12px 32px rgba(45, 43, 43, 0.22);

  /* Motion budget: under 300ms, ease-out in / ease-in out, no bounce. */
  --motion-fast: 200ms;
  --motion-base: 250ms;
  --motion-slow: 300ms;
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0.06, 0.68, 0.19);

  /* Height of the sticky category bar; scroll offsets are derived from it. */
  --category-bar-height: 47px;
}

/* Arabic and Persian need more line-height than Latin at the same optical size. */
[dir="rtl"] {
  --font-heading: Amiri, "Amiri Fallback", "Segoe UI", serif;
  --font-body: Amiri, "Amiri Fallback", "Segoe UI", serif;
}


