/* ======================= Sticky header – desktop only ======================= */
@media (min-width:1200px){
  :root { --sticky-top: 0px; --sticky-height: 0px; }

  /* kontener sticky */
  #stickyHeader { position: relative; z-index: 1030; background: #fff; }

  /* pasek sticky */
  #stickyHeader .sticky-inner{
    position: relative;              /* potrzebne dla absolutnego inputa */
    gap: 16px;
    padding-top: 12px;
    padding-bottom: 12px;
    transition: padding .2s ease, box-shadow .2s ease, transform .2s ease;
  }

  /* domyślnie: pokaż menu, lupę i ikony dopiero w trybie sticky */
  #stickyHeader .sticky-search,
  #stickyHeader .sticky-icons{ display: none; }
  body.sticky-active #stickyHeader .sticky-search,
  body.sticky-active #stickyHeader .sticky-icons{ display: flex; }

  /* lewa sekcja sticky: ikonka lupy jako trigger */
  #stickyHeader .sticky-search{
    position: relative;
    align-items: center;
    flex: 0 0 auto;
  }
  #stickyHeader .sticky-search .icon-svg{ width: 22px; height: auto; cursor: pointer; }

  /* środek: menu */
  #desktopMenuWrap{ flex: 1 1 auto; }

  /* prawa sekcja: ikony */
  #stickyHeader .sticky-icons{ align-items: center; }
  #stickyHeader .sticky-icons .icon-svg{ height: 22px; width: auto; }

  /* efekt po przyklejeniu */
  #stickyHeader.is-sticky{
    position: fixed;
    top: var(--sticky-top);
    left: 0; right: 0;
    box-shadow: 0 8px 20px rgba(0,0,0,.08);
    border-bottom: 1px solid rgba(0,0,0,.06);
  }

  /* zmniejszenie fontu w menu */
  body.sticky-active #desktopMenuWrap .nav .nav-link{
    font-size: 90%;
    padding-top: .5rem;
    padding-bottom: .5rem;
    transition: font-size .2s ease, padding .2s ease;
  }

  /* chowamy klasyczny pasek utility po aktywacji sticky */
  #utilityDesktop{
    transition: opacity .15s ease, height .15s ease, margin .15s ease, padding .15s ease;
    overflow: visible;
  }
  body.sticky-active #utilityDesktop{
    opacity: 0;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    border: 0 !important;
  }

  /* odstęp pod sticky, by nie skakał layout */
  #stickySpacer{ height: 0; }
  body.sticky-active #stickySpacer{ height: var(--sticky-height); }
}

/* ======================= Admin bar offset ======================= */
@media (min-width:1200px){ body.admin-bar #stickyHeader.is-sticky{ top: 32px; } }
@media (max-width: 782px){ body.admin-bar #stickyHeader.is-sticky{ top: 46px; } }

/* ======================= Megamenu ======================= */
#desktopMenuWrap .mega-menu{
  position: absolute;     /* liczone od paska menu */
  top: 100%;
  left: 50vw;
  transform: translateX(-50%);
  width: 100vw;
  max-width: none;
  z-index: 1040;
}

/* drobne dopasowania badgy na koszyku */
#stickyHeader .badge{
  font-size: .65rem;
  transform: translate(-50%, -35%);
}

/* ======================= STICKY SEARCH: FINAL OVERRIDE ======================= */
/* Absolutne pole po PRAWEJ od lupki, nie zmienia układu. Ten blok musi być NA KOŃCU. */
@media (min-width:1200px){
  /* stan zamknięty */
  body.sticky-active #stickyHeader .sticky-search .custom-search{
    position: absolute;
    top: 50%;
    left: calc(100% + 8px);          /* tuż po prawej od kontenera z ikoną */
    transform: translateY(-50%);
    height: 36px;
    box-sizing: border-box;
    background: #fff;
    z-index: 1050;

    width: 0 !important;
    max-width: 0 !important;
    opacity: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;

    transition: width .18s ease, max-width .18s ease, opacity .18s ease;
  }

  /* stan otwarty */
  body.sticky-active #stickyHeader .sticky-search.is-open .custom-search{
    width: 200px !important;
    max-width: 200px !important;
    opacity: 1 !important;
    border-bottom:1px solid black !important;
    overflow: visible !important;
    pointer-events: auto !important;
    margin-left:1em !important;
  }
}

/* Anchor dla overlay */
.vms-anchor{ position:relative; z-index:1; }

/* Overlay ma przykrywać tylko rząd z ikonkami */
.vms-anchor > .v-mobile-search-overlay{
  position:absolute !important;
  left:0; top:0; width:100%;
  padding:8px 12px;
  background:#fff;
  box-shadow:0 4px 16px rgba(0,0,0,.12);
  z-index:2000;
  display:none;
}
.vms-anchor > .v-mobile-search-overlay.open{ display:block; }

/* Formularz i elementy */
.v-mobile-search-form{ position:relative; display:flex; align-items:center; gap:0; }

.v-mobile-search-submit{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border:0; background:transparent; padding:0; cursor:pointer;
}
.v-mobile-search-submit .icon-svg{ display:block; width:20px; height:20px; }

.v-mobile-search-form .custom-search{
  flex:1 1 auto; width:100%;
  height:44px;
  padding:10px 40px 10px 44px; /* 44px na lupę, 40px na × */
  display:block;
}

.v-mobile-search-close{
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border:0; background:transparent;
  font-size:24px; line-height:1; cursor:pointer; padding:0;
}

/* Desktop wyłącza overlay */
@media (min-width:1200px){
  .v-mobile-search-overlay{ display:none !important; }
}