/* DanceGrove marketplace storefront — incremental styles (Terracotta skin).
   Uses only --dg-* tokens; complements grove.css .card/.ph/.body grid. */

/* Product thumbnail fills the card photo area (object-fit avoids distortion). */
.card .ph .product-thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Sale / out-of-stock pills on the card photo. */
.badge-sale,
.badge-oos {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 999px;
  position: relative;
  z-index: 2;
}
.badge-sale {
  background: var(--dg-clay, #bd5e35);
  color: var(--dg-paper, #fff);
}
.badge-oos {
  background: var(--dg-ink, #2a2522);
  color: var(--dg-paper, #fff);
}

/* Strikethrough "was" price. */
.price-was {
  color: var(--dg-ink-soft, #8a7f78);
  margin-right: 4px;
  font-weight: 400;
}

/* PDP buy box + stock indicator. */
.product-stock.is-out { opacity: .9; }
.product-info .product-desc { color: var(--dg-ink, #2a2522); }
.product-info .df-lbl {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin: 0 0 4px;
  color: var(--dg-ink, #2a2522);
}

/* Single-column PDP on small screens. */
@media (max-width: 760px) {
  .product-detail { grid-template-columns: 1fr !important; }
}