/* Responsive PDP product-image and thumbnail carousel.
   Uses WooCommerce's native FlexSlider controls whenever initialized.
   A small JS fallback provides the same UX when FlexSlider fails to initialize. */
body.single-product.woocommerce div.product .woocommerce-product-gallery {
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
/* Display correctly even if the WooCommerce gallery JS never initializes.
   When FlexSlider creates .flex-viewport, these fallback rules stop applying. */
body.single-product.woocommerce div.product .woocommerce-product-gallery:not(:has(.flex-viewport)) {
  opacity:1!important;
}
body.single-product.woocommerce div.product .woocommerce-product-gallery:not(:has(.flex-viewport)) > .woocommerce-product-gallery__wrapper {
  display:flex!important;
  width:100%!important;
  max-width:100%;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
body.single-product.woocommerce div.product .woocommerce-product-gallery:not(:has(.flex-viewport)) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
  display:block!important;
  flex:0 0 100%!important;
  width:100%!important;
  max-width:100%!important;
  float:none!important;
  scroll-snap-align:start;
}
/* Display correctly even if the WooCommerce gallery JS never initializes.
   When FlexSlider creates .flex-viewport, these fallback rules stop applying. */
body.single-product.woocommerce div.product .woocommerce-product-gallery:not(:has(.flex-viewport)) {
  opacity:1!important;
}
body.single-product.woocommerce div.product .woocommerce-product-gallery:not(:has(.flex-viewport)) > .woocommerce-product-gallery__wrapper {
  display:flex!important;
  width:100%!important;
  max-width:100%;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
body.single-product.woocommerce div.product .woocommerce-product-gallery:not(:has(.flex-viewport)) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
  display:block!important;
  flex:0 0 100%!important;
  width:100%!important;
  max-width:100%!important;
  float:none!important;
  scroll-snap-align:start;
}
body.single-product.woocommerce div.product .woocommerce-product-gallery.vp-gallery-fallback {
  opacity:1!important;
}
body.single-product.woocommerce div.product .vp-gallery-fallback .woocommerce-product-gallery__wrapper {
  display:flex!important;
  width:100%!important;
  max-width:100%;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y;
}
body.single-product.woocommerce div.product .vp-gallery-fallback .woocommerce-product-gallery__wrapper::-webkit-scrollbar {
  display:none;
}
body.single-product.woocommerce div.product .vp-gallery-fallback .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
  display:block!important;
  flex:0 0 100%!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0;
  margin:0!important;
  float:none!important;
  scroll-snap-align:start;
}
body.single-product.woocommerce div.product .vp-gallery-fallback .woocommerce-product-gallery__image img {
  display:block;
  width:100%!important;
  height:auto!important;
  max-height:600px;
  object-fit:contain;
}
/* CSS-only horizontal thumbs if WooCommerce initializes but custom JS is delayed. */
body.single-product.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs {
  display:flex!important;
  flex-wrap:nowrap!important;
  grid-template-columns:none!important;
  gap:10px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:thin;
  scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;
  padding-bottom:7px!important;
}
body.single-product.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li {
  flex:0 0 76px!important;
  width:76px!important;
  min-width:76px;
  float:none!important;
  margin:0!important;
  scroll-snap-align:start;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-carousel {
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  min-width:0;
  margin-top:12px;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-viewport {
  flex:1 1 0;
  min-width:0;
  overflow:hidden;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs {
  display:flex!important;
  flex-wrap:nowrap!important;
  grid-template-columns:none!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%;
  margin:0!important;
  padding:3px 1px 8px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  list-style:none!important;
  scrollbar-width:thin;
  scroll-snap-type:x proximity;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs li {
  flex:0 0 76px!important;
  width:76px!important;
  min-width:76px;
  height:76px;
  margin:0!important;
  float:none!important;
  list-style:none!important;
  scroll-snap-align:start;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs li img,
body.single-product.woocommerce div.product .vp-pdp-thumb-button {
  box-sizing:border-box;
  width:100%!important;
  height:100%!important;
  border-radius:10px;
  border:2px solid transparent;
  object-fit:contain;
  background:#fff!important;
  cursor:pointer;
  opacity:1!important;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs li img.flex-active,
body.single-product.woocommerce div.product .vp-pdp-thumb-button[aria-pressed="true"] {
  border-color:#282d3d;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-button {
  display:block;
  padding:0;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-button img {
  width:100%!important;
  height:100%!important;
  object-fit:contain;
  border:0!important;
  border-radius:8px;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-button:focus-visible,
body.single-product.woocommerce div.product .vp-pdp-thumb-arrow:focus-visible {
  outline:3px solid #6c58d4;
  outline-offset:2px;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-arrow {
  flex:0 0 36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:42px;
  padding:0;
  border:1px solid rgba(27,31,42,.16);
  border-radius:11px;
  color:#202431;
  background:#fff;
  font-size:24px;
  cursor:pointer;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-arrow:disabled {
  opacity:.34;
  cursor:default;
}
body.single-product.woocommerce div.product .vp-pdp-thumb-carousel.vp-pdp-no-overflow .vp-pdp-thumb-arrow {
  display:none;
}
@media (max-width:900px) {
  body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs li {
    flex-basis:66px!important;
    width:66px!important;
    min-width:66px;
    height:66px;
  }
  body.single-product.woocommerce div.product .vp-pdp-thumb-arrow {
    flex-basis:32px;
    width:32px;
    height:38px;
  }
}
@media (max-width:430px) {
  body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs {
    gap:7px!important;
  }
  body.single-product.woocommerce div.product .vp-pdp-thumb-viewport .flex-control-thumbs li {
    flex-basis:58px!important;
    width:58px!important;
    min-width:58px;
    height:58px;
  }
}

/* Mobile checkout fix — override the later two-column layout rules in style.css.
 * Keep the billing, shipping address, order notes and review in document order. */
@media (max-width:1024px) {
  body.woocommerce-checkout #customer_details {
    display:block!important;
    width:100%!important;
    min-width:0!important;
    grid-template-columns:none!important;
    grid-template-rows:none!important;
    gap:0!important;
  }
  body.woocommerce-checkout #customer_details::before,
  body.woocommerce-checkout #customer_details::after {
    content:none!important;
    display:none!important;
  }
  body.woocommerce-checkout #customer_details > .col-1,
  body.woocommerce-checkout #customer_details > .col-2 {
    display:block!important;
    position:static!important;
    float:none!important;
    clear:both!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-column:auto!important;
    grid-row:auto!important;
    margin:0 0 18px!important;
    padding:0!important;
  }
  body.woocommerce-checkout .woocommerce-billing-fields,
  body.woocommerce-checkout .woocommerce-shipping-fields,
  body.woocommerce-checkout .woocommerce-additional-fields,
  body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
    position:static!important;
    float:none!important;
    clear:both!important;
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body.woocommerce-checkout #ship-to-different-address {
    clear:both!important;
    position:static!important;
    float:none!important;
    margin:0 0 16px!important;
    font-size:18px!important;
    line-height:1.35!important;
  }
  body.woocommerce-checkout #ship-to-different-address label {
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:flex-start!important;
    gap:10px!important;
    width:100%!important;
    margin:0!important;
    cursor:pointer;
    font-size:18px!important;
    line-height:1.35!important;
  }
  body.woocommerce-checkout #ship-to-different-address input[type="checkbox"] {
    flex:0 0 20px!important;
    width:20px!important;
    height:20px!important;
    min-height:20px!important;
    margin:3px 0 0!important;
    padding:0!important;
    position:static!important;
    float:none!important;
    vertical-align:middle!important;
  }
  body.woocommerce-checkout #ship-to-different-address label > span {
    display:block!important;
    flex:1 1 auto!important;
    min-width:0!important;
    white-space:normal!important;
  }
  body.woocommerce-checkout .woocommerce-additional-fields {
    margin:16px 0 20px!important;
  }
  body.woocommerce-checkout #order_review_heading,
  body.woocommerce-checkout #order_review,
  body.woocommerce-checkout .vp-checkout-order-under-notes {
    position:static!important;
    float:none!important;
    clear:both!important;
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body.woocommerce-checkout .woocommerce-checkout-review-order-table {
    width:100%!important;
    max-width:100%!important;
    table-layout:fixed!important;
  }
  body.woocommerce-checkout .woocommerce-checkout-review-order-table td,
  body.woocommerce-checkout .woocommerce-checkout-review-order-table th {
    min-width:0!important;
    overflow-wrap:anywhere;
  }
}
@media (max-width:480px) {
  body.woocommerce-checkout .woocommerce-billing-fields,
  body.woocommerce-checkout .woocommerce-additional-fields,
  body.woocommerce-checkout #order_review {
    padding:16px!important;
  }
  body.woocommerce-checkout #ship-to-different-address label,
  body.woocommerce-checkout #ship-to-different-address {
    font-size:16px!important;
  }
}

/* Native WordPress menus, without the former hard-coded category links. */
@media (min-width:901px) {
  .vp-native-menu { gap:clamp(9px,1.15vw,19px);font-size:13px;white-space:nowrap;min-width:0; }
  .vp-native-menu > li { position:relative;list-style:none; }
  .vp-native-menu > li > a { display:inline-block;padding:13px 0; }
  .vp-native-menu .sub-menu {
    list-style:none;display:none;position:absolute;left:-18px;top:calc(100% - 1px);
    z-index:150;min-width:235px;max-width:min(340px,85vw);padding:10px;
    margin:0;border:1px solid rgba(35,38,49,.11);border-radius:14px;
    background:#fff;box-shadow:0 18px 45px rgba(15,18,29,.18);white-space:normal;
  }
  .vp-native-menu > li:hover > .sub-menu,
  .vp-native-menu > li:focus-within > .sub-menu {display:block;}
  .vp-native-menu .sub-menu li {list-style:none;}
  .vp-native-menu .sub-menu a {
    display:block;padding:10px 12px;border-radius:8px;color:#23252e;
    font-size:13px;line-height:1.35;
  }
  .vp-native-menu .sub-menu a:hover,
  .vp-native-menu .sub-menu a:focus {background:#f1effb;color:#161923;}
  .vp-native-menu .sub-menu a::after {display:none!important;}
}
@media (max-width:900px) {
  .vp-native-mobile li {list-style:none;}
  .vp-native-mobile .menu-item-has-children {position:relative;}
  .vp-native-mobile .menu-item-has-children > a {padding-right:50px;}
  .vp-native-mobile .sub-menu {display:none;list-style:none;margin:0;padding:0 0 10px 13px;}
  .vp-native-mobile .menu-item-has-children.is-open > .sub-menu {display:block;}
  .vp-native-mobile .sub-menu a {
    display:block;min-height:42px;padding:10px 13px;border-radius:8px;
    font-size:14px;line-height:1.35;color:#626673;
  }
  .vp-native-mobile .sub-menu a:hover,
  .vp-native-mobile .sub-menu a:focus {background:#f2f0fb;color:#20212b;}
  .vp-native-submenu-toggle {
    position:absolute;right:0;top:4px;display:grid;place-items:center;
    width:44px;height:44px;border:0;border-radius:9px;
    background:transparent;color:#353743;cursor:pointer;font-size:20px;
  }
  .vp-native-submenu-toggle[aria-expanded="true"] {transform:rotate(180deg);}
  .vp-native-submenu-toggle:focus-visible {outline:2px solid #6650dc;outline-offset:2px;}
}
/* Switch the 8-link native menu to a compact dropdown before it can overflow. */
@media (min-width:901px) and (max-width:1360px) {
  .vp-menu {display:none!important;}
  .vp-menu-toggle {display:flex!important;}
  .vp-mobile-menu {display:none;list-style:none;margin:0 0 12px;padding:8px 0;max-height:calc(100dvh - 115px);overflow-y:auto;background:#fff;border-top:1px solid rgba(20,22,30,.08);}
  .vp-mobile-menu.is-open {display:block!important;}
  .vp-mobile-menu > li {border-bottom:1px solid rgba(20,22,30,.07);}
  .vp-mobile-menu > li > a {width:100%;min-height:52px;display:flex;align-items:center;padding:0 4px;color:#24262d;font-weight:650;font-size:15px;}
  .vp-native-mobile .menu-item-has-children {position:relative;}
  .vp-native-mobile .menu-item-has-children > a {padding-right:50px;}
  .vp-native-mobile .sub-menu {display:none;list-style:none;margin:0;padding:0 0 10px 13px;}
  .vp-native-mobile .menu-item-has-children.is-open > .sub-menu {display:block;}
  .vp-native-mobile .sub-menu a {display:block;min-height:42px;padding:10px 13px;border-radius:8px;font-size:14px;color:#626673;}
  .vp-native-mobile .sub-menu a:hover {background:#f2f0fb;color:#20212b;}
  .vp-native-submenu-toggle {position:absolute;right:0;top:4px;width:44px;height:44px;border:0;border-radius:9px;background:transparent;color:#353743;font-size:20px;cursor:pointer;}
  .vp-native-submenu-toggle[aria-expanded="true"] {transform:rotate(180deg);}
  .vp-native-submenu-toggle:focus-visible {outline:2px solid #6650dc;outline-offset:2px;}
}
/* Consistent card structure: images first, action buttons under the product details.
   Applies to related products on PDP without changing the actual purchase flow. */
body.single-product .related.products ul.products li.product {
  display:flex!important;flex-direction:column!important;
  align-items:stretch!important;position:relative!important;
}
body.single-product .related.products ul.products li.product > .woocommerce-LoopProduct-link {
  display:block!important;flex:1 1 auto!important;min-width:0!important;
}
body.single-product .related.products ul.products li.product > a.button,
body.single-product .related.products ul.products li.product > a.vapora-details {
  display:flex!important;flex:0 0 auto!important;
  position:static!important;float:none!important;clear:both!important;
  order:3!important;width:100%!important;min-height:42px!important;
  align-items:center!important;justify-content:center!important;
  text-align:center!important;margin-top:9px!important;
}
body.single-product .related.products ul.products li.product > a.vapora-details {order:4!important;}
body.single-product .related.products ul.products li.product > .vp-save-btn {
  position:absolute!important;right:14px!important;top:14px!important;
  z-index:8!important;order:0!important;
}
body.single-product .related.products ul.products li.product > .vp-save-product {
  display:none!important;
}

/* Display the explicitly chosen final-banner imagery as real image elements.
   The desktop lifestyle banner is the img src; the curated mobile image is
   the <picture> source at 900px and below. Avoid a competing CSS background. */
.vp-collection-banner.vp-collection-banner--image {
  isolation:isolate;
  background:#080b13!important;
}
.vp-collection-banner--image .vp-collection-banner-media {
  display:block;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
}
.vp-collection-banner--image .vp-collection-banner-media img {
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center center;
}
.vp-collection-banner--image::before {
  z-index:1;
  pointer-events:none;
}
.vp-collection-banner--image .vp-collection-banner-copy {
  position:relative;
  z-index:2;
}