/* =========================================================
   Anhelo — ficha de producto

   Módulo aparte a propósito: el brief pide que los cambios de la ficha no
   dependan de selectores globales que puedan mover otras páginas. Todo lo de
   acá cuelga de .an-pdp-* o de #single-product.
   ========================================================= */

/* ---------------------------------------------------------
   Rating debajo del título

   Lo puebla anhelo-product-v2.js moviendo el #revieStar de Revi. Mientras esté
   vacío el atributo hidden lo mantiene fuera del flujo, así que un producto sin
   reseñas no deja un espacio en blanco entre el título y el precio.
   --------------------------------------------------------- */

#single-product .an-pdp-rating {
  margin: -4px 0 12px;
}

#single-product .an-pdp-rating[hidden] {
  display: none;
}

#single-product .an-pdp-rating--enlace {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

#single-product .an-pdp-rating--enlace span {
  border-bottom: 1px solid transparent;
  transition: border-color var(--an-fast, .2s);
}

#single-product .an-pdp-rating--enlace:hover span {
  border-bottom-color: currentColor;
}

#single-product .an-pdp-rating--enlace:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* ---------------------------------------------------------
   Jerarquía de precio

   El problema no era la falta de datos sino que precio, cuotas, transferencia
   y precio sin impuestos tenían el mismo peso. Se ordena en tres escalones:
   el precio manda, cuotas y transferencia acompañan, el resto es letra chica.
   --------------------------------------------------------- */

#single-product .js-price-container {
  display: block;
}

#single-product .an-pdp-price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

#single-product .an-pdp-price .js-price-display {
  font-size: 26px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.02em;
}

#single-product .an-pdp-price .js-compare-price-display {
  color: var(--main-foreground-opacity-50);
  font-size: 15px;
  font-weight: 400;
  text-decoration: line-through;
}

#single-product .an-pdp-price-secondary {
  margin-top: 7px;
  color: var(--main-foreground-opacity-80);
  font-size: 13px;
  line-height: 1.5;
}

#single-product .an-pdp-price-secondary .item-installments,
#single-product .an-pdp-price-secondary > div {
  margin: 0;
  font-size: 13px;
}

/* Letra chica: descargos, "no acumulable" y precio sin impuestos.
   Lo ideal es apagar el precio sin impuestos desde el administrador; mientras
   siga encendido, al menos deja de competir con el precio real. */
#single-product .an-pdp-price-legal {
  margin-top: 8px;
  color: var(--main-foreground-opacity-50);
  font-size: 11px;
  line-height: 1.45;
}

#single-product .an-pdp-price-legal > div {
  margin: 0 !important;
  font-size: 11px !important;
  opacity: 1 !important;
}

/* ---------------------------------------------------------
   Bloque de stock, envío y cambios pegado al CTA
   --------------------------------------------------------- */

.an-pdp-info {
  margin: -8px 0 22px;
}

.an-pdp-info__stock {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.an-pdp-info__stock[hidden] {
  display: none;
}

/* El color es el que carga el estado, no un adorno: verde y rojo acá son
   información (hay / no hay), por eso el texto además lo dice con palabras. */
.an-pdp-info__stock[data-estado="stock"] { color: #1f7a4d; }
.an-pdp-info__stock[data-estado="ultima"] { color: #b8651b; }
.an-pdp-info__stock[data-estado="agotado"] { color: var(--main-foreground-opacity-60); }

.an-pdp-info__row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 0;
  border-top: 1px solid var(--main-foreground-opacity-10);
}

.an-pdp-info__row:last-child {
  border-bottom: 1px solid var(--main-foreground-opacity-10);
}

.an-pdp-info__icon {
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  margin-top: 1px;
  fill: currentColor;
}

.an-pdp-info__copy {
  min-width: 0;
}

.an-pdp-info__line {
  display: block;
  font-size: 12px;
  line-height: 1.5;
}

.an-pdp-info__line--strong {
  font-weight: 700;
}

.an-pdp-info__link {
  display: inline-block;
  margin-top: 3px;
  font-size: 11px;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 767px) {
  #single-product .an-pdp-price .js-price-display {
    font-size: 23px;
  }

  .an-pdp-info__line {
    font-size: 12px;
  }
}

/* ---------------------------------------------------------
   Prueba social de la ficha

   Los tres primeros beneficios de este bloque decían con palabras vagas
   ("Despacho rápido", "Cambios simples") lo que ahora el bloque de arriba dice
   con plazos concretos. Queda solo la métrica de comunidad, que no se repite
   en ningún otro lado de la ficha.
   --------------------------------------------------------- */

#single-product .an-product-trust__grid {
  grid-template-columns: minmax(0, 1fr);
}

#single-product .an-product-trust__item:nth-child(-n+3) {
  display: none;
}

#single-product .an-product-trust__item:nth-child(n+4) {
  border-top: 0;
  border-left: 0;
}