/* Zoomag r11 — balanced responsive scale.
   r10 fixed the selector problem and proved the width can expand; r11 calibrates
   that working mechanism to normal ecommerce proportions. */

body.zm-storefront-r11 {
  --zm-r11-page: min(88vw, 1840px);
  --zm-r11-inner: min(82vw, 1720px);
  --zm-r11-gap: clamp(28px, 1.8vw, 38px);
  font-size: 16px !important;
}

/* Site/header canvas: broad, but not full-bleed. */
body.zm-storefront-r11 .zoomag_top_panel > .container,
body.zm-storefront-r11 .zoomag_main_header_block > .container,
body.zm-storefront-r11 .zm-classic-nav__inner,
body.zm-storefront-r11 .zm-classic-nav__desktop-panel-inner {
  width: var(--zm-r11-page) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

/* Product shell — direct selectors (the important r10 fix stays). */
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-container {
  width: var(--zm-r11-page) !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-breadcrumb-trail,
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-product-jungle,
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-tabs-savannah,
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase,
body.zm-storefront-r11 .zoohub-product-showcase .product-related {
  width: var(--zm-r11-inner) !important;
  max-width: none !important;
  margin-inline: auto !important;
  box-sizing: border-box !important;
}

@media (min-width: 1440px) {
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-product-jungle {
    grid-template-columns: minmax(0, 43fr) minmax(0, 57fr) !important;
    gap: var(--zm-r11-gap) !important;
    align-items: start !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-gallery-den,
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-info-sanctuary {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-gallery-den {
    padding: 18px !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-gallery-featured,
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-image-frame {
    width: 100% !important;
    height: auto !important;
    max-height: 660px !important;
    aspect-ratio: 1 / 1 !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-info-sanctuary {
    padding: 22px 24px !important;
  }
}

/* 1200–1439: use more of the screen so laptop/13-inch remains comfortable. */
@media (min-width: 1200px) and (max-width: 1439.98px) {
  body.zm-storefront-r11 {
    --zm-r11-page: 94vw;
    --zm-r11-inner: 90vw;
    --zm-r11-gap: 26px;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-product-jungle {
    grid-template-columns: minmax(0, 42fr) minmax(0, 58fr) !important;
    gap: var(--zm-r11-gap) !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-gallery-den {
    width: 100% !important;
    max-width: none !important;
    padding: 16px !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-gallery-featured,
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-image-frame {
    width: 100% !important;
    max-height: 570px !important;
    aspect-ratio: 1 / 1 !important;
  }
}

/* 1024–1199: two columns remain, but canvas is almost full width. */
@media (min-width: 1024px) and (max-width: 1199.98px) {
  body.zm-storefront-r11 {
    --zm-r11-page: 96vw;
    --zm-r11-inner: 94vw;
    --zm-r11-gap: 22px;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zoohub-product-jungle {
    grid-template-columns: minmax(0, 43fr) minmax(0, 57fr) !important;
    gap: 22px !important;
  }
}

/* Product typography: down from r10, still clearly larger than old compact theme. */
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-product-title {
  font-size: clamp(2rem, 2vw, 2.75rem) !important;
  line-height: 1.1 !important;
  max-width: 27ch !important;
  margin-bottom: 14px !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-fact-item {
  min-height: 60px !important;
  padding: 10px 12px !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-fact-label { font-size: 12px !important; }
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-fact-value,
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-stock-text { font-size: 14px !important; }
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-price-meadow {
  padding: 14px 16px !important;
  margin: 12px 0 !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-price-current {
  font-size: clamp(2rem, 1.9vw, 2.55rem) !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-conversion-trust__item {
  min-height: 58px !important;
  padding: 10px 11px !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-conversion-trust__text strong { font-size: 13px !important; }
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-conversion-trust__text small { font-size: 11px !important; }

/* Variants retain the gallery width but lose r10's oversized padding. */
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-variant-gallery-host .zoohub-variant-switches {
  padding: 18px !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-variant-switches__title { font-size: 18px !important; }
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-variant-chip { min-height: 56px !important; }
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-variant-chip__label { font-size: 13px !important; }
body.zm-storefront-r11 .zoohub-product-showcase .zoohub-tabs-content,
body.zm-storefront-r11 .zoohub-product-showcase [data-zm-product-description] {
  font-size: 16px !important;
}

/* Related products: equal size and proportional to the same inner canvas. */
@media (min-width: 1600px) {
  body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase {
    --zr-visible: 4 !important;
    --zr-gap: 22px !important;
    padding: 28px !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-image-section {
    height: clamp(250px, 15vw, 300px) !important;
    padding: 14px 14px 0 !important;
  }
}
@media (min-width: 1200px) and (max-width: 1599.98px) {
  body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase {
    --zr-visible: 3 !important;
    --zr-gap: 20px !important;
    padding: 26px !important;
  }
  body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-image-section {
    height: 280px !important;
  }
}
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-product-image {
  width: auto !important;
  height: auto !important;
  max-width: 91% !important;
  max-height: 91% !important;
  object-fit: contain !important;
  padding: 0 !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-content-section {
  padding: 15px 16px 17px !important;
  gap: 10px !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-product-name a {
  font-size: 16px !important;
  line-height: 1.28 !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-price-main,
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-special-price {
  font-size: 22px !important;
}
body.zm-storefront-r11 .zoohub-product-showcase .zm-related-showcase .petz-btn.petz-btn-primary {
  min-height: 48px !important;
}

/* Tablet/mobile remains r10's full-width single-column strategy. */
@media (max-width: 1023.98px) {
  body.zm-storefront-r11 {
    --zm-r11-page: calc(100vw - 24px);
    --zm-r11-inner: calc(100vw - 24px);
  }
}
@media (max-width: 767.98px) {
  body.zm-storefront-r11 {
    --zm-r11-page: calc(100vw - 18px);
    --zm-r11-inner: calc(100vw - 18px);
    font-size: 16px !important;
  }
}
