/* =====================================================================
   Ager — header "smart hide" on scroll (assets/header-scroll.css)
   Desktop : the category bar (دسته‌بندی محصولات … سوالات شما) slides away when
             scrolling down and comes back on the slightest scroll up.
             Logo, search, account and cart never move.
   Phones  : the search bar slides away when scrolling down and comes back on
             the slightest scroll up.
   The header keeps its full height in the page flow (no layout jump); only its
   painted background is shortened, so nothing below it shifts.
   Behaviour is driven by assets/header-scroll.js (adds .hdr-collapsed).
   ===================================================================== */

/* the header's own background moves to a pseudo-element so it can shrink */
html header{
  background:transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  border-bottom:0;
}
html header::before{
  content:"";position:absolute;top:0;left:0;right:0;height:100%;z-index:-1;
  background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  pointer-events:none;
  transition:height .32s cubic-bezier(.4,0,.2,1);
}
html header.hdr-collapsed::before{height:calc(100% - var(--hdr-shrink,0px));}

/* while collapsed, the empty strip must not swallow clicks meant for the page */
html header.hdr-collapsed{pointer-events:none;}
html header.hdr-collapsed .nav{pointer-events:auto;}

/* ---------- desktop / Windows ---------- */
@media(min-width:701px){
  html header .nav-sub{
    transition:transform .32s cubic-bezier(.4,0,.2,1),opacity .22s ease,visibility 0s linear 0s;
  }
  html header.hdr-collapsed .nav-sub{
    transform:translateY(-12px);opacity:0;visibility:hidden;pointer-events:none;
    transition:transform .32s cubic-bezier(.4,0,.2,1),opacity .22s ease,visibility 0s linear .32s;
  }
}

/* ---------- phones ---------- */
@media(max-width:700px){
  html header::before{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;}
  html header .header-search{
    transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s ease,visibility 0s linear 0s,border-color .2s,background .2s;
  }
  html header.hdr-collapsed .header-search{
    transform:translateY(-14px);opacity:0;visibility:hidden;pointer-events:none;
    transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s ease,visibility 0s linear .3s;
  }
  /* the row itself is empty while collapsed: only its real children take clicks */
  html header.hdr-collapsed .nav{pointer-events:none;}
  html header.hdr-collapsed .nav > :not(.header-search){pointer-events:auto;}
  /* slide-in menu + its backdrop are fixed to the screen and must stay clickable */
  html header.hdr-collapsed .nav-sub,
  html header.hdr-collapsed .m-backdrop{pointer-events:auto;}
}

@media(prefers-reduced-motion:reduce){
  html header::before,
  html header .nav-sub,
  html header .header-search{transition:none !important;}
}