/* =============================================================================
   Dynamo — design tokenek ("Tervlap")
   -----------------------------------------------------------------------------
   Koncepció: a felület a villamos kiviteli tervlapok logikáját követi — rajzlap-
   fehér felületek, grafit tusvonal, a tervrajz a főszereplő. A háttér a
   kapcsolószekrények RAL 7035 világosszürkéjének halvány árnyalata. Elsődleges
   szín: cianotípia-kék (a régi "blueprint" tervmásolatok színe). A státuszok az
   IEC 60073 jelzőlámpa-színeit követik (piros / sárga / zöld / kék).
   ========================================================================== */
:root {
  /* — Semleges ("tus és papír") — */
  --ink: #1c2421;            /* fő szöveg, erős vonalak */
  --ink-2: #3d4743;          /* másodlagos szöveg */
  --ink-3: #66726d;          /* halvány szöveg — fehéren is AA kontraszt (5:1) */
  --paper: #eceeec;          /* alkalmazás-háttér */
  --sheet: #ffffff;          /* panelek, kártyák, mezők */
  --sheet-2: #f6f7f6;        /* enyhén kiemelt felület (táblázatfej, sávok) */
  --sheet-3: #eef1ef;        /* hover / csíkozás */
  --rule: #d5dcd8;           /* hajszálvonal */
  --rule-2: #b9c3be;         /* erősebb vonal, beviteli mező kerete */

  /* — Elsődleges: cianotípia-kék — */
  --primary: #1b5e8e;
  --primary-hover: #154c74;
  --primary-press: #103b5a;
  --primary-ink: #123f60;    /* szöveg a világos kék alapon */
  --primary-tint: #dde9f3;   /* kijelölt elem háttere */
  --primary-tint-2: #eef4f9;
  --focus: #2b7bbf;

  /* — Jelzések — */
  --signal: #f2b200;         /* jelzőlámpa-sárga: márkapont, "élő" állapot */
  --danger: #c42b3a;   --danger-hover: #a52230; --danger-tint: #fbe9eb;
  --success: #1e7f4e;  --success-tint: #e3f3ea;
  --warning: #a15f00;  --warning-tint: #fdf1d9;

  /* — Jelzőlámpák (pinek, státuszpöttyök) — */
  --lamp-red: #e0323f;
  --lamp-orange: #f08a00;
  --lamp-yellow: #f2c200;
  --lamp-green: #23a05a;
  --lamp-blue: #2f6fd6;

  /* — Tipográfia — */
  --font: 'Fira Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-cond: 'Fira Sans Condensed', 'Fira Sans', system-ui, 'Segoe UI', Arial, sans-serif;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 15px;
  --fs-lg: 17px;
  --fs-xl: 21px;
  --fs-2xl: 26px;

  /* — Térköz, méretek — */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --header-h: 56px;
  --nav-w: 248px;
  --tap: 44px;               /* érintési célterület mobilon */

  /* — Sarkok: hierarchia szerint, nem mindenhol ugyanaz — */
  --r-xs: 4px;   /* címkék, jelvények */
  --r-sm: 6px;   /* gombok, mezők */
  --r-md: 8px;   /* kártyák */
  --r-lg: 12px;  /* panelek, modális ablakok */
  --r-pill: 999px;

  /* — Árnyék: csak lebegő elemeken (menü, modális, eszköztár) — */
  --sh-float: 0 1px 2px rgba(28, 36, 33, .10), 0 6px 18px rgba(28, 36, 33, .10);
  --sh-pop: 0 2px 6px rgba(28, 36, 33, .10), 0 18px 44px rgba(28, 36, 33, .20);
  --transition: 140ms cubic-bezier(.4, 0, .2, 1);

  /* — Régi változónevek → új értékek (a JS-ben/HTML-ben beégetett stílusok miatt) — */
  --brand: var(--primary-tint);           /* régen sárga háttér sötét szöveggel → most világoskék kiemelés */
  --brand-dark: var(--primary);
  --brand-red: var(--danger);
  --brand-red-dark: #9e1f2c;
  --brand-gradient: var(--primary-tint);  /* nincs több színátmenet */
  --brand-gradient-soft: var(--primary-tint-2);
  --brand-gradient-rev: var(--primary-tint);
  --dark: var(--ink);
  --dark-2: var(--ink-2);
  --gray-900: #1c2421;
  --gray-800: #29312e;
  --gray-700: #3d4743;
  --gray-600: #525d59;
  --gray-500: #66726d;
  --gray-400: #a1aca7;
  --gray-300: #cad2ce;
  --gray-200: #e1e6e3;
  --gray-100: #eef1ef;
  --gray-50:  #f6f7f6;
  --green: var(--success);   --green-soft: var(--success-tint);
  --orange: var(--warning);  --orange-soft: var(--warning-tint);
  --red: var(--danger);      --red-soft: var(--danger-tint);
  --blue: var(--primary);    --blue-soft: var(--primary-tint);
  --r-xl: 14px;
  --sh-1: none;
  --sh-2: var(--sh-float);
  --sh-3: var(--sh-pop);
  --sh-glow: 0 0 0 3px rgba(27, 94, 142, .22);
  --sh-glow-red: 0 0 0 3px rgba(196, 43, 58, .22);
  --ring: 0 0 0 3px rgba(43, 123, 191, .28);
}
