/* =====================================================================
   MKSK — Tasarım token'ları
   MARKANIN TEK KAYNAĞI. Logo hex kodları kesinleştiğinde yalnızca
   bu dosya değişir; site ve panel bütünüyle ona döner.

   Tasarım fikri karatenin nesne dünyasından çıkarıldı:
     obi (kuşak)  → 6px kuşak şeridi, sistemin birincil tarama aracı
     tatami       → sert kenar, çizgiyle çerçeve, gölge yok
     aka / ao     → iki kutuplu anlam sistemi (para ↔ gelişim)
     dogi         → soğuk beyaz panel zemini, sıcak siyah marka
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wdth,wght@0,62..125,100..900;1,62..125,100..900&display=swap');

:root {
  /* ---- MARKA ------------------------------------------------------ */
  --kuro:      #000000;   /* gerçek siyah — logo rozeti, hero, panel kenar çubuğu */
  --sumi:      #1A1513;   /* sıcak koyu yüzey (kahve casti, mavi-gri değil) */
  --sumi-2:    #241D1A;   /* koyu zeminde yükseltilmiş yüzey */
  --aka:       #C8102E;   /* müsabaka kırmızısı — logonun "KARATE" yazısı */
  --aka-dk:    #96001F;
  --aka-lt:    #E23B4F;
  --ao:        #1C4E8C;   /* müsabaka mavisi — gelişim, bilgi */
  --ao-dk:     #143A69;
  --gumus:     #C9CDD2;   /* logonun metalik monogramı */

  /* ---- YÜZEY ve METİN (açık tema / panel) -------------------------- */
  --gi:        #FFFFFF;   /* kağıt: kart, tablo satırı, form */
  --kage:      #EDEFF1;   /* çukur zemin: sayfa arka planı */
  --kage-2:    #F6F7F8;   /* yumuşak vurgu satırı */
  --sen:       #D7DBDF;   /* saç çizgisi */
  --sen-kv:    #BFC5CB;   /* kuvvetli çizgi */
  --moji:      #16191C;
  --moji-2:    #4A545E;
  --moji-3:    #7B858F;

  /* ---- DURUM ------------------------------------------------------ */
  --ok:        #0F7B4A;   --ok-bg:    rgba(15,123,74,.10);   --ok-br:    rgba(15,123,74,.28);
  --uyari:     #B26A00;   --uyari-bg: rgba(178,106,0,.10);   --uyari-br: rgba(178,106,0,.28);
  --hata:      #C8102E;   --hata-bg:  rgba(200,16,46,.10);   --hata-br:  rgba(200,16,46,.28);
  --bilgi:     #1C4E8C;   --bilgi-bg: rgba(28,78,140,.10);   --bilgi-br: rgba(28,78,140,.28);

  /* ---- KUŞAK PALETİ (veri rengi, marka değil) ---------------------- */
  --kusak-beyaz:   #F5F5F3;
  --kusak-sari:    #F2C230;
  --kusak-turuncu: #E8761E;
  --kusak-yesil:   #1E8E4E;
  --kusak-mavi:    #2266B8;
  --kusak-mor:     #6B3FA0;
  --kusak-kahve:   #6B4423;
  --kusak-siyah:   #16191C;
  --kusak-altin:   #C9A227;   /* siyah kuşak dan çizgisi */

  /* ---- TİPOGRAFİ --------------------------------------------------- */
  --font: 'Archivo', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', sans-serif;

  /* Modüler ölçek: taban 16px, oran 1.25 (majör üçlü) */
  --ol-display: clamp(2.75rem, 8vw, 6rem);
  --ol-h1:      clamp(1.9rem, 4.2vw, 2.5rem);
  --ol-h2:      clamp(1.5rem, 3vw, 1.875rem);
  --ol-h3:      1.375rem;
  --ol-govde:   1rem;
  --ol-kucuk:   0.875rem;
  --ol-etiket:  0.8125rem;
  --ol-mikro:   0.75rem;

  /* ---- BOŞLUK (4px tabanlı) ---------------------------------------- */
  --b1: 4px;  --b2: 8px;  --b3: 12px; --b4: 16px;
  --b5: 24px; --b6: 32px; --b7: 48px; --b8: 64px; --b9: 96px;

  /* ---- KÖŞE — tek değer değil, anlam taşır -------------------------- */
  --k-yok:   0;      /* tablo, kenar çubuğu — tatami bantı */
  --k-yapi:  2px;    /* kart, form, buton — yapısal kaplar */
  --k-bant:  999px;  /* rozet, çip — bunlar KUŞAKTIR, form anlamı taşır */

  /* ---- KUŞAK ŞERİDİ (sistemin imzası) ------------------------------ */
  --serit-en: 6px;

  /* ---- HAREKET ----------------------------------------------------- */
  --gecis:     160ms cubic-bezier(.2,.8,.2,1);
  --gecis-yav: 240ms cubic-bezier(.2,.8,.2,1);

  /* ---- KATMAN (yalnız üste binen öğeler gölge alır) ----------------- */
  --golge-katman: 0 8px 24px rgba(0,0,0,.18);

  --icerik-en: 1320px;
  color-scheme: light;
}

/* =====================================================================
   KOYU TEMA — panel için.
   aka ve ao DEĞİŞMEZ (yalnız doygunlukları hafif düşer).
   Kuşak renkleri hiç değişmez: veri rengidir.
   ===================================================================== */
:root[data-tema="koyu"],
:root:not([data-tema="acik"]) {
  /* varsayılan açık; koyu yalnız aşağıdaki blokta */
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) {
    --gi:     #1A1513;
    --kage:   #100C0B;
    --kage-2: #241D1A;
    --sen:    #342C28;
    --sen-kv: #4A403A;
    --moji:   #EFEAE6;
    --moji-2: #B6ABA4;
    --moji-3: #8A7F78;
    --aka:    #D9384B;
    --ao:     #3E77BC;
    --ok:     #2E9E68;
    --uyari:  #D08A1E;
    --hata:   #D9384B;
    --bilgi:  #3E77BC;
    color-scheme: dark;
  }
}

:root[data-tema="koyu"] {
  --gi:     #1A1513;
  --kage:   #100C0B;
  --kage-2: #241D1A;
  --sen:    #342C28;
  --sen-kv: #4A403A;
  --moji:   #EFEAE6;
  --moji-2: #B6ABA4;
  --moji-3: #8A7F78;
  --aka:    #D9384B;
  --ao:     #3E77BC;
  --ok:     #2E9E68;
  --uyari:  #D08A1E;
  --hata:   #D9384B;
  --bilgi:  #3E77BC;
  color-scheme: dark;
}

/* =====================================================================
   HAREKET AZALTMA — kalite tabanı
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}