/*  id="cm-anti-fouc-css" */

/* 2026-07-11 LCP+CLS attervezes:
   - A regi teljes-body fuggony (opacity:0) miatt a Lighthouse SOSEM talalt LCP-jeloltet -> "NO_LCP" hiba.
   - A .001/.01 opacity trukk LCP-t adott, de igy a kesleltetett CSS alatti belso ugralasok CLS-kent szamitottak (lab ~0.18).
   - MOST: csak a MAIN + FOOTER van letakarva (opacity:0 alatt sem LCP, sem CLS nem szamit),
     a fejlec/promo-sav viszont LATSZIK az elso festestol (a fejlec CSS-e szandekosan blokkolo!),
     igy a logo azonnali, ervenyes LCP-jelolt, es a latogato is hamarabb lat fejlecet. */
html.cm-loading main#main-content, html.cm-loading main, html.cm-loading body > footer,
html.cm-loading .cm-mfoot{opacity:0 !important;}
/* Nincs transition: hatterfulon (document.hidden) az atmenet befagy, es a tartalom a ful
   fokuszalasaig lathatatlan maradna — azonnali megjelenes a CSS-kesz reveal-nel. */
html.cm-ready main#main-content, html.cm-ready main, html.cm-ready body > footer,
html.cm-ready .cm-mfoot{opacity:1;}
html.cm-loading{overflow-anchor:none}
/* 2026-10-09 (PSI, LCP): a fooldali hero (h1 = LCP-elem) mar a fuggony alatt latszik, amint a markupja kesz
   (cm-hero-kesz osztaly: cm-home-redesign/template-front-desktop.php); a main tobbi resze cm-ready-ig takarva. */
html.cm-loading.cm-hero-kesz main#main-content,html.cm-loading.cm-hero-kesz main#cm-home-desktop{opacity:1!important}
html.cm-loading.cm-hero-kesz main#main-content>:not(#cm-home-desktop),html.cm-loading.cm-hero-kesz #cm-home-desktop>:not(.cm-home-redesign__container),html.cm-loading.cm-hero-kesz .cm-home-redesign__container>:not(.cm-home-redesign__layout),html.cm-loading.cm-hero-kesz .cm-home-redesign__layout>:not(.cm-home-redesign__main),html.cm-loading.cm-hero-kesz .cm-home-redesign__main>:not(.cm-hero){opacity:0!important}
/* 2026-10-09 (CLS): az mpp-main (halasztott CSS) alap betu- es link-szabalyai elore, AZONOS ertekkel (a vegso
   kaszkad valtozatlan) — enelkul lassu telefonon Times New Roman + kek, alahuzott linkek, majd ujratordeles. */
body.mpp-portal{font-family:var(--font-sans);font-size:16px;line-height:1.55}
a{color:inherit;text-decoration:none}
/* Pre-reserve header height to avoid layout shift during the brief opacity:0 phase.
   1200-tol (nem 1400-tol): a Lighthouse asztali nezete 1350px szeles, ott is kell. */
/* CLS-meres (2026-07-11): 1200-1399px kozott (Lighthouse asztali nezet = 1350px!) a fejlec
   FIXED, es a body padding-top kompenzacio csak a kesleltetett CSS-sel erkezett -> a teljes
   tartalom 67px-et ugrott (0.133 CLS). Elore adjuk; a tema vegleges CSS-e ugyanezt allitja.
   FONTOS: 1400px FELETT a fejlec NEM fixed (position:relative, body padding-top:0) — ott ez
   a padding ures feher savot tolna az oldal tetejere (tulaj 2026-07-11: "a header brutalisan
   megnott"), ezert szigoruan max-width:1399-ig ervenyes! */
@media (min-width:1200px) and (max-width:1399px){
  html body{padding-top:91px;}
  html body header.top-head{min-height:91px;}
}
@media (min-width:1200px){
  html body .promo-bar{height:38px;min-height:38px;max-height:38px;overflow:hidden;}
  html body .cm-hero{min-height:406px;}
}
/* Fejlec-ugras fix (tulaj 2026-07-11, F5/navigacio kozben "ugrik egyet a header"):
   1) A "Skip to content" link rejto CSS-e a kesleltetett main.css-ben volt -> betolteskor
      folyo elemkent a fejlec FOLE kerult, majd eltunt = fuggoleges ugras. Azonnal levisszuk. */
a.mpp-skip-link{position:absolute !important;left:-9999px !important;top:0 !important;}
/* A fuggoleges gorgetosav megjelenese/eltunese vizszintesen odebb tolta a TELJES elrendezest
   (ultrawide-on nagyon feltuno "ugralas", pl. promo-rotacional). A hely mindig foglalt: */
html{scrollbar-gutter:stable;}
@media (min-width:1400px){
  /* 2) >=1400-on a fejlec a tartalomfolyamban van (nem fixed!), es a profil-pill alap-CSS-e
        keson erkezik -> a pill betolteskor magasabbra nyilt, majd osszeugrott. A vegleges
        (1990px-en kimert) geometriat elore adjuk, a kesobbi CSS ugyanezt allitja. */
  html body header.top-head{min-height:116px;}
  html body header.top-head .container.top-row{min-height:86px;}
  html body header.top-head .mpp-user-panel__trigger{height:52px;padding:0 13px;border-radius:14px;display:flex;align-items:center;gap:9px;border:1px solid transparent;font-size:11px;letter-spacing:0.11px;}
  html body header.top-head .mpp-user-panel__trigger .mpp-user-panel__chev{width:10px;height:17px;font-size:17px;line-height:17px;}
  html body header.top-head .mpp-user-panel__trigger .mpp-user-panel__avatar-img{width:40px;height:40px;border-radius:50%;object-fit:cover;}
  html body header.top-head .mpp-user-panel__trigger .mpp-user-panel__name{font-size:18px;font-weight:800;}
  /* Szimulacios diff-meres (2026-07-11) maradek 5 tetele — a vegleges ertekek elore: */
  html body header.top-head{height:116px;}
  html body header.top-head .mpp-user-panel__trigger{order:2;}
  html body header.top-head .mpp-user-panel__icons{order:1;}
  html body header.top-head .account-actions #mppMsgTrigger,
  html body header.top-head .account-actions #mppNotifTrigger,
  html body header.top-head .account-actions #mppHeaderCartBtn{display:flex;position:relative;border:1px solid rgba(15,23,42,0.08);}
  html body header.top-head .promo-bar{position:relative;}
  html body header.top-head #siteNav .menu .cm-nav-ico{display:inline-flex !important;}
  /* Az utolso 2 betoltesi elteres: a mobil hamburger (#navBurger) desktopon is latszott
     stilus nelkul (ez volt a "kotojel"), a nyelvvalto pedig 88px-rol 58-ra szukult. */
  html body header.top-head #navBurger{display:none !important;}
  html body header.top-head #mppLangSwitcher{width:58px;max-width:58px;overflow:hidden;justify-content:center;}
}
/* 3) (2026-07-11 v2) Nincs tobbe fejlec-rejtes: a fejlec teljes vazszerkezete a
   cm-header-critical.php inline blokkjaban azonnal betoltodik, igy a fejlec az ELSO
   festestol a vegleges formajaban all — tulaj-keres: "barmit nyomok, mindig fix maradjon". */

/*  id="cm-header-gap-cart-profile-safe-css" */

@media (min-width:1400px){
  html body header.top-head .account-actions .mpp-user-panel{
    display:inline-flex!important;
    align-items:center!important;
    gap:4px!important;
    position:relative!important;
    flex:0 0 auto!important;
  }
  html body header.top-head .account-actions .mpp-user-panel > .mpp-user-dropdown{
    right:0!important;
    left:auto!important;
    top:calc(100% + 8px)!important;
    z-index:99999!important;
    transform:none!important;
  }
  html body header.top-head .top-row .logo{
    margin-right:38px!important;
    flex:0 0 auto!important;
    position:relative!important;
    z-index:3!important;
  }
  html body header.top-head .top-row{column-gap:30px!important}

  html body header.top-head .mpp-header-cart-wrap{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    overflow:visible!important;
  }
  html body header.top-head .mpp-header-cart-panel[hidden]{display:none!important}
  html body header.top-head .mpp-header-cart-panel.is-open,
  html body header.top-head .mpp-header-cart-panel:not([hidden]){
    display:block!important;
    position:absolute!important;
    top:calc(100% + 12px)!important;
    right:0!important;
    left:auto!important;
    width:360px!important;
    max-width:calc(100vw - 28px)!important;
    max-height:72vh!important;
    overflow:auto!important;
    padding:14px!important;
    border-radius:16px!important;
    background:#fff!important;
    color:#172033!important;
    border:1px solid #d8e5f7!important;
    box-shadow:0 18px 46px rgba(15,23,42,.22)!important;
    z-index:1000000!important;
    transform:none!important;
  }
  html body:not(.light-surface) header.top-head .mpp-header-cart-panel.is-open,
  html body:not(.light-surface) header.top-head .mpp-header-cart-panel:not([hidden]){
    background:#0f1724!important;
    color:#eaf1fb!important;
    border-color:#263a59!important;
    box-shadow:0 20px 56px rgba(0,0,0,.55)!important;
  }
  html body header.top-head .mpp-header-cart-panel a{color:inherit!important}
}

@media (max-width:1399px){
  html body header.top-head #mppUserDropdown.cm-mobile-profile-open{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:fixed!important;
    top:76px!important;
    right:8px!important;
    left:auto!important;
    width:min(315px,calc(100vw - 16px))!important;
    max-height:calc(100dvh - 92px)!important;
    overflow:auto!important;
    padding:8px!important;
    border-radius:18px!important;
    background:#fff!important;
    color:#111827!important;
    border:1px solid rgba(148,163,184,.45)!important;
    box-shadow:0 18px 48px rgba(15,23,42,.28)!important;
    z-index:1000000!important;
    pointer-events:auto!important;
  }
  html body:not(.light-surface) header.top-head #mppUserDropdown.cm-mobile-profile-open{
    background:#111827!important;
    color:#f8fafc!important;
    border-color:#334155!important;
  }
  html body header.top-head #mppUserDropdown.cm-mobile-profile-open .mpp-user-dropdown__nav{
    display:flex!important;
    flex-direction:column!important;
    gap:4px!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    visibility:visible!important;
    opacity:1!important;
  }
  html body header.top-head #mppUserDropdown.cm-mobile-profile-open .mpp-user-dropdown__item{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    min-height:42px!important;
    padding:10px 12px!important;
    border-radius:12px!important;
    color:inherit!important;
    font-size:15px!important;
    font-weight:900!important;
    text-decoration:none!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
}