/* =============================================================================
   WISE — Wagner Design System · design tokenek
   Forrás: CLAUDE-DESIGN.md v1.0 (2026-08-25) + wagner-ui-minta.html
   A tokenblokk VÁLTOZTATÁS NÉLKÜL került át a szabálykönyvből.

   Ez a fájl az egyetlen hely, ahol hexa szín és nyers px szerepelhet.
   Minden más fájl kizárólag ezeket a változókat hívja.
   ============================================================================= */

/* --- Betűtípusok — saját kiszolgálás, külső kérés nélkül ---------------------
   Változó (variable) fontok: egyetlen fájl fedi le a 400–700 súlyokat, tehát
   kevesebb kérés, mint súlyonként külön fájllal. A latin / latin-ext bontás a
   Google Fonts szerinti unicode-range — a böngésző csak azt tölti le, amire a
   szöveghez szükség van (magyar szövegnél mindkettőre szükség van az ő/ű miatt).
   Forrás: @fontsource-variable/inter 5.3.0, @fontsource-variable/dm-sans 5.3.0
   Licenc: SIL Open Font License 1.1 (mindkettő) — lásd fonts/LICENSE-fontok.md

   JetBrains Mono SZÁNDÉKOSAN nincs letöltve: a felületen a monospace csak
   azonosítókban és billentyű-jelölésben fordul elő, ezért a rendszerfontra
   támaszkodunk (--font-mono). Ha ez később nem elég, ugyanígy bekötendő. */

@font-face{
  font-family:'Inter Variable'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('/fonts/inter-v5.3.0-latin-wght-normal.woff2') format('woff2-variations');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter Variable'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('/fonts/inter-v5.3.0-latin-ext-wght-normal.woff2') format('woff2-variations');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'DM Sans Variable'; font-style:normal; font-weight:100 1000; font-display:swap;
  src:url('/fonts/dm-sans-v5.3.0-latin-wght-normal.woff2') format('woff2-variations');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'DM Sans Variable'; font-style:normal; font-weight:100 1000; font-display:swap;
  src:url('/fonts/dm-sans-v5.3.0-latin-ext-wght-normal.woff2') format('woff2-variations');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  /* Márka (wagnersolar.hu) */
  --brand-500:#F1B33A; --brand-600:#D99A1E; --brand-700:#B37E12; --brand-100:#FCF2DC;

  /* Wagner-szürke semleges skála: 100–300 háttér, 400–600 keret, 900–1000 szöveg */
  --n-0:#FFFFFF; --n-100:#FAFAFA; --n-200:#F2F3F3; --n-300:#E9EAEA; --n-400:#DCDEDE;
  --n-500:#C6C9C9; --n-600:#A9ADAD; --n-700:#7A7F7F; --n-800:#565A5A; --n-900:#373A3A; --n-1000:#232626;

  /* Státusz */
  --ok-500:#2E9E5B; --ok-100:#E4F5EA; --warn-500:#E08A00; --warn-100:#FCF0DC;
  --err-500:#C02B0A; --err-100:#FBEAE6; --info-500:#2D6CDF; --info-100:#E7EEFC;

  /* Diagram (validált, FIX sorrend) */
  --viz-1:#2A78D6; --viz-2:#EB6834; --viz-3:#1BAF7A; --viz-4:#B37E12; --viz-5:#E87BA4; --viz-6:#4A3AA7;

  /* Szemantika — a kód ezt hívja */
  --bg:var(--n-100); --surface:var(--n-0); --surface-2:var(--n-200); --overlay:var(--n-0);
  --border:var(--n-300); --border-strong:var(--n-400); --border-active:var(--n-600);
  --text:var(--n-1000); --text-muted:var(--n-800); --text-faint:var(--n-600);
  --accent:var(--brand-500); --accent-hover:var(--brand-600); --on-accent:#232626; --focus:#2D6CDF;

  /* Tipó: DM Sans címek, Inter szöveg, 14px alap.
     A saját kiszolgálású változó fontok neve elöl, utána a szabálykönyv fallback-lánca. */
  --font:"Inter Variable","Inter",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-display:"DM Sans Variable","DM Sans",var(--font);
  --font-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --t-display:1.625rem/1.25 var(--font-display); --t-h1:1.25rem/1.3 var(--font-display);
  --t-h2:1rem/1.4 var(--font-display); --t-body:0.875rem/1.55 var(--font);
  --t-sm:0.8125rem/1.5 var(--font); --t-xs:0.6875rem/1.4 var(--font); --tracking-caps:.07em;

  /* Térköz 4px-rács · forma · mozgás · vezérlők */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px;
  --r-sm:8px; --r-md:10px; --r-lg:14px; --r-pill:999px;
  --sh-overlay:0 4px 16px rgba(35,38,38,.10),0 12px 40px rgba(35,38,38,.14);
  --z-nav:100; --z-dropdown:200; --z-modal:300; --z-toast:400;
  --dur-fast:100ms; --dur:160ms; --ease:cubic-bezier(.25,.75,.35,1);
  --container:1280px; --topbar-h:52px; --control-h:36px; --control-h-sm:28px; --control-h-lg:44px;

  /* Töréspontok: mobil <640 · tablet 640–1024 · desktop >1024.
     Média-lekérdezésben nem használható változó — ezért ezek emlékeztetők, a
     @media szabályok a 640px / 1024px literált írják. */
  --bp-sm:640px; --bp-lg:1024px;
}

/* --- Sötét téma ---------------------------------------------------------------
   Két helyen kell szerepelnie, és a kettőnek MINDIG EGYEZNIE KELL:
     1. [data-theme="dark"]  — a felhasználó kifejezett választása (témaváltó gomb);
     2. @media prefers-color-scheme + :root:not([data-theme="light"])
        — az OS-beállítás, ha a felhasználó még nem választott. A :not() azért kell,
          hogy a kifejezett "világos" választás sötét OS mellett is érvényesüljön.
   A wise-tema.js beállítja a data-theme attribútumot még az első kirajzolás előtt,
   így nincs villanás; a 2. blokk akkor is helyes témát ad, ha a script nem futna le.
   A verifikacio.sh ellenőrzi, hogy a két blokk tartalma azonos. */

[data-theme="dark"]{
  --bg:#121414; --surface:#191C1C; --surface-2:#212525; --overlay:#252929;
  --border:#2C3030; --border-strong:#3A3F3F; --border-active:#525858;
  --text:#F2F2EF; --text-muted:#B9BDBC; --text-faint:#767C7B; --on-accent:#1B1508;
  --ok-100:#12291C; --warn-100:#2A2010; --err-100:#2C1611; --info-100:#141E33;
  --sh-overlay:0 4px 16px rgba(0,0,0,.5),0 16px 48px rgba(0,0,0,.55);
  --viz-1:#3987E5; --viz-2:#D95926; --viz-3:#199E70; --viz-4:#C98500; --viz-5:#D55181; --viz-6:#9085E9;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#121414; --surface:#191C1C; --surface-2:#212525; --overlay:#252929;
    --border:#2C3030; --border-strong:#3A3F3F; --border-active:#525858;
    --text:#F2F2EF; --text-muted:#B9BDBC; --text-faint:#767C7B; --on-accent:#1B1508;
    --ok-100:#12291C; --warn-100:#2A2010; --err-100:#2C1611; --info-100:#141E33;
    --sh-overlay:0 4px 16px rgba(0,0,0,.5),0 16px 48px rgba(0,0,0,.55);
    --viz-1:#3987E5; --viz-2:#D95926; --viz-3:#199E70; --viz-4:#C98500; --viz-5:#D55181; --viz-6:#9085E9;
  }
}
