/* ==================================================================
   Variation Savings + Herbies Pack Rows - Main Styles
   Version: 3.1.8
   ================================================================== */

/* ---------------------------------------------------------
   FOUC Prevention
   --------------------------------------------------------- */
.js form.variations_form:not(.vsh-ready){
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: relative !important;
}

.js form.variations_form.vsh-ready{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity 0.3s ease !important;
}

/*
 * If the enhanced UI wins, keep the native Woo pack select hidden.
 * This prevents the slow-network race where a stale failsafe state briefly
 * reveals the native select and the shiny pack pills later appear as well.
 */
.js form.variations_form.vsh-ready:not(.vsh-failsafe) .bde-woo-select.vsp-pack-hidden,
.js form.variations_form.vsh-ready:not(.vsh-failsafe) select.vsp-pack-hidden{
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  overflow: hidden !important;
  clip: rect(1px,1px,1px,1px) !important;
  clip-path: inset(50%) !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Failsafe: if enhanced VSH UI does not finish, show native Woo form */
.js form.variations_form.vsh-failsafe{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.js form.variations_form.vsh-failsafe .single_variation_wrap,
.js form.variations_form.vsh-failsafe .single_variation_wrap:not(.vsh-moved),
.js form.variations_form.vsh-failsafe .single_variation_wrap.vsh-failsafe-visible{
  opacity: 1 !important;
  visibility: visible !important;
  position: static !important;
  pointer-events: auto !important;
  display: block !important;
}

.js form.variations_form.vsh-failsafe .vsp-purchase-stack:not(.is-has-selection) .single_variation_wrap{
  display: block !important;
}

.js form.variations_form.vsh-failsafe select[name^="attribute_"],
.js form.variations_form.vsh-failsafe select.vsp-pack-hidden,
.js form.variations_form.vsh-failsafe .bde-woo-select.vsp-pack-hidden{
  position: static !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  min-width: 160px !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* ---------------------------------------------------------
   Savings badge
   --------------------------------------------------------- */
.vsp-save{
  font-weight: 800 !important;
  color: var(--c-forest, #1C3A2A) !important;
  white-space: nowrap !important;
}

.vsp-purchase-heading{ 
  font-size: 20px !important; 
}

/* ---------------------------------------------------------
   Design tokens (SCFC palette, NOT scoped to .scfc)
   --------------------------------------------------------- */
.vsp-pack,
.vsp-purchase-stack,
.vsp-var-summary,
.vsp-attrs-toggle{
  --gap:20px;
  --c-leaf:#AFEA80;
  --c-forest:#1C3A2A;
  --c-gold:#FFD600;
  --c-ink:#111827;
  --c-muted:#6B7280;
  --c-card:#ffffff;
  --c-slate:#EEF1F4;
  --c-slate-border:#D6DDE3;
  --c-latte:#F3E9D7;
  --radius:18px;
  --shadow:0 10px 18px rgba(0,0,0,.08);
}

/* ---------------------------------------------------------
   Pack rows (desktop grid layout)
   --------------------------------------------------------- */
.vsp-pack{
  --row-gap: 6px;
  --border-w: 1px;
  --gap: 10px;

  --vsp-w-pack: max-content;
  --vsp-w-type: max-content;
  --vsp-w-unavail: 0px;
  --vsp-w-meta: max-content;
  --vsp-w-final: max-content;
}

.vsp-pack__grid{
  display:flex !important;
  flex-direction:column !important;
  gap:var(--row-gap) !important;
  width:100% !important;
  padding-top: 5px !important;
  box-sizing: border-box !important;
}

.vsp-pack__pill{
  position:relative !important;
  display:grid !important;
  grid-template-columns:
    minmax(max-content, var(--vsp-w-pack))
    minmax(max-content, var(--vsp-w-type))
    minmax(0, var(--vsp-w-unavail))
    minmax(0, 1fr)
    minmax(max-content, var(--vsp-w-meta))
    minmax(max-content, var(--vsp-w-final)) !important;
  align-items:center !important;
  column-gap: var(--gap) !important;
  width:100% !important;
  padding:10px 12px !important;
  border-radius: calc(var(--radius) - 4px) !important;
  border: var(--border-w) solid rgba(28,58,42,.22) !important;
  background: rgba(175,234,128,.10) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
  cursor:pointer !important;
  transition: transform .08s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease !important;
  overflow: visible !important;
  box-sizing:border-box !important;
}

.vsp-pack__pill > *{ 
  min-width:0 !important; 
}

.vsp-pack__pill.is-reg{
  background: rgba(243,233,215,.92) !important;
  border-color: rgba(214,221,227,1) !important;
}

.vsp-pack__pill:hover{
  transform: translateY(-1px) !important;
  background: rgba(255,214,0,.14) !important;
  border-color: rgba(255,214,0,.55) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.06) !important;
}

.vsp-pack__pill:focus-visible{
  outline:none !important;
  box-shadow: 0 0 0 2px rgba(255,214,0,.28), 0 8px 18px rgba(0,0,0,.06) !important;
}

.vsp-pack__pill.is-active{
  background: rgba(255,214,0,.18) !important;
  border-color: var(--c-forest) !important;
  box-shadow: 0 0 0 2px rgba(28,58,42,.16) !important;
}

.vsp-pack__pill.is-active:hover{
  background: rgba(255,214,0,.18) !important;
}

.vsp-pack__pill.is-disabled{
  background: #F3F4F6 !important;
  border-color: rgba(17,24,39,.18) !important;
  opacity: 1 !important;
  cursor:not-allowed !important;
  transform:none !important;
  box-shadow:none !important;
}

.vsp-pack__pill > input[type="radio"]{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  border:0 !important;
}

/* Grid column pinning */
.vsp-pack__pack{ grid-column: 1 !important; }
.vsp-pack__type{ grid-column: 2 !important; }
.vsp-pack__unavail{ grid-column: 3 !important; }
.vsp-pack__spacer{ grid-column: 4 !important; }
.vsp-pack__meta{ grid-column: 5 !important; }
.vsp-pack__final{ grid-column: 6 !important; }

/* Pack name */
.vsp-pack__pack{
  font-weight: 900 !important;
  font-size: 15px !important;
  color: var(--c-ink) !important;
  white-space:nowrap !important;
  justify-self:start !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Type badge */
.vsp-pack__type{
  justify-self:start !important;
  white-space:nowrap !important;
  min-width: var(--vsp-w-type) !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.vsp-pack__sub{
  display:inline-flex !important;
  align-items:center !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  padding:3px 7px !important;
  border-radius:999px !important;
  border:1px solid rgba(28,58,42,.22) !important;
  background: rgba(28,58,42,.06) !important;
  color: var(--c-forest) !important;
  white-space:nowrap !important;
}

/* Unavailable pill */
.vsp-pack__unavail{
  font-size:11px !important;
  font-weight:800 !important;
  padding:3px 8px !important;
  border-radius:999px !important;
  background: rgba(107,114,128,.12) !important;
  border:1px solid rgba(107,114,128,.25) !important;
  color: rgba(107,114,128,.95) !important;
  white-space:nowrap !important;
  justify-self:start !important;
  min-width: var(--vsp-w-unavail) !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Spacer */
.vsp-pack__spacer{
  justify-self:stretch !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
}

/* Meta (old price + save) */
.vsp-pack__meta{
  justify-self:end !important;
  text-align:right !important;
  white-space:nowrap !important;
  display:inline-flex !important;
  align-items:baseline !important;
  gap:6px !important;
  min-width: var(--vsp-w-meta) !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.vsp-pack__meta del{
  opacity:.9 !important;
  color: var(--c-muted) !important;
  font-weight:800 !important;
}

/* Final price */
.vsp-pack__final{
  justify-self:end !important;
  text-align:right !important;
  white-space:nowrap !important;
  display:inline-flex !important;
  align-items:baseline !important;
  flex-wrap:nowrap !important;
  min-width: var(--vsp-w-final) !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.vsp-pack__final .price{
  display:inline-flex !important;
  align-items:baseline !important;
  gap:4px !important;
}

.vsp-pack__final ins{
  text-decoration:none !important;
  font-weight:900 !important;
  color: var(--c-forest) !important;
  background: linear-gradient(90deg, rgba(255,214,0,.35), rgba(175,234,128,.25)) !important;
  padding:2px 6px !important;
  border-radius:6px !important;
}

.vsp-pack__final .amount{ 
  font-weight:900 !important; 
}

.vsp-pack__pill.is-disabled .vsp-pack__pack,
.vsp-pack__pill.is-disabled .vsp-pack__meta,
.vsp-pack__pill.is-disabled .vsp-pack__final,
.vsp-pack__pill.is-disabled .vsp-pack__type{
  color: rgba(17,24,39,.55) !important;
}
/* ---------------------------------------------------------
   Breakdance/VSH: neutralise rogue strong wrapper around
   sticky purchase column
   --------------------------------------------------------- */

body.single-product .stickydivv > strong,
body.single-product .bde-div-450-180 > strong{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  font-weight:inherit !important;
}

body.single-product .stickydivv > strong > .bde-columns,
body.single-product .bde-div-450-180 > strong > .bde-columns{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
/* ---------------------------------------------------------
   Purchase stack
   --------------------------------------------------------- */
.vsp-purchase-stack{
  margin-top: 10px !important;
  padding: 12px 14px !important;
  border-radius: var(--radius) !important;
  background: var(--c-card) !important;
  border: 1px solid rgba(28,58,42,.14) !important;
  box-shadow: var(--shadow) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing: border-box !important;
}

.vsp-purchase-stack .single_variation_wrap{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing:border-box !important;
}
.vsp-purchase-stack .woocommerce-variation,
.vsp-purchase-stack .woocommerce-variation-add-to-cart{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
/* Hide single_variation_wrap until moved - prevents FOUC */
.js form.variations_form .single_variation_wrap:not(.vsh-moved){
  opacity: 0 !important;
  position: absolute !important;
  pointer-events: none !important;
}

.js .vsp-purchase-stack .single_variation_wrap.vsh-moved{
  opacity: 1 !important;
  position: static !important;
  pointer-events: auto !important;
}

.vsp-purchase-stack .woocommerce-variation-add-to-cart{
  display:grid !important;
  grid-template-columns:120px minmax(0, 1fr) !important;
  align-items:stretch !important;
  justify-items:stretch !important;
  gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

.vsp-purchase-stack .quantity{
  width:120px !important;
  max-width:120px !important;
  min-width:0 !important;
  margin:0 !important;
  flex:none !important;
  box-sizing:border-box !important;
}

.vsp-purchase-stack .quantity input.qty{
  width:100% !important;
  height:44px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(28,58,42,.22) !important;
  background: rgba(175,234,128,.10) !important;
  color: var(--c-ink) !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  line-height: 1 !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
  transition: transform .08s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.vsp-purchase-stack .quantity input.qty:focus{
  outline:none !important;
  background: #fff !important;
  border-color: var(--c-forest) !important;
  box-shadow: 0 0 0 2px rgba(255,214,0,.28) !important;
}

.vsp-purchase-stack .woocommerce-variation-add-to-cart .single_add_to_cart_button{
  grid-column:2 !important;
  justify-self:stretch !important;
  align-self:stretch !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  flex:none !important;
  height:44px !important;
  box-sizing:border-box !important;
  border-radius: 14px !important;
  border: 1px solid rgba(28,58,42,.28) !important;
  background: linear-gradient(90deg, rgba(175,234,128,.38), rgba(255,214,0,.35)) !important;
  color: var(--c-forest) !important;
  font-weight: 950 !important;
  font-size: 15px !important;
  letter-spacing: .01em !important;
  box-shadow: 0 12px 18px rgba(0,0,0,.08) !important;
  transition: transform .08s ease, box-shadow .15s ease, filter .15s ease;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}

.vsp-purchase-stack .single_add_to_cart_button:hover{
  transform: translateY(-1px) !important;
  filter: saturate(1.08) contrast(1.02) !important;
  box-shadow: 0 16px 24px rgba(0,0,0,.10) !important;
}

.vsp-purchase-stack .single_add_to_cart_button:focus-visible{
  outline:none !important;
  box-shadow: 0 0 0 2px rgba(255,214,0,.30), 0 16px 24px rgba(0,0,0,.10) !important;
}

.vsp-purchase-stack .single_add_to_cart_button:disabled,
.vsp-purchase-stack .single_add_to_cart_button.disabled{
  opacity:.6 !important;
  cursor:not-allowed !important;
  transform:none !important;
  box-shadow:none !important;
}
.vsp-purchase-stack .woocommerce-variation-add-to-cart .quantity{
  grid-column:1 !important;
  justify-self:stretch !important;
  align-self:stretch !important;
}
/* ---------------------------------------------------------
   Selected summary
   --------------------------------------------------------- */
.vsp-var-summary{
  padding: 10px 12px !important;
  border-radius: calc(var(--radius) - 2px) !important;
  border: 1px solid rgba(28,58,42,.14) !important;
  background: linear-gradient(180deg, rgba(175,234,128,.10), rgba(255,255,255,.92)) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
}

.vsp-var-summary__top{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  margin-bottom: 8px !important;
}

.vsp-var-summary__low{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  font-weight: 900 !important;
  font-size: 0.92rem !important;
  line-height: 1 !important;
  color: var(--c-forest) !important;
  background: rgba(255,214,0,.22) !important;
  border: 1px solid rgba(255,214,0,.55) !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  white-space:nowrap !important;
}

.vsp-var-summary__selected{
  font-weight: 900 !important;
  color: var(--c-ink) !important;
  font-size: 1.0rem !important;
  line-height: 1.25 !important;
  margin: 0 0 8px !important;
}

.vsp-var-summary__prices{
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
}

.vsp-var-summary__regular{
  font-weight: 800 !important;
  color: rgba(17,24,39,.64) !important;
  font-size: 0.95rem !important;
}

.vsp-var-summary__current{
  display:flex !important;
  align-items:baseline !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  font-weight: 950 !important;
  color: var(--c-forest) !important;
  font-size: 1.18rem !important;
  line-height: 1.1 !important;
}

.vsp-var-summary__current .vsp-price-per{
  font-weight: 900 !important;
  font-size: 1.0rem !important;
  color: rgba(17,24,39,.82) !important;
}

.vsp-var-summary__save{
  font-weight: 900 !important;
  font-size: 0.98rem !important;
  color: rgba(17,24,39,.82) !important;
}

.vsp-var-summary__save strong{
  color: var(--c-forest) !important;
  background: linear-gradient(90deg, rgba(255,214,0,.24), rgba(175,234,128,.14)) !important;
  padding: 2px 6px !important;
  border-radius: 8px !important;
}

/* ---------------------------------------------------------
   Read more toggle
   --------------------------------------------------------- */
.vsp-attrs-toggle{
  margin-top: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding:8px 12px !important;
  border-radius:999px !important;
  font-weight:900 !important;
  font-size:0.95rem !important;
  line-height:1 !important;
  color: var(--c-ink) !important;
  background: rgba(175,234,128,.14) !important;
  border: 1px solid rgba(175,234,128,.40) !important;
  cursor:pointer !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
  transition: transform .08s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.vsp-attrs-toggle:hover{
  transform: translateY(-1px) !important;
  background: rgba(255,214,0,.18) !important;
  border-color: rgba(255,214,0,.55) !important;
  box-shadow: 0 0 0 2px rgba(255,214,0,.22) !important;
}

.vsp-attrs-toggle:focus-visible{
  outline:none !important;
  box-shadow: 0 0 0 2px rgba(255,214,0,.28) !important;
}

/* Characteristics table collapsed state */
.js table.woocommerce-product-attributes.vsp-attrs-collapsed tr.vsp-attr-hidden{ 
  display:none !important; 
}

/* ---------------------------------------------------------
   Small screens
   --------------------------------------------------------- */
@media (max-width: 520px){
  .vsp-pack__pill{
    padding:9px 10px !important;
  }

  .vsp-pack__pack{
    font-size:14px !important;
  }

  .vsp-purchase-stack{
    padding: 11px 12px !important;
  }

  .vsp-purchase-stack .woocommerce-variation-add-to-cart{
    grid-template-columns:108px minmax(0, 1fr) !important;
  }

.vsp-purchase-stack .quantity{
  width:108px !important;
  max-width:108px !important;
  box-sizing:border-box !important;
}

.vsp-purchase-stack .quantity input.qty,
.vsp-purchase-stack .woocommerce-variation-add-to-cart .single_add_to_cart_button{
  height:42px !important;
}

  .vsp-var-summary__current{
    font-size: 1.12rem !important;
  }

  .vsp-var-summary__current .vsp-price-per{
    font-size: 0.98rem !important;
  }
}

@media (max-width: 390px){
  .vsp-pack__unavail{ font-size:10px !important; padding:3px 7px !important; }
}

/* ---------------------------------------------------------
   Mobile layout (<=1023px)
   - Kill sticky positioning
   - Reorder: images/title → purchase → description
   - Horizontal scroll cards (centered, carousel-style)
   - Dynamic edge fades
   --------------------------------------------------------- */
@media (max-width: 1023px){

  /* Kill Breakdance sticky */
  .headdivv > .stickydivv,
  .headdivv > .bde-div-450-180.stickydivv,
  .stickydivv{
    position: static !important;
    top: auto !important;
    bottom: auto !important;
  }

  /* Make head area one column and re-order */
  .headdivv{
    display:flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    max-width: 100% !important;
  }

  /* Flatten left wrapper */
  .headdivv > .bde-div-450-179{
    display: contents !important;
  }

  /* Top content (title + images) */
  .headdivv > .bde-div-450-179 > .bde-div-450-174{
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Purchase options */
  .headdivv > .bde-div-450-180.stickydivv{
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-top: 14px !important;
  }

  /* Description + reviews */
  .headdivv > .bde-div-450-179 > .bde-div-450-160{
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 12px !important;
  }

  /* Prevent table from expanding page */
  form.variations_form .variations{
    width: 100% !important;
    table-layout: fixed !important;
  }
  
  form.variations_form .variations tr.vsp-pack-row,
  form.variations_form .variations tr.vsp-pack-row td.value{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Horizontal scroll carousel */
  .vsp-pack{
    position: relative !important;
    max-width: 100% !important;
  }

  .vsp-pack__grid{
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    scroll-snap-type: x mandatory !important;
    scroll-padding-left: 10px !important;
    padding: 12px 10px !important;
    touch-action: auto !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  /* Hide scrollbar */
  .vsp-pack__grid{ 
    scrollbar-width: none !important; 
  }
  
  .vsp-pack__grid::-webkit-scrollbar{ 
    width:0 !important; 
    height:0 !important; 
    display:none !important; 
  }

  /* Card sizing - stacked layout */
  .vsp-pack__pill{
    flex: 0 0 150px !important;
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
    height: 132px !important;
    scroll-snap-align: start !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    row-gap: 7px !important;
    text-align: center !important;
    grid-template-columns: none !important;
    column-gap: 0 !important;
    border-width: 1px !important;
    box-shadow: 0 10px 20px rgba(0,0,0,.10) !important;
    transform: translateZ(0);
  }

  .vsp-pack__pill.is-reg{
    box-shadow: 0 10px 20px rgba(0,0,0,.10) !important;
  }

  /* Hide spacer */
  .vsp-pack__spacer{ 
    display:none !important; 
  }

  /* Center all inner elements */
  .vsp-pack__pack,
  .vsp-pack__type,
  .vsp-pack__unavail,
  .vsp-pack__meta,
  .vsp-pack__final{
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .vsp-pack__pack{
    font-size: 14px !important;
    font-weight: 950 !important;
    letter-spacing: .01em !important;
  }

  .vsp-pack__sub{
    padding: 4px 9px !important;
    font-size: 10px !important;
  }

  .vsp-pack__meta{
    gap: 6px !important;
  }

  .vsp-pack__final ins{
    display:inline-flex !important;
    justify-content:center !important;
  }

  /* Dynamic edge fades */
  body.single-product .vsp-purchase-stack .vsp-pack::before,
  body.single-product .vsp-purchase-stack .vsp-pack::after{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    width:28px;
    pointer-events:none;
    z-index:3;
    opacity:0;
    transition: opacity .18s ease !important;
  }

  body.single-product .vsp-purchase-stack .vsp-pack::before{
    left:0;
    background: linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,0));
  }
  
  body.single-product .vsp-purchase-stack .vsp-pack::after{
    right:0;
    background: linear-gradient(270deg, rgba(255,255,255,1), rgba(255,255,255,0));
  }

  body.single-product .vsp-purchase-stack .vsp-pack[data-vsp-fade-left="1"]::before{
    opacity:1;
  }
  
  body.single-product .vsp-purchase-stack .vsp-pack[data-vsp-fade-right="1"]::after{
    opacity:1;
  }
}

/* =========================================================
   VSH Notices (styled like mini-cart)
   ========================================================= */

.vsh-notices {
  margin: 0 0 20px 0;
  padding: 0;
}

.vsh-notices:empty {
  display: none;
}

.vsh-notices .woocommerce-notices-wrapper {
  margin: 0;
}

/* Notice boxes */
.vsh-notices ul.woocommerce-error,
.vsh-notices ul.woocommerce-message,
.vsh-notices ul.woocommerce-info {
  list-style: none !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  
  border-radius: 14px !important;
  border: 1px solid rgba(28,58,42,.16) !important;
  background: rgba(175,234,128,.10) !important;
  color: rgba(17,24,39,.92) !important;
  
  font-weight: 900 !important;
  font-size: 12.5px !important;
  line-height: 1.25 !important;
  
  position: relative !important;
  overflow: hidden !important;
}

/* Kill pseudo-icons */
.vsh-notices ul.woocommerce-error::before,
.vsh-notices ul.woocommerce-message::before,
.vsh-notices ul.woocommerce-info::before,
.vsh-notices ul.woocommerce-error li::before,
.vsh-notices ul.woocommerce-message li::before,
.vsh-notices ul.woocommerce-info li::before {
  content: none !important;
  display: none !important;
}

/* List items */
.vsh-notices ul.woocommerce-error li,
.vsh-notices ul.woocommerce-message li,
.vsh-notices ul.woocommerce-info li {
  margin: 0 !important;
  padding: 0 !important;
}

/* Notice type colors */
.vsh-notices ul.woocommerce-error {
  background: rgba(255,122,122,.14) !important;
  border-color: rgba(255,122,122,.30) !important;
}

.vsh-notices ul.woocommerce-message {
  background: rgba(175,234,128,.14) !important;
  border-color: rgba(175,234,128,.30) !important;
}

.vsh-notices ul.woocommerce-info {
  background: rgba(255,214,0,.13) !important;
  border-color: rgba(255,214,0,.28) !important;
}

/* Notice animation */
@keyframes vshNoticeIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.vsh-notices ul.woocommerce-error,
.vsh-notices ul.woocommerce-message,
.vsh-notices ul.woocommerce-info {
  animation: vshNoticeIn .18s ease-out both;
}

/* Shake animation for quantity input */
@keyframes vshQtyShake {
  0%   { transform: translateX(0); }
  20%  { transform: translateX(-4px); }
  40%  { transform: translateX(4px); }
  60%  { transform: translateX(-3px); }
  80%  { transform: translateX(3px); }
  100% { transform: translateX(0); }
}

.vsh-shake {
  animation: vshQtyShake .28s ease-in-out;
  border-color: rgba(255,122,122,.40) !important;
  box-shadow: 0 0 0 2px rgba(255,122,122,.12) !important;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .vsh-notices ul.woocommerce-error,
  .vsh-notices ul.woocommerce-message,
  .vsh-notices ul.woocommerce-info,
  .vsh-shake {
    animation: none !important;
  }
}

/* Fix quantity button alignment */
.vsp-purchase-stack .quantity {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.vsp-purchase-stack .quantity button.plus,
.vsp-purchase-stack .quantity button.minus,
.vsp-purchase-stack .quantity .plus,
.vsp-purchase-stack .quantity .minus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 44px !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
  text-align: center !important;
  vertical-align: middle !important;
}

.vsp-purchase-stack .quantity input.qty {
  text-align: center !important;
  vertical-align: middle !important;
  padding: 0 8px !important;
  line-height: 44px !important;
}
.variations_form .added_to_cart,
a.added_to_cart.wc-forward {
  display: none !important;
}

/* =========================================================
   No-JS crawlable pack/price fallback
   - Output is wrapped in <noscript>, so JS-enabled browsers do not render it.
   - The .js rule is only belt-and-braces, not the primary hiding mechanism.
   ========================================================= */

.js .vsh-noscript-pack-list {
  display: none !important;
}

.vsh-noscript-pack-list {
  margin: 14px 0 16px !important;
  padding: 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(28,58,42,.14) !important;
  background: linear-gradient(180deg, rgba(175,234,128,.12), rgba(255,255,255,.96)) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.05) !important;
  color: #111827 !important;
}

.vsh-noscript-pack-list__title {
  margin: 0 0 6px !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  color: #1C3A2A !important;
}

.vsh-noscript-pack-list__note {
  margin: 0 0 10px !important;
  font-size: 12.5px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  color: rgba(17,24,39,.72) !important;
}

.vsh-noscript-pack-list__items {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.vsh-noscript-pack-list__item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 9px 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(28,58,42,.16) !important;
  background: rgba(255,255,255,.86) !important;
}

.vsh-noscript-pack-list__name {
  min-width: 0 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  color: #111827 !important;
}

.vsh-noscript-pack-list__price {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  text-align: right !important;
  white-space: nowrap !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  color: #1C3A2A !important;
}

.vsh-noscript-pack-list__price .price {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 5px !important;
}

.vsh-noscript-pack-list__price del {
  color: rgba(17,24,39,.58) !important;
  font-weight: 800 !important;
}

.vsh-noscript-pack-list__price ins {
  text-decoration: none !important;
  font-weight: 950 !important;
  color: #1C3A2A !important;
  background: linear-gradient(90deg, rgba(255,214,0,.35), rgba(175,234,128,.25)) !important;
  padding: 2px 6px !important;
  border-radius: 7px !important;
}

.vsh-noscript-pack-list__price .vsp-save {
  display: none !important;
}

@media (max-width: 520px) {
  .vsh-noscript-pack-list__item {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 5px !important;
  }

  .vsh-noscript-pack-list__price {
    text-align: left !important;
    white-space: normal !important;
  }
}