/* ============================================================================
   Évszak- és ünnepi animáció (js/evszak-animacio.js) – a TrimmGo app
   bejelentkező képernyőjének webes megfelelője. A réteg a háttér (.ea-aura)
   elemben van, a kártya mögött; érintést nem fog el.
   Használja: bejelentkezes.php (+ jelszó-oldalak), admin/admin_bejelentkezes.php,
   gazdi/belepes.php – módosítás után mindhárom belépő felületen ellenőrizd!
   ============================================================================ */
.ea-reteg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}
.ea-reteg img { display: block; user-select: none; }

/* Hulló / felszálló részecskék: esés → lengés → forgás */
.ea-eses {
    position: absolute;
    top: 0;
    animation: eaEses var(--ido) linear infinite;
    will-change: transform;
}
@keyframes eaEses {
    from { transform: translateY(var(--tol)); }
    to { transform: translateY(var(--ig)); }
}
.ea-leng {
    animation: eaLeng var(--lido) ease-in-out infinite alternate;
}
@keyframes eaLeng {
    from { transform: translateX(calc(var(--leng) * -1)) rotateX(calc(var(--bil) * -1)) rotateY(0deg) rotate(calc(var(--bilz) * -1)); }
    to { transform: translateX(var(--leng)) rotateX(var(--bil)) rotateY(var(--ry)) rotate(var(--bilz)); }
}
.ea-forog {
    animation: eaForog var(--ido) linear infinite;
}
@keyframes eaForog {
    from { transform: rotate(0deg); }
    to { transform: rotate(var(--forg)); }
}
/* A hópehely a világos háttéren is látsszon: halvány meleg árnyék */
.ea-ho {
    color: #fff;
    text-shadow: 0 0 2px rgba(101, 36, 16, 0.35), 0 1px 6px rgba(101, 36, 16, 0.25);
}
.ea-szirom { border-radius: 50% 50% 50% 2px; opacity: 0.9; }
.ea-konfetti { border-radius: 1.5px; }
.ea-dobog { animation: eaDobog 420ms ease-in-out infinite alternate; }
@keyframes eaDobog { to { transform: scale(1.12); } }

/* Repülő állatok */
.ea-repul {
    position: absolute;
    left: 0;
    animation: eaUtX var(--ido) linear infinite;
    will-change: transform;
}
@keyframes eaUtX {
    from { transform: translateX(var(--tol)); }
    to { transform: translateX(var(--ig)); }
}
.ea-hullam { animation: eaHullam var(--hido) ease-in-out infinite alternate; }
@keyframes eaHullam {
    from { transform: translateY(calc(var(--hul) * -1)) rotate(calc(var(--bilz) * -1)); }
    to { transform: translateY(var(--hul)) rotate(var(--bilz)); }
}

/* Két képkocka felváltva (szárnycsapás, lépés) */
.ea-kocka { position: relative; }
.ea-kocka img { position: absolute; inset: 0; }
.ea-kocka1 { animation: eaKocka1 var(--kido) linear infinite; }
.ea-kocka2 { animation: eaKocka2 var(--kido) linear infinite; }
@keyframes eaKocka1 { 0%, 49.9% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes eaKocka2 { 0%, 49.9% { opacity: 0; } 50%, 100% { opacity: 1; } }

/* Süni: oda (0–42%), kint áll, megfordul, vissza (50–92%), kint áll */
.ea-suni {
    position: absolute;
    left: 0;
    bottom: 14px;
    animation: eaSuniUt 52s linear infinite;
}
@keyframes eaSuniUt {
    0% { transform: translateX(-106px) scaleX(1); }
    42% { transform: translateX(calc(100vw + 10px)) scaleX(1); }
    46% { transform: translateX(calc(100vw + 10px)) scaleX(1); }
    46.01% { transform: translateX(calc(100vw + 10px)) scaleX(-1); }
    92% { transform: translateX(-106px) scaleX(-1); }
    96% { transform: translateX(-106px) scaleX(-1); }
    96.01% { transform: translateX(-106px) scaleX(1); }
    100% { transform: translateX(-106px) scaleX(1); }
}
.ea-suni-lepes { animation: eaLepes 420ms linear infinite; }
@keyframes eaLepes {
    0%, 50%, 100% { transform: translateY(0); }
    25%, 75% { transform: translateY(-1.5px); }
}

/* Mókus: álló / ugró póz */
.ea-mokus { position: absolute; left: 0; top: 0; }
.ea-mokus-poz { position: relative; }
.ea-mokus-poz img { position: absolute; inset: 0; }
.ea-mokus-ugr { opacity: 0; }
.ea-mokus-poz.ugro .ea-mokus-all { opacity: 0; }
.ea-mokus-poz.ugro .ea-mokus-ugr { opacity: 1; }

/* Húsvéti nyuszi a kártya mögül */
.ea-nyuszi { position: absolute; }
.ea-nyuszi-fej { transform-origin: 50% 100%; }

/* Pislákoló fénypont (csillagok, fa díszei, égősor) */
.ea-pislako {
    position: absolute;
    border-radius: 50%;
    animation: eaPislog var(--pido) ease-in-out infinite alternate;
}
@keyframes eaPislog {
    from { opacity: 0.15; }
    to { opacity: 0.95; }
}
.ea-kor { position: absolute; border-radius: 50%; }

/* Tűzijáték */
.ea-loves { position: absolute; width: 0; height: 0; }
.ea-raketa {
    position: absolute;
    left: -1.5px; top: -1.5px;
    width: 3px; height: 14px;
    border-radius: 2px;
    background: #fff4c2;
    box-shadow: 0 0 6px #fff4c2;
}
.ea-villanas {
    position: absolute;
    left: -14px; top: -14px;
    width: 28px; height: 28px;
    border-radius: 50%;
    opacity: 0;
}
.ea-szikra-ut { position: absolute; left: 0; top: 0; }
.ea-szikra {
    position: absolute;
    left: -2.5px; top: -2.5px;
    width: 5px; height: 5px;
    border-radius: 50%;
    opacity: 0;
}

/* Nyár: napsütés */
.ea-nap { position: absolute; inset: 0; }
.ea-sugar {
    position: absolute;
    transform-origin: 0 50%;
    background: linear-gradient(90deg, rgba(255, 244, 190, 0.7), rgba(255, 244, 190, 0));
    animation: eaSugar var(--pido) ease-in-out infinite alternate;
}
@keyframes eaSugar {
    from { opacity: 0.25; }
    to { opacity: 0.85; }
}
.ea-nap-mag {
    background: #fff6c8;
    box-shadow: 0 0 40px rgba(255, 230, 140, 0.9);
    animation: eaNapMag 3s ease-in-out infinite alternate;
}
@keyframes eaNapMag { to { transform: scale(1.12); } }
.ea-folt {
    background: #fff4c2;
    animation: eaFolt 3s ease-in-out infinite alternate;
}
@keyframes eaFolt {
    from { opacity: 0.15; }
    to { opacity: 0.4; }
}

/* Álló elemek */
.ea-allok { position: absolute; inset: 0; }
.ea-allo {
    position: absolute;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2));
    animation: eaAlloBe 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
@keyframes eaAlloBe {
    from { opacity: 0; scale: 0.6; }
}
.ea-gumi {
    border-style: solid;
    border-radius: 50%;
    border-color: #e03131 #ffffff;
    transform: rotate(45deg);
}
.ea-lapat { display: flex; flex-direction: column; align-items: center; }
.ea-tok-feny {
    position: absolute;
    border-radius: 50%;
    background: #ffa94d;
    animation: eaTokFeny var(--pido) ease-in-out infinite alternate;
}
@keyframes eaTokFeny {
    from { opacity: 0.35; }
    to { opacity: 0.8; }
}

/* Éjszakai ünnepek háttere (szilveszter, aug. 20., Halloween) */
body.ea-u-szilveszter .ea-aura,
body.ea-u-augusztus20 .ea-aura {
    background: radial-gradient(120% 90% at 50% 0%, #3b2433 0%, #1d1219 55%, #0c080b 100%);
}
body.ea-u-halloween .ea-aura {
    background: radial-gradient(120% 90% at 50% 0%, #4b2a63 0%, #2a1638 55%, #140a1f 100%);
}
body.ea-u-szilveszter .ea-aura > span,
body.ea-u-augusztus20 .ea-aura > span,
body.ea-u-halloween .ea-aura > span {
    opacity: 0.12;
}

/* ===== Díszítés a kártyán ===== */
.ea-koszontes {
    margin: -18px 0 22px;
    color: #9a4a26;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}
.ea-logo-hely { position: relative; display: inline-block; }
.ea-sapka {
    position: absolute;
    left: -9px; top: -15px;
    width: 30px;
    transform: rotate(-18deg);
}
.ea-vaza {
    display: inline-block;
    width: 30px;
    margin-right: 6px;
    vertical-align: bottom;
}

.ea-disz {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}
.ea-disz img { position: absolute; }
.ea-kendo {
    position: absolute;
    inset: -8px;
    border: 4px solid;
    border-radius: 38px;
}
.ea-kendo-belso { width: 100%; height: 100%; border: 4px solid; }
.ea-kendo-piros { border-color: #ce2939; }
.ea-kendo-feher { border-color: #ffffff; border-radius: 34px; }
.ea-kendo-zold { border-color: #477050; border-radius: 30px; }
.ea-csomo { left: -36px; bottom: -48px; width: 80px; transform: rotate(-12deg); }
.ea-kokarda { right: -22px; top: -26px; width: 56px; transform: rotate(14deg); }
.ea-zaszlo { right: -26px; top: -58px; width: 66px; transform: rotate(6deg); }
.ea-korona { left: 50%; top: -64px; width: 86px; margin-left: -43px; }
.ea-kontener.ea-koronaval { margin-top: 50px; }
.ea-sarok-sziv { height: auto; }

/* Karácsonyi égősor a kártya tetején */
.ea-izzosor {
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 28px;
    pointer-events: none;
    z-index: 1;
}
.ea-izzosor svg { position: absolute; left: 0; top: 0; }
.ea-izzo-foglalat {
    position: absolute;
    width: 5px; height: 3px;
    border-radius: 1px;
    background: #2b2219;
}
.ea-izzo {
    position: absolute;
    width: 7px; height: 10px;
    border-radius: 3.5px;
    opacity: 0.6;
}
.ea-kartya.ea-izzosorral .kartya-fejlec,
.ea-kartya.ea-izzosorral.gz-kartya { padding-top: 54px; }

@media (max-width: 480px) {
    .ea-sarok-sziv { transform: scale(0.85); }
    .ea-kontener.ea-koronaval { margin-top: 64px; }
}

/* Sötét éjszakai háttéren a kártya maradjon világos */
body.ea-u-szilveszter .ea-kartya,
body.ea-u-augusztus20 .ea-kartya,
body.ea-u-halloween .ea-kartya {
    background: rgba(255, 252, 248, 0.92);
}
body.ea-u-szilveszter .kartya-lablec,
body.ea-u-augusztus20 .kartya-lablec,
body.ea-u-halloween .kartya-lablec {
    background: rgba(255, 255, 255, 0.5);
}


/* A kendő lekerekítése a kártyáéhoz igazodik (--ea-kartya-r) */
.ea-kendo { border-radius: calc(var(--ea-kartya-r, 30px) + 8px); }
.ea-kendo-feher { border-radius: calc(var(--ea-kartya-r, 30px) + 4px); }
.ea-kendo-zold { border-radius: var(--ea-kartya-r, 30px); }
/* Ha a kártya maga a díszek tárolója (gazdi belépés), legyen viszonyítási pont */
.ea-kartya.ea-kontener { position: relative; }