/* ODO Commerce OS v2.8.2 — Runtime Layout Stability
 * Purpose: deterministic storefront geometry after Elementor/Woo runtime CSS,
 * plus native Woo gallery compatibility. Presentation-only; no commerce data mutations.
 */

/* --------------------------------------------------------------------------
 * 1. Elementor product-grid isolation
 * -------------------------------------------------------------------------- */
body.odo-commerce-ui .elementor-widget-odo_collection,
body.odo-commerce-ui .elementor-widget-odo_products,
body.odo-commerce-ui .elementor-widget-odo_recommendations,
body.odo-commerce-ui .elementor-widget-odo_recently_viewed,
body.odo-commerce-ui .odo-collection-widget,
body.odo-commerce-ui .odo-product-section,
body.odo-commerce-ui .odo-recommendations,
body.odo-commerce-ui .odo-client-collection{
  min-width:0!important;
  max-width:100%!important;
}

body.odo-commerce-ui .odo-grid-guard-v282{
  display:grid!important;
  grid-template-columns:repeat(var(--odo-v282-cols,4),minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  grid-auto-columns:auto!important;
  grid-auto-rows:auto!important;
  align-items:start!important;
  align-content:start!important;
  justify-items:stretch!important;
  gap:34px var(--odo-v282-gap,14px)!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
}

body.odo-commerce-ui .odo-grid-guard-v282 > .odo-product-card-v2,
body.odo-commerce-ui .odo-grid-guard-v282 > .odo-product-card-v280{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  align-self:start!important;
}

body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__media-wrap,
body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__media{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__media{
  display:block!important;
  position:relative!important;
  aspect-ratio:4/5!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
}

body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__primary,
body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__primary img,
body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__alt{
  width:100%!important;
  max-width:100%!important;
}

/* Recently viewed is async. Never reserve phantom pages while hidden/empty. */
body.odo-commerce-ui [data-odo-recent-section][hidden]{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}
body.odo-commerce-ui [data-odo-recent-section]:not([hidden]){
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}
body.odo-commerce-ui .odo-grid-guard-v282--recent:empty{display:none!important;min-height:0!important;height:0!important}

/* --------------------------------------------------------------------------
 * 2. Native WooCommerce single-product gallery compatibility
 * v2.8.1 accidentally treated FlexSlider's slide wrapper as a CSS grid.
 * Restore Woo's expected block/slider geometry and make thumbnails compact.
 * -------------------------------------------------------------------------- */
body.odo-commerce-ui.single-product .odo-premium-product__gallery{
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  align-self:start!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  float:none!important;
  overflow:visible!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery__wrapper{
  display:block!important;
  grid-template-columns:none!important;
  gap:0!important;
  width:auto;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery__image,
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery__image:first-child{
  display:block;
  grid-column:auto!important;
  width:100%;
  max-width:100%;
  min-height:0!important;
  margin:0!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#eeeae2!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery__image a{
  display:block!important;
  width:100%!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery__image img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  aspect-ratio:4/5!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-viewport{
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#eeeae2;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery ol.flex-control-thumbs,
body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs{
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:100%!important;
  max-width:100%!important;
  min-height:0!important;
  height:auto!important;
  margin:10px 0 0!important;
  padding:0 0 4px!important;
  list-style:none!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;
  scrollbar-width:thin;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li{
  display:block!important;
  float:none!important;
  flex:0 0 76px!important;
  width:76px!important;
  max-width:76px!important;
  min-width:76px!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  scroll-snap-align:start;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li img{
  display:block!important;
  width:76px!important;
  height:92px!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
  opacity:.62!important;
  cursor:pointer!important;
  transition:opacity .18s ease,border-color .18s ease,transform .18s ease!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li img:hover{
  opacity:.88!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li img.flex-active{
  opacity:1!important;
  border-color:#111!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__gallery .woocommerce-product-gallery__trigger{
  top:14px!important;
  right:14px!important;
  width:42px!important;
  height:42px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 4px 18px rgba(17,17,17,.08)!important;
}

/* No-JS / native fallback gallery gets the same compact one-row thumbnails. */
body.odo-commerce-ui.single-product .odo-native-gallery{display:block!important;min-height:0!important;height:auto!important}
body.odo-commerce-ui.single-product .odo-native-gallery__stage{border-radius:14px!important}
body.odo-commerce-ui.single-product .odo-native-gallery__thumbs{
  display:flex!important;
  flex-flow:row nowrap!important;
  gap:8px!important;
  margin-top:10px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x proximity;
}
body.odo-commerce-ui.single-product .odo-native-gallery__thumb{
  flex:0 0 76px!important;
  width:76px!important;
  border-radius:9px!important;
  scroll-snap-align:start;
}
body.odo-commerce-ui.single-product .odo-native-gallery__thumb img{width:76px!important;height:92px!important;object-fit:cover!important}

/* Product summary and below-the-fold rhythm. */
body.odo-commerce-ui.single-product .odo-premium-product{
  align-items:start!important;
  margin-bottom:38px!important;
}
body.odo-commerce-ui.single-product .odo-premium-product__summary{
  top:96px!important;
  padding-top:10px!important;
}
.admin-bar body.odo-commerce-ui.single-product .odo-premium-product__summary,
body.admin-bar.odo-commerce-ui.single-product .odo-premium-product__summary{top:128px!important}
body.odo-commerce-ui.single-product .odo-premium-product__summary .product_title{
  max-width:720px;
  margin-top:8px!important;
  font-size:clamp(40px,3.8vw,60px)!important;
  line-height:.96!important;
}
body.odo-commerce-ui.single-product .odo-tb-product .woocommerce-tabs{
  width:min(1160px,100%)!important;
  margin:42px auto 0!important;
  padding-top:0!important;
}
body.odo-commerce-ui.single-product .odo-tb-product .woocommerce-Tabs-panel{
  max-width:100%!important;
}
body.odo-commerce-ui.single-product .odo-tb-product .related,
body.odo-commerce-ui.single-product .odo-tb-product .upsells{
  width:100%!important;
  max-width:100%!important;
  margin:64px auto 0!important;
}

/* --------------------------------------------------------------------------
 * 3. Archive guard/polish — preserves current working query/filter logic.
 * -------------------------------------------------------------------------- */
body.odo-commerce-ui .odo-product-grid-v2--archive.odo-grid-guard-v282{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
body.odo-commerce-ui .odo-faceted-shop .odo-facets,
body.odo-commerce-ui .odo-tb-archive .odo-catalog-tools{
  min-height:0!important;
  height:auto!important;
}
body.odo-commerce-ui .odo-tb-archive .odo-filter-panel.is-open{
  align-items:start!important;
}

/* --------------------------------------------------------------------------
 * Responsive deterministic geometry
 * -------------------------------------------------------------------------- */
@media(max-width:1100px){
  body.odo-commerce-ui .odo-grid-guard-v282,
  body.odo-commerce-ui .odo-product-grid-v2--archive.odo-grid-guard-v282{
    grid-template-columns:repeat(var(--odo-v282-cols,3),minmax(0,1fr))!important;
  }
  body.odo-commerce-ui.single-product .odo-premium-product{
    grid-template-columns:minmax(0,1fr) minmax(330px,.82fr)!important;
    gap:32px!important;
  }
}

@media(max-width:780px){
  body.odo-commerce-ui .odo-grid-guard-v282,
  body.odo-commerce-ui .odo-product-grid-v2--archive.odo-grid-guard-v282{
    grid-template-columns:repeat(var(--odo-v282-cols,2),minmax(0,1fr))!important;
    gap:26px 8px!important;
  }
  body.odo-commerce-ui.single-product .odo-premium-product{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }
  body.odo-commerce-ui.single-product .odo-premium-product__summary{
    position:static!important;
    top:auto!important;
  }
  body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li,
  body.odo-commerce-ui.single-product .odo-native-gallery__thumb{
    flex-basis:68px!important;
    width:68px!important;
    max-width:68px!important;
    min-width:68px!important;
  }
  body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li img,
  body.odo-commerce-ui.single-product .odo-native-gallery__thumb img{
    width:68px!important;
    height:82px!important;
  }
  body.odo-commerce-ui.single-product .odo-tb-product .woocommerce-tabs{margin-top:30px!important}
}

@media(max-width:420px){
  body.odo-commerce-ui .odo-grid-guard-v282,
  body.odo-commerce-ui .odo-product-grid-v2--archive.odo-grid-guard-v282{
    gap:22px 7px!important;
  }
  body.odo-commerce-ui .odo-grid-guard-v282 .odo-product-card-v2__top>a{font-size:11px!important}
}

@media(prefers-reduced-motion:reduce){
  body.odo-commerce-ui.single-product .odo-premium-product__gallery .flex-control-thumbs li img{transition:none!important}
}