/* ==========================================================================
   02-tokens-core.css — Primitív tokenek (TW v4 igazítva)

   Tailwind v4 értékekkel és névadással. AI-tervezők (v0, Lovable, stb.)
   TW-osztályait közvetlenül leképezi:
     p-6     → padding: var(--space-6)
     text-xl → font-size: var(--text-xl)
     gap-4   → gap: var(--space-4)

   FIX értékek (nem fluid clamp) — egy projektben egyenletes és kiszámítható.
   Egy skála, semmi alias, semmi duplikáció.

   ⚠️ Ezeket a tokeneket NE módosítsd projektenként.
   Projekt-specifikus override-ok a 03-tokens-brand.css-be valók.
   ========================================================================== */

:root {

  /* ========================================================================
     FONT SIZE — TW exact
     ======================================================================== */

  --text-xs:   0.75rem;     /* 12px */
  --text-sm:   0.875rem;    /* 14px */
  --text-base: 1rem;        /* 16px */
  --text-lg:   1.125rem;    /* 18px */
  --text-xl:   1.25rem;     /* 20px */
  --text-2xl:  1.5rem;      /* 24px */
  --text-3xl:  1.875rem;    /* 30px */
  --text-4xl:  2.25rem;     /* 36px */
  --text-5xl:  3rem;        /* 48px */
  --text-6xl:  3.75rem;     /* 60px */
  --text-7xl:  4.5rem;      /* 72px */
  --text-8xl:  6rem;        /* 96px */
  --text-9xl:  8rem;        /* 128px */

  /* ========================================================================
     LINE HEIGHT — TW exact
     ======================================================================== */

  --lh-none:    1;
  --lh-tight:   1.25;
  --lh-snug:    1.375;
  --lh-normal:  1.5;
  --lh-relaxed: 1.625;
  --lh-loose:   2;

  /* ========================================================================
     FONT WEIGHT — TW exact
     ======================================================================== */

  --fw-light:    300;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-black:    900;

  /* ========================================================================
     LETTER SPACING — TW exact
     ======================================================================== */

  --tracking-tighter: -0.05em;
  --tracking-tight:   -0.025em;
  --tracking-normal:  0;
  --tracking-wide:    0.025em;
  --tracking-wider:   0.05em;
  --tracking-widest:  0.1em;

  /* ========================================================================
     SPACING — TW numerikus, trimmelt (18 érték)

     Fél-lépcsők (0.5, 1.5, stb.) és köztes értékek (7, 9, 11, 14) nem
     kerültek be. Ha projektben kell, projekt-szinten add hozzá.
     ======================================================================== */

  --space-0:  0;
  --space-1:  0.25rem;    /*  4px */
  --space-2:  0.5rem;     /*  8px */
  --space-3:  0.75rem;    /* 12px */
  --space-4:  1rem;       /* 16px */
  --space-5:  1.25rem;    /* 20px */
  --space-6:  1.5rem;     /* 24px */
  --space-8:  2rem;       /* 32px */
  --space-10: 2.5rem;     /* 40px */
  --space-12: 3rem;       /* 48px */
  --space-16: 4rem;       /* 64px */
  --space-20: 5rem;       /* 80px */
  --space-24: 6rem;       /* 96px */
  --space-32: 8rem;       /* 128px */
  --space-40: 10rem;      /* 160px */
  --space-48: 12rem;      /* 192px */
  --space-64: 16rem;      /* 256px */
  --space-80: 20rem;      /* 320px */

  /* ========================================================================
     CONTAINER WIDTHS
     ======================================================================== */

  --container-prose:   65ch;     /* Olvasható folyószöveg (blog, cikk) */
  --container-narrow:  720px;    /* Keskeny tartalom (about, kontakt) */
  --container-default: 1200px;   /* Általános weboldal */
  --container-wide:    1440px;   /* Tág layout (dashboard, gallery) */
  --container-full:    100%;     /* Full bleed szekciók */

  /* ========================================================================
     RADIUS — TW exact
     ======================================================================== */

  --radius-none: 0;
  --radius-sm:   0.125rem;    /*  2px */
  --radius:      0.25rem;     /*  4px — TW default rounded */
  --radius-md:   0.375rem;    /*  6px */
  --radius-lg:   0.5rem;      /*  8px */
  --radius-xl:   0.75rem;     /* 12px */
  --radius-2xl:  1rem;        /* 16px */
  --radius-3xl:  1.5rem;      /* 24px */
  --radius-full: 9999px;

  /* ========================================================================
     SHADOW — TW exact
     ======================================================================== */

  --shadow-sm:    0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow:       0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md:    0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg:    0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl:    0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow-2xl:   0 25px 50px -12px rgb(0 0 0 / 0.25);
  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);

  /* ========================================================================
     MOTION — easing & duration
     ======================================================================== */

  --ease-linear: linear;
  --ease-in:     cubic-bezier(0.4, 0, 1, 1);
  --ease-out:    cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease:        var(--ease-in-out);

  --duration-instant: 0ms;
  --duration-fast:    150ms;
  --duration-base:    250ms;
  --duration-slow:    400ms;
  --duration-slower:  600ms;

  /* ========================================================================
     Z-INDEX
     ======================================================================== */

  --z-base:     1;
  --z-dropdown: 10;
  --z-sticky:   20;
  --z-fixed:    30;
  --z-modal:    40;
  --z-popover:  50;
  --z-toast:    60;
  --z-tooltip:  70;

  /* ========================================================================
     BREAKPOINTS — TW exact (csak referenciaként, @media-ban használjuk)
     ======================================================================== */

  --bp-sm:  640px;
  --bp-md:  768px;
  --bp-lg:  1024px;
  --bp-xl:  1280px;
  --bp-2xl: 1536px;

}
