/* ==========================================================================
   Legichain — design tokens
   Kaynak: LEGICHAIN_DESIGN_SYSTEM_v1.md (bölüm 04–07, 12)
   Katman: primitive → semantic → component. Bileşenlerde doğrudan hex yok.
   ========================================================================== */

:root {
  /* --- Marka sabitleri --- */
  --brand-lime: #BDF93F;
  --brand-ink: #05080F;

  /* --- Ana aksiyon --- */
  --action-primary-bg: #BDF93F;
  --action-primary-hover: #ACE52E;
  --action-primary-pressed: #9BD31F;
  --action-primary-fg: #05080F;

  /* --- Tipografi --- */
  --font-sans: 'Satoshi', Arial, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Ölçek: desktop / mobile değerleri clamp ile (DS 5.2) */
  --text-display: clamp(2.5rem, 1.85rem + 2.7vw, 4rem);      /* 40 → 64 */
  --lh-display: 1.09;
  --text-h1: clamp(2.125rem, 1.72rem + 1.6vw, 3rem);         /* 34 → 48 */
  --lh-h1: 1.17;
  --text-h2: clamp(1.75rem, 1.55rem + .85vw, 2.25rem);       /* 28 → 36 */
  --lh-h2: 1.22;
  --text-h3: clamp(1.375rem, 1.32rem + .25vw, 1.5rem);       /* 22 → 24 */
  --lh-h3: 1.33;
  --text-h4: 1.25rem;                                        /* 20 */
  --lh-h4: 1.4;
  --text-lead: clamp(1.125rem, 1.07rem + .25vw, 1.25rem);    /* 18 → 20 */
  --lh-lead: 1.5;
  --text-body: 1rem;                                         /* 16 */
  --lh-body: 1.625;
  --text-ui: .875rem;                                        /* 14 */
  --lh-ui: 1.43;
  --text-label: .8125rem;                                    /* 13 */
  --lh-label: 1.385;
  --text-caption: .75rem;                                    /* 12 */
  --lh-caption: 1.5;
  --text-code: .8125rem;                                     /* 13 */
  --lh-code: 1.62;
  --text-kpi: clamp(1.75rem, 1.6rem + .5vw, 2rem);           /* 28 → 32 */
  --lh-kpi: 1.25;

  --tracking-display: -0.035em;
  --tracking-h1: -0.025em;
  --tracking-h2: -0.02em;
  --tracking-h3: -0.01em;
  --tracking-h4: -0.01em;
  --tracking-kpi: -0.02em;

  /* --- Boşluk (4 px taban) --- */
  --space-0: 0;
  --space-0-5: .125rem;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* --- Düzen --- */
  --container-max: 80rem;                 /* 1280 px */
  --gutter: 1.25rem;                      /* mobil 20 */
  --grid-gap: 1rem;                       /* mobil 16 */
  --section-y: clamp(3.5rem, 2.6rem + 4.2vw, 6rem);       /* 56 → 96 */
  --section-y-lg: clamp(4rem, 3rem + 5.5vw, 8rem);        /* 64 → 128 */
  --header-h: 4rem;                       /* mobil 64 */
  --measure: 66ch;                        /* gövde satır genişliği */
  --measure-hero: 52ch;

  /* --- Köşe --- */
  --radius-sm: .25rem;
  --radius-control: .5rem;
  --radius-card: .75rem;
  --radius-dialog: 1rem;
  --radius-pill: 999px;                   /* yalnız avatar / switch */

  /* --- Hareket --- */
  --motion-instant: 80ms;
  --motion-fast: 140ms;
  --motion-base: 200ms;
  --motion-panel: 280ms;
  --motion-explain: 450ms;
  --ease-standard: cubic-bezier(.2, 0, 0, 1);
  --ease-enter: cubic-bezier(.16, 1, .3, 1);

  /* --- Katman --- */
  --z-base: 0;
  --z-sticky: 20;
  --z-dropdown: 40;
  --z-overlay: 80;
  --z-modal: 100;
  --z-toast: 120;

  /* --- İkon --- */
  --icon-sm: 1rem;
  --icon-md: 1.25rem;
  --icon-lg: 1.5rem;
  --icon-stroke: 1.75;
}

@media (min-width: 640px) {
  :root { --gutter: 2rem; --grid-gap: 1.5rem; }
}
@media (min-width: 1024px) {
  :root { --gutter: 3rem; --header-h: 4.5rem; }
}

/* --------------------------------------------------------------------------
   Semantik renkler — LIGHT (varsayılan)
   -------------------------------------------------------------------------- */
:root,
[data-theme='light'] {
  color-scheme: light;

  --bg-canvas: #F6F8F5;
  --bg-subtle: #EDF1EB;
  --surface-default: #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-hover: #F0F4EC;
  --surface-pressed: #E7EDDF;

  --text-primary: #101810;
  --text-secondary: #52605A;
  --text-muted: #5D6B63;

  --border-subtle: #E0E6DD;
  --border-strong: #C7D0C3;
  --border-control: #758279;

  --accent-fg: #426400;
  --accent-subtle: #EFF8DB;
  --accent-border: #658719;
  --focus-ring: #426400;

  --disabled-bg: #E7ECE4;
  --disabled-fg: #65705F;

  --success-fg: #16634A; --success-bg: #E9F6EF;
  --warning-fg: #855200; --warning-bg: #FFF4D6;
  --danger-fg: #B4233B;  --danger-bg: #FDEDF0;
  --info-fg: #2457A6;    --info-bg: #ECF3FF;
  --neutral-fg: #52605A; --neutral-bg: #EDF1EB;

  --chart-1: #426400; --chart-2: #2457A6; --chart-3: #16634A;
  --chart-4: #855200; --chart-5: #7046A5; --chart-6: #A03C63;

  --shadow-card: 0 1px 2px rgb(16 24 16 / .04);
  --shadow-overlay: 0 16px 48px rgb(16 24 16 / .12);
  --scrim: rgb(5 8 15 / .44);

  /* Kod bloğu zemini light'ta hafif koyu yüzey değil, ikincil bölge */
  --code-bg: #EDF1EB;
  --code-fg: #101810;

  --logo-src: url('/assets/img/logo-light.png');
}

/* --------------------------------------------------------------------------
   Semantik renkler — DARK
   -------------------------------------------------------------------------- */
[data-theme='dark'] {
  color-scheme: dark;

  --bg-canvas: #05080F;
  --bg-subtle: #090F19;
  --surface-default: #0C121D;
  --surface-raised: #131D2B;
  --surface-hover: #192536;
  --surface-pressed: #223147;

  --text-primary: #F3F6FA;
  --text-secondary: #A5B1C2;
  --text-muted: #8D9BAF;

  --border-subtle: #1B2738;
  --border-strong: #34445A;
  --border-control: #64748B;

  --accent-fg: #BDF93F;
  --accent-subtle: #182510;
  --accent-border: #7B9F31;
  --focus-ring: #BDF93F;

  --disabled-bg: #1A2330;
  --disabled-fg: #8190A3;

  --success-fg: #62D6A2; --success-bg: #0D2B23;
  --warning-fg: #F3C76A; --warning-bg: #302410;
  --danger-fg: #FF8297;  --danger-bg: #321720;
  --info-fg: #8DB8FF;    --info-bg: #132640;
  --neutral-fg: #A5B1C2; --neutral-bg: #1A2330;

  --chart-1: #BDF93F; --chart-2: #8DB8FF; --chart-3: #62D6A2;
  --chart-4: #F3C76A; --chart-5: #BAA0EA; --chart-6: #EF98B8;

  --shadow-card: none;
  --shadow-overlay: 0 24px 64px rgb(0 0 0 / .36);
  --scrim: rgb(0 0 0 / .64);

  --code-bg: #090F19;
  --code-fg: #F3F6FA;

  --logo-src: url('/assets/img/logo-dark.png');
}

/* JavaScript kapalıysa sistem tercihini izle (theme-init.js normalde
   ilk boyamadan önce data-theme atar). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg-canvas: #05080F; --bg-subtle: #090F19;
    --surface-default: #0C121D; --surface-raised: #131D2B;
    --surface-hover: #192536; --surface-pressed: #223147;
    --text-primary: #F3F6FA; --text-secondary: #A5B1C2; --text-muted: #8D9BAF;
    --border-subtle: #1B2738; --border-strong: #34445A; --border-control: #64748B;
    --accent-fg: #BDF93F; --accent-subtle: #182510; --accent-border: #7B9F31;
    --focus-ring: #BDF93F; --disabled-bg: #1A2330; --disabled-fg: #8190A3;
    --success-fg: #62D6A2; --success-bg: #0D2B23;
    --warning-fg: #F3C76A; --warning-bg: #302410;
    --danger-fg: #FF8297;  --danger-bg: #321720;
    --info-fg: #8DB8FF;    --info-bg: #132640;
    --neutral-fg: #A5B1C2; --neutral-bg: #1A2330;
    --chart-1: #BDF93F; --chart-2: #8DB8FF; --chart-3: #62D6A2;
    --chart-4: #F3C76A; --chart-5: #BAA0EA; --chart-6: #EF98B8;
    --shadow-card: none;
    --shadow-overlay: 0 24px 64px rgb(0 0 0 / .36);
    --scrim: rgb(0 0 0 / .64);
    --code-bg: #090F19; --code-fg: #F3F6FA;
    --logo-src: url('/assets/img/logo-dark.png');
  }
}

/* --------------------------------------------------------------------------
   Reduced motion: süreler sıfırlanır, dekoratif hareket kapanır.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-instant: 0ms;
    --motion-fast: 0ms;
    --motion-base: 0ms;
    --motion-panel: 0ms;
    --motion-explain: 0ms;
  }
  [data-decorative-motion] { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto !important; }
}
