/*
 * Live product-page bridge.
 * Loaded last by the active child theme so legacy WooCommerce/gallery-plugin
 * styles cannot override the shared parent theme's current product controls.
 */

body.single-product.woocommerce .summary.entry-summary {
  font-family: var(--origins-product-details-font, var(--origins-sans)) !important;
}
body.single-product.woocommerce .summary .product_title {
  font-family: var(--origins-product-title-font, var(--origins-sans)) !important;
  font-size: var(--origins-product-title-size, 64px) !important;
  font-weight: var(--origins-product-title-weight, 600) !important;
}
body.single-product.woocommerce .summary p.price,
body.single-product.woocommerce .summary span.price {
  font-family: var(--origins-product-details-font, var(--origins-sans)) !important;
  font-size: var(--origins-product-price-size, 20px) !important;
  font-weight: var(--origins-product-price-weight, 400) !important;
}
body.single-product.woocommerce .woocommerce-product-details__short-description {
  font-family: var(--origins-product-details-font, var(--origins-sans)) !important;
  font-size: var(--origins-product-description-size, 16px) !important;
  line-height: var(--origins-product-description-line-height, 1.72) !important;
}
body.single-product.woocommerce .product_meta,
body.single-product.woocommerce .product_meta a {
  font-family: var(--origins-product-details-font, var(--origins-sans)) !important;
  font-size: var(--origins-product-meta-size, 14px) !important;
  font-weight: var(--origins-product-meta-weight, 400) !important;
}

body.single-product.woocommerce span.onsale:not(.origins-sale-marker) {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  width: 52px !important;
  min-width: 52px !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  line-height: 1 !important;
}

body.single-product.woocommerce div.product {
  position: relative !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 64px);
  overflow: visible !important;
}

/* The marker layer is a direct child of the product, not a gallery-plugin
 * viewport. This preserves image-based anchoring while allowing configured
 * negative offsets to cross the photograph's edge without being cropped. */
body.single-product.woocommerce div.product > .origins-product-marker-layer {
  position: absolute !important;
  z-index: 80 !important;
  display: block !important;
  overflow: visible !important;
  pointer-events: none !important;
}
body.single-product.woocommerce div.product .summary {
  max-width: none;
}
body.single-product.woocommerce div.product div.images,
body.single-product.woocommerce .woocommerce-product-gallery,
body.single-product.woocommerce .woocommerce-product-gallery__wrapper,
body.single-product.woocommerce .flex-viewport,
body.single-product.woocommerce .rtwpvg-wrapper,
body.single-product.woocommerce .rtwpvg-container,
body.single-product.woocommerce .rtwpvg-images {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
body.single-product.woocommerce div.product div.images,
body.single-product.woocommerce .woocommerce-product-gallery {
  position: relative !important;
  overflow: visible !important;
}
body.single-product.woocommerce .flex-viewport,
body.single-product.woocommerce .rtwpvg-images {
  overflow: hidden !important;
}
body.single-product.woocommerce .woocommerce-product-gallery__image img,
body.single-product.woocommerce div.images img.wp-post-image,
body.single-product.woocommerce .rtwpvg-gallery-image img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain;
}
body.single-product.woocommerce .woocommerce-product-gallery img.zoomImg,
body.single-product.woocommerce .rtwpvg-images img.zoomImg {
  display: none !important;
}
body.single-product.woocommerce .woocommerce-product-gallery__image a,
body.single-product.woocommerce .rtwpvg-gallery-image a {
  cursor: zoom-in;
}
body.single-product.woocommerce .flex-control-thumbs,
body.single-product.woocommerce .rtwpvg-thumbnail-wrapper {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  clear: both;
  margin-top: 10px;
  overflow: hidden !important;
}

@media (max-width: 900px) {
  body.single-product.woocommerce div.product {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    width: 100%;
    max-width: 100%;
    overflow: visible !important;
  }
  body.single-product.woocommerce div.product div.images,
  body.single-product.woocommerce div.product div.summary {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  body.single-product.woocommerce div.product div.images,
  body.single-product.woocommerce .woocommerce-product-gallery,
  body.single-product.woocommerce div.product div.summary,
  body.single-product.woocommerce .rtwpvg-wrapper,
  body.single-product.woocommerce .rtwpvg-container,
  body.single-product.woocommerce .rtwpvg-images {
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  body.single-product.woocommerce .flex-control-thumbs,
  body.single-product.woocommerce .rtwpvg-thumbnail-wrapper {
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media (max-width: 768px) {
  body.single-product.woocommerce .summary .product_title {
    font-size: var(--origins-product-title-size-mobile, 41px) !important;
  }
  body.single-product.woocommerce span.onsale:not(.origins-sale-marker) {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
  }
}

@media (max-width: 620px) {
  body.single-product.woocommerce div.product {
    gap: 22px;
  }
}

/* The parent theme owns the configurable marker shapes. These declarations
 * repeat only the size reset needed after older live-store badge CSS. */
body.woocommerce .origins-sale-marker,
body.woocommerce-page .origins-sale-marker {
  width: var(--origins-marker-size, 52px) !important;
  min-width: var(--origins-marker-size, 52px) !important;
  height: var(--origins-marker-size, 52px) !important;
  min-height: var(--origins-marker-size, 52px) !important;
  border-radius: 50% !important;
}
body.woocommerce .origins-sale-marker--pill,
body.woocommerce-page .origins-sale-marker--pill,
body.woocommerce .origins-sale-marker--banner,
body.woocommerce-page .origins-sale-marker--banner {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: var(--origins-marker-padding-y, 9px) var(--origins-marker-padding-x, 14px) !important;
}
body.woocommerce .origins-sale-marker--pill,
body.woocommerce-page .origins-sale-marker--pill {
  border-radius: 999px !important;
}
body.woocommerce .origins-sale-marker--banner,
body.woocommerce-page .origins-sale-marker--banner {
  border-radius: 6px !important;
}
body.woocommerce .origins-sale-marker--ribbon,
body.woocommerce-page .origins-sale-marker--ribbon {
  width: auto !important;
  min-width: var(--origins-marker-size, 52px) !important;
  height: auto !important;
  min-height: 0 !important;
  padding: var(--origins-marker-padding-y, 9px) var(--origins-marker-padding-x, 14px) !important;
  border-radius: 0 !important;
}
