/* ONEBIO client design updates: load after v17 on all page types. */

/* Keep brand-green lettering consistent across light and dark sections. */
:root { --color-green: #86b81d; --color-green-deep: var(--color-green); }

/* A consistent dark stage for product photography, including the native Woo gallery. */
.product-card__image,
.woocommerce .product-card__image,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
body.single-product .onebio-gallery-stage,
body.single-product .onebio-gallery-thumb,
.woocommerce div.product .flex-control-thumbs li,
.split-visual,
.about-transparency__visual,
.insight-card:nth-child(3) .insight-card__image img {
  background: radial-gradient(circle at 50% 58%, rgba(134,184,29,.11), transparent 43%), #0b0d0b !important;
}
.split-visual__rings::before,
.split-visual__rings::after { border-color: rgba(134,184,29,.12); }

/* All product cards reserve the same bottle stage and avoid cropping. Source
   media should also use an equally padded square canvas for exact visual scale. */
.product-card__image { aspect-ratio: 1 / 1 !important; padding: 8% !important; }
.product-card__image img,
.woocommerce .product-card__image img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}
.product-card__image::after { background: rgba(0,0,0,.35); }

/* Wholesale's "How it works" section matches the Affiliate application process. */
section[aria-labelledby="wholesale-process"] {
  position: relative;
  background: var(--color-black) !important;
  color: var(--color-white);
  overflow: hidden;
}
section[aria-labelledby="wholesale-process"] .inner-heading > p,
section[aria-labelledby="wholesale-process"] .number-card p { color: #b9beb7; }
section[aria-labelledby="wholesale-process"] .number-grid { border-color: var(--border-dark); }
section[aria-labelledby="wholesale-process"] .number-card {
  border-color: var(--border-dark);
  background: rgba(255,255,255,.02);
}

/* Subtle brand watermark, visible behind copy without reducing legibility. */
.page-section--dark,
section[aria-labelledby="wholesale-process"] { position: relative; isolation: isolate; }
.page-section--dark::before,
section[aria-labelledby="wholesale-process"]::before {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(50vw,640px);
  background: url('../images/logo.png') center / contain no-repeat;
  opacity: .055;
  pointer-events: none;
  content: '';
}
.page-section--dark > .container,
section[aria-labelledby="wholesale-process"] > .container { position: relative; z-index: 1; }

/* A calmer single-product reading scale and a legible chemical-data table. */
.woocommerce div.product .product_title { font-size: clamp(2.05rem,3.5vw,3.8rem); line-height: 1.06; }
.woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-tabs .panel { font-size: .9rem; line-height: 1.72; }
.woocommerce div.product .woocommerce-tabs .panel h2 { font-size: clamp(1.35rem,2vw,2rem); }
.woocommerce div.product .woocommerce-tabs .panel h3 { margin: 1.8em 0 .55em; font-size: 1.12rem; line-height: 1.3; }
.woocommerce div.product .woocommerce-tabs .panel p { margin: 0 0 1em; }
.woocommerce div.product .woocommerce-tabs .panel .onebio-specs-wrap { max-width: 100%; overflow-x: auto; }
.woocommerce div.product .woocommerce-tabs .panel table.onebio-specs {
  width: 100%; border-collapse: collapse; margin: 1.1em 0;
  font-size: .86rem; line-height: 1.5;
}
.woocommerce div.product .woocommerce-tabs .panel table.onebio-specs th,
.woocommerce div.product .woocommerce-tabs .panel table.onebio-specs td {
  border: 1px solid #d8ddd4; padding: 12px 14px; text-align: left; vertical-align: top;
}
.woocommerce div.product .woocommerce-tabs .panel table.onebio-specs th {
  width: 36%; min-width: 155px; background: #edf3e5; font-weight: 600;
}
.woocommerce div.product .woocommerce-tabs .panel table.onebio-specs td { background: #fff; overflow-wrap: anywhere; }
@media (max-width: 700px) {
  .page-section--dark::before,
  section[aria-labelledby="wholesale-process"]::before { width: 80vw; opacity: .04; }
  .woocommerce div.product .woocommerce-tabs .panel table.onebio-specs th,
  .woocommerce div.product .woocommerce-tabs .panel table.onebio-specs td { padding: 9px 10px; }
}
