/*
 * Tylko wyglad serca na miniaturach produktu.
 * Ten plik nie obsluguje klikniec, nie zmienia licznika i nie nadpisuje
 * zadnej funkcji JavaScript modulu wishlisty.
 */

.product-miniature,
.product-miniature .product-miniature__thumb {
  position: relative !important;
}

/* Na miniaturach oba moduly potrafia wstawic przycisk w to samo miejsce.
 * Lista w naglowku i strona produktu korzystaja z Jash Wishlist, dlatego
 * chowamy tutaj tylko konkurencyjny przycisk Block Wishlist. */
.product-miniature .wishlist-button-add {
  display: none !important;
}

.product-miniature .jashwishlist-button {
  --wishlist-btn-size: 42px;
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 26 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  border: 1px solid rgba(49, 88, 234, .18) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 5px 16px rgba(20, 48, 100, .15) !important;
  color: #3158ea !important;
  opacity: 1 !important;
  overflow: visible !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.product-miniature .jashwishlist-button svg {
  display: block !important;
  width: 21px !important;
  height: 20px !important;
  margin: 0 !important;
  color: #3158ea !important;
  --svg-bg-fill: transparent;
  transform-origin: center;
  transition: transform .18s ease, color .18s ease;
}

.product-miniature .jashwishlist-button[data-is-added="true"] svg {
  --svg-bg-fill: #3158ea;
  animation: sismed-mini-heart-pop .34s cubic-bezier(.2, .8, .25, 1);
}

.product-miniature .jashwishlist-button:hover {
  border-color: rgba(49, 88, 234, .48) !important;
  box-shadow: 0 8px 20px rgba(20, 48, 100, .2) !important;
  transform: translateY(-1px);
}

.product-miniature .jashwishlist-button:active {
  transform: scale(.9);
}

.product-miniature .jashwishlist-button:focus-visible {
  outline: 3px solid rgba(49, 88, 234, .25);
  outline-offset: 2px;
}

.product-miniature .jashwishlist-button[data-in-progress="true"] {
  pointer-events: none;
  opacity: .6 !important;
}

@keyframes sismed-mini-heart-pop {
  0% { transform: scale(.78); }
  65% { transform: scale(1.25); }
  100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .product-miniature .jashwishlist-button,
  .product-miniature .jashwishlist-button svg {
    animation: none !important;
    transition: none !important;
  }
}