/* ============================================================
   ROLL 32 — SHARED COMMERCE UI / CSS-4A
   Sitewide commerce components: product controls, product cards,
   Quickview, floating cart and XOO sidecart.
   Extracted without rewriting or deduplicating source behavior.
   ============================================================ */

:root {
    --r32-commerce-ui-module-loaded: 1;
    --r32-commerce-ui-module-version: "0.5.0";
}


/* Source group: Shared product variation / CF swatch / WOWADDONS / PRAD controls */
/* ============================================================
   10) PRODUCT PAGE – VARIATIONS + CF SWATCHES
   ============================================================ */
.woocommerce div.product form.variations_form table.variations{
  width: 100%;
  border: 0;
  border-spacing: 0;
}

.woocommerce div.product form.variations_form table.variations tr{
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 10px 0;
}

.woocommerce div.product form.variations_form table.variations th.label{
  width: 120px;
  padding: 0;
  margin: 0;
  color: var(--r32-text);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .3px;
  opacity: .95;
}

.woocommerce div.product form.variations_form table.variations td.value{
  padding: 0;
  margin: 0;
  flex: 1;
}

.woocommerce div.product form.variations_form .cfvsw-swatches-container.cfvsw-product-container{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0;
  margin: 0;
}

.woocommerce div.product form.variations_form .cfvsw-swatches-container .cfvsw-swatches-option{
  background: var(--r32-panel);
  border: 1px solid var(--r32-border);
  padding: 9px 14px;
  min-width: 120px;
  color: var(--r32-text);
  font-weight: 600;
  transition: transform .08s ease, border-color .12s ease, box-shadow .12s ease, background .12s ease;
}

.woocommerce div.product form.variations_form .cfvsw-swatches-container .cfvsw-swatches-option:hover{
  border-color: var(--r32-gold);
  background: rgba(212,175,55,.06);
  box-shadow: 0 0 0 2px rgba(212,175,55,.12);
  transform: translateY(-1px);
}

.woocommerce div.product form.variations_form .cfvsw-swatches-container .cfvsw-selected-swatch{
  background: rgba(212,175,55,.12) !important;
  border-color: var(--r32-gold) !important;
  color: var(--r32-white) !important;
  box-shadow: 0 0 0 2px rgba(212,175,55,.22), 0 8px 22px rgba(0,0,0,.35);
}

.woocommerce div.product form.variations_form a.reset_variations{
      display: inline-block;
      margin-top: 6px;
      color: var(--r32-copper);
      text-decoration: none;
      font-weight: 600;
      font-size: 12px;
      letter-spacing: .6px;
      text-transform: uppercase;
      opacity: .85;
    }

    .woocommerce div.product form.variations_form a.reset_variations:hover{
      opacity: 1;
      text-decoration: none;
    }

/* Mobile product variation / PRAD rules migrated to Roll 32 Site Styles → css/product.css (v0.3.0). */
/* Mobile product tabs / Additional Information / reviews migrated to Roll 32 Site Styles → css/product.css (v0.3.0). */
    /* ============================================================
       11) WOWADDONS PANEL
       ============================================================ */
.woocommerce div.product form.cart .wowaddon,
.woocommerce div.product form.cart .wow-addon,
.woocommerce div.product form.cart [class*="wowaddon"],
.woocommerce div.product form.cart [class*="wow-addon"]{
  background: var(--r32-panel);
  border: 1px solid var(--r32-border);
  padding: 18px 18px 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.woocommerce div.product form.cart .wowaddon label,
.woocommerce div.product form.cart .wow-addon label,
.woocommerce div.product form.cart [class*="wowaddon"] label,
.woocommerce div.product form.cart [class*="wow-addon"] label{
  color: var(--r32-white);
  font-weight: 700;
  letter-spacing: .2px;
}

.woocommerce div.product form.cart .wowaddon input[type="text"],
.woocommerce div.product form.cart .wow-addon input[type="text"],
.woocommerce div.product form.cart [class*="wowaddon"] input[type="text"],
.woocommerce div.product form.cart [class*="wow-addon"] input[type="text"]{
  background: var(--r32-obs);
  border: 1px solid var(--r32-border);
  color: var(--r32-text);
}

.woocommerce div.product form.cart .wowaddon input[type="text"]:focus,
.woocommerce div.product form.cart .wow-addon input[type="text"]:focus,
.woocommerce div.product form.cart [class*="wowaddon"] input[type="text"]:focus{
  outline: none;
  border-color: var(--r32-gold);
  box-shadow: 0 0 0 2px rgba(212,175,55,.18);
}

/* ============================================================
   12) WOWADDONS / PRAD — COLOR TILE UI
   ============================================================ */
.woocommerce div.product form.cart .prad-color-picker-container input[type="text"],
.woocommerce div.product form.cart .prad-color-picker-container input[type="tel"]{
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.woocommerce div.product form.cart .prad-color-picker-container input[type="color"],
.woocommerce div.product form.cart .prad-color-picker-container input[type="color"].prad-front-end{
  position: fixed !important;
  left: -9999px !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.roll32-color-ui{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  background: var(--r32-obs);
  border: 1px solid var(--r32-border);
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
}

.roll32-color-left{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.roll32-color-swatch{
  width: 42px;
  height: 42px;
  border: 1px solid var(--r32-border);
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.04),
    0 10px 22px rgba(0,0,0,.45);
  flex: 0 0 auto;
}

.roll32-color-name{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.roll32-color-title{
  color: var(--r32-white);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.roll32-color-sub{
  color: var(--r32-text);
  font-size: 12px;
  opacity: .9;
}

.roll32-color-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--r32-panel);
  border: 1px solid var(--r32-gold);
  color: var(--r32-gold);
  padding: 8px 12px;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .6px;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  transition: box-shadow .12s ease, transform .08s ease, background .12s ease;
  flex: 0 0 auto;
}

.roll32-color-btn:hover{
  background: rgba(212,175,55,.08);
  box-shadow: 0 0 0 2px rgba(212,175,55,.16);
  transform: translateY(-1px);
}

/* Shop filter architecture migrated to Roll 32 Site Styles → css/vault.css (v0.4.0). */

/* Source group: Mobile mini-cart checkout button */
/* ============================================================
   16) MOBILE — MINI-CART CHECKOUT BUTTON
   ============================================================ */
@media (max-width: 768px){
  .ast-site-header-cart .button,
  .woocommerce-mini-cart__buttons .checkout,
  .woocommerce-mini-cart__buttons a.checkout,
  .ast-site-header-cart .checkout-button{
    background-color: var(--r32-gold) !important;
    color: var(--r32-obs) !important;
    border: 1px solid var(--r32-gold) !important;
    font-weight: 700;
    letter-spacing: 0.5px;
  }

  .ast-site-header-cart .button:hover,
  .woocommerce-mini-cart__buttons .checkout:hover{
    background-color: #c29d2f !important;
    border-color: #c29d2f !important;
  }
}

/* Source group: Shared mobile Astra/XOO basket rules */
/* Vault filter-dock rules migrated to css/vault.css (v0.4.0).
   Shared mobile Astra cart / XOO basket rules remain global below. */
@media (max-width: 921px){

  body .ast-site-header-cart,
  body .ast-site-header-cart a,
  body .ast-site-header-cart .ast-site-header-cart-li{
    opacity: 1 !important;
    visibility: visible !important;
  }

  body .ast-site-header-cart svg,
  body .ast-site-header-cart svg *{
    fill: var(--r32-gold) !important;
    stroke: var(--r32-gold) !important;
    opacity: 1 !important;
  }

  body .xoo-wsc-basket{
    right: 12px !important;
    bottom: calc(11px + env(safe-area-inset-bottom, 0px)) !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1000000 !important;
    transform: none !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  body .xoo-wsc-basket::before,
  body .xoo-wsc-basket::after{
    content: none !important;
    display: none !important;
  }
}

/* Source group: XOO floating cart icon */
/* ============================================================
   18) CART ICON — UNIFIED MOBILE + DESKTOP
   ============================================================ */
@keyframes r32CartPulse{
  0%{
    transform: scale(1);
    filter: brightness(1);
  }
  50%{
    transform: scale(1.18);
    filter: brightness(1.28);
  }
  100%{
    transform: scale(1);
    filter: brightness(1);
  }
}

html body .xoo-wsc-basket{
  position: fixed !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .xoo-wsc-basket,
html body .xoo-wsc-basket *{
  color: var(--r32-gold) !important;
}

html body .xoo-wsc-basket .xoo-wsc-bki{
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  color: var(--r32-gold) !important;
}

html body .xoo-wsc-basket .xoo-wsc-bki::before{
  position: relative !important;
  z-index: 1 !important;
  font-size: 28px !important;
  line-height: 1 !important;
  color: var(--r32-gold) !important;
  opacity: 1 !important;
  text-shadow: 0 0 12px rgba(212,175,55,0.25) !important;
}

html body .xoo-wsc-basket .xoo-wsc-items-count.is-zero{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .xoo-wsc-basket .xoo-wsc-items-count:not(.is-zero){
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--r32-gold) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-shadow:
    0 0 4px rgba(0,0,0,0.95),
    0 0 8px rgba(0,0,0,0.75) !important;
  animation: none !important;
  pointer-events: none !important;
}

html body .xoo-wsc-basket:has(.xoo-wsc-items-count:not(.is-zero)) .xoo-wsc-bki::before{
  animation: r32CartPulse 5s ease-in-out infinite !important;
  transform-origin: center !important;
  will-change: transform, filter !important;
}

@media (min-width: 922px){
  html body .xoo-wsc-basket .xoo-wsc-bki::before{
    font-size: 32px !important;
  }

  html body .xoo-wsc-basket .xoo-wsc-items-count:not(.is-zero){
    font-size: 12px !important;
  }
}

/* Source group: Woo product cards / Quickview trigger */
/* ============================================================
   22) PRODUCT CARDS — HOVER / QUICKVIEW / CATEGORY GLOW
   ============================================================ */
.woocommerce ul.products li.product{
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease;
}

.woocommerce ul.products li.product:hover{
  transform: translateY(-6px);
  box-shadow:
    0 12px 28px rgba(0,0,0,.75),
    0 0 18px rgba(212,175,55,.22),
    0 0 40px rgba(212,175,55,.12);
}

.woocommerce ul.products li.product img{
  transition: transform .25s ease, filter .25s ease;
}

.woocommerce ul.products li.product:hover img{
  transform: scale(1.025);
  filter: brightness(1.07);
}

.woocommerce ul.products li.product .product-category,
.woocommerce ul.products li.product .ast-woo-product-category{
  transition: text-shadow .25s ease, color .25s ease;
}

.woocommerce ul.products li.product:hover .product-category,
.woocommerce ul.products li.product:hover .ast-woo-product-category{
  color: var(--r32-gold);
  text-shadow:
    0 0 6px rgba(212,175,55,.45),
    0 0 14px rgba(212,175,55,.25);
}

/* make image wrapper the positioning context */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap{
  position: relative !important;
}

/* hide redundant Select Options icon */
.woocommerce ul.products li.product .ast-on-card-button.ast-select-options-trigger{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* quick view hidden by default */
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger{
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 8 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  margin: 0 !important;
  visibility: hidden !important;
  opacity: 0 !important;
  cursor: pointer !important;
  background: rgba(11,11,12,0.92) !important;
  border: 1px solid rgba(212,175,55,0.36) !important;
  border-radius: 999px !important;
  box-shadow:
    0 10px 22px rgba(0,0,0,0.50),
    inset 0 0 0 1px rgba(255,255,255,0.03) !important;
  transform: translateY(2px) scale(0.92) !important;
  transition:
    opacity .22s ease,
    visibility .22s ease,
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease !important;
}

.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger svg,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger svg *{
  color: var(--r32-gold) !important;
  fill: var(--r32-gold) !important;
  stroke: var(--r32-gold) !important;
}

.woocommerce ul.products li.product:hover .ast-on-card-button.ast-quick-view-trigger,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger:hover,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger:focus{
  visibility: visible !important;
  opacity: 1 !important;
  background: rgba(11,11,12,0.98) !important;
  border-color: var(--r32-gold) !important;
  box-shadow:
    0 0 0 2px rgba(212,175,55,0.16),
    0 12px 26px rgba(0,0,0,0.58),
    0 0 16px rgba(212,175,55,0.22),
    0 0 28px rgba(212,175,55,0.10) !important;
  transform: translateY(-1px) scale(1.06) !important;
}

.woocommerce ul.products li.product:hover .ast-on-card-button.ast-quick-view-trigger svg,
.woocommerce ul.products li.product:hover .ast-on-card-button.ast-quick-view-trigger svg *,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger:hover svg,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger:hover svg *{
  filter: drop-shadow(0 0 4px rgba(212,175,55,0.35));
}

.woocommerce ul.products li.product .ast-card-action-tooltip{
  position: absolute !important;
  top: 50% !important;
  right: 52px !important;
  transform: translateY(-50%) !important;
  padding: 6px 10px !important;
  background: rgba(11,11,12,0.96) !important;
  border: 1px solid rgba(212,175,55,0.34) !important;
  color: var(--r32-gold) !important;
  border-radius: 0 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.7px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.45),
    0 0 12px rgba(212,175,55,0.08) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition:
    opacity .18s ease,
    transform .18s ease,
    visibility .18s ease !important;
}

.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger:hover .ast-card-action-tooltip,
.woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger:focus .ast-card-action-tooltip{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(-50%) translateX(-2px) !important;
}

@media (max-width: 920px){
  .woocommerce ul.products li.product .ast-on-card-button.ast-quick-view-trigger{
    display: none !important;
  }
}

/* Source group: XOO shipping drawer + floating-bag state */
/* ============================================================
   24) SHIPPING DRAWER / SIDE CART SHIPPING
   ============================================================ */
.xoo-wsc-slider,
.xoo-wsc-slider-active .xoo-wsc-slider,
.xoo-wsc-sl-content[data-slider="shipping"],
.xoo-wsc-sl-shipping{
  background: #141415 !important;
  color: #B0B0B0 !important;
}

.xoo-wsc-sl-head{
  background: #0B0B0C !important;
  color: #D4AF37 !important;
  border-bottom: 1px solid #2D2D2E !important;
}

.xoo-wsc-sl-head,
.xoo-wsc-sl-head *{
  color: #D4AF37 !important;
}

.xoo-wsc-sl-body{
  background: #141415 !important;
  color: #B0B0B0 !important;
}

.xoo-wsc-slider label,
.xoo-wsc-slider p,
.xoo-wsc-slider span,
.xoo-wsc-slider small,
.xoo-wsc-slider .woocommerce-shipping-destination,
.xoo-wsc-slider .shipping-calculator-button{
  color: #B0B0B0 !important;
}

.xoo-wsc-slider a,
.xoo-wsc-slider .shipping-calculator-button{
  color: #D4AF37 !important;
}

.xoo-wsc-slider .woocommerce-shipping-calculator,
.xoo-wsc-slider #shipping-calculator-form,
.xoo-wsc-slider section.shipping-calculator-form{
  background: #141415 !important;
  color: #B0B0B0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.xoo-wsc-slider .form-row,
.xoo-wsc-slider p.form-row,
.xoo-wsc-slider .form-row-wide{
  background: transparent !important;
  color: #B0B0B0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

.xoo-wsc-slider input[type="text"],
.xoo-wsc-slider input[type="number"],
.xoo-wsc-slider input[type="email"],
.xoo-wsc-slider input[type="tel"],
.xoo-wsc-slider textarea{
  background: #0B0B0C !important;
  color: #FFFFFF !important;
  border: 1px solid #2D2D2E !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 42px !important;
  min-height: 42px !important;
  line-height: 42px !important;
  padding: 0 14px !important;
}

.xoo-wsc-slider select{
  background: #0B0B0C !important;
  color: #FFFFFF !important;
  border: 1px solid #2D2D2E !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.xoo-wsc-slider input[type="text"]:focus,
.xoo-wsc-slider input[type="number"]:focus,
.xoo-wsc-slider input[type="email"]:focus,
.xoo-wsc-slider input[type="tel"]:focus,
.xoo-wsc-slider textarea:focus,
.xoo-wsc-slider select:focus{
  border-color: #D4AF37 !important;
  outline: none !important;
  box-shadow: 0 0 0 1px #D4AF37 !important;
}

.xoo-wsc-slider input::placeholder,
.xoo-wsc-slider textarea::placeholder{
  color: #B0B0B0 !important;
  opacity: 0.8 !important;
}

.xoo-wsc-slider .select2-container,
.xoo-wsc-slider .select2-container--default,
.xoo-wsc-slider .select2-container--default .select2-selection--single{
  background: #0B0B0C !important;
  color: #FFFFFF !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.xoo-wsc-slider .select2-container--default .select2-selection--single{
  background: #0B0B0C !important;
  border: 1px solid #2D2D2E !important;
  height: 42px !important;
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
}

.xoo-wsc-slider .select2-container--default .select2-selection--single .select2-selection__rendered{
  color: #FFFFFF !important;
  line-height: 40px !important;
  padding-left: 14px !important;
  padding-right: 34px !important;
  margin: 0 !important;
}

.xoo-wsc-slider .select2-container--default .select2-selection--single .select2-selection__arrow{
  height: 40px !important;
  top: 0 !important;
  right: 8px !important;
}

.xoo-wsc-slider .select2-container--default .select2-selection--single .select2-selection__arrow b{
  border-top-color: #D4AF37 !important;
  border-bottom-color: #D4AF37 !important;
}

.xoo-wsc-slider .select2-container--default.select2-container--focus .select2-selection--single,
.xoo-wsc-slider .select2-container--default.select2-container--open .select2-selection--single{
  border-color: #D4AF37 !important;
  box-shadow: 0 0 0 1px #D4AF37 !important;
}

.select2-dropdown{
  background: #141415 !important;
  color: #FFFFFF !important;
  border: 1px solid #2D2D2E !important;
  border-radius: 0 !important;
}

.select2-search--dropdown .select2-search__field{
  background: #0B0B0C !important;
  color: #FFFFFF !important;
  border: 1px solid #2D2D2E !important;
  border-radius: 0 !important;
}

.select2-search--dropdown .select2-search__field:focus{
  border-color: #D4AF37 !important;
  box-shadow: 0 0 0 1px #D4AF37 !important;
  outline: none !important;
}

.select2-container--default .select2-results__option{
  background: #141415 !important;
  color: #B0B0B0 !important;
  padding: 8px 14px !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected]{
  background: #1A1A1B !important;
  color: #D4AF37 !important;
}

.select2-container--default .select2-results__option[aria-selected="true"]{
  background: #0B0B0C !important;
  color: #FFFFFF !important;
}

.xoo-wsc-slider button,
.xoo-wsc-slider .button,
.xoo-wsc-slider input[type="submit"]{
  background: #0B0B0C !important;
  color: #D4AF37 !important;
  border: 1px solid #D4AF37 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-transform: uppercase !important;
}

.xoo-wsc-slider button:hover,
.xoo-wsc-slider .button:hover,
.xoo-wsc-slider input[type="submit"]:hover{
  background: #D4AF37 !important;
  color: #0B0B0C !important;
  border-color: #D4AF37 !important;
}

.xoo-wsc-slider .form-row label,
.xoo-wsc-slider p.form-row label{
  display: block !important;
  margin-bottom: 8px !important;
}

/* ============================================================
   25) HIDE FLOATING BAG WHEN SIDE CART IS OPEN (MOBILE)
   ============================================================ */
@media (max-width: 768px){
  body.xoo-wsc-cart-active .xoo-wsc-basket,
  html.xoo-wsc-cart-active .xoo-wsc-basket{
    opacity: 0 !important;
    pointer-events: none !important;
    transform: scale(0.9);
  }
}

/* Source group: Custom Quickview drawer + iframe mode + shared video/color rules */
/* ============================================================
   29) CUSTOM QUICKVIEW DRAWER
   ============================================================ */
html.r32-qv-open,
body.r32-qv-open{
  overflow: hidden !important;
}

#r32-qv-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s ease, visibility .28s ease;
  z-index: 999998;
}

#r32-qv-overlay.is-open{
  opacity: 1;
  visibility: visible;
}

#r32-qv-drawer{
  position: fixed;
  top: 0;
  right: 0;
  width: 640px;
  max-width: 92vw;
  height: 100vh;
  background: #0B0B0C;
  border-left: 1px solid rgba(212,175,55,.22);
  box-shadow: -18px 0 40px rgba(0,0,0,.42);
  transform: translate3d(100%,0,0);
  opacity: .98;
  transition:
    transform .38s cubic-bezier(.22,1,.36,1),
    opacity .28s ease;
  z-index: 999999;
  display: flex;
  flex-direction: column;
  will-change: transform, opacity;
  overflow: hidden !important;
}

#r32-qv-drawer.is-open{
  transform: translate3d(0,0,0);
  opacity: 1;
}

#r32-qv-head{
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 0 52px 0 18px;
  border-bottom: 1px solid rgba(212,175,55,.14);
  background: #0B0B0C;
}

#r32-qv-title{
  color: #D4AF37;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  line-height: 1;
}

#r32-qv-close{
  position: absolute;
  top: 28px;
  right: 14px;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: #D4AF37;
  font-size: 34px;
  line-height: 1;
  cursor: pointer;
  z-index: 3;
  transition: color .15s ease;
}

#r32-qv-close:hover{
  color: #FFFFFF;
}

#r32-qv-body{
  flex: 1 1 auto !important;
  min-height: 0 !important;
  position: relative;
  overflow: hidden !important;
}

#r32-qv-frame{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: #0B0B0C;
  opacity: 1;
  transition: opacity .22s ease;
  overflow: hidden !important;
}

#r32-qv-loading{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  background:
    radial-gradient(circle at center, rgba(212,175,55,.06) 0%, rgba(11,11,12,0) 38%),
    #0B0B0C;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease;
  z-index: 2;
}

#r32-qv-drawer.is-loading #r32-qv-loading{
  opacity: 1;
  visibility: visible;
}

#r32-qv-spinner{
  width: 42px;
  height: 42px;
  border: 2px solid rgba(212,175,55,.16);
  border-top-color: #D4AF37;
  animation: r32-qv-spin .9s linear infinite;
  box-shadow: 0 0 18px rgba(212,175,55,.10);
}

#r32-qv-loading-text{
  color: #D4AF37;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-align: center;
}

#r32-qv-loading-sub{
  color: #B0B0B0;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
  max-width: 220px;
}

@keyframes r32-qv-spin{
  to{ transform: rotate(360deg); }
}

#r32-qv-drawer.is-loading #r32-qv-frame{
  opacity: 0;
}

@media (min-width: 1025px){
  :root{
    --r32-qv-width: 640px;
  }

  html.r32-qv-open,
  body.r32-qv-open{
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  #r32-qv-overlay{
    background: transparent !important;
    backdrop-filter: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  #r32-qv-drawer{
    width: var(--r32-qv-width) !important;
    max-width: var(--r32-qv-width) !important;
    box-shadow:
      -18px 0 40px rgba(0,0,0,.45),
      -1px 0 0 rgba(212,175,55,.10) !important;
  }

  #r32-qv-drawer::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(
      to bottom,
      rgba(212,175,55,0),
      rgba(212,175,55,.28),
      rgba(212,175,55,0)
    );
    pointer-events: none;
  }

  body.r32-qv-open #page{
    padding-right: var(--r32-qv-width) !important;
    transition: padding-right .38s cubic-bezier(.22,1,.36,1);
  }
}

@media (max-width: 1024px){
  #r32-qv-drawer{
    width: min(640px, 92vw);
    max-width: 92vw;
  }
}

@media (max-width: 768px){
  #r32-qv-drawer{
    width: 100vw;
    max-width: 100vw;
  }
}

/* ============================================================
   30) QUICKVIEW MODE (IFRAME CONTENT)
   ============================================================ */
body.r32-quickview-mode{
  background: #0B0B0C !important;
}

body.r32-quickview-mode header,
body.r32-quickview-mode footer,
body.r32-quickview-mode .site-below-footer-wrap,
body.r32-quickview-mode .related.products,
body.r32-quickview-mode .up-sells,
body.r32-quickview-mode .woocommerce-tabs,
body.r32-quickview-mode .product_meta .posted_in + *,
body.r32-quickview-mode .ast-woocommerce-container > nav,
body.r32-quickview-mode .breadcrumbs,
body.r32-quickview-mode .ast-breadcrumbs-wrapper,
body.r32-quickview-mode .woocommerce-breadcrumb{
  display: none !important;
}

body.r32-quickview-mode .site-content,
body.r32-quickview-mode .ast-container,
body.r32-quickview-mode .content-area,
body.r32-quickview-mode .site-main{
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.r32-quickview-mode.single-product div.product{
  margin: 0 !important;
  padding: 18px 18px 120px !important;
}

body.r32-quickview-mode .r32-qv-full-link-wrap{
  margin: 10px 0 32px !important;
}

body.r32-quickview-mode .r32-qv-full-link{
  display: inline-block;
  color: var(--r32-gold);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
}

body.r32-quickview-mode .r32-qv-full-link:hover{
  text-decoration: underline;
}

body.r32-quickview-mode .roll32-input-overlay,
body.r32-quickview-mode .roll32-btn-overlay-label{
  pointer-events: none !important;
}

body.r32-quickview-mode .woocommerce-product-gallery .flex-viewport,
body.r32-quickview-mode .ast-product-gallery-layout-horizontal-slider .flex-viewport{
  max-height: 420px !important;
  overflow: hidden !important;
}

body.r32-quickview-mode .woocommerce-product-gallery .flex-viewport img,
body.r32-quickview-mode .woocommerce-product-gallery__wrapper img{
  max-height: 420px !important;
  width: 100% !important;
  object-fit: contain !important;
}

body.r32-quickview-mode .single_variation_wrap .woocommerce-variation-add-to-cart,
body.r32-quickview-mode form.cart:not(.variations_form){
  position: sticky;
  bottom: 0;
  z-index: 30;
  background: linear-gradient(to top, #0B0B0C 82%, rgba(11,11,12,.94) 100%);
  padding: 14px 0 calc(10px + env(safe-area-inset-bottom, 0px));
  margin-top: 18px;
  border-top: 1px solid rgba(212,175,55,.16);
  box-shadow: 0 -12px 24px rgba(0,0,0,.30);
}

body.r32-quickview-mode .woocommerce-product-gallery__image a,
body.r32-quickview-mode .woocommerce-product-gallery__image img{
  cursor: default !important;
}

body.r32-quickview-mode .woocommerce-product-gallery__wrapper img{
  transform: none !important;
  transition: none !important;
}

body.r32-quickview-mode .zoomImg{
  display: none !important;
}

html.r32-quickview-html,
body.r32-quickview-mode{
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: thin;
  scrollbar-color: #000000 #000000;
}

html.r32-quickview-html::-webkit-scrollbar,
body.r32-quickview-mode::-webkit-scrollbar{
  width: 8px;
  background: #000000 !important;
}

html.r32-quickview-html::-webkit-scrollbar-track,
body.r32-quickview-mode::-webkit-scrollbar-track{
  background: #000000 !important;
}

html.r32-quickview-html::-webkit-scrollbar-thumb,
body.r32-quickview-mode::-webkit-scrollbar-thumb{
  background: #000000 !important;
  border-radius: 999px;
  border: 0 !important;
  box-shadow: none !important;
}

html.r32-quickview-html::-webkit-scrollbar-thumb:hover,
body.r32-quickview-mode::-webkit-scrollbar-thumb:hover{
  background: #000000 !important;
}

html.r32-quickview-html::-webkit-scrollbar-corner,
body.r32-quickview-mode::-webkit-scrollbar-corner{
  background: #000000 !important;
}

body.r32-quickview-mode .single_variation_wrap{
  margin-bottom: 0 !important;
}

body.r32-quickview-mode form.cart,
body.r32-quickview-mode .variations_form{
  margin-top: 10px !important;
}

body.r32-quickview-mode .ast-single-product-extras{
  margin-top: 10px !important;
}

body.r32-quickview-mode .price{
  color: #FFFFFF !important;
  font-weight: 600;
}

/* Single-product price / spacing architecture migrated to Roll 32 Site Styles → css/product.css (v0.3.0). */

body.r32-quickview-mode .product_title,
body.r32-quickview-mode h1.product_title{
  margin-bottom: 8px !important;
}

body.r32-quickview-mode .variations td.label{
  padding-bottom: 2px !important;
}

body.r32-quickview-mode .variations td.value{
  padding-bottom: 2px !important;
}

body.r32-quickview-mode .woocommerce-variation-price{
  margin: 0 0 8px !important;
}

body.r32-quickview-mode .woocommerce-variation-add-to-cart{
  margin-top: 2px !important;
}

/* ============================================================
   32) KLARNA / EXPRESS PAYMENTS (REMOVED)
   ============================================================ */
/* Old Klarna/Express CSS has been removed. Messaging is disabled server-side. */
/* Single-product RSFV video-thumbnail treatment migrated to Roll 32 Site Styles → css/product.css (v0.3.0). */

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide,
body.r32-quickview-mode .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide{
  background: #000 !important;
  overflow: hidden !important;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide.flex-active-slide video.rsfv-video,
body.r32-quickview-mode .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide.flex-active-slide video.rsfv-video{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  background: #000 !important;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide:not(.flex-active-slide) video.rsfv-video,
body.r32-quickview-mode .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide:not(.flex-active-slide) video.rsfv-video{
  display: none !important;
}

.single-product .woocommerce-product-gallery .flex-viewport:has(.woocommerce-product-gallery__image.r32-video-slide.flex-active-slide),
body.r32-quickview-mode .woocommerce-product-gallery .flex-viewport:has(.woocommerce-product-gallery__image.r32-video-slide.flex-active-slide){
  height: 520px !important;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide.flex-active-slide,
body.r32-quickview-mode .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide.flex-active-slide{
  height: 520px !important;
}

@media (max-width: 921px){
  .single-product .woocommerce-product-gallery .flex-viewport:has(.woocommerce-product-gallery__image.r32-video-slide.flex-active-slide),
  body.r32-quickview-mode .woocommerce-product-gallery .flex-viewport:has(.woocommerce-product-gallery__image.r32-video-slide.flex-active-slide){
    height: 380px !important;
  }

  .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide.flex-active-slide,
  body.r32-quickview-mode .woocommerce-product-gallery .woocommerce-product-gallery__image.r32-video-slide.flex-active-slide{
    height: 380px !important;
  }
}

.single-product .woocommerce-product-gallery .flex-control-thumbs li video.rsfv-video,
body.r32-quickview-mode .woocommerce-product-gallery .flex-control-thumbs li video.rsfv-video{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: cover !important;
}

/* Single-product color-picker spacing migrated to Roll 32 Site Styles → css/product.css (v0.3.0). */

body.r32-quickview-mode .roll32-color-row{
  padding: 0 14px !important;
  box-sizing: border-box !important;
  gap: 12px !important;
}

body.r32-quickview-mode .roll32-btn-wrap{
  padding-left: 12px !important;
}

/* Source group: Base simple-price rule */
.roll32-simple-price{
  display: block !important;
  margin: 0 0 16px !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: #FFFFFF !important;
}

/* Source group: Header-cart hover treatment */
/* ============================================================
   ROLL 32 — HEADER CART HOVER (REAL TARGET = .count)
   ============================================================ */

.ast-site-header-cart .count,
.ast-site-header-cart .count .ast-count-text,
.ast-site-header-cart .count::before,
.ast-site-header-cart .count::after{
  transition:
    color 0.22s ease,
    border-color 0.22s ease,
    filter 0.22s ease,
    text-shadow 0.22s ease,
    opacity 0.22s ease !important;
}

.ast-site-header-cart .count:hover,
.ast-site-header-cart .count:hover .ast-count-text{
  color: #f1e2a3 !important;
  text-shadow:
    0 0 3px rgba(255,255,255,0.10),
    0 0 6px rgba(255,255,255,0.05) !important;
  filter: brightness(1.06) !important;
}

.ast-site-header-cart .count:hover::before,
.ast-site-header-cart .count:hover::after{
  border-color: #f1e2a3 !important;
  filter:
    brightness(1.06)
    drop-shadow(0 0 2px rgba(255,255,255,0.08))
    drop-shadow(0 0 5px rgba(255,255,255,0.04)) !important;
}

/* Source group: Mobile sidecart stacking / structure / footer layout */
/* ============================================================
   18.1) MOBILE — SIDECART STACKING FIX
   Keep basket container above sticky filter dock
   ============================================================ */
@media (max-width: 921px){
  body .xoo-wsc-container{
    z-index: 1000001 !important;
  }

  body .xoo-wsc-basket{
    z-index: 1000002 !important;
  }
}
/* ============================================================
   ROLL 32 — SIDECART REMOVE VIEW CART BUTTON
   ============================================================ */
body .xoo-wsc-ft-btn-cart,
body .xoo-wsc-ft-btn.xoo-wsc-cart,
body .xoo-wsc-btn-cart,
body .xoo-wsc-footer a[href*="/cart"],
body .xoo-wsc-footer .xoo-wsc-ft-btn-cart{
  display: none !important;
}
/* ============================================================
   ROLL 32 — PHASE 2.5 MOBILE SIDECART STRUCTURE FIX
   Keeps cart items visible while builder/footer stays anchored
   Mobile only
   ============================================================ */
@media (max-width: 768px){

  /* --------------------------------------------
     1) MAKE THE SIDECART A FLEX COLUMN LAYOUT
  -------------------------------------------- */
  body .xoo-wsc-container,
  body .xoo-wsc-main,
  body .xoo-wsc-content{
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  /* --------------------------------------------
     2) KEEP HEADER FIXED HEIGHT
  -------------------------------------------- */
  body .xoo-wsc-header,
  body .xoo-wsc-head{
    flex: 0 0 auto !important;
  }

  /* --------------------------------------------
     3) MAKE PRODUCT LIST AREA THE SCROLL ZONE
  -------------------------------------------- */
  body .xoo-wsc-body{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 10px !important;
  }

  /* --------------------------------------------
     4) PIN THE FOOTER / CONTROL PANEL
  -------------------------------------------- */
  body .xoo-wsc-footer{
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 30 !important;
    background: #141415 !important;
    border-top: 1px solid rgba(212,175,55,0.22) !important;
    box-shadow: 0 -10px 24px rgba(0,0,0,0.42) !important;
    padding-top: 10px !important;
    padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* --------------------------------------------
     5) TIGHTEN FOOTER CONTENT SPACING
  -------------------------------------------- */
  body .xoo-wsc-footer .r32-encounter-progress{
    margin: 10px 0 10px !important;
    padding: 10px !important;
  }

  body .xoo-wsc-footer .r32-ship-progress{
    margin: 10px 0 10px !important;
    padding: 10px 12px !important;
  }

  body .xoo-wsc-footer .xoo-wsc-ft-buttons-cont,
  body .xoo-wsc-footer .xoo-wsc-ft-btns-cont{
    margin-top: 8px !important;
  }

  /* --------------------------------------------
     6) MAKE ENCOUNTER BOX MORE COMPACT ON MOBILE
  -------------------------------------------- */
  body .r32-encounter-head{
    margin-bottom: 6px !important;
  }

  body .r32-encounter-title{
    font-size: 12px !important;
    letter-spacing: 0.8px !important;
  }

  body .r32-encounter-count{
    font-size: 11px !important;
  }

  body .r32-encounter-status{
    font-size: 12px !important;
    margin-bottom: 4px !important;
  }

  body .r32-encounter-sub{
    font-size: 11px !important;
    line-height: 1.35 !important;
    margin-bottom: 8px !important;
  }

  body .r32-encounter-bar{
    height: 8px !important;
    margin-bottom: 10px !important;
  }

  body .r32-encounter-milestones{
    gap: 6px !important;
    margin-bottom: 8px !important;
  }

  body .r32-encounter-step{
    padding: 6px 4px !important;
  }

  body .r32-encounter-step-num{
    font-size: 12px !important;
    margin-bottom: 1px !important;
  }

  body .r32-encounter-step-label{
    font-size: 9px !important;
    line-height: 1.08 !important;
  }

  body .r32-encounter-note{
    font-size: 10px !important;
    line-height: 1.3 !important;
  }

  /* --------------------------------------------
     7) MAKE FREE SHIPPING BOX MORE COMPACT TOO
  -------------------------------------------- */
  body .r32-ship-progress-message{
    margin-bottom: 6px !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
  }

  body .r32-ship-progress-bar{
    height: 8px !important;
  }

  /* --------------------------------------------
     8) TIGHTEN BUTTONS
  -------------------------------------------- */
  body .xoo-wsc-ft-btn,
  body .xoo-wsc-ft-btns-cont a,
  body .xoo-wsc-ft-buttons-cont a{
    min-height: 44px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* --------------------------------------------
     9) GIVE PRODUCT CARDS A LITTLE MORE ROOM
  -------------------------------------------- */
  body .xoo-wsc-body .xoo-wsc-product{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  /* --------------------------------------------
     10) OPTIONAL SAFETY:
     cap footer footprint so it never eats entire screen
  -------------------------------------------- */
  body .xoo-wsc-footer{
    max-height: 52dvh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* --------------------------------------------
     11) FORCE HIDE FLOATING BASKET WHEN CART OPEN
  -------------------------------------------- */
  body.xoo-wsc-cart-active .xoo-wsc-basket,
  html.xoo-wsc-cart-active .xoo-wsc-basket {
    display: none !important;
    visibility: hidden !important;
  }
}