/* ════════════════════════════════════════════════════════════════════════════
   SkyraIrl Design Tokens
   Tutarlı spacing, radius, font-size, shadow sistematiği.
   Tüm component'ler bu değişkenleri referans almalı.
   ════════════════════════════════════════════════════════════════════════════ */

:root {
    /* ── Spacing scale (4px base) ─────────────────────────────── */
    --spc-1: 4px;    /* mikro ayırma */
    --spc-2: 8px;    /* küçük gap */
    --spc-3: 12px;   /* form field gap */
    --spc-4: 16px;   /* card-içi bölümler */
    --spc-5: 20px;   /* büyük gap */
    --spc-6: 24px;   /* kart padding standart */
    --spc-7: 32px;   /* section aralığı */
    --spc-8: 48px;   /* page section */

    /* ── Border radius scale ──────────────────────────────────── */
    --r-sm:   6px;   /* küçük chip/buton */
    --r-md:   10px;  /* input, stat-box */
    --r-lg:   14px;  /* card, modal */
    --r-xl:   18px;  /* hero card */
    --r-pill: 999px; /* badge, pill */

    /* ── Font size scale ──────────────────────────────────────── */
    --fs-xs:    0.72rem;  /* meta, caption */
    --fs-sm:    0.82rem;  /* muted body */
    --fs-base:  0.92rem;  /* table cell, form labels */
    --fs-md:    1rem;     /* default body, button */
    --fs-lg:    1.15rem;  /* section heading */
    --fs-xl:    1.4rem;   /* page heading */
    --fs-2xl:   1.75rem;  /* hero */
    --fs-3xl:   2.2rem;   /* display */

    /* ── Font weight scale ────────────────────────────────────── */
    --fw-normal: 400;
    --fw-medium: 500;
    --fw-semi:   600;
    --fw-bold:   700;

    /* ── Shadow scale (purple neon theme) ─────────────────────── */
    --sh-sm: 0 0 6px rgba(140,70,255,0.18);
    --sh-md: 0 0 10px rgba(140,70,255,0.30), 0 0 22px rgba(120,50,255,0.12);
    --sh-lg: 0 0 14px rgba(170,100,255,0.45), 0 0 36px rgba(140,70,255,0.22);
    --sh-xl: 0 0 20px rgba(180,110,255,0.55), 0 0 48px rgba(150,80,255,0.30);

    /* ── Border width ─────────────────────────────────────────── */
    --bw-hair: 1px;     /* subtle separators */
    --bw-std:  2px;     /* cards, buttons (standard) */

    /* ── Transition ──────────────────────────────────────────── */
    --t-fast:   .15s ease;
    --t-base:   .22s ease;
    --t-slow:   .35s cubic-bezier(.25,.46,.45,.94);

    /* ── Button paddings (3 sizes) ────────────────────────────── */
    --btn-pad-sm: var(--spc-1) var(--spc-3);    /* 4/12 */
    --btn-pad-md: var(--spc-2) var(--spc-5);    /* 8/20 */
    --btn-pad-lg: var(--spc-3) var(--spc-6);    /* 12/24 */
}