/* =========================================================================
   teknikbakis.com — Tasarım Sistemi  v3
   Ekol: Kitaplık (araç-önce arşiv)
   İskelet: üst şerit + arama │ giriş │ sol konu listesi + kart ızgarası
   İmza hamle: sol konu listesi + canlı filtre — sayfa açılışta çalışan bir araçtır
   Varsayılan tema: AÇIK. Koyu tema tam karşılığıyla mevcut.
   Kural: bileşende çıplak hex/px YOK.
   (v1 Vaka Dosyası / v2 Nöbet Panosu arşivi: assets/css/*.bak-*)
   ========================================================================= */

:root {
  color-scheme: light dark;

  /* ---- Renk: Kitaplık (varsayılan açık) --------------------------------
     Nötrler sıcağa kaydırılmış kâğıt; kart saf beyazla ayrışır.          */
  --c-bg:      #F4F2ED;  /* Kâğıt     · oklch(96%  .005  90) sayfa zemini */
  --c-card:    #FFFFFF;  /* Kart      · içerik yüzeyi                     */
  --c-sunk:    #FAF9F6;  /* Kart-alt  · kart ayak zemini                  */
  --c-ink:     #16191C;  /* Mürekkep  · oklch(22%  .008 240) ana metin    */
  --c-body:    #4A5157;  /* Gövde     · kart metni                        */
  --c-soft:    #6E757C;  /* Soluk     · oklch(55%  .012 240) ikincil      */
  --c-line:    #DDD9D1;  /* Çizgi     · oklch(88%  .008  90) kenarlık     */

  --c-accent:  #1D4E89;  /* Mürekkep mavisi · oklch(40% .12 250) etiket   */
  --c-accent-wash: #E8EEF6;
  --c-ok:      #1F6B4A;  /* Onay      · oklch(46%  .09  155) çözüldü      */
  --c-ok-wash: #E6F1EB;
  --c-warm:    #C2410C;  /* Kayıt no  · oklch(53%  .17   40) İMZA aksanı  */
  --c-warm-wash: #FBEDE6;

  /* Önem dereceleri — zafiyet analizi kayıtları için (CVSS rozetleri, uyarı kutuları) */
  --c-crit:      #B3261E;  /* Kritik · oklch(48% .18  28) */
  --c-crit-wash: #FBE9E7;
  --c-high:      #A85309;  /* Yüksek · oklch(53% .14  55) */
  --c-high-wash: #FBEFE3;
  --c-low:       #3F6B8A;  /* Düşük  · oklch(50% .07 240) */
  --c-low-wash:  #E9F0F5;
  --c-on-severity: #FFFFFF;  /* dolu rozet üstündeki metin */

  --c-focus: var(--c-accent);

  /* ---- Tipografi -------------------------------------------------------
     Gövde 1.2 sıkı · Başlık 1.414 sıçrama.                              */
  --font-display: "Bricolage Grotesque", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Newsreader", Charter, Georgia, "Times New Roman", serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  --type-3xs:  0.6875rem;
  --type-2xs:  0.7378rem;
  --type-xs:   0.8854rem;
  --type-sm:   0.9375rem;
  --type-base: 1.0625rem;
  --type-md:   1.3125rem;
  --type-lg:   1.53rem;
  --type-xl:   2.163rem;
  --type-2xl:  3.059rem;

  --leading-tight: 1.12;
  --leading-snug:  1.28;
  --leading-body:  1.62;
  --tracking-label: 0.14em;

  --measure-width: 68ch;

  /* ---- Boşluk: 4px tabanlı ritim --------------------------------------- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  2rem;
  --space-7:  2.75rem;
  --space-8:  4rem;
  --space-9:  6rem;

  /* ---- Radius: sistem kararı, tek sayı değil --------------------------- */
  --radius-card:  8px;    /* kart, kitaplık rafındaki cilt */
  --radius-input: 6px;    /* arama, liste öğesi            */
  --radius-chip:  4px;    /* konu etiketi                  */
  --radius-pill:  999px;  /* yalnız durum rozeti           */

  /* ---- Gölge: kâğıt kaldırma, hazır shadow-xl değil -------------------- */
  --shadow-card: 0 1px 2px rgb(22 25 28 / 0.04);
  --shadow-hover: 0 2px 4px rgb(22 25 28 / 0.06), 0 8px 20px rgb(22 25 28 / 0.05);
  --ring-line: inset 0 0 0 1px var(--c-line);

  /* ---- Kap ve kolonlar --------------------------------------------------- */
  --container: 1240px;
  --side-width: 13rem;
  --gutter: var(--space-6);
}

/* =========================================================================
   Koyu tema — token seviyesinde tam karşılık, HER İKİ YÖNDE override.
   ========================================================================= */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-bg:      #14171A;
    --c-card:    #1B1F23;
    --c-sunk:    #191D21;
    --c-ink:     #E9E7E2;
    --c-body:    #BDC3C8;
    --c-soft:    #9AA1A8;
    --c-line:    #2A3036;
    --c-accent:  #7FB0DC;
    --c-accent-wash: #17242E;
    --c-ok:      #5CB894;
    --c-ok-wash: #14251F;
    --c-warm:    #E4835C;
    --c-warm-wash: #2A1A14;
    --c-crit:      #F2837A;
    --c-crit-wash: #2E1614;
    --c-high:      #E0A063;
    --c-high-wash: #2B1F12;
    --c-low:       #7FA8C4;
    --c-low-wash:  #16242E;
    --c-on-severity: #14171A;
    --shadow-card: 0 1px 2px rgb(0 0 0 / 0.4);
    --shadow-hover: 0 2px 4px rgb(0 0 0 / 0.45), 0 8px 20px rgb(0 0 0 / 0.35);
  }
}

:root[data-theme="dark"] {
  --c-bg:      #14171A;
  --c-card:    #1B1F23;
  --c-sunk:    #191D21;
  --c-ink:     #E9E7E2;
  --c-body:    #BDC3C8;
  --c-soft:    #9AA1A8;
  --c-line:    #2A3036;
  --c-accent:  #7FB0DC;
  --c-accent-wash: #17242E;
  --c-ok:      #5CB894;
  --c-ok-wash: #14251F;
  --c-warm:    #E4835C;
  --c-warm-wash: #2A1A14;
  --c-crit:    #F2837A;
  --c-crit-wash: #2E1614;
  --c-high:    #E0A063;
  --c-high-wash: #2B1F12;
  --c-low:     #7FA8C4;
  --c-low-wash:  #16242E;
  --c-on-severity: #14171A;
  --shadow-card: 0 1px 2px rgb(0 0 0 / 0.4);
  --shadow-hover: 0 2px 4px rgb(0 0 0 / 0.45), 0 8px 20px rgb(0 0 0 / 0.35);
}

:root[data-theme="light"] {
  --c-bg:      #F4F2ED;
  --c-card:    #FFFFFF;
  --c-sunk:    #FAF9F6;
  --c-ink:     #16191C;
  --c-body:    #4A5157;
  --c-soft:    #6E757C;
  --c-line:    #DDD9D1;
  --c-accent:  #1D4E89;
  --c-accent-wash: #E8EEF6;
  --c-ok:      #1F6B4A;
  --c-ok-wash: #E6F1EB;
  --c-warm:    #C2410C;
  --c-warm-wash: #FBEDE6;
  --c-crit:    #B3261E;
  --c-crit-wash: #FBE9E7;
  --c-high:    #A85309;
  --c-high-wash: #FBEFE3;
  --c-low:     #3F6B8A;
  --c-low-wash:  #E9F0F5;
  --c-on-severity: #FFFFFF;
  --shadow-card: 0 1px 2px rgb(22 25 28 / 0.04);
  --shadow-hover: 0 2px 4px rgb(22 25 28 / 0.06), 0 8px 20px rgb(22 25 28 / 0.05);
}