@keyframes cartBounce {
  0%, 100% { transform: translateY(0); }
  30% { transform: translateY(-3px); }
  60% { transform: translateY(1px); }
}

.product_preview__button.fa.fa-shopping-cart,
.product_preview__buttons .product_preview__button.fa {
  background: #d9784a !important;
  border: none !important;
  border-radius: 5px;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
  transition: background 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}

.product_preview__button.fa.fa-shopping-cart:hover,
.product_preview__buttons .product_preview__button.fa:hover {
  background: #c2683c !important;
  box-shadow: 0 4px 10px rgba(217, 120, 74, 0.35) !important;
  transform: translateY(-1px) !important;
}

.product_preview__button.fa.fa-shopping-cart:active,
.product_preview__buttons .product_preview__button.fa:active {
  transform: translateY(0) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

.product_preview__button.fa.fa-shopping-cart::before,
.product_preview__button.fa.fa-shopping-cart .product_preview__button_text {
  color: #fff !important;
}

.product_preview__button.fa.fa-shopping-cart:hover::before {
  animation: cartBounce 500ms ease;
}

/* ============ Сортування на категорії: сітка 2x2 (тільки мобільна) ====== */
@media (max-width: 767px) {
  .products_container__sort {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .fn_products_sort {
    min-width: 0 !important;
    width: 100% !important;
  }
  .products_sort {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }
  .product_sort__title {
    display: none !important;
  }
  .product_sort__link {
    box-sizing: border-box !important;
    height: 34px !important;
    width: 100% !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 8px !important;
    border-radius: 5px !important;
    background: #fff !important;
    border: 1px solid #d1d1d1 !important;
    font-size: 12px !important;
    white-space: nowrap;
  }
  .product_sort__link.active_down,
  .product_sort__link.active_up {
    border-color: var(--okay-button-color) !important;
  }
  .switch_mobile_filter {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 36px !important;
    margin-top: 10px !important;
	border-radius: 5px !important;
  }
}