/* --- Flèches sur les images produit --- */
.mws-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #dcdbdb;
  font-size: 60px;
  font-weight: 500;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: all 0.2s ease;
}

.mws-arrow.left { left: 8px; }
.mws-arrow.right { right: 8px; }

.mws-arrow::before { content: '‹'; }
.mws-arrow.right::before { content: '›'; }


/* --- Ciblage précis du conteneur image --- */
.thumbnail-top, .product-thumbnail, .elementor .product img {
  position: relative !important;
  overflow: hidden;
}

/* --- Effet hover et CTA --- */
.js-product-miniature,
.elementor .product,
.elementor .product-item {
  position: relative;
  overflow: hidden;
}

.mws-add-to-cart {
  position: absolute;
  top: 75%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  background: #007BBD;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  padding: 5px 10px;
  border: none;
  border-radius: 20px;
  text-align: center;
  justify-content: center;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  opacity: 0;
  pointer-events: none;
  transition: all .25s ease;
  z-index: 15;
  width: 70%;
}

.mws-add-to-cart i {
  font-size: 18px;
}

.mws-hover img {
  opacity: 0.3;
  transition: opacity .25s ease;
}

.mws-hover .mws-add-to-cart {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  pointer-events: auto;
}