/* Price blocks: struck-through old price, current price, instalments, Pix. */

.st-price {
  display: grid;
  gap: 2px;
}

.st-price__old {
  color: var(--st-muted-2);
  font-size: var(--st-size-label);
  text-decoration: line-through;
}

.st-price__label {
  color: var(--st-muted);
  font-size: var(--st-size-label);
}

.st-price__now {
  color: var(--st-ink);
  font-size: var(--st-size-price-card);
  font-weight: var(--st-weight-extrabold);
  letter-spacing: var(--st-track-h2);
  line-height: 1.1;
}

.st-price--lg .st-price__now {
  font-size: var(--st-size-price-lg);
  font-weight: var(--st-weight-black);
  letter-spacing: var(--st-track-hero);
}

.st-price__installment {
  color: var(--st-ink-2);
  font-size: var(--st-size-label);
}

/* Red text uses accent-deep — #ec3013 never carries body copy. */
.st-price__pix {
  color: var(--st-accent-deep);
  font-size: var(--st-size-label);
  font-weight: var(--st-weight-bold);
}

/* Product page price block — a bordered card, unlike the card-grid price. */
.st-product__price-block {
  position: relative;
  padding: 20px;
  background: var(--st-surface);
  border: var(--st-border-width) solid var(--st-ink);
}

.st-product__price-block .st-price__old {
  font-size: 14px;
}

.st-product__price-block .st-badge {
  position: absolute;
  inset-block-start: 20px;
  inset-inline-end: 20px;
}

/*
 * Global constraints, "Screen 04 exact values": "instalment line 800
 * weight" — scoped to this card rather than the shared .st-price__installment
 * rule above, which product-card.php's card grid also uses and where no
 * weight is specified in the handoff (only "Preço do card 24px/800" for
 * .st-price__now there, already covered).
 */
.st-product__price-block .st-price__installment {
  font-weight: var(--st-weight-extrabold);
}