/** Shopify CDN: Minification failed

Line 364:14 Unexpected "{"
Line 364:23 Expected ":"
Line 371:14 Unexpected "{"
Line 371:23 Expected ":"

**/
/* Importar fuentes Poppins y Montserrat */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&family=Montserrat:wght@400;600&display=swap');

/* Cambiar tipo de letra y color del título del producto */
.product__title, .product__title h1 {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  color: #3A006E !important;
}

/* Estrellas de valoración */
.product-rating .star, .spr-icon-star, .rating-star {
  color: #FD0189 !important;
  font-size: 20px !important;
}

/* Texto de reseñas (4.8, 212 reviews) */
.product-rating .review-count, .spr-starrating span, .rating-count {
  color: #3A006E !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
}

/* Precio original (tachado) */
.price--compare, .price__regular del, .price-item--regular {
  color: #977AB6 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 26px !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Precio con descuento */
.price--on-sale, .price__sale, .price-item--sale {
  color: #3A006E !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 22px !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Porcentaje de descuento (Ahorra 20%) */
.price__badge--sale, .sale-badge, .discount-badge {
  color: #FF0000 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

/* Ajustes solo para desktop (pantallas de 768px o más) */
@media (min-width: 768px) {
  /* Ajustar el diseño de las columnas en la página de producto */
  .product__media-wrapper, .product__media-container, .product__image-wrapper {
    width: 50% !important;
    padding-left: 0 !important;
  }

  .product__info-wrapper, .product__info-container, .product__details {
    width: 50% !important;
    padding-right: 10px !important;
    padding-left: 20px !important;
  }

  .product__main, .product__content {
    display: flex !important;
    gap: 10px !important;
  }

  /* Hacer solo la imagen principal más ancha */
  .product__media, .product__image, .product-media--main {
    width: 120% !important;
    max-width: none !important;
    position: relative !important;
    left: -50px !important;
    height: auto !important;
    padding-bottom: 15% !important; /* Aumentar la altura del contenedor */
    overflow: visible !important;
  }

  /* Ajustar las miniaturas para que estén alineadas con la imagen grande */
  .product__media-thumbnails, .thumbnails, .thumbnail-list {
    margin-top: 20px !important;
    width: 87% !important;
    position: relative !important;
    left: 45px !important;
  }

  .product__media-thumbnails .thumbnail, .thumbnails .thumbnail, .thumbnail-list .thumbnail {
    margin-right: 20px !important;
  }
}

/* Alinear los precios (tachado y con descuento) */
.price, .price__pricing, .product-price {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 0 !important;
}

/* Estilizar el contenedor del selector de cantidad */
.product-form__quantity .quantity-wrapper {
  width: 100% !important;
  max-width: 650px !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-right: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Estilizar el texto "Cantidad" */
.product-form__quantity .quantity__label, .product-form__quantity .form__label {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #3A006E !important;
  margin: 0 !important;
}

/* Estilizar el componente personalizado del selector de cantidad */
.product-form__quantity .custom-quantity-selector {
  width: 500px !important;
  height: 50px !important;
  border: 3px solid #E1E1F5 !important;
  border-radius: 1px !important;
  background-color: #FFFFFF !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #3A006E !important;
  padding: 0 40px 0 15px !important;
  box-sizing: border-box !important;
  position: relative !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Estilizar el valor mostrado del selector */
.product-form__quantity .quantity-display {
  flex: 1 !important;
  text-align: left !important;
}

/* Estilizar la lista de opciones */
.product-form__quantity .quantity-options {
  position: absolute !important;
  top: calc(100% + 2px) !important;
  left: 0 !important;
  width: 100% !important;
  max-width: 500px !important;
  background-color: #FFFFFF !important;
  border: 3px solid #E1E1F5 !important;
  border-top: none !important;
  z-index: 10 !important;
  max-height: 200px !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}

/* Estilizar cada opción */
.product-form__quantity .quantity-option {
  padding: 10px 15px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #3A006E !important;
  cursor: pointer !important;
  text-align: left !important;
}

.product-form__quantity .quantity-option:hover {
  background-color: #E1E1F5 !important;
}

/* Añadir una flecha personalizada al componente personalizado */
.product-form__quantity .custom-quantity-selector::after {
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="%233A006E" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>') !important;
  position: absolute !important;
  right: 15px !important;
  top: 55% !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 20px !important; /* Asegurar que la flecha tenga una altura definida */
  line-height: 20px !important; /* Centrar verticalmente el contenido SVG */
}

/* Estilizar el botón de añadir al carrito */
.product-form__submit, .add-to-cart, .product-form__cart-submit {
  width: 200% !important;
  max-width: 500px !important;
  height: 50px !important;
  color: #3A006E !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 0 25px 0 15px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Color del texto del botón en estado hover */
.product-form__submit:hover, .add-to-cart:hover, .product-form__cart-submit:hover {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Asegurar que el contenedor del selector y el botón tengan el mismo ancho */
.product-form__buttons, .product-form__actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 700px !important;
}

/* Ajustes para versión móvil (pantallas menores a 767px) */
@media (max-width: 767px) {
  /* Reducir el ancho del contenedor del selector de cantidad en móvil */
  .product-form__quantity .quantity-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Reducir el ancho del componente personalizado en móvil */
  .product-form__quantity .custom-quantity-selector {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 300px !important;
    padding: 0 40px 0 15px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Ajustar la lista de opciones en móvil */
  .product-form__quantity .quantity-options {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 300px !important;
  }

  /* Reducir el ancho del botón en móvil */
  .product-form__submit, .add-to-cart, .product-form__cart-submit {
    max-width: 100% !important;
    width: 100% !important;
    min-width: 300px !important;
    padding: 0 25px 0 15px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    color: #3A006E !important;
    font-weight: 700 !important;
  }

  /* Color del texto del botón en estado hover en móvil */
  .product-form__submit:hover, .add-to-cart:hover, .product-form__cart-submit:hover {
    color: #FFFFFF !important;
    font-weight: 700 !important;
  }

  /* Reducir el ancho del contenedor general en móvil */
  .product-form__buttons, .product-form__actions {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  /* Asegurarse de que el contenedor padre no añada espacio adicional */
  .product__info-container {
    padding-bottom: 40px !important;
  }

  /* Ajustar la descripción en móvil */
  .product__info-container .product__description {
    margin-bottom: 40px !important;
  }

  /* Ajustar el cuadro personalizado en móvil */
  .product__custom-box {
    width: 100% !important;
    margin: 0 !important;
    background-color: #FFFFFF !important;
    border: none !important;
    border-radius: 15px 15px 5px 5px !important;
    display: block !important;
  }

  /* Ajustar el título del cuadro en móvil */
  .product__custom-box .custom-box__title {
    font-size: 16px !important;
    text-align: center !important;
    padding: 6px 10px 6px 40px !important;
    margin: 0 0 5px 0 !important;
  }

  /* Ajustar el contenedor interno en móvil */
  .product__custom-box .custom-box__inner {
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 0 10px 15px !important;
    align-items: flex-start !important;
  }

  /* Ajustar el contenido en móvil */
  .product__custom-box .custom-box__content {
    max-width: none !important;
    text-align: left !important;
  }

  /* Ajustar el texto del cuadro en móvil */
  .product__custom-box .custom-box__text {
    font-size: 13px !important;
  }

  /* Ajustar el botón del cuadro en móvil */
  .product__custom-box .custom-box__button {
    font-size: 12px !important;
    padding: 8px 16px !important;
  }

  /* Ajustar la imagen en móvil */
  .product__custom-box .custom-box__image {
    flex: 0 0 80px !important;
    max-width: 80px !important;
    margin-left: auto !important;
    margin-top: 8px !important;
  }
}

/* Estilizar la descripción del producto (aplicado a todas las resoluciones) */
.product__info-container .product__description {
  color: #3A006E !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin-bottom: 50px !important;
}

/* Estilizar las viñetas de la lista dentro de la descripción (aplicado a todas las resoluciones) */
#ProductInfo-{{ section.id }} .product__info-container .product__description ul {
  list-style: none !important;
  padding: 0 0 0 20px !important;
  margin: 0 !important;
}

/* Reducir el espacio entre elementos de la lista y agregar viñeta personalizada (aplicado a todas las resoluciones) */
#ProductInfo-{{ section.id }} .product__info-container .product__description ul li {
  position: relative !important;
  margin-top: 0 !important;
  margin-bottom: 1px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 20px !important;
  line-height: 1 !important;
}

/* Agregar viñeta personalizada (por ejemplo, una estrella) (aplicado a todas las resoluciones) */
.product__info-container .product__description ul li::before {
  content: '\2605' !important;
  position: absolute !important;
  left: 0 !important;
  color: #FD0189 !important;
  font-size: 16px !important;
}

/* Estilizar el cuadro personalizado (aplicado a todas las resoluciones) */
.product__custom-box {
  background-color: #FFFFFF !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 15px 15px 5px 5px !important;
  width: 100% !important;
  overflow: hidden !important;
  display: block !important;
}

/* Estilizar el título del cuadro */
.custom-box__title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #FFFFFF !important;
  background-color: #00E2F9 !important;
  margin: 0 0 5px 0 !important;
  padding: 8px 12px 8px 45px !important;
  text-align: left !important;
  border-radius: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
}

/* Contenedor interno para texto e imagen */
.custom-box__inner {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  align-items: flex-start !important;
  padding: 0 15px 20px !important;
  box-sizing: border-box !important;
}

/* Contenedor del contenido (texto, botón) */
.custom-box__content {
  flex: 1 !important;
  min-width: 0 !important;
  max-width: none !important;
  text-align: left !important;
}

/* Estilizar el texto del cuadro */
.custom-box__text {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #3A006E !important;
  margin-bottom: 8px !important;
  line-height: 1.5 !important;
}

/* Estilizar el botón del cuadro */
.custom-box__button {
  display: inline-block !important;
  background-color: #FD0189 !important;
  color: #FFFFFF !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 10px 20px !important;
  border-radius: 5px !important;
  text-decoration: none !important;
  transition: background-color 0.3s ease !important;
  width: 95% !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

/* Efecto hover para el botón */
.custom-box__button:hover {
  background-color: #3A006E !important;
  color: #FFFFFF !important;
}

/* Contenedor de la imagen */
.custom-box__image {
  flex: 0 0 120px !important;
  max-width: 120px !important;
  margin-left: auto !important;
  margin-top: 10px !important;
}

/* Estilizar la imagen */
.custom-box__image img {
  width: 100% !important;
  height: auto !important;
  border-radius: 5px !important;
}

/* Asegurarse de que el contenedor padre no añada espacio superior */
.product__info-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 50px !important;
}
/* Personalizar el sale badge */
.badge.price__badge-sale {
  color: #FFFFFF !important; /* Color de las letras y el símbolo % */
}

/* Estilizar el ícono de descuento */
.badge.price__badge-sale .icon-discount {
  fill: #FFFFFF !important; /* Color del ícono */
  stroke: #FFFFFF !important; /* En caso de que el ícono use stroke */
}

/* Asegurar que el texto dentro del badge sea blanco */
.badge.price__badge-sale .nowrap {
  color: #FFFFFF !important; /* Color de las letras y el símbolo % */
}
/* Estilizar el botón de la barra "Sticky Add to Cart" */
.sticky-add-to-cart__button {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important; /* Negrita */
}
.cart-drawer .cart-drawer__footer form button.cart-drawer__cta.button.button--primary[name="checkout"] {
  color: #FFFFFF !important;
}