/*
 * GLOW STORE - Branding
 * Paleta principal (manual de marca):
 *   Rosa    #F2BFCE
 *   Dorado  #F5C674
 *   Malva   #A47774
 *   Onyx    #1A1E27
 *   Magenta #EF60A2 (acento / CTAs)
 * Tipografías: Poppins (cuerpo) · Ovo (acentos / títulos)
 */

:root {
  --primary-color: #1A1E27;
  --secondary-color: #EF60A2;
  --hover-color: #D9488B;
  --yellow-color: #F5C674;
  --foreground-color: #1A1E27;
  --foreground-sub-color: #A47774;
  --body-text-color: #1A1E27;
  --bg-offwhite-color: #FDF4F7;
  --bg-gray-color: #FBF1F5;
  --border-color: #F2E3E9;
  --frank-ruhl-fonts: 'Ovo', serif;
  --karma-fonts: 'Poppins', sans-serif;
}

/* Hero slider: cada slide define su propia foto vía style="background-image" inline */
.hero__slider--items {
  background-color: #FDF4F7;
}

/* Sombreado sutil para que el texto se lea bien sobre la foto en celular,
   aunque el recorte de la imagen deje el texto sobre la persona/producto */
.slider__maintitle,
.slider__desc,
.image__width--text__title,
.image__width--text__desc {
  text-shadow: 0 1px 3px rgba(255, 255, 255, 0.75), 0 1px 10px rgba(255, 255, 255, 0.55);
}

/* Feature section: iconos en línea (SVG) en vez de las imágenes placeholder del template */
.feature__icon svg {
  display: block;
  color: var(--secondary-color);
}

/* Footer: fondo rosa suave en lugar de la imagen placeholder del template */
.footer__bg {
  background-image: none;
  background-color: var(--bg-offwhite-color);
}

/* Botones y acentos en magenta */
.primary__btn,
.quickview__cart--btn,
.add__to--cart__btn {
  background: var(--secondary-color);
}
.primary__btn:hover,
.quickview__cart--btn:hover,
.add__to--cart__btn:hover {
  background: var(--hover-color);
}

/* Badge de oferta / etiquetas en dorado */
.product__badge--items,
.product__items--offer {
  background: var(--yellow-color);
  color: var(--primary-color);
}

/* Badge de producto agotado (stock 0 o menor) */
.product__badge--soldout {
  width: auto;
  left: 1.5rem;
  padding: 0 1.2rem;
  background: #F8D7D7;
  color: var(--primary-color);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* Contador del carrito */
.items__count {
  background: var(--secondary-color);
}

/* Whatsapp flotante */
#whatsapp-icon {
  position: fixed;
  bottom: 25px;
  left: 25px;
  z-index: 1050;
  width: 55px;
  height: 55px;
  cursor: pointer;
}
#whatsapp-icon img {
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 991px) {
  /* La toolbar fija inferior del template ocupa el borde en móvil */
  #whatsapp-icon {
    bottom: 90px;
    left: 15px;
  }
}

/* Toasts (Bootstrap 5) legibles con el reset del template */
.toast {
  font-size: 1.4rem;
}

/* Formularios de cuenta / checkout */
.account__login--input.is-invalid,
.checkout__input--field.is-invalid {
  border-color: #dc3545;
}
.invalid-feedback {
  display: block;
  color: #dc3545;
  font-size: 1.3rem;
  margin-top: 0.4rem;
}

/* Variantes de producto (talles / tonos) */
.variant__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
.variant__list li {
  border: 1px solid var(--border-color);
  border-radius: 4px;
  transition: var(--transition);
}
.variant__list li a {
  display: block;
  padding: 0.6rem 1.4rem;
  color: var(--body-text-color);
}
.variant__list li.active {
  border-color: var(--secondary-color);
  background: var(--secondary-color);
}
.variant__list li.active a {
  color: #fff;
}
.variant__list li.disabled {
  opacity: 0.4;
  pointer-events: none;
}

/* Descripción de producto: viene como HTML enriquecido (negrita, listas, saltos
   de línea) desde el editor de CADI. El reset global de ul/ol del template le
   quita viñetas e indentación, así que se restauran acá solo para este bloque. */
.product__details--info__desc ul,
.product__details--info__desc ol {
  margin: 0.8rem 0;
  padding-left: 2rem;
}
.product__details--info__desc ul > li {
  list-style: disc;
}
.product__details--info__desc ol > li {
  list-style: decimal;
}
.product__details--info__desc li {
  margin-bottom: 0.4rem;
}
.product__details--info__desc p {
  margin-bottom: 0.8rem;
}
.product__details--info__desc strong {
  color: var(--primary-color);
}