/* =========================================================
   MOBILE HEADER – FINAL (FIXED)
   - logo balra, ikonok jobbra (egy sor)
   - search a logo alatt (full width)
   - hero background cover + szép overlay
   - nincs jobb oldali kifolyás / scroll
   - cart/account: 1 tapra nyíljon (double-tap fix)
   ========================================================= */
@media (max-width: 960px){

  /* 0) Globál overflow + box sizing (kifolyás stop) */
  html, body{ overflow-x: clip !important; }
  *, *::before, *::after{ box-sizing: border-box !important; }

  /* 1) Site header padding */
  body .bd-site-header{ padding: 16px 10px 34px !important; }

  /* 2) Hero kártya: width clamp + hero kép fix */
  body .bd-site-header .bd-header-inner{
    width: calc(100vw - 20px) !important;   /* 10px + 10px padding */
    max-width: 100vw !important;
    margin: 0 auto !important;

    border-radius: 32px !important;
    padding: 14px 14px 18px !important;
    gap: 18px !important;

    min-height: unset !important;
    height: auto !important;

    background-image: var(--hero-img) !important;
    background-size: cover !important;
    background-position: 55% 25% !important;
    background-repeat: no-repeat !important;
    background-color: #f2efea !important;

    overflow: hidden !important;
  }

  /* 3) Overlay: felül olvasható, alul kép látszik */
  body .bd-site-header .bd-header-inner::before{
    background: linear-gradient(
      to bottom,
      rgba(242,239,234,0.92) 0%,
      rgba(242,239,234,0.72) 28%,
      rgba(242,239,234,0.18) 100%
    ) !important;
  }

  /* 4) TOP: grid (logo + ikonok), 2. sor search */
  body .bd-site-header .bd-header-top{
    display: grid !important;
    grid-template-columns: 1fr auto auto auto !important;
    grid-template-areas:
      "logo menu cart account"
      "search search search search" !important;

    align-items: center !important;
    column-gap: 1px !important;
    row-gap: 12px !important;

    position: relative !important;
    z-index: 50 !important;

    max-width: 100% !important;
  }

  body .bd-site-header .bd-header-left{
    grid-area: logo !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body .bd-site-header .bd-logo-img{
    height: 54px !important;
    width: auto !important;
    display: block !important;
    max-width: 100% !important;
  }

  /* nav off mobilon */
  body .bd-site-header .bd-header-nav{ display: none !important; }

  /* TRÜKK: a right wrapper “eltűnik”, gyerekek grid itemek lesznek */
  body .bd-site-header .bd-header-right{ display: contents !important; }

  /* ikonok grid helye */
  body .bd-site-header .bd-menu-toggle{
    grid-area: menu !important;
    justify-self: end !important;
    display: flex !important;
  }
  body .bd-site-header .pp-cart-wrap{
    grid-area: cart !important;
    justify-self: end !important;
  }
  body .bd-site-header .bd-account{
    grid-area: account !important;
    justify-self: end !important;
  }

  /* ikon méret */
  body .bd-site-header .bd-icon-btn{
    width: 42px !important;
    height: 42px !important;
  }

  /* 5) SEARCH: 2. sor, full width, stabil (nem nyílik túl) */
  body .bd-site-header .bd-search{
    grid-area: search !important;

    display: block !important;
    position: relative !important;

    width: 100% !important;
    height: 44px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    min-width: 0 !important;
    max-width: 100% !important;
  }

  body .bd-site-header .bd-search-fly{
    position: relative !important;
    right: auto !important;
    top: auto !important;

    width: 100% !important;
    max-width: 100% !important;
    height: 44px !important;

    padding: 10px 10px 10px 12px !important;

    border-radius: 999px !important;
    border: 2px solid #111827 !important;
    background: rgba(255,255,255,.32) !important;
    box-shadow: 0 8px 20px rgba(148,163,184,.25) !important;

    overflow: hidden !important;
  }

  body .bd-site-header .bd-search.is-open .bd-search-fly,
  body .bd-site-header .bd-search.is-expanded .bd-search-fly{
    width: 100% !important;
  }

  body .bd-site-header .bd-search-fly input{
    font-size: 15px !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body .bd-site-header .bd-search-fly button{
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 34px !important;
    margin-left: 6px !important;
  }

  /* dropdown full width mobilon */
  body .bd-site-header .bd-search-dropdown{
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  body .bd-site-header .bd-search-dd-inner{
    grid-template-columns: 1fr !important;
  }

  /* 6) CART + ACCOUNT: ne szűküljön ikon szélességre */
  body .pp-cart-wrap,
  body .bd-account{
    position: relative !important;
  }

  /* MINI CART: jobbra igaz, viewport-safe */
  body .pp-cart-wrap .pp-mini-cart{
    left: auto !important;
    right: 0 !important;

    width: 360px !important;
    max-width: calc(100vw - 28px) !important;
    min-width: 280px !important;

    z-index: 2147483647 !important;

    transform: translateX(0) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* a te működő finomhangolásod (mobilon) */
  body .pp-cart-wrap.is-open .pp-mini-cart{
    margin-right: -120px !important;
  }

  /* ACCOUNT dropdown: jobbra igaz, viewport-safe */
  body .bd-account .bd-account-dd{
    left: auto !important;
    right: 0 !important;

    width: 260px !important;
    max-width: calc(100vw - 28px) !important;

    z-index: 99999 !important;

    transform: translateX(0) !important;
  }

  /* badge ne legyen negatív right */
  body .bd-site-header .pp-cart-badge{ right: 0 !important; }

  /* confirm box ne lógjon ki */
  body .pp-cart-confirm__box{
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: 100vw !important;
  }

  /* 7) HERO tipó mobil */
  body .bd-site-header .bd-header-hero{
    flex: 0 0 auto !important;
    align-items: flex-start !important;
    padding-top: 4px !important;
    max-width: 100% !important;
  }
  body .bd-site-header .bd-hero-text{ max-width: 100% !important; }
  body .bd-site-header .bd-hero-text h1{
    font-size: 2rem !important;
    line-height: 1.12 !important;
    margin-bottom: 12px !important;
  }
  body .bd-site-header .bd-hero-text p{ margin-bottom: 16px !important; }

  /* =========================================================
     FIX: mobile double-tap on cart/account (tap -> click)
     ========================================================= */
  body .pp-cart-wrap,
  body .bd-account,
  body .pp-cart-wrap * ,
  body .bd-account *{
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  body .pp-cart-wrap .bd-icon-btn,
  body .bd-account .bd-icon-btn{
    cursor: pointer;
    pointer-events: auto;
  }

  /* ha van “híd” a panelekhez, mobilon nyelheti az első tapot */
  body .pp-mini-cart::before,
  body .bd-account-dd::before{
    display: none !important;
  }
  
}

@media (max-width: 560px){
  body .bd-site-header .bd-hero-text h1{ font-size: 1.75rem !important; }
}
/* =========================================================
   FIX: Search + Cart dropdown ne legyen levágva a headerben
   (tedd a CSS LEGALJÁRA)
   ========================================================= */
@media (max-width: 960px){

  /* 1) NE vágja le a dropdownokat */
  body .bd-site-header .bd-header-inner{
    overflow: visible !important;
  }

  /* 2) overlay pseudo elem sose takarja a dropdownot */
  body .bd-site-header .bd-header-inner::before{
    z-index: 0 !important;
    pointer-events: none !important;
  }
  body .bd-site-header .bd-header-inner > *{
    position: relative !important;
    z-index: 1 !important;
  }

  /* 3) rétegsorrend: top sor > hero */
  body .bd-site-header .bd-header-top{
    position: relative !important;
    z-index: 5000 !important;
  }
  body .bd-site-header .bd-header-hero{
    position: relative !important;
    z-index: 1 !important;
  }

  /* 4) SEARCH legyen a legmagasabb */
  body .bd-site-header .bd-search{
    position: relative !important;
    z-index: 999996 !important;
  }
  body .bd-site-header .bd-search-dropdown{
    z-index: 999999 !important;
  }

  /* 5) CART is nagyon felül */
  body .pp-cart-wrap{
    position: relative !important;
    z-index: 999998 !important;
  }
  body .pp-cart-wrap .pp-mini-cart{
    z-index: 999999 !important;
  }

  /* (opcionális) account is felül, de search/cart alatt */
  body .bd-account{
    position: relative !important;
    z-index: 999997 !important;
  }
  body .bd-account .bd-account-dd{
    z-index: 999999 !important;
  }
}


/* =========================
   HAMBURGER + MOBILE MENU
   ========================= */

/* hamburger alapból rejtve (desktop) */
.bd-menu-toggle{ display:none; }

/* mobile menu alapból rejtve */
.bd-mobile-menu{ display:none; }

/* MOBIL */
@media (max-width: 960px){

  /* nav rejtve mobilon */
  .bd-header-nav{ display:none; }

  /* hamburger látszik */
  .bd-menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  /* ====== ITT A LÉNYEG: SORREND FIX ======
     Search → Kosár → Account → Hamburger  */
  .bd-header-right{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
  }

  .bd-header-right .bd-search{
    order:0 !important;
    flex:1 1 auto !important;
    min-width:0 !important;
  }

  .bd-header-right .pp-cart-wrap{
    order:10 !important;
  }

  .bd-header-right .bd-account,
  .bd-header-right #bdAccountWrap{
    order:20 !important;
  }

  .bd-header-right .bd-menu-toggle{
    order:30 !important; /* mindig a legvégén */
  }

  /* ====== MOBILE MENU PANEL ====== */
  body.bd-menu-open .bd-mobile-menu{
    display:block;
    position:fixed;
    inset:0;
    z-index:99998;
    padding:86px 16px 16px; /* hely a close gombnak */
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(10px);
    overflow:auto;
  }

  /* X gomb */
  .bd-mobile-close{
    position:fixed;
    top:14px;
    right:14px;
    width:44px;
    height:44px;
    border-radius:999px;
    border:2px solid #111827;
    background:rgba(255,255,255,.75);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:99999;
    box-shadow:0 14px 30px rgba(15,23,42,.14);
  }

  /* lista */
  .bd-mobile-menu-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .bd-mobile-menu-list a{
    display:block;
    padding:14px 16px;
    border-radius:16px;
    text-decoration:none;
    color:#111827;
    font-weight:800;
    background:rgba(255,255,255,.65);
    border:1px solid rgba(17,24,39,.10);
    box-shadow:0 10px 22px rgba(15,23,42,.08);
  }

  /* ne görgessen a body ha nyitva */
  body.bd-menu-open{ overflow:hidden; }
}
/* amikor a mobil menü nyitva van: háttér ne görögessen */
body.bd-menu-open{
  overflow: hidden;
  height: 100%;
  touch-action: none;            /* iOS/Android: ne “pan”-eljen a háttér */
}

/* a menü maga legyen görgethető */
#bdMobileMenu{
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;  /* ne “rántsa” a hátteret */
  max-height: 100dvh;
}