/*
  RETEG: components. Az architecture kapu (UiStylingSeamTests) minden
  stiluslaptol @layer-t var, es itt nem is formalis: a base.css a "reset"
  retegben adja a body hatteret, ezt a fajl pedig atlatszora irja. A
  retegsorrend (reset, base, layout, components, ...) miatt a components
  KESOBB jon, tehat a felulirás mukodik - fordított sorrendben nemán elveszne.
*/
@layer components {
    /*
      PlusSeat - "plusz-racs" hatter (design-javaslat, Ruben 2026-09-22, atdolgozva 09-23).
      Hova kerul: wwwroot/css/plus-grid.css, a tobbi stiluslap UTAN betoltve.

      HOL FUT: a PlusSeat alapertelmezett megjelenesen (kijelentkezve nincs data-theme,
      es a Grafit a :root alapertelmezes) es az explicit Grafit teman. A Rez, a Porcelan
      es a Moha VALTOZATLAN - ott a canvas display:none, a JS el sem indul.

      ---------------------------------------------------------------------------
      AMIT EZ A FAJL SZANDEKOSAN NEM CSINAL - es miert
      ---------------------------------------------------------------------------

      1. NEM ad z-index-et es position-t a .site-header, .site-footer, main vagy
         .layout elemnek. Az uj RETEGKONTEXTUST nyitna beloluk, es az bennuk ulo
         paneleket a kulvilaghoz kepest lefokozna: a harang-panel es a fiok-menu
         (z-index: 20, layout.css 324/442) meg az "Ugras a tartalomra" link
         (z-index: 100, layout.css 665) a fejlecben ul - ha a fejlec es a main is
         1-es szintre kerul, a DOM-sorrend dont, es a main a fejlec FOLE fest.
         A legordulo panel igy a tartalom moge kerulne: nema hiba, oldalankent mas.
         FIGYELEM: a motion.css view-transition-name-je (fejlec ES main) ezt a
         retegkontextust MAGATOL megnyitja - ott ezert a fejlec z-index: 10-et kap
         (2026-09-29, MotionAndBadgeGateTests orzi).

      2. NINCS backdrop-filter, es nincs attetszo fejlec/lablec. A nem-none
         backdrop-filter ONMAGABAN retegkontextust nyit - pontosan az 1. pontban
         leirt hibat hozna vissza. A racs igy a tomor fejlec es lablec MOGOTT van,
         es a tartalmi savban latszik; ez a kompromisszum tudatos.

      A canvas ehelyett z-index: -1-et kap. Igy mindentol hatrebb all, es a lap
      egyetlen meglevo szabalyahoz sem kell hozzanyulni.

      ---------------------------------------------------------------------------
      MIERT KERUL A HATTERSZIN A <html>-RE
      ---------------------------------------------------------------------------
      A negativ z-index a szulo HATTERE fole fest, de a gyokerelem hattere a vaszon
      (canvas background), ami mindennel hatrebb van. A base.css ma a body-n tartja
      a hatteret; az a bongeszo szabalyai szerint felszivodik a vaszonra, amig a
      html-nek nincs sajat hattere - erre viszont nem akarunk epiteni, mert egyetlen
      kesobbi "html { background: ... }" sor nemaan eltakarna a racsot.
      Ezert itt egyertelmuve tesszuk: a szin a html-en ul, a body atlatszo. A
      LATHATO EREDMENY UGYANAZ, csak nem a szivodasra tamaszkodik.
    */

    /* Alapertelmezesben rejtve - a temak dontik el, hol latszik. */
    #plus-grid {
        display: none;
    }

    :root[data-brand="plusseat"]:not([data-theme]) #plus-grid,
    :root[data-theme="grafit"] #plus-grid {
        display: block;
        position: fixed;
        inset: 0;
        z-index: -1;
        pointer-events: none;
    }

    /* A hatterszin a gyokerelemre, a body atlatszo - lasd a fenti indoklast. */
    :root[data-brand="plusseat"]:not([data-theme]),
    :root[data-theme="grafit"] {
        background: var(--surface-default);
    }

    :root[data-brand="plusseat"]:not([data-theme]) body,
    :root[data-theme="grafit"] body {
        background: transparent;
    }

    /*
      Nyomtatas: a racs nem kerul papirra. A body hatteret sem allitjuk vissza -
      a bongeszo nyomtataskor amugy sem festi a hatteret, ha a felhasznalo nem keri.
    */
    @media print {
        #plus-grid { display: none !important; }
    }
}
