/* Zoomag product page repair r1 — 2026-08-10
   Purpose: undo overly broad storefront product-page overrides and restore
   visible taste/weight/volume switches without touching the database. */

body.zm-storefront-r1 #product-product .zoohub-product-showcase,
body.zm-storefront-r2 #product-product .zoohub-product-showcase,
body.zm-storefront-r3 #product-product .zoohub-product-showcase {
  background: #fff !important;
}

/* Return product page to the tuned product-specific layout instead of the
   storefront r1 two-column override. */
body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-container,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-container,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-container {
  width: min(calc(100vw - 42px), 1580px) !important;
  max-width: 1580px !important;
  margin-inline: auto !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-layout,
body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-main,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-layout,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-main,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-layout,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-main {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-product-jungle,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-product-jungle,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-product-jungle {
  width: min(100%, 1480px) !important;
  max-width: 1480px !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: minmax(470px, 530px) minmax(0, 1fr) !important;
  gap: 30px !important;
  align-items: start !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-den,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-den,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-den {
  width: 100% !important;
  max-width: 530px !important;
  min-height: 0 !important;
  padding: 12px !important;
  position: sticky !important;
  top: 92px !important;
  border: 1px solid rgba(226, 196, 170, .82) !important;
  border-radius: 24px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.985), rgba(255,249,244,.97)) !important;
  box-shadow: 0 18px 42px rgba(83, 53, 30, .10), inset 0 1px 0 rgba(255,255,255,.96) !important;
  overflow: visible !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-main,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-main,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-main {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  gap: 14px !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-featured,
body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-image-frame,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-featured,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-image-frame,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-featured,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-image-frame {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: 500px !important;
  aspect-ratio: 1 / 1 !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-image-frame,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-image-frame,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-image-frame {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border: 1px solid rgba(237, 219, 202, .92) !important;
  border-radius: 20px !important;
  background: #fff !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-image,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-image,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-image {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  padding: 2px !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-thumbnails,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-thumbnails,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-thumbnails {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  border: 1px solid rgba(232, 211, 192, .86) !important;
  border-radius: 17px !important;
  background: rgba(255,255,255,.82) !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-thumb,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-thumb,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-thumb {
  flex: 0 0 calc((100% - 40px) / 6) !important;
  width: auto !important;
  aspect-ratio: 1 !important;
  padding: 4px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(232, 211, 192, .9) !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Keep variants in the commerce column. The old desktop-docking JS can move
   them under the gallery; the r1 repair script moves them back, and these rules
   guarantee they remain visible. */
body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-gallery-host,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-gallery-host,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-gallery-host {
  display: none !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-commerce-host,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-commerce-host,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-commerce-host {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 16px 0 16px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 18px 18px 16px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(31, 160, 111, .18) !important;
  background: linear-gradient(135deg, rgba(246,255,251,.98), rgba(255,255,255,.98)) !important;
  box-shadow: 0 14px 30px rgba(19, 100, 68, .08) !important;
  position: relative !important;
  z-index: 5 !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches__header,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches__header,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches__header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches__title,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches__title,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches__title {
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  color: #16442b !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches__family,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches__family,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches__family {
  font-size: 13px !important;
  color: #5f7b6b !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)) !important;
  align-items: stretch !important;
  gap: 10px !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-chip,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-chip,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-chip {
  display: inline-flex !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 56px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 10px 12px !important;
  border-radius: 14px !important;
  text-align: center !important;
  line-height: 1.15 !important;
  cursor: pointer !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-chip__label,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-chip__label,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-chip__label {
  font-size: 15px !important;
  font-weight: 900 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-chip__hint,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-chip__hint,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-chip__hint {
  font-size: 11px !important;
  font-weight: 700 !important;
  opacity: .74 !important;
}

body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-chip--active,
body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-chip--active,
body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-chip--active {
  color: #fff !important;
  border-color: #16834a !important;
  background: linear-gradient(135deg, #178f52, #35bd6f) !important;
}

@media (max-width: 1099.98px) {
  body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-product-jungle,
  body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-product-jungle,
  body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-product-jungle {
    grid-template-columns: 1fr !important;
    max-width: 760px !important;
    gap: 22px !important;
  }
  body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-gallery-den,
  body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-gallery-den,
  body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-gallery-den {
    position: static !important;
    max-width: none !important;
  }
}

@media (max-width: 640px) {
  body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-container,
  body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-container,
  body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-container {
    width: min(calc(100vw - 24px), 100%) !important;
  }
  body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid,
  body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid,
  body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 420px) {
  body.zm-storefront-r1 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid,
  body.zm-storefront-r2 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid,
  body.zm-storefront-r3 #product-product .zoohub-product-showcase .zoohub-variant-switches__grid {
    grid-template-columns: 1fr !important;
  }
}

/* ========================================================================== */
/* r2 final scale — widen product canvas, preserve all variant behavior.       */
/* ========================================================================== */
body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-container {
  width: min(calc(100vw - 56px), 1720px) !important;
  max-width: 1720px !important;
}
body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-product-jungle,
body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-tabs-savannah,
body.zm-storefront-r4 #product-product .zoohub-product-showcase .product-related {
  width: min(100%, 1600px) !important;
  max-width: 1600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-tabs-content,
body.zm-storefront-r4 #product-product .zoohub-product-showcase [data-zm-product-description] {
  width: 100% !important;
  max-width: none !important;
}

@media (min-width: 1440px) {
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-product-jungle {
    grid-template-columns: minmax(520px, 570px) minmax(0, 1fr) !important;
    gap: 42px !important;
  }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-gallery-den { max-width: 570px !important; padding: 14px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-gallery-featured,
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-image-frame { max-height: 540px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-info-sanctuary { padding: 22px 26px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-product-title { font-size: clamp(2.15rem, 2vw, 2.8rem) !important; max-width: 25ch !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-fact-label { font-size: 12.5px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-fact-value { font-size: 14.5px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-price-current { font-size: 2rem !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-conversion-trust__text strong { font-size: 13px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-conversion-trust__text small { font-size: 11.5px !important; }
}

@media (min-width: 1100px) and (max-width: 1439.98px) {
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-container { width: min(calc(100vw - 34px), 1360px) !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-product-jungle {
    width: min(100%, 1320px) !important;
    grid-template-columns: minmax(420px, 470px) minmax(0, 1fr) !important;
    gap: 24px !important;
  }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-gallery-den { max-width: 470px !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-gallery-featured,
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-image-frame { max-height: 450px !important; }
}

@media (max-width: 1099.98px) {
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-container { width: min(calc(100vw - 28px), 920px) !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-product-jungle,
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-tabs-savannah,
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .product-related { max-width: 920px !important; }
}

@media (max-width: 640px) {
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-container { width: calc(100vw - 20px) !important; }
  body.zm-storefront-r4 #product-product .zoohub-product-showcase .zoohub-tabs-content { padding: 12px !important; }
}