/* ==========================================================================
   Vitamin Shop - Karta produktu
   Warstwa powiekszenia zdjecia.

   Ten arkusz laduje sie ZAWSZE, takze pod motywem, ktory deklaruje
   wsparcie vitamin-shop-style. Powod: powiekszenie zdjecia jest czescia
   mechanizmu galerii, a nie skorka - bez tych regul warstwa lezalaby
   w tresci strony zamiast nad nia.
   ========================================================================== */

.vs-pdp-zoom{
  position:fixed;
  inset:0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:rgba(8,11,13,.92);
  opacity:0;
  transition:opacity 220ms cubic-bezier(.16,1,.3,1);
}
.vs-pdp-zoom.is-on{opacity:1}

.vs-pdp-zoom img{
  max-width:min(100%,1200px);
  max-height:calc(100vh - 96px);
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:var(--r-md,14px);
  background:#fff;
}

/* Pole dotyku 44 px, kontrast bialego znaku na ciemnym tle powyzej 12:1. */
.vs-pdp-zoom__close{
  position:absolute;
  top:16px;
  right:16px;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:26px;
  line-height:1;
  cursor:pointer;
}
.vs-pdp-zoom__close:hover{background:rgba(255,255,255,.26)}
.vs-pdp-zoom__close:focus-visible{outline:3px solid var(--brand,#0FCA19);outline-offset:2px}

/* Blokada przewijania tla, gdy warstwa jest otwarta. */
body.vs-pdp-locked{overflow:hidden}

/* Elementy sterowane atrybutem hidden musza znikac takze wtedy,
   gdy motyw ustawia display na kontenerach. */
.vs-pdp [hidden],
.vs-pdp-zoom[hidden]{display:none !important}

@media (prefers-reduced-motion: reduce){
  .vs-pdp-zoom{transition-duration:.001ms}
}