/** Shopify CDN: Minification failed

Line 323:1 Expected "}" to go with "{"

**/
/* Wicked Good Cookies: Live Product Options theme overrides */

/* ---------- Base option layout ---------- */

.cl-po--options {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 4px !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

.cl-po--option {
  overflow: visible !important;
  box-sizing: border-box !important;
  background-color: #f6eafe;
  border: 0;
  border-radius: 10px;
  padding: 10px;
  margin: 3px 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Do not force display:block here. LPO uses display:none for conditions. */

.cl-po--option:first-child {
  margin-top: 0 !important;
}

.cl-po--option:last-child {
  margin-bottom: 0 !important;
}

/* Nested groups were receiving another full card's padding and margins. */
.cl-po--option .cl-po--group > .cl-po--option {
  background: transparent;
  border-radius: 0;
  padding: 4px 0;
  margin: 0 !important;
}

.cl-po--option[data-option*="Quantity"] {
  background-color: #fffbca !important;
  border-radius: 10px;
  padding: 10px;
}

/* ---------- Labels, values, and prices ---------- */

.cl-po--label,
.cl-po--label *,
.cl-po--option .cl-po--label {
  text-align: left !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

.cl-po--label {
  color: #5b009f !important;
  font-family: "Bowlby One SC", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-transform: uppercase;
  font-size: clamp(1em, 2.5vw, 1.5em) !important;
  line-height: 1.2;
  margin-bottom: 6px !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100%;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}

.cl-po--label,
.cl-po--value,
.cl-po--price {
  overflow: visible !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

.cl-po--label .cl-po--value,
.cl-po--label .cl-po--price {
  display: inline-flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  line-height: 1.3 !important;
  font-size: clamp(12px, 14px, 18px);
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0;
  padding: 0;
  text-indent: 0 !important;
  position: static !important;
  float: none !important;
  transform: none !important;
  text-align: left !important;
}

.cl-po--label .cl-po--value {
  color: #b833ff;
}

.cl-po--label .cl-po--price {
  margin-left: 6px !important;
  white-space: nowrap !important;
}

/* ---------- Swatches ---------- */

/*
 * The former top:25px and padding-bottom:25px caused the large gaps.
 * The extra selector specificity overrides LPO's later injected rule.
 */
body .cl-po--option > .cl-po--swatch-container {
  position: relative !important;
  top: 0 !important;
  z-index: 1 !important;
  margin-top: 4px !important;
  padding-top: 0 !important;
  padding-bottom: 4px !important;
  clear: both !important;
}

/* Remove compounded spacing around the nested text-color option. */
.cl-po--option[data-option="Text Color Options"] {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.cl-po--option[data-option="Text Color"] {
  margin-top: 0 !important;
  padding-top: 4px !important;
}

/* ---------- Hidden minimum selector ---------- */

/*
 * This hides the LPO minimum radio UI without disabling or removing it.
 * LPO can therefore keep its selected value and enforce the quantity floor.
 * JavaScript adds the fallback class when the wrapper has no data-option.
 */
.cl-po--option[data-option="Minimum"],
.cl-po--option:has(input[name="_Minimum"]),
.wgc-lpo-minimum-option {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- Other option adjustments ---------- */

[name="properties[Special Instructions]"] {
  height: 200px;
}

.cl-layer-actions {
  display: none !important;
}

/* Hide only the tooltip arrow, not the entire tooltip. */
.tippy-arrow {
  display: none !important;
}

.lpo-variant-override input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.lpo-variant-override .cl-po--swatch {
  cursor: pointer;
}

.lpo-variant-override .cl-po--swatch.is-selected {
  outline: 2px solid #4b5563;
  outline-offset: 1px;
}

.wgc-show-design-customizations {
/*
 * Hide this one checkbox by default. LPO injects display:flex!important later,
 * so these selectors deliberately have enough specificity to beat that rule.
 */
body .cl-po--option[data-option="MoreCustomizations-Design"]
  .cl-po--checkbox-item:has(
    input[type="checkbox"][value="Add Design Customizations"]
  ) {
  display: none !important;
}

body .cl-po--option[data-option="MoreCustomizations-Design"]
  .cl-po--checkbox-item.wgc-show-design-customizations:has(
    input[type="checkbox"][value="Add Design Customizations"]
  ) {
  display: flex !important;
}

body .cl-po--option[data-option="MoreCustomizations-Design"]
.wgc-hide-design-customizations {
  .cl-po--checkbox-item.wgc-hide-design-customizations {
  display: none !important;
}

/* ---------- Sticky preview ---------- */

div[id^="product-form-template"] .cl-po--container,
.product-form__item .cl-po--container {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 32px !important;
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

div[id^="product-form-template"] .cl-po--wrapper {
  flex: 0 1 550px !important;
  min-width: 0 !important;
  max-width: 600px !important;
  box-sizing: border-box;
}

div[id^="product-form-template"] .cl-po--preview {
  flex: 1 1 480px !important;
  max-width: 480px !important;
  min-width: 300px !important;
  position: sticky !important;
  top: var(--lpo-sticky-top, 80px) !important;
  align-self: flex-start !important;
  z-index: 2;
  overflow: visible !important;
  height: fit-content !important;
}

div[id^="product-form-template"] .cl-po--preview-sticky {
  width: auto !important;
  max-width: 100% !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

div[id^="product-form-template"] .cl-po--preview img,
div[id^="product-form-template"] .cl-po--preview canvas,
div[id^="product-form-template"] .cl-po--preview svg,
div[id^="product-form-template"] .cl-po--preview video {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ---------- Responsive layout ---------- */

@media (max-width: 786px) {
  div[id^="product-form-template"] .cl-po--container,
  .product-form__item .cl-po--container {
    flex-direction: column !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
  }

  div[id^="product-form-template"] .cl-po--wrapper,
  div[id^="product-form-template"] .cl-po--preview {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    position: static !important;
    top: auto !important;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .product__info-wrapper .cl-po--option,
  .product__info-wrapper .cl-po--label {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* ---------- Single-option Cookie Shape ---------- */

/* JavaScript applies this class only when Cookie Shape has one choice. */
.wgc-hide-single-cookie-shape,
body .cl-po--option.wgc-hide-single-cookie-shape,
body variant-selects .product-form__input.wgc-hide-single-cookie-shape,
.wgc-hide-single-cookie-shape,
.cl-po--option.wgc-hide-single-cookie-shape {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body variant-radios .product-form__input.wgc-hide-single-cookie-shape,
body product-info .product-form__input.wgc-hide-single-cookie-shape {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}