/*
  Tasarım değişkenleri (design tokens)
  Renkler, köşeler, gölgeler ve boşluklar burada tek bir yerde tanımlanır.
  Bir rengi değiştirmek istersen sadece bu dosyayı düzenlemen yeterli.
*/

:root {
  /* Marka renkleri */
  --color-forest: #1F6B4F;
  --color-deep: #174A38;
  --color-mint: #EAF4EF;
  --color-warm-white: #F8FAF8;
  --color-surface: #FFFFFF;
  --color-text: #17211D;
  --color-text-secondary: #5F6E66;

  /* Yardımcı nötr gri-yeşil tonlar */
  --color-sage: #C9D8D0;
  --color-line: #E1E8E4;
  --color-line-soft: #EDF1EE;

  /*
    Sonuç durum renkleri
    Bunlar marka yeşilinden bilerek ayrı tutulur.
    Marka yeşili (forest) hiçbir zaman "güvenli" anlamında kullanılmaz.
    *-text tonları, açık zemin üstünde okunabilirlik için biraz koyulaştırılmıştır.
  */
  --status-low: #4F7A67;
  --status-low-bg: #EEF3F0;
  --status-low-text: #3E6353;

  --status-caution: #C78A1C;
  --status-caution-bg: #FBF3E3;
  --status-caution-text: #845A0E;

  --status-high: #C24F4F;
  --status-high-bg: #FBEDED;
  --status-high-text: #A03D3D;

  /* Yeterli veri yok: bir risk değil, bilgi eksikliği (nötr gri) */
  --status-unknown: #8A978F;
  --status-unknown-bg: #F0F3F1;
  --status-unknown-text: #5F6E66;

  /* Yazı tipi: cihazın kendi modern yazı tipi (dışarıdan yükleme yok) */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI Variable Text", "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Köşe yuvarlaklıkları */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  /* Gölgeler */
  --shadow-card: 0 1px 2px rgba(23, 33, 29, 0.04), 0 8px 24px rgba(23, 33, 29, 0.05);
  --shadow-raised: 0 2px 6px rgba(23, 33, 29, 0.04), 0 20px 48px rgba(23, 74, 56, 0.10);
  --shadow-focus: 0 0 0 4px rgba(31, 107, 79, 0.16);

  /* Yerleşim */
  --container: 1120px;
  --gutter: clamp(16px, 4vw, 32px);
  --section-space: clamp(72px, 10vw, 128px);
  --header-height: 68px;
}