/* ============================================================
   tokens.css — Tasarım değişkenleri (tek kaynak)
   Renk, tipografi, boşluk, köşe, gölge değerleri SADECE burada
   tanımlanır. Diğer dosyalar bu değişkenleri kullanır.
   ============================================================ */

:root {
    /* ============================================================
       TEMEL MARKA RENKLERİ — yalnızca bu ikisi elle belirlenir.
       Yönetim panelinden değiştirilebilir: _Layout, kayıtlı değerleri
       bu iki değişkene inline <style> ile yazar. Aşağıdaki tüm tonlar
       bunlardan türetildiği için tek renk değişince tema komple döner.
       ============================================================ */
    --od-primary: #FF9E20;
    --od-secondary: #215E61;

    /* ------------------------------------------------------------
       TÜRETİLMİŞ TONLAR
       Her tonda önce sabit yedek, ardından color-mix sürümü yazılır;
       color-mix desteklemeyen eski tarayıcılar ikinci satırı yok sayıp
       yedek değerde kalır.
       ------------------------------------------------------------ */

    /* ---------- Primary tonları ---------- */
    --od-primary-hover: #F08A08;
    --od-primary-hover: color-mix(in srgb, var(--od-primary) 88%, #000);

    --od-primary-active: #D97706;
    --od-primary-active: color-mix(in srgb, var(--od-primary) 78%, #000);

    --od-primary-light: #FFB558;
    --od-primary-light: color-mix(in srgb, var(--od-primary) 72%, #fff);

    --od-primary-100: #FFF4E4;
    --od-primary-100: color-mix(in srgb, var(--od-primary) 12%, #fff);

    --od-primary-200: #FFE3BD;
    --od-primary-200: color-mix(in srgb, var(--od-primary) 30%, #fff);

    --od-primary-soft: rgba(255, 158, 32, .14);
    --od-primary-soft: color-mix(in srgb, var(--od-primary) 14%, transparent);

    /* Ana renk zemini üzerindeki yazı rengi.
       Not: _Layout bu değeri panelden gelen renge göre hesaplayıp ezer
       (bkz. SiteSettings.OnPrimaryColor), böylece koyu bir marka renginde
       de okunur kalır. Buradaki değer yalnızca yedektir. */
    --od-on-primary: #2B1704;
    --od-on-primary: color-mix(in srgb, var(--od-primary) 18%, #000);

    /* ---------- Secondary tonları ---------- */
    --od-secondary-hover: #1A4B4E;
    --od-secondary-hover: color-mix(in srgb, var(--od-secondary) 82%, #000);

    --od-secondary-light: #2F8085;
    --od-secondary-light: color-mix(in srgb, var(--od-secondary) 82%, #fff);

    --od-secondary-deep: #143C3E;
    --od-secondary-deep: color-mix(in srgb, var(--od-secondary) 66%, #000);

    --od-secondary-darkest: #0C2729;
    --od-secondary-darkest: color-mix(in srgb, var(--od-secondary) 42%, #000);

    --od-secondary-100: #E8F1F1;
    --od-secondary-100: color-mix(in srgb, var(--od-secondary) 10%, #fff);

    --od-secondary-200: #C9E0E0;
    --od-secondary-200: color-mix(in srgb, var(--od-secondary) 25%, #fff);

    --od-secondary-soft: rgba(33, 94, 97, .10);
    --od-secondary-soft: color-mix(in srgb, var(--od-secondary) 10%, transparent);

    --od-on-secondary: #FFFFFF;

    /* ---------- Nötr / yüzey (marka renginden hafif tonlanır) ---------- */
    --od-ink: #0F2426;
    --od-ink: color-mix(in srgb, var(--od-secondary) 25%, #000);

    --od-text: #3F5354;
    --od-muted: #7A8D8E;

    --od-line: #E4EBEB;
    --od-line: color-mix(in srgb, var(--od-secondary) 8%, #fff);

    --od-line-strong: #CFDCDC;
    --od-line-strong: color-mix(in srgb, var(--od-secondary) 18%, #fff);

    --od-surface: #FFFFFF;

    --od-surface-2: #F4F8F8;
    --od-surface-2: color-mix(in srgb, var(--od-secondary) 4%, #fff);

    --od-bg: #F7FAFA;
    --od-bg: color-mix(in srgb, var(--od-secondary) 3%, #fff);

    /* Koyu zeminlerde kullanılan nötrler */
    --od-dark-text: #C4D6D7;
    --od-dark-text: color-mix(in srgb, var(--od-secondary) 25%, #fff);

    --od-dark-muted: #8FA9AA;
    --od-dark-muted: color-mix(in srgb, var(--od-secondary) 45%, #fff);

    --od-dark-line: rgba(255, 255, 255, .12);

    /* ---------- Durum renkleri ---------- */
    --od-success: #1E9E6A;
    --od-warning: #E8A317;
    --od-danger: #DC3F3F;
    --od-star: #FFB020;

    /* ---------- Tipografi ---------- */
    --od-font: 'Arimo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

    --od-fs-xs: .75rem;
    --od-fs-sm: .875rem;
    --od-fs-base: 1rem;
    --od-fs-lg: 1.125rem;
    --od-fs-xl: 1.375rem;

    /* Akışkan başlık ölçeği */
    --od-fs-h1: clamp(2.1rem, 1.35rem + 3.2vw, 3.5rem);
    --od-fs-h2: clamp(1.6rem, 1.2rem + 1.7vw, 2.35rem);
    --od-fs-h3: clamp(1.15rem, 1rem + .5vw, 1.4rem);

    --od-lh-tight: 1.15;
    --od-lh: 1.6;

    /* ---------- Köşe yarıçapı ---------- */
    --od-r-xs: .375rem;
    --od-r-sm: .5rem;
    --od-r: .75rem;
    --od-r-md: 1rem;
    --od-r-lg: 1.25rem;
    --od-r-xl: 1.75rem;
    --od-r-pill: 999px;

    /* ---------- Gölgeler ---------- */
    --od-shadow-xs: 0 1px 2px rgba(15, 36, 38, .06);
    --od-shadow-sm: 0 .25rem .75rem rgba(15, 36, 38, .06);
    --od-shadow: 0 .75rem 1.75rem rgba(15, 36, 38, .08);
    --od-shadow-lg: 0 1.5rem 3rem rgba(15, 36, 38, .12);
    /* Marka rengiyle birlikte değişir (yedek: turuncu) */
    --od-shadow-primary: 0 .75rem 1.5rem rgba(255, 158, 32, .32);
    --od-shadow-primary: 0 .75rem 1.5rem color-mix(in srgb, var(--od-primary) 32%, transparent);

    /* ---------- Ölçü / boşluk ---------- */
    --od-container: 1200px;
    --od-gutter: 1.25rem;
    --od-section-y: clamp(3rem, 6vw, 5.5rem);

    /* ---------- Geçişler ---------- */
    --od-t-fast: .15s ease;
    --od-t: .25s ease;

    /* ---------- Katmanlar ---------- */
    --od-z-header: 1020;
    --od-z-bottom-nav: 1030;

    /* ---------- Geriye dönük uyum ----------
       Eski sayfalar (about.css, contact.css, evaluate.css, legacy.css)
       bu iki değişkeni kullanıyor. Yeniden tasarlandıkça kaldırılacak. */
    --primary-color: var(--od-primary);
    --secondary-color: var(--od-secondary);
}