/* =========================================================================
   WISP — THEME TOKENS  ·  "CRIMSON EMBER"
   =========================================================================
   Sitenin TEK renk kaynagi. style.css / forum.css / contact.css /
   animations.css icindeki her renk buradaki token'lardan okunur.

   Tema degistirmek icin SADECE bu dosyayi duzenle — baska hicbir dosyaya
   dokunmana gerek yok.

   Palet, marka gorsellerinden turetildi:
     - Karakterin kiyafeti  -> derin siyah zeminler
     - Enerji / kilic izi   -> kizil vurgu (#ff2d3f)
     - Logo krom harfleri   -> gumus ikincil vurgu + beyaz metin

   YUKLEME SIRASI (her PHP sayfasinda ilk sirada olmali):
     theme.css  ->  forum.css (varsa)  ->  style.css  ->  animations.css
   ========================================================================= */

/* Basliklar icin display font — logonun italik/teknik karakteriyle uyumlu.
   Govde metni Inter'de kalir (PHP sayfalari yukluyor). */
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root {

    /* ---------------------------------------------------------------------
       0. TIPOGRAFI
       --------------------------------------------------------------------- */
    --font-body: 'Inter', system-ui, -apple-system, sans-serif;
    --font-display: 'Chakra Petch', 'Inter', system-ui, sans-serif;

    /* ---------------------------------------------------------------------
       1. NOTRLER — siyah / antrasit skala
       --------------------------------------------------------------------- */
    --bg: #09090b;            /* sayfa zemini — derin siyah */
    --surface: #101014;       /* kartlar, paneller */
    --surface-2: #16161b;     /* ikincil yuzey, hover zemini */
    --surface-3: #1d1d23;     /* en acik notr yuzey (baslik seritleri) */

    --border: #202026;        /* varsayilan cerceve */
    --border-hover: #3a3a44;  /* hover / vurgulu cerceve */

    --text: #f4f4f6;          /* ana metin — kirik beyaz */
    --text-invert: #ffffff;   /* kizil zemin uzerindeki metin */
    --muted: #9a9aa8;         /* ikincil metin */
    --placeholder: #55555f;   /* input placeholder */

    /* ---------------------------------------------------------------------
       2. MARKA — kizil
       --accent      : metin/ikon icin guvenli ton (siyah uzerinde AA, 5.3:1)
       --accent-bright: buton hover, parlama
       --accent-vivid : en canli ton — noktalar, kucuk vurgular
       --------------------------------------------------------------------- */
    --accent: #ff2d3f;
    --accent-bright: #ff4656;
    --accent-vivid: #ff6b78;
    --accent-deep: #b3121f;         /* koyu kizil — gradient golgesi, kenar */
    --accent-soft: #24090d;         /* cok koyu kizil zemin (rozet/etiket) */
    --accent-border: #6e1a24;       /* kizil cerceve (rozet/etiket) */
    --accent-tint-08: rgba(255, 45, 63, 0.08);
    --accent-tint-15: rgba(255, 45, 63, 0.15);
    --accent-tint-25: rgba(255, 45, 63, 0.25);
    --accent-tint-40: rgba(255, 45, 63, 0.40);
    --accent-tint-60: rgba(255, 45, 63, 0.60);

    /* ---------------------------------------------------------------------
       3. IKINCIL VURGU — krom / gumus (logo harfleri)
       --------------------------------------------------------------------- */
    --accent-2: #c9ccd6;
    --accent-2-bright: #e9ebf1;
    --accent-2-soft: #1b1b20;
    --accent-2-tint-15: rgba(201, 204, 214, 0.15);
    --accent-2-tint-25: rgba(201, 204, 214, 0.25);

    /* Marka gradienti — kizil baskin, ortada krom parlamasi.
       Logodaki kirmizi kavis + parlak yildiz hissini verir; animations.css
       bunu basliklarda kaydirarak "shimmer" efekti olarak kullanir. */
    --brand-gradient: linear-gradient(90deg,
        var(--accent) 0%,
        var(--accent) 30%,
        #ffd6da 50%,
        var(--accent) 70%,
        var(--accent) 100%);

    /* Buton / dolgu gradienti — ustten alta hafif koyulasan kizil */
    --accent-gradient: linear-gradient(180deg, var(--accent-bright) 0%, var(--accent) 60%, var(--accent-deep) 100%);

    /* ---------------------------------------------------------------------
       4. ANLAMSAL RENKLER
       Not: marka kizil oldugu icin hata rengi turuncuya kaydirildi;
       boylece bir form hatasi marka vurgusuyla karismaz.
       --------------------------------------------------------------------- */
    --success: #34d399;
    --success-bright: #22c55e;
    --success-border: #1f5a3d;
    --success-tint-30: rgba(34, 197, 94, 0.30);
    --success-tint-60: rgba(34, 197, 94, 0.60);

    --danger: #ff6a3d;
    --danger-bright: #ff7a50;
    --danger-border: #6b2e1a;
    --danger-tint-25: rgba(255, 106, 61, 0.25);

    --warning: #f5b323;          /* premium rozet / uyari metni */
    --warning-bright: #ffc53d;
    --warning-border: #6b4b0f;
    --warning-tint-08: rgba(245, 179, 35, 0.08);
    --warning-tint-15: rgba(245, 179, 35, 0.15);
    --warning-tint-25: rgba(245, 179, 35, 0.25);
    --warning-tint-30: rgba(245, 179, 35, 0.30);
    --warning-tint-35: rgba(245, 179, 35, 0.35);

    --info: #6ea2ff;
    --info-bright: #4f8cff;

    /* Notr rozet cercevesi */
    --tag-border-neutral: #33333c;

    /* ---------------------------------------------------------------------
       5. GOLGELER — koyu temada derin siyah + kizil parlama
       --------------------------------------------------------------------- */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.45);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.55);
    --shadow-lg: 0 14px 40px rgba(0, 0, 0, 0.65);
    --shadow-xl: 0 24px 60px rgba(0, 0, 0, 0.75);
    --shadow-accent: 0 0 24px rgba(255, 45, 63, 0.45), 0 0 60px rgba(255, 45, 63, 0.18);

    /* ---------------------------------------------------------------------
       6. KAPLAMALAR / EFEKTLER
       --------------------------------------------------------------------- */
    --nav-scrolled: rgba(9, 9, 11, 0.82);
    --scrim: rgba(0, 0, 0, 0.72);            /* modal arka plani */
    --scrim-strong: rgba(0, 0, 0, 0.62);     /* avatar hover kaplamasi */
    --ripple: rgba(255, 255, 255, 0.14);
    --ripple-on-accent: rgba(255, 255, 255, 0.35);

    --selection-bg: #ff2d3f;
    --selection-text: #ffffff;

    --scrollbar-track: var(--bg);
    --scrollbar-thumb: #26262d;
    --scrollbar-thumb-hover: #3a3a44;

    /* Sabit beyaz — renkli zeminde okunurlugu garanti olmasi gereken yerler
       (QR kod zemini, Discord butonu vb.) icin. Tema degisse de beyaz kalir. */
    --pure-white: #ffffff;

    /* Dis marka renkleri — temaya gore degismez */
    --discord: #5865f2;

    /* ---------------------------------------------------------------------
       7. GERIYE DONUK TAKMA ADLAR
       Eski forum.css bu adlari kullaniyordu. Kodda kalmis bir kullanim
       olursa renksiz kalmasin diye guvenlik agi olarak tutuluyor.
       Yeni kod --success / --info kullanmali.
       --------------------------------------------------------------------- */
    --green: var(--success);
    --blue: var(--info);
}

/* Tarayiciya koyu tema oldugunu soyle — form kontrolleri, scrollbar vb.
   yerel bilesenler de koyu cizilir. */
:root { color-scheme: dark; }
