/** Shopify CDN: Minification failed

Line 82:4 Expected ":"

**/
/* MASSARO - swatches: estilo conservador y seguro */
/* Solo impacta elementos que claramente son swatches (clases típicas y data-attributes de color) */

/* Selectores muy orientados a swatches para minimizar efectos secundarios */
.product-swatch__items,
.product-swatch__item,
.product-swatch__button,
.swatch__items,
.swatch__item,
.swatch__button,
[data-option-type="color"],
[data-option-name*="Color"] .swatch,
[data-option-name*="color"] .swatch,
[data-option-name*="Color"] .swatch,
[data-option-name="Color"] .swatch,
[data-option-name="color"] .swatch {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 0 !important;
}

/* Circulos visibles pero sin tocar labels generales */
.product-swatch__button,
.swatch__button,
.product-swatch__item,
.swatch__item {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  box-shadow: none !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Imágenes dentro de swatches */
.product-swatch__button img,
.swatch__button img,
.product-swatch__item img,
.swatch__item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
}

/* Si no hay imagen, mostrar fondo neutro solo para elementos dentro de contenedores de color */
[data-option-name*="Color"] .product-swatch__button:not(:has(img)),
[data-option-name*="Color"] .swatch__button:not(:has(img)) {
  background-color: #e7e2de !important;
}

/* Hover / activo (suave) */
[data-option-name*="Color"] .product-swatch__button:focus,
[data-option-name*="Color"] .product-swatch__button:hover,
[data-option-name*="Color"] .swatch__item--active {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06) !important;
  border-color: rgba(0,0,0,0.12) !important;
}

/* Móvil: pequeño ajuste */
@media (max-width: 767px) {
  .product-swatch__button,
  .swatch__button,
  .swatch__item {
    width: 44px !important;
    height: 44px !important;
  }
}