/* Retail Experience Framework v20.4.9 — fast, deterministic product layouts. */

/* Native anchors remain the only product-page navigation mechanism. */
body.ref-v2049-native-product-links .products .product-small .box-image,
body.ref-v2049-native-product-links .products .product-small .box-text,
body.ref-v2049-native-product-links .products .product-small .title-wrapper{
  position:relative!important;
}
body.ref-v2049-native-product-links .products .product-small .box-image a[href*="/product/"],
body.ref-v2049-native-product-links .products .product-small .product-title a[href*="/product/"],
body.ref-v2049-native-product-links .products .product-small .name a[href*="/product/"]{
  position:relative!important;
  z-index:30!important;
  pointer-events:auto!important;
}
body.ref-v2049-native-product-links .products .product-small :is(.box-image,.col-inner,.product-small.box)::before,
body.ref-v2049-native-product-links .products .product-small :is(.box-image,.col-inner,.product-small.box)::after{
  pointer-events:none!important;
}
body.ref-v2049-native-product-links .products .product-small .image-tools.grid-tools{
  pointer-events:none!important;
}
body.ref-v2049-native-product-links .products .product-small .image-tools.grid-tools .quick-view,
body.ref-v2049-native-product-links .products .product-small :is(.wishlist-button,.wishlist-icon,.add_to_wishlist){
  pointer-events:auto!important;
  position:relative!important;
  z-index:35!important;
}

/* Badge placement no longer depends on a DOM-moving observer. */
body.ref-v2046-card-cleanup .products .product-small .product-small.box{
  position:relative!important;
}
body.ref-v2046-card-cleanup .products .product-small .box-text{
  position:static!important;
}
body.ref-v2046-card-cleanup .products .product-small :is(.ref-cx2-badges,.ref-card-badges,.badge-container){
  position:absolute!important;
  top:12px!important;
  left:12px!important;
  right:auto!important;
  z-index:24!important;
}

/* Server-rendered support and Highlights live directly below the gallery. */
@media(min-width:850px){
  body.single-product.ref-v2049-product-finalised .product-main .content-row{
    align-items:stretch!important;
  }
  body.single-product.ref-v2049-product-finalised .product-main .product-gallery{
    display:flex!important;
    flex:0 0 50%!important;
    max-width:50%!important;
    flex-direction:column!important;
    align-self:stretch!important;
    min-width:0!important;
  }
  body.single-product.ref-v2049-product-finalised .product-main .product-info{
    flex:0 0 50%!important;
    max-width:50%!important;
    min-width:0!important;
  }
  body.single-product.ref-v2049-product-finalised :is(#product-sidebar,.product-sidebar-small){
    display:none!important;
  }
}

.ref-v2049-gallery-support{
  display:grid;
  width:100%;
  grid-template-columns:minmax(0,1.45fr) minmax(170px,.72fr);
  gap:12px;
  margin:15px 0 0;
  box-sizing:border-box;
  content-visibility:auto;
  contain-intrinsic-size:420px;
}
.ref-v2049-gallery-support>div,
.ref-v2049-gallery-support>aside{
  min-width:0;
  padding:15px;
  border:1px solid color-mix(in srgb,var(--ref-primary,#111) 12%,#e5e7eb);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 26px rgba(23,31,48,.05);
}
.ref-v2049-gallery-support header>span,
.ref-v2049-support-information>span,
.ref-v2049-support-product>div>span{
  display:block;
  margin-bottom:3px;
  color:color-mix(in srgb,var(--ref-dark,#243245) 64%,#fff);
  font-size:8.5px;
  font-weight:850;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.ref-v2049-gallery-support h2{
  margin:0;
  color:var(--ref-dark,#17233c);
  font-size:17px;
  line-height:1.16;
  letter-spacing:-.02em;
}
.ref-v2049-gallery-support header>p{
  margin:5px 0 10px;
  color:color-mix(in srgb,var(--ref-dark,#243245) 67%,#fff);
  font-size:10.5px;
  line-height:1.42;
}
.ref-v2049-support-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.ref-v2049-support-grid .ref-v2046-support-product{
  grid-template-columns:62px minmax(0,1fr)!important;
  gap:10px!important;
  min-height:76px!important;
  padding:7px 9px!important;
  border-radius:14px!important;
}
.ref-v2049-support-grid .ref-v2046-support-image{
  width:62px!important;
  height:62px!important;
  aspect-ratio:1!important;
}
.ref-v2049-support-grid .ref-v2046-support-product h3{
  margin:0 0 3px!important;
  font-size:11.5px!important;
  line-height:1.28!important;
  -webkit-line-clamp:2!important;
}
.ref-v2049-support-grid .ref-v2046-support-price{
  margin:0 0 2px!important;
  font-size:11.5px!important;
  line-height:1.25!important;
}
.ref-v2049-support-grid .ref-v2046-support-link{
  font-size:9.5px!important;
}
.ref-v2049-support-information{
  background:color-mix(in srgb,var(--ref-primary,#111) 4%,#fff)!important;
}
.ref-v2049-support-information>div{
  display:grid;
  gap:7px;
  margin-top:10px;
}
.ref-v2049-support-information p{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:7px;
  align-items:center;
  margin:0;
  color:var(--ref-dark,#17233c);
  font-size:10.5px;
  line-height:1.28;
}
.ref-v2049-support-information i{
  display:inline-flex;
  width:20px;
  height:20px;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--ref-primary,#111);
  color:#fff;
  font-size:9px;
  font-style:normal;
}
.ref-v2049-related-placeholder{
  display:grid;
  min-height:62px;
  grid-template-columns:52px minmax(0,1fr);
  gap:9px;
  align-items:center;
  padding:8px;
  border:1px dashed color-mix(in srgb,var(--ref-primary,#111) 18%,#ddd);
  border-radius:13px;
  background:#fafbfc;
}
.ref-v2049-related-placeholder small{
  color:color-mix(in srgb,var(--ref-dark,#243245) 62%,#fff);
  font-size:9.5px;
  line-height:1.35;
}
.ref-v2049-related-skeleton{
  display:block;
  width:52px;
  height:52px;
  border-radius:10px;
  background:linear-gradient(90deg,#f0f1f3 25%,#f8f8f9 50%,#f0f1f3 75%);
  background-size:200% 100%;
  animation:ref-v2049-pulse 1.4s linear infinite;
}
@keyframes ref-v2049-pulse{to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.ref-v2049-related-skeleton{animation:none}}

/* Existing Highlights follows the support panel server-side. */
body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights{
  width:100%!important;
  margin:11px 0 0!important;
  padding:15px 17px!important;
  border-radius:18px!important;
  box-shadow:0 10px 24px rgba(25,30,42,.05)!important;
  content-visibility:auto;
  contain-intrinsic-size:190px;
}
body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights .ref-px2-eyebrow{
  margin-bottom:2px!important;
  font-size:8.5px!important;
}
body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights h3{
  margin:0 0 9px!important;
  font-size:18px!important;
  line-height:1.15!important;
}
body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights .ref-px2-highlight-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
}
body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights .ref-px2-highlight{
  min-height:35px!important;
  padding:7px 9px!important;
  gap:7px!important;
  border-radius:11px!important;
  font-size:10.8px!important;
  line-height:1.28!important;
}
body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights .ref-px2-highlight i{
  flex-basis:18px!important;
  width:18px!important;
  height:18px!important;
  font-size:8px!important;
}

/* Keep right-column reassurance useful but compact. */
body.single-product.ref-v2049-product-finalised .product-info .ref-px2-reassurance{
  gap:7px!important;
  margin-top:10px!important;
}
body.single-product.ref-v2049-product-finalised .product-info .ref-px2-reassurance>div{
  min-height:38px!important;
  padding:7px 10px!important;
  font-size:10.5px!important;
}

@media(max-width:1100px) and (min-width:850px){
  .ref-v2049-gallery-support{grid-template-columns:1fr!important}
  .ref-v2049-support-information>div{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:849px){
  .ref-v2049-gallery-support{
    grid-template-columns:1fr!important;
    margin:14px 0 0!important;
  }
  body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights{
    margin-top:10px!important;
  }
}
@media(max-width:560px){
  body.single-product.ref-v2049-product-finalised .product-gallery>.ref-px2-highlights .ref-px2-highlight-grid{
    grid-template-columns:1fr!important;
  }
}
