/* ==========================================================================
   Őszi téma
   --------------------------------------------------------------------------
   Szezonális réteg az offolda-modern.css fölött. Csak akkor töltődik be, ha a
   controller::SZEZONALIS_TEMA értéke "osz" — kikapcsolni ott kell; ez a fájl,
   a js/tema-osz.js és az images/tema-osz/ mappa maradhat a helyén.

   A sablonokhoz nem nyúl: a modern réteg színei változókként vannak megadva,
   és ez a fájl azokat állítja át. Minden szabály a body.tema-osz alá van
   kötve, hogy a téma akkor se szivárogjon ki, ha a fájl valamiért mégis
   betöltődne.

   Színvilág egy napsütötte őszi délutánból: arany, narancs és
   rozsdavörös lomb, kék ég, áttörő napfény. Sötét módban ugyanez
   alkonyatkor. A kontraszt mindenhol legalább akkora, mint az alap
   arculatban (a link 5,2:1 a felületen, az eredeti 4,4:1; a halvány szöveg
   a háttér legaranyabb részén is 3,6:1, az eredeti 3,1:1).
   ========================================================================== */

body.tema-osz {
    --marka:            #B9470F;   /* rozsdanarancs */
    --marka-vilagos:    #EE8A2A;   /* tök */
    --marka-sotet:      #8C300A;   /* gesztenye */
    --marka-halvany:    rgba(233, 140, 40, 0.15);

    --hatter:           #FAF1E3;
    --felulet:          #FFFCF7;
    --felulet-emelt:    #FFFDF9;
    --felulet-halvany:  #F7EAD6;

    --szoveg:           #2B1D14;   /* fakéreg */
    --szoveg-halk:      #5E4535;
    --szoveg-halkabb:   #826A57;

    --keret:            #ECDDC7;
    --keret-eros:       #DCC4A2;

    /* az árnyék mellett meleg derengés: mintha a nap világítaná meg őket */
    --arnyek-s:   0 1px 2px rgba(92, 52, 20, .07), 0 4px 16px rgba(240, 170, 60, .14);
    --arnyek-m:   0 2px 6px rgba(92, 52, 20, .08), 0 10px 28px rgba(240, 160, 50, .20);
    --arnyek-l:   0 4px 12px rgba(92, 52, 20, .10), 0 16px 48px rgba(92, 52, 20, .14);

    /* csak a téma használja */
    --osz-arany:        #E9A21B;
    --osz-ikon:         #C8661C;
    --osz-menu-teto:    #EEF7FC;
    --osz-menu-alj:     #FBEEDA;
    --osz-szam-veg:     #D9731A;
    --osz-level-atlatszo: 1;
}

body.tema-osz.dark {
    --marka:            #F39A3D;
    --marka-vilagos:    #FBC06A;
    --marka-sotet:      #D9761F;
    --marka-halvany:    rgba(243, 154, 61, 0.16);

    --hatter:           #16100C;
    --felulet:          #211913;
    --felulet-emelt:    #2A2018;
    --felulet-halvany:  #31261C;

    --szoveg:           #F6EADB;
    --szoveg-halk:      #C7B19A;
    --szoveg-halkabb:   #A8927E;

    --keret:            #3E3025;
    --keret-eros:       #574330;

    --arnyek-s:   0 1px 2px rgba(0, 0, 0, .45);
    --arnyek-m:   0 2px 6px rgba(0, 0, 0, .50), 0 8px 24px rgba(0, 0, 0, .40);
    --arnyek-l:   0 4px 12px rgba(0, 0, 0, .55), 0 16px 48px rgba(0, 0, 0, .50);

    --osz-arany:        #F2B04A;
    --osz-ikon:         #E8A04A;
    --osz-menu-teto:    #141B29;
    --osz-menu-alj:     #261B13;
    --osz-szam-veg:     #FBC06A;
    --osz-level-atlatszo: .9;
}

/* --------------------------------------------------------------------------
   Háttér: napsütötte őszi délután
   --------------------------------------------------------------------------
   Fent tiszta, világos égszínkék, ami lefelé aranyló párába fordul, a
   képernyő alján rét-derengés. Jobbra fent a nap: fehéren izzó mag, aranyló
   udvar, és belőle halvány fénysugarak törnek elő, mint a lomb mögül.
   A rétegek a viewporthoz rögzítettek, tehát görgetéskor az ég marad fent.

   Sötétben alkonyat: mélykék égből a horizont felé borostyánba hajló fény,
   a nap lejjebb, vörösesebben.

   A kártyák, táblázatok és diagramok saját, tömör felületen ülnek, így a
   háttér színessége az olvashatóságukat nem érinti.
   -------------------------------------------------------------------------- */
body.tema-osz {
    --osz-nap-x: 78%;
    --osz-nap-y: 30%;
    background-image:
        radial-gradient(circle at var(--osz-nap-x) var(--osz-nap-y),
            rgba(255, 253, 240, 1) 0, rgba(255, 246, 205, .95) 3%,
            rgba(255, 224, 140, .55) 11%, rgba(255, 200, 90, .18) 24%, transparent 42%),
        linear-gradient(180deg, transparent 72%, rgba(214, 196, 80, .10) 88%, rgba(176, 178, 56, .16) 100%),
        linear-gradient(180deg, #A9D8F5 0%, #CBE7F6 22%, #F4F0DC 50%, #FBE6B6 76%, #F8E2AA 100%);
    background-attachment: fixed;
}
body.tema-osz.dark {
    --osz-nap-x: 84%;
    --osz-nap-y: 74%;
    background-image:
        radial-gradient(circle at var(--osz-nap-x) var(--osz-nap-y),
            rgba(255, 200, 130, .60) 0, rgba(245, 140, 60, .32) 8%,
            rgba(200, 80, 30, .12) 22%, transparent 42%),
        linear-gradient(180deg, transparent 70%, rgba(90, 60, 20, .18) 88%, rgba(70, 50, 15, .30) 100%),
        linear-gradient(180deg, #0E1626 0%, #1A1D2E 30%, #2E2128 58%, #422620 82%, #4A2A1E 100%);
}

/* A fénysugarak: két, eltérő ütemű kúpos színátmenet egymáson, hogy a
   sugarak ne legyenek egyformák; a nap körül erősek, kifelé elhalnak.
   Nagyon lassan fordulnak, mintha a lomb mozogna a fény előtt. A tartalom
   mögött van (z-index: -1), az ég fölött. */
body.tema-osz::before {
    content: "";
    position: fixed;
    left: var(--osz-nap-x);
    top: var(--osz-nap-y);
    /* Csak akkora, amekkorán a sugarak látszanak (kb. 41vmax-ig): egy
       viewportnyinál nagyobb forgó réteg nagy kijelzőn ~50 MB-os grafikus
       memóriát kérne, ami gyengébb telefonon akadozást okoz. */
    width: 90vmax;
    height: 90vmax;
    margin: -45vmax 0 0 -45vmax;
    pointer-events: none;
    z-index: -1;
    background:
        repeating-conic-gradient(from 0deg, rgba(255, 248, 215, 0) 0deg 6deg, rgba(255, 248, 215, .55) 8deg 9deg, rgba(255, 248, 215, 0) 11deg 13deg),
        repeating-conic-gradient(from 4deg, rgba(255, 238, 180, 0) 0deg 11deg, rgba(255, 238, 180, .45) 14deg 16deg, rgba(255, 238, 180, 0) 19deg 21deg);
    -webkit-mask-image: radial-gradient(circle closest-side, rgba(0, 0, 0, .85) 0, rgba(0, 0, 0, .35) 32%, transparent 91%);
            mask-image: radial-gradient(circle closest-side, rgba(0, 0, 0, .85) 0, rgba(0, 0, 0, .35) 32%, transparent 91%);
    animation: osz-sugar 360s linear infinite;
}
/* Alkonyatkor a sugarak csak sejlenek: sötét háttéren a világos csíkok
   különben csillagrobbanásként vinnék el a figyelmet a szövegről. */
body.tema-osz.dark::before {
    opacity: .14;
}
body.tema-osz.tema-animacio-ki::before { animation: none; }

@keyframes osz-sugar {
    to { transform: rotate(360deg); }
}

body.tema-osz ::selection { background: rgba(240, 160, 60, .35); }

/* --------------------------------------------------------------------------
   Oldalmenü: lefelé melegedő háttér, borostyán ikonok, az alján őszi ág
   -------------------------------------------------------------------------- */
body.tema-osz .oldalmenu {
    background: linear-gradient(180deg, var(--osz-menu-teto) 0%, var(--felulet) 30%, var(--osz-menu-alj) 100%);
}

body.tema-osz .menu-elem .fa,
body.tema-osz .menu-csoport-fej > span .fa { color: var(--osz-ikon); }
body.tema-osz .menu-elem.aktiv .fa { color: inherit; }

body.tema-osz .menu-elem.aktiv {
    background: linear-gradient(90deg, rgba(233, 140, 40, .22), rgba(233, 140, 40, .05));
}

/* Dísz a menü alján: őszi ág levelekkel és berkenyével (vektoros, ugyanazok
   a levélformák, amik hullanak). A menüpontok után jön, és a flex
   margin-top: auto tartja lent: ha van hely, a menü aljára kerül, ha nincs,
   a menüvel együtt görgethető — így sosem takar el menüpontot.

   A méret a rajz saját arányát követi (260×93 → 232×83), hogy ne torzuljon;
   a felső térköz a háttér alá esik (content-box), elválasztva az utolsó
   menüponttól. Szellő gyanánt alig észrevehetően ring. */
body.tema-osz .oldalmenu-tartalom {
    display: flex;
    flex-direction: column;
}
body.tema-osz .oldalmenu-tartalom::after {
    content: "";
    flex: 0 0 auto;
    align-self: center;
    box-sizing: border-box;
    width: 232px;
    height: 99px;
    padding-top: var(--terkoz-m);
    margin-top: auto;
    background: url(../images/tema-osz/ag.svg) center bottom / contain no-repeat;
    background-origin: content-box;
    transform-origin: 6% 70%;
    animation: osz-ag 7s ease-in-out infinite alternate;
}
body.tema-osz.tema-animacio-ki .oldalmenu-tartalom::after { animation: none; }

@keyframes osz-ag {
    from { transform: rotate(-1.2deg); }
    to   { transform: rotate(1.4deg); }
}

/* --------------------------------------------------------------------------
   Címek: a középre zárt főcím alá levélmotívumos díszvonal
   -------------------------------------------------------------------------- */
body.tema-osz h1.text-center::after {
    content: "";
    display: block;
    width: 168px;
    height: 22px;
    margin: 10px auto 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 168 22'%3E%3Cdefs%3E%3Cpath id='l' d='M44 68L43 68L42 67L41 67L40 66L39 66L39 65L38 65L38 64L37 64L36 64L35 64L34 64L33 63L32 63L30 64L29 63L29 62L28 62L25 62L24 61L25 60L25 59L24 58L25 57L26 55L27 54L27 53L28 52L29 51L29 50L29 49L29 48L28 47L27 46L25 45L24 44L24 43L22 41L19 39L19 38L19 37L17 34L15 31L15 30L17 29L18 28L19 27L22 28L25 29L27 28L28 28L30 29L33 30L34 30L35 30L37 31L39 32L40 31L40 29L40 27L40 26L41 23L41 20L42 19L43 18L43 15L44 11L46 10L47 10L48 6L50 2L52 6L53 10L54 10L56 11L57 15L57 18L58 19L59 20L59 23L60 26L60 27L60 29L60 31L61 32L63 31L65 30L66 30L67 30L70 29L72 28L73 28L75 29L78 28L81 27L82 28L83 29L85 30L85 31L83 34L81 37L81 38L81 39L78 41L76 43L76 44L75 45L73 46L72 47L71 48L71 49L71 50L71 51L72 52L73 53L73 54L74 55L75 57L76 58L75 59L75 60L76 61L75 62L72 62L71 62L71 63L70 64L68 63L67 63L66 64L65 64L64 64L63 64L62 64L62 65L61 65L61 66L60 66L59 67L58 67L57 68L56 68L51.6 66L51 92L49 92L48.4 66Z'/%3E%3C/defs%3E%3Cpath d='M8 11H64M104 11H160' stroke='%23DDBF97' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='3' cy='11' r='1.6' fill='%23DDBF97'/%3E%3Ccircle cx='165' cy='11' r='1.6' fill='%23DDBF97'/%3E%3Cuse xlink:href='%23l' fill='%23D9661A' transform='translate(73 0) scale(.22) rotate(-14 50 50)'/%3E%3Cuse xlink:href='%23l' fill='%23E9A21B' transform='translate(62 6) scale(.11) rotate(-60 50 50)'/%3E%3Cuse xlink:href='%23l' fill='%23E9A21B' transform='translate(95 6) scale(.11) rotate(50 50 50)'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.tema-osz.dark h1.text-center::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 168 22'%3E%3Cdefs%3E%3Cpath id='l' d='M44 68L43 68L42 67L41 67L40 66L39 66L39 65L38 65L38 64L37 64L36 64L35 64L34 64L33 63L32 63L30 64L29 63L29 62L28 62L25 62L24 61L25 60L25 59L24 58L25 57L26 55L27 54L27 53L28 52L29 51L29 50L29 49L29 48L28 47L27 46L25 45L24 44L24 43L22 41L19 39L19 38L19 37L17 34L15 31L15 30L17 29L18 28L19 27L22 28L25 29L27 28L28 28L30 29L33 30L34 30L35 30L37 31L39 32L40 31L40 29L40 27L40 26L41 23L41 20L42 19L43 18L43 15L44 11L46 10L47 10L48 6L50 2L52 6L53 10L54 10L56 11L57 15L57 18L58 19L59 20L59 23L60 26L60 27L60 29L60 31L61 32L63 31L65 30L66 30L67 30L70 29L72 28L73 28L75 29L78 28L81 27L82 28L83 29L85 30L85 31L83 34L81 37L81 38L81 39L78 41L76 43L76 44L75 45L73 46L72 47L71 48L71 49L71 50L71 51L72 52L73 53L73 54L74 55L75 57L76 58L75 59L75 60L76 61L75 62L72 62L71 62L71 63L70 64L68 63L67 63L66 64L65 64L64 64L63 64L62 64L62 65L61 65L61 66L60 66L59 67L58 67L57 68L56 68L51.6 66L51 92L49 92L48.4 66Z'/%3E%3C/defs%3E%3Cpath d='M8 11H64M104 11H160' stroke='%235C4632' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='3' cy='11' r='1.6' fill='%235C4632'/%3E%3Ccircle cx='165' cy='11' r='1.6' fill='%235C4632'/%3E%3Cuse xlink:href='%23l' fill='%23F39A3D' transform='translate(73 0) scale(.22) rotate(-14 50 50)'/%3E%3Cuse xlink:href='%23l' fill='%23C9822E' transform='translate(62 6) scale(.11) rotate(-60 50 50)'/%3E%3Cuse xlink:href='%23l' fill='%23C9822E' transform='translate(95 6) scale(.11) rotate(50 50 50)'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   Számcsempék: a szám rozsdától borostyánig színátmenetes, a sarokban egy
   halvány juharlevél
   -------------------------------------------------------------------------- */
body.tema-osz .szam-csempe {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath transform='rotate(24 50 50)' d='M44 68L43 68L42 67L41 67L40 66L39 66L39 65L38 65L38 64L37 64L36 64L35 64L34 64L33 63L32 63L30 64L29 63L29 62L28 62L25 62L24 61L25 60L25 59L24 58L25 57L26 55L27 54L27 53L28 52L29 51L29 50L29 49L29 48L28 47L27 46L25 45L24 44L24 43L22 41L19 39L19 38L19 37L17 34L15 31L15 30L17 29L18 28L19 27L22 28L25 29L27 28L28 28L30 29L33 30L34 30L35 30L37 31L39 32L40 31L40 29L40 27L40 26L41 23L41 20L42 19L43 18L43 15L44 11L46 10L47 10L48 6L50 2L52 6L53 10L54 10L56 11L57 15L57 18L58 19L59 20L59 23L60 26L60 27L60 29L60 31L61 32L63 31L65 30L66 30L67 30L70 29L72 28L73 28L75 29L78 28L81 27L82 28L83 29L85 30L85 31L83 34L81 37L81 38L81 39L78 41L76 43L76 44L75 45L73 46L72 47L71 48L71 49L71 50L71 51L72 52L73 53L73 54L74 55L75 57L76 58L75 59L75 60L76 61L75 62L72 62L71 62L71 63L70 64L68 63L67 63L66 64L65 64L64 64L63 64L62 64L62 65L61 65L61 66L60 66L59 67L58 67L57 68L56 68L51.6 66L51 92L49 92L48.4 66Z' fill='%23D9661A' fill-opacity='0.09'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right -14px bottom -16px;
    background-size: 64px 64px;
}
body.tema-osz.dark .szam-csempe { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath transform='rotate(24 50 50)' d='M44 68L43 68L42 67L41 67L40 66L39 66L39 65L38 65L38 64L37 64L36 64L35 64L34 64L33 63L32 63L30 64L29 63L29 62L28 62L25 62L24 61L25 60L25 59L24 58L25 57L26 55L27 54L27 53L28 52L29 51L29 50L29 49L29 48L28 47L27 46L25 45L24 44L24 43L22 41L19 39L19 38L19 37L17 34L15 31L15 30L17 29L18 28L19 27L22 28L25 29L27 28L28 28L30 29L33 30L34 30L35 30L37 31L39 32L40 31L40 29L40 27L40 26L41 23L41 20L42 19L43 18L43 15L44 11L46 10L47 10L48 6L50 2L52 6L53 10L54 10L56 11L57 15L57 18L58 19L59 20L59 23L60 26L60 27L60 29L60 31L61 32L63 31L65 30L66 30L67 30L70 29L72 28L73 28L75 29L78 28L81 27L82 28L83 29L85 30L85 31L83 34L81 37L81 38L81 39L78 41L76 43L76 44L75 45L73 46L72 47L71 48L71 49L71 50L71 51L72 52L73 53L73 54L74 55L75 57L76 58L75 59L75 60L76 61L75 62L72 62L71 62L71 63L70 64L68 63L67 63L66 64L65 64L64 64L63 64L62 64L62 65L61 65L61 66L60 66L59 67L58 67L57 68L56 68L51.6 66L51 92L49 92L48.4 66Z' fill='%23F39A3D' fill-opacity='0.08'/%3E%3C/svg%3E"); }
body.tema-osz .szam-csempe:hover { border-color: var(--osz-arany); }

body.tema-osz .szam-csempe .szam {
    background: linear-gradient(120deg, var(--marka) 20%, var(--osz-szam-veg) 100%);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* Az utótag („nap") saját színt tart, ne vegye át az átlátszó kitöltést. */
body.tema-osz .szam-csempe .szam-utotag { -webkit-text-fill-color: var(--szoveg-halk); }

/* --------------------------------------------------------------------------
   Gombok és sávok
   -------------------------------------------------------------------------- */
body.tema-osz .btn-danger,
body.tema-osz .btn-primary,
body.tema-osz .btn-info {
    background: linear-gradient(180deg, #C8551A 0%, var(--marka) 100%);
}
body.tema-osz .btn-danger:hover, body.tema-osz .btn-primary:hover, body.tema-osz .btn-info:hover,
body.tema-osz .btn-danger:focus, body.tema-osz .btn-primary:focus, body.tema-osz .btn-info:focus {
    background: var(--marka-sotet);
}

/* Sötétben a borostyán gomb világos, ezért a felirata sötét: fehérrel csak
   2,2:1 volna a kontraszt, így 7,9:1. */
body.tema-osz.dark .btn-danger,
body.tema-osz.dark .btn-primary,
body.tema-osz.dark .btn-info {
    background: linear-gradient(180deg, #F7AE55 0%, var(--marka) 100%);
    color: #24170E;
}
body.tema-osz.dark .btn-danger:hover, body.tema-osz.dark .btn-primary:hover, body.tema-osz.dark .btn-info:hover,
body.tema-osz.dark .btn-danger:focus, body.tema-osz.dark .btn-primary:focus, body.tema-osz.dark .btn-info:focus {
    background: var(--marka-vilagos);
    color: #24170E;
}
body.tema-osz.dark .kviz-ajanlo-gomb,
body.tema-osz.dark .kviz-ajanlo-gomb:hover,
body.tema-osz.dark .kviz-ajanlo-gomb:focus,
body.tema-osz.dark .kviz-ful.aktiv,
body.tema-osz.dark .select2-results .select2-highlighted {
    color: #24170E !important;
}
/* A halvány fülsor kijelölt eleme nem kitöltött, hanem keretes: a háttere a
   sötét felület, ezért ott a felirat marad borostyán. Enélkül a fenti szabály
   azt is sötétre festené, és a felirat eltűnne a háttérben. */
body.tema-osz.dark .kviz-fulek-halvany .kviz-ful.aktiv {
    color: var(--marka) !important;
}

body.tema-osz .kviz-ajanlo {
    background: linear-gradient(90deg, rgba(240, 160, 60, .22), rgba(240, 160, 60, .07));
}

/* --------------------------------------------------------------------------
   Szófelhő: a gyakoriság sorrendje most a lomb színeiben — a ritka szó
   sárguló, a gyakori mélyvörös. A világosság továbbra is egy irányba lép,
   tehát a szín és a méret ugyanazt mondja.
   -------------------------------------------------------------------------- */
body.tema-osz #szofelho .highcharts-point.szo-1 { fill: #E5B04A; }
body.tema-osz #szofelho .highcharts-point.szo-2 { fill: #E08A2C; }
body.tema-osz #szofelho .highcharts-point.szo-3 { fill: #CC6118; }
body.tema-osz #szofelho .highcharts-point.szo-4 { fill: #A8400F; }
body.tema-osz #szofelho .highcharts-point.szo-5 { fill: #7A2A0C; }

body.tema-osz.dark #szofelho .highcharts-point.szo-1 { fill: #7A4A1E; }
body.tema-osz.dark #szofelho .highcharts-point.szo-2 { fill: #A86424; }
body.tema-osz.dark #szofelho .highcharts-point.szo-3 { fill: #D68A2E; }
body.tema-osz.dark #szofelho .highcharts-point.szo-4 { fill: #F0A93C; }
body.tema-osz.dark #szofelho .highcharts-point.szo-5 { fill: #FFD07A; }

/* --------------------------------------------------------------------------
   Mobil fejléc: egy levél a cím mellett
   -------------------------------------------------------------------------- */
body.tema-osz .mobilfejlec-cim::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 6px;
    vertical-align: -2px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath transform='rotate(-12 50 50)' d='M44 68L43 68L42 67L41 67L40 66L39 66L39 65L38 65L38 64L37 64L36 64L35 64L34 64L33 63L32 63L30 64L29 63L29 62L28 62L25 62L24 61L25 60L25 59L24 58L25 57L26 55L27 54L27 53L28 52L29 51L29 50L29 49L29 48L28 47L27 46L25 45L24 44L24 43L22 41L19 39L19 38L19 37L17 34L15 31L15 30L17 29L18 28L19 27L22 28L25 29L27 28L28 28L30 29L33 30L34 30L35 30L37 31L39 32L40 31L40 29L40 27L40 26L41 23L41 20L42 19L43 18L43 15L44 11L46 10L47 10L48 6L50 2L52 6L53 10L54 10L56 11L57 15L57 18L58 19L59 20L59 23L60 26L60 27L60 29L60 31L61 32L63 31L65 30L66 30L67 30L70 29L72 28L73 28L75 29L78 28L81 27L82 28L83 29L85 30L85 31L83 34L81 37L81 38L81 39L78 41L76 43L76 44L75 45L73 46L72 47L71 48L71 49L71 50L71 51L72 52L73 53L73 54L74 55L75 57L76 58L75 59L75 60L76 61L75 62L72 62L71 62L71 63L70 64L68 63L67 63L66 64L65 64L64 64L63 64L62 64L62 65L61 65L61 66L60 66L59 67L58 67L57 68L56 68L51.6 66L51 92L49 92L48.4 66Z' fill='%23D9661A' fill-opacity='1'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.tema-osz.dark .mobilfejlec-cim::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath transform='rotate(-12 50 50)' d='M44 68L43 68L42 67L41 67L40 66L39 66L39 65L38 65L38 64L37 64L36 64L35 64L34 64L33 63L32 63L30 64L29 63L29 62L28 62L25 62L24 61L25 60L25 59L24 58L25 57L26 55L27 54L27 53L28 52L29 51L29 50L29 49L29 48L28 47L27 46L25 45L24 44L24 43L22 41L19 39L19 38L19 37L17 34L15 31L15 30L17 29L18 28L19 27L22 28L25 29L27 28L28 28L30 29L33 30L34 30L35 30L37 31L39 32L40 31L40 29L40 27L40 26L41 23L41 20L42 19L43 18L43 15L44 11L46 10L47 10L48 6L50 2L52 6L53 10L54 10L56 11L57 15L57 18L58 19L59 20L59 23L60 26L60 27L60 29L60 31L61 32L63 31L65 30L66 30L67 30L70 29L72 28L73 28L75 29L78 28L81 27L82 28L83 29L85 30L85 31L83 34L81 37L81 38L81 39L78 41L76 43L76 44L75 45L73 46L72 47L71 48L71 49L71 50L71 51L72 52L73 53L73 54L74 55L75 57L76 58L75 59L75 60L76 61L75 62L72 62L71 62L71 63L70 64L68 63L67 63L66 64L65 64L64 64L63 64L62 64L62 65L61 65L61 66L60 66L59 67L58 67L57 68L56 68L51.6 66L51 92L49 92L48.4 66Z' fill='%23F39A3D' fill-opacity='1'/%3E%3C/svg%3E"); }

/* --------------------------------------------------------------------------
   Hulló levelek (a js/tema-osz.js rakja ki őket)

   A réteg a tartalom fölött, de az oldalmenü, a mobil fejléc, a legördülők
   és a modális ablakok alatt van, és nem fogja meg az egeret. Nagy kijelzőn
   nyitott menü mellett csak a tartalom fölött hullanak, a menü tiszta marad.
   -------------------------------------------------------------------------- */
body.tema-osz .levelhullas {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 1020;
    opacity: var(--osz-level-atlatszo);
    transition: left 200ms ease;
}
@media (min-width: 992px) {
    body.tema-osz:not(.menu-zarva):not(.menu-nelkul) .levelhullas { left: var(--menu-szelesseg); }
}

body.tema-osz .level {
    position: absolute;
    top: -60px;
    width: var(--meret);
    height: var(--meret);
    opacity: var(--atlatszo);
    animation: osz-hull var(--hull) linear var(--kes) infinite;
    will-change: transform;
}
body.tema-osz .level-leng {
    width: 100%;
    height: 100%;
    animation: osz-leng var(--leng-ido) ease-in-out var(--kes) infinite alternate;
}
body.tema-osz .level-forog {
    display: block;
    width: 100%;
    height: 100%;
    animation: osz-forog var(--forog-ido) linear infinite;
}

@keyframes osz-hull {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(var(--sodor), calc(100vh + 120px), 0); }
}
@keyframes osz-leng {
    from { transform: translateX(calc(var(--leng) * -1)) rotate(-28deg); }
    to   { transform: translateX(var(--leng)) rotate(28deg); }
}
@keyframes osz-forog {
    from { transform: rotate3d(var(--ax), var(--ay), .2, 0deg); }
    to   { transform: rotate3d(var(--ax), var(--ay), .2, 360deg); }
}

/* A menü alján lévő ki-be kapcsoló — csökkentett mozgásnál nincs értelme,
   ott a levelek el sem indulnak. */
@media (prefers-reduced-motion: reduce) {
    body.tema-osz .levelhullas, body.tema-osz .tema-animacio-gomb { display: none !important; }
    /* A modern réteg „* { animation: none }" szabálya az ::after-re nem hat. */
    body.tema-osz .oldalmenu-tartalom::after,
    body.tema-osz::before { animation: none !important; }
}

@media print {
    body.tema-osz .levelhullas { display: none !important; }
}
