/* Product-page accents stay with the price; card labels float over the tile. */
.rt-product-card__offer {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.rt-product-badge.rt-product-badge--inline,
.rt-offer-label {
  position: static;
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  padding: 5px 9px;
  border: 0;
  border-radius: 0;
  background: var(--rt-oxblood);
  color: var(--rt-white);
  font-family: var(--rt-font-ui);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: .02em;
  text-transform: none;
}

.rt-product-badge.rt-product-badge--inline.is-muted {
  background: var(--rt-graphite);
}

.rt-product-card__offer.is-sale .rt-product-card__price ins {
  color: var(--rt-oxblood);
}

.rt-product-offer {
  margin: 24px 0;
  padding: 20px 0;
  border-top: 1px solid var(--rt-line);
  border-bottom: 1px solid var(--rt-line);
}

.rt-product-offer .rt-offer-label {
  padding: 6px 11px;
  font-size: 12px;
}

.single-product div.product .rt-product-offer p.price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 16px;
  margin: 14px 0 0;
}

.single-product div.product .rt-product-offer p.price ins {
  order: -1;
  background: transparent;
  color: var(--rt-oxblood);
  font-size: clamp(28px, 2.5vw, 36px);
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
}

.single-product div.product .rt-product-offer p.price del {
  color: var(--rt-smoke);
  font-size: 17px;
  font-weight: 400;
  opacity: 1;
}

/* Same 4:5 tile and foreground safe area, independent of transparent canvas size. */
.products .product .rt-catalog-photo {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  flex: none;
  overflow: hidden;
  margin: 0 0 16px;
  background: var(--rt-catalog-surface, #fff);
}

body.rt-product-backdrops .products .product .rt-catalog-photo img,
body .woocommerce ul.products li.product .rt-catalog-photo img,
body .products .product .rt-catalog-photo img {
  position: absolute;
  top: var(--rt-watch-top, 0%);
  left: var(--rt-watch-left, 0%);
  display: block;
  width: var(--rt-watch-width, 100%);
  height: var(--rt-watch-height, 100%);
  max-width: none;
  max-height: none;
  aspect-ratio: auto;
  margin: 0;
  background: transparent;
  object-fit: contain;
  outline: none;
}

/* Win against the legacy link:hover img selector: only the tile is outlined. */
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link .rt-catalog-photo img,
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link:hover .rt-catalog-photo img,
.products .product > a.woocommerce-LoopProduct-link .rt-catalog-photo img,
.products .product > a.woocommerce-LoopProduct-link:hover .rt-catalog-photo img {
  outline: none;
}

.rt-price-labels { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.rt-material-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid #715737;
  border-radius: 0;
  background: transparent;
  color: #715737;
  font: 650 11px/1.5 var(--rt-font-ui);
  letter-spacing: .02em;
  white-space: nowrap;
}
.rt-material-badge.is-gold { background: #715737; color: var(--rt-white); }
.rt-product-material-price { margin: 24px 0; }
.single-product div.product .rt-product-material-price p.price { margin: 14px 0 0; }

/* Labels never add a row to cards. Leave the top-right wishlist unobstructed. */
.rt-gallery-card > a { position: relative; }
.products .product .rt-price-labels,
.rt-gallery-card .rt-price-labels {
  position: absolute;
  z-index: 3;
  top: .65rem;
  left: .65rem;
  width: max-content;
  max-width: calc(100% - 4rem);
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  pointer-events: none;
}
.rt-gallery-card .rt-price-labels { max-width: calc(100% - 1.3rem); }
.products .product .rt-price-labels > *,
.rt-gallery-card .rt-price-labels > * { max-width: 100%; white-space: normal; }
.products .product .rt-material-badge:not(.is-gold),
.rt-gallery-card .rt-material-badge:not(.is-gold) { background: var(--rt-porcelain); }

/* The home gallery keeps exactly its current 4:5 tile and gallery backdrop. */
.rt-gallery-card .rt-gallery-card__photo {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  flex: none;
  overflow: hidden;
  background: var(--rt-gallery-surface, transparent);
}
body.rt-product-backdrops .rt-gallery-card .rt-gallery-card__photo img,
.rt-gallery-card > a:hover .rt-gallery-card__photo img {
  position: absolute;
  top: var(--rt-watch-top);
  left: var(--rt-watch-left);
  width: var(--rt-watch-width);
  height: var(--rt-watch-height);
  max-width: none;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
  background: transparent;
  outline: none;
}

/* Cached geometry uses an 86% safe area. Cards use 90% (about 5% per end).
   Scale around the measured centre, not the source canvas; product stages stay 86%. */
body.rt-product-backdrops .products .product .rt-catalog-photo.is-framed img,
body .woocommerce ul.products li.product .rt-catalog-photo.is-framed img,
body .products .product .rt-catalog-photo.is-framed img,
body.rt-product-backdrops .rt-gallery-card .rt-gallery-card__photo img,
.rt-gallery-card > a:hover .rt-gallery-card__photo img {
  top: calc(50% + (var(--rt-watch-top) - 50%) * 1.046511628);
  left: calc(50% + (var(--rt-watch-left) - 50%) * 1.046511628);
  width: calc(var(--rt-watch-width) * 1.046511628);
  height: calc(var(--rt-watch-height) * 1.046511628);
}

/* Native containment remains the fallback on older browsers. */
.rt-watch-stage-frame { display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; }
@supports (width: 1cqw) {
  .rt-product-gallery__stage,
  .rt-product-photo-dialog__stage,
  .rt-product-gallery__views button { container-type: size; overflow: hidden; }
  .rt-product-gallery__photo.has-watch-frame { padding: 0; }
  .rt-product-gallery__views button { display: flex; align-items: center; justify-content: center; }
  .rt-product-gallery .rt-watch-stage-frame {
    position: relative;
    display: block;
    flex: none;
    width: min(100cqw, 80cqh);
    height: min(125cqw, 100cqh);
  }
  .rt-product-gallery .rt-watch-stage-frame img {
    position: absolute;
    top: var(--rt-watch-top);
    left: var(--rt-watch-left);
    width: var(--rt-watch-width);
    height: var(--rt-watch-height);
    max-width: none;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    background: transparent;
  }
}

@media (hover: hover) and (pointer: fine) {
  .products .product .rt-catalog-photo {
    outline: 1px solid transparent;
    outline-offset: -1px;
    transition: outline-color 150ms ease;
  }
  .products .product > a:hover .rt-catalog-photo { outline-color: #b4a09a; }
  .rt-gallery-card .rt-gallery-card__photo { outline: 1px solid transparent; outline-offset: -1px; transition: outline-color 150ms ease; }
  .rt-gallery-card > a:hover .rt-gallery-card__photo { outline-color: #b4a09a; }
}

@media (max-width: 767px) {
  .rt-product-badge.rt-product-badge--inline { font-size: 11px; padding: 4px 8px; }
  .rt-product-offer { margin: 20px 0; padding: 18px 0; }
  .single-product div.product .rt-product-offer p.price { column-gap: 12px; }
}
