/*
 * DEVNANOTEK CAR-TOOL — Tasarım Jetonları (design tokens)
 * Ürünün TEK renk/ölçü kaynağı. Başka hiçbir dosyada ham hex yazılmaz — daima var(--...).
 *
 * TASARIM DİLİ: "teşhis cihazı" — koyu grafit gövde, soğuk teknik vurgu, ölçüm
 * aleti yoğunluğu. Yuvarlak/parlak SaaS estetiği yerine dik köşeli, kılavuz
 * çizgili, veri önde bir dil kurar.
 *
 * 🔴 RENK SEMANTİĞİ (bozma): ye-şil/amber/kırmızı YALNIZ arıza durumu içindir.
 *    Otomotivde amber = uyarı lambası. Marka vurgusu olarak kullanılırsa durum
 *    renkleri sinyal olmaktan çıkar. Vurgu/dekorasyon = --accent (soğuk mavi).
 *
 * 🔴 ALTIN yalnızca DEVNANOTEK LOGOSUNUN "DEV" hecesidir (--brand-gold).
 *    Başka hiçbir yerde kullanılmaz; sayfadaki tek altın o olduğu için imza gibi okunur.
 *
 * Tüm kontrast oranları hesapla doğrulandı (WCAG 2.1 AA) — bkz. docs/MARKA.md §3.
 * @author DEVNANOTEK
 */

:root {
  /* ── Gövde yüzeyleri (koyu tema = kurumsal varsayılan) ──────────────── */
  --bg: #0E1116;                /* Sayfa zemini — grafit */
  --bg-elevated: #141922;       /* Panel/başlık bandı */
  --surface: #1A212C;           /* Kart yüzeyi */
  --surface-2: #222B38;         /* Hover / ikincil yüzey */
  --line: #262F3D;              /* Kılcal ayraç */
  --line-strong: #35404F;       /* Vurgulu kenarlık / kontrol çerçevesi */

  /* ── Metin ─────────────────────────────────────────────────────────── */
  --text: #E9EEF5;              /* 16.22:1 ✓ AAA */
  --text-muted: #97A4B6;        /*  7.48:1 ✓ AAA */
  /* --text-dim küçük metinde de kullanılır (ölçüm etiketi, tablo başlığı, alt yazı)
   * → EN AÇIK zemine (--surface) karşı bile ≥4.5:1 olmalı: 5.82 / 5.43 / 4.98 ✓ AA */
  --text-dim: #8290A3;

  /* ── Vurgu: soğuk teknik mavi (marka değil, ARAYÜZ vurgusu) ────────── */
  --accent: #38BDF8;            /*  8.83:1 ✓ AAA — bağlantı, vurgu metni, ikon */
  --accent-hover: #7DD3FC;
  --accent-fill: #0EA5E9;       /* Dolgu buton zemini */
  --accent-ink: #04141F;        /*  6.74:1 ✓ AA — dolgu üzerine metin */
  --accent-soft: rgba(56, 189, 248, .14);  /* Etiket zemini — metinle 5.77:1 ✓ AA */
  --accent-line: rgba(56, 189, 248, .32);  /* Vurgulu panel kenarlığı */

  /* ── Durum renkleri — YALNIZ arıza/sonuç bildirimi ──────────────────── */
  --ok: #3FD68A;                /* 10.08:1 ✓ AAA */
  --warn: #F5B942;              /* 10.72:1 ✓ AAA */
  --err: #FF7A70;               /*  7.45:1 ✓ AAA */
  --ok-soft: rgba(63, 214, 138, .14);   /* metinle 6.50:1 ✓ AA */
  --warn-soft: rgba(245, 185, 66, .14); /* metinle 6.83:1 ✓ AA */
  --err-soft: rgba(255, 122, 112, .14); /* metinle 5.14:1 ✓ AA */

  /* ── Marka altını — SADECE logo "DEV" hecesi ────────────────────────── */
  --brand-gold: #FAA41A;        /* 9.36:1 ✓ (logo büyük metin) */
  --brand-gold-hover: #FFBE55;

  /* ── Tipografi ─────────────────────────────────────────────────────── */
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Bebas Neue", var(--font-body);   /* YALNIZ logo — bkz. MARKA.md §4 */
  --font-mono: ui-monospace, "Cascadia Mono", "SF Mono", "Segoe UI Mono", Consolas, monospace;

  /* Akışkan ölçek — sabit px genişlik yok */
  --fs-xs: .75rem;                          /* 12px — etiket/rozet */
  --fs-sm: .875rem;                         /* 14px */
  --fs-base: 1rem;
  --fs-lg: clamp(1.0625rem, .35vw + 1rem, 1.1875rem);
  --fs-xl: clamp(1.1875rem, .7vw + 1rem, 1.4375rem);
  --fs-2xl: clamp(1.375rem, 1.4vw + 1rem, 1.875rem);
  --fs-3xl: clamp(1.75rem, 2.4vw + 1rem, 2.5rem);
  --fs-hero: clamp(2rem, 3.6vw + 1rem, 3.25rem);
  --lh-tight: 1.18;
  --lh-normal: 1.6;

  /* Ölçüm aleti yazısı — kılavuz etiketleri ve sayısal değerler */
  --track-label: .14em;         /* Etiket harf aralığı (VERSAL) */

  /* ── Boşluk ölçeği ──────────────────────────────────────────────────── */
  --sp-1: 4px;  --sp-2: 8px;   --sp-3: 16px;  --sp-4: 24px;
  --sp-5: 40px; --sp-6: 64px;  --sp-7: 96px;

  /* ── Biçim: cihaz gövdesi gibi DİK köşeli, yumuşatılmış ─────────────── */
  --radius: 10px;               /* Panel/kart */
  --radius-sm: 6px;             /* Kontrol (buton, giriş alanı) */
  --radius-pill: 999px;         /* YALNIZ rozet ve durum noktası */
  --shadow: 0 24px 48px -28px rgba(0, 0, 0, .85);
  --shadow-sm: 0 8px 20px -14px rgba(0, 0, 0, .7);

  /* Kılavuz çizgisi dokusu — hero zemininde ölçüm ızgarası hissi */
  --grid-line: rgba(255, 255, 255, .028);
  --grid-size: 32px;

  /* ── Yerleşim ───────────────────────────────────────────────────────── */
  --container: 1200px;
  --container-narrow: 780px;
  --header-h: 64px;

  /* ── Hareket (prefers-reduced-motion ile sıfırlanır) ────────────────── */
  --t-fast: .14s ease;
  --t-base: .22s ease;
}

/*
 * Açık tema — işletim sistemi tercihi.
 * Cihaz metaforu korunur: koyu gövde yerine "beyaz laboratuvar paneli".
 * Vurgu ve durum renkleri açık zeminde AA sağlamak için koyulaştırılır —
 * bu bir tutarsızlık DEĞİL, kontrast gereğidir (MARKA.md §3).
 */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg: #F2F5F9;
    --bg-elevated: #FFFFFF;
    --surface: #FFFFFF;
    --surface-2: #E9EEF5;
    --line: #D7DEE8;
    --line-strong: #B9C4D2;

    --text: #0F1620;            /* 16.61:1 ✓ AAA */
    --text-muted: #4C5A6B;      /*  6.44:1 ✓ AAA */
    --text-dim: #5C6979;        /*  5.12 / 5.60 / 4.80 (bg · elevated · surface-2) ✓ AA */

    --accent: #0369A1;          /*  5.43:1 ✓ AA */
    --accent-hover: #075E8D;
    --accent-fill: #0369A1;     /* beyaz metinle 5.93:1 ✓ AA */
    --accent-ink: #FFFFFF;
    --accent-soft: rgba(3, 105, 161, .12);  /* metinle 4.98:1 ✓ AA */
    --accent-line: rgba(3, 105, 161, .30);

    --ok: #136B34;              /*  6.04:1 ✓ AA (etiket zemininde 5.51:1 ✓) */
    --warn: #92610A;            /*  4.88:1 ✓ AA (etiket zemininde 4.54:1 ✓) */
    --err: #C0322B;             /*  5.15:1 ✓ AA (etiket zemininde 4.67:1 ✓) */
    --ok-soft: rgba(19, 107, 52, .12);
    --warn-soft: rgba(146, 97, 10, .12);
    --err-soft: rgba(192, 50, 43, .12);

    --brand-gold: #A66D09;      /*  3.99:1 ✓ (logo büyük metin ≥ 3:1) */
    --brand-gold-hover: #8A5A05;

    --shadow: 0 24px 48px -32px rgba(15, 22, 32, .30);
    --shadow-sm: 0 8px 20px -16px rgba(15, 22, 32, .22);
    --grid-line: rgba(15, 22, 32, .035);
  }
}

/* Kullanıcı açıkça koyu tema seçtiyse (ileride tema düğmesi eklenirse) */
:root[data-theme="dark"] { color-scheme: dark; }
:root { color-scheme: dark light; }