/** Shopify CDN: Minification failed

Line 184:7 Expected identifier but found whitespace
Line 184:8 Unexpected "1"
Line 925:1 Expected "}" to go with "{"

**/
label:has(input[type=radio]), label:has(input[type=checkbox]){
    border-radius: unset;
}

.menu-list__submenu-inner{
  background: #fff !important;
}

.announcement-bar__text{
  font-family: 'DM Sans' !important;
}

/* Bold second-level menus - Mobile and Desktop */
.header-drawer .menu-drawer__menu-item--parent,
.header-drawer .menu-drawer__menu-item--parent .menu-drawer__menu-item-text {
  font-weight: 700 !important;
}

/* Third-level menus remain normal */
.header-drawer .menu-drawer__menu-item--child,
.header-drawer .menu-drawer__menu-item--child .menu-drawer__menu-item-text {
  font-weight: 400 !important;
}

/* Desktop mega menu second-level headings */
.mega-menu .mega-menu__link--level-2,
.mega-menu .mega-menu__link--level-2 span {
  font-weight: 700 !important;
}


/* Variant buttons: black background + white text on hover and when selected */
.variant-option--buttons .variant-option__button-label:not(.variant-option__button-label--has-swatch) {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.variant-option--buttons .variant-option__button-label:not(.variant-option__button-label--has-swatch):hover,
.variant-option--buttons .variant-option__button-label:not(.variant-option__button-label--has-swatch):has(input:checked) {
  background-color: #000;
  border-color: #000;
  color: #fff;
}

.variant-option--buttons .variant-option__button-label:not(.variant-option__button-label--has-swatch):hover .variant-option__button-label__text,
.variant-option--buttons .variant-option__button-label:not(.variant-option__button-label--has-swatch):has(input:checked) .variant-option__button-label__text {
  color: #fff;
}

/* Hide the default selected pill/border so it doesn't conflict */
.variant-option--buttons .variant-option__button-label:not(.variant-option__button-label--has-swatch) .variant-option__button-label__pill {
  display: none;
}

.text-block h1{
    font-family: Reckless Standard S-TRIAL;
font-weight: 400;
font-style: Regular;
font-size: 24px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
color: #000000;
}
.variant-option+.variant-option{
  margin-top: unset !important;
  margin-bottom: 15px;
}
.product-form-buttons button{
    border-radius: unset;
}
/* .variant-picker, .variant-picker__form{
    width: 70%;
} */

.variant-option--buttons legend{
  font-weight: 600;
}
.variant-option__swatch-value{
  padding-inline-start: unset !important;
  font-weight: 300;
  color: #000 !important;
}

.variant-option__button-label__pill{
    background: #fff !important;
   
}
.variant-option__button-label:has(:checked){
    color: #000 !important;
}
.variant-option--equal-width-buttons .variant-option__button-label{
    width: 20% !important;
}

/* Compact side-by-side style for Length option */
.variant-option--buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  width: auto;
}

.variant-option--buttons .variant-option__button-label {
  flex: 0 0 auto;      /* stop full-width stretching */
  width: auto;
}

fieldset.variant-option--buttons:has(input[name^="Color-"]) {
  display: none !important;
}

.variant-option--buttons .variant-option__button-label {
  padding: 10px 28px;
  border: 1px solid #ccc;
  border-radius: 2px;
  cursor: pointer;
  font-size: 14px;
  background: #fff;
}

.variant-option--buttons .variant-option__button-label:has(input:checked) {
  border-color: #000;
  border-width: 1.5px;
}
.product-form-buttons:has(.add-to-cart-button.button-secondary) .quantity-selector{
    border-radius: 65px !important;
}

.add-to-cart-button{
  border-radius: 65px !important;
}

.shopify-payment-button__button{
  border-radius: 10px !important;
  background: #FEE1D9 !important;
  color: #000 !important;
}


/* Container with border around the whole "Bought With" block */
.bought-with-container {
  border: 1px solid var(--color-border, #e5e5e5);
  border-radius: 4px;
  padding: 16px;
}

/* Tabs row: "Bought With" | "Add Ons" */
.bought-with-tabs {
  display: flex;
  gap: 24px;
  margin-bottom: 16px;
  border-bottom: 1px solid transparent;
}

.bought-with-tabs__tab {
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-subdued, #6b6b6b);
  background: none;
  border: none;
  padding: 0 0 8px;
  cursor: pointer;
}

.bought-with-tabs__tab[aria-selected="true"] {
  color: var(--color-text, #1a1a1a);
  border-bottom: 2px solid var(--color-text, #1a1a1a);
}

/* The card row itself — horizontal, not a scrolling carousel */
/* .resource-list__slide {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;      /* overrides the carousel's --slide-width */
  flex: 1 1 auto;
  padding: 12px;
  border: 1px solid var(--color-border, #e5e5e5);
  border-radius: 4px;
} */

/* Thumbnail */
.resource-list__slide .card__media {
  width: 80px;
  height: 100px;
  flex: 0 0 80px;
  object-fit: cover;
  border-radius: 2px;
}

/* Info block */
.resource-list__slide .card__info {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.resource-list__slide .card__title {
  font-size: 14px;
  line-height: 1.3;
  color: var(--color-text, #1a1a1a);
  margin: 0;
}

.resource-list__slide .card__price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 14px;
}

.resource-list__slide .card__price--sale {
  font-weight: 600;
  color: var(--color-text, #1a1a1a);
}

.resource-list__slide .card__price--compare {
  text-decoration: line-through;
  color: var(--color-text-subdued, #9b9b9b);
  font-weight: 400;
}

.resource-list__slide .card__shop-now {
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  color: var(--color-text, #1a1a1a);
  margin-top: 4px;
}

.resource-list__carousel {
  --slide-width: 100% !important;
}
.resource-list__carousel slideshow-arrows {
  display: none; /* no arrows needed for a single row */
}

.menu-list__submenu{
   width:100% !important;
}
.mega-menu__grid{
  gap: 100px !important;
}
[data-menu-grid-id="MegaMenuList-1"]{
  --menu-columns-desktop: 4 !important;
}

/* ===== Mega menu: second-level headings bold ===== */
.mega-menu__link.mega-menu__link--parent {
  font-weight: 700;
}

/* Keep third-level links at normal weight */
.mega-menu__link:not(.mega-menu__link--parent) {
  /* font-weight: var(--menu-child-font-weight); */
  font-size: 14px;
}
/* Sidebar container width & spacing */
.facets--vertical {
  padding-inline-end: var(--padding-lg);
}

.facets--vertical .facets__filters-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Each filter block (Length / Shade / Color) acts like an accordion section */
/* .facets--vertical .facets__item {
  padding-block: 16px;
  border-bottom: 1px solid var(--color-border, #e5e5e5);
} */

.facets--vertical .facets__item:first-child {
  padding-block-start: 0;
}

/* Section title row: LENGTH / SHADE / COLOR + chevron */
.facets--vertical .facets__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  list-style: none; /* removes default <summary> marker if using <details> */
}

.facets--vertical .facets__summary::-webkit-details-marker {
  display: none;
}

.facets--vertical .facets__label {
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--color-foreground, #1a1a1a);
    font-family: Inter;
    font-weight: 600;
    font-size: 14px;
}

.checkbox__label-text{
    font-family: Inter !important;
    font-weight: 500 !important;
    font-size: 12px !important;
}

.facets__pill-label{
    font-family: Inter !important;
    font-weight: 500 !important;
    font-size: 12px !important;
}

.facets--vertical .facets__summary .icon-caret {
  width: 14px;
  height: 14px;
  color: var(--color-foreground, #1a1a1a);
  opacity: 0.6;
  transition: transform 0.2s ease;
}

/* Rotate chevron when panel is open */
.facets--vertical .facets__panel[open] ~ .facets__summary .icon-caret,
.facets--vertical details[open] > .facets__summary .icon-caret {
  transform: rotate(180deg);
}

/* Checkbox list styling */
.facets--vertical .facets__inputs-wrapper {
  margin-block-start: 12px;
}
.jm-button--primary[data-v-9640c170]{
  background: rgb(254 225 217 / 1.0) !important;
  color: #000 !important;
  border: 1px solid rgb(254 225 217 / 1.0) !important;
}

.facets--vertical .facets__inputs-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.facets--vertical .facets__inputs-list label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--color-foreground, #333);
  cursor: pointer;
}

.facets--vertical .facets__inputs-list input[type="checkbox"] {
  width: 14px;
  height: 14px;
  accent-color: var(--color-foreground, #1a1a1a);
  cursor: pointer;
  margin: 0;
}

/* "Filters   213 Products   Sort" top bar */
.facets-controls-wrapper.facets--horizontal {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 13px;
  color: var(--color-foreground-muted, #666);
  /* padding-block: 12px;
  border-bottom: 1px solid var(--color-border, #e5e5e5);
  margin-bottom: 16px; */
}

.facets--filters-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-foreground, #1a1a1a);
}

.products-count-wrapper {
  font-size: 13px;
  color: var(--color-foreground-muted, #666);
}

/* Clear All button — pill style, greyed out until active */
.facets__clear-all {
  display: block; /* override default 'none' so it's always visible per the image */
  width: 100%;
  text-align: center;
  border: 1px solid var(--color-border, #ddd);
  border-radius: 999px;
  padding-block: 10px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-foreground-muted, #999);
  background: transparent;
  cursor: not-allowed;
  margin-block-start: 20px;
}

/* Active state — darker text/border once a filter is selected */
.facets__clear-all--active {
  color: var(--color-foreground, #1a1a1a);
  border-color: var(--color-foreground, #1a1a1a);
  cursor: pointer;
}

/* Grid column ratio: sidebar vs product grid, similar to the image proportions */
@media screen and (min-width: 750px) {
  :root {
    --facets-vertical-col-width: column-3; /* adjust column span to make sidebar narrower/wider */
  }
}


/* Fix: re-hide the native checkbox, let the theme's own checkbox design show */
.facets--vertical .facets__inputs-list input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

/* Remove pill/button/border look from the label completely */
.facets--vertical .facets__inputs-list label,
.facets--vertical .facets__inputs-list .facets__label-list,
.facets--vertical .facets__inputs-list li {
  display: flex !important;
  align-items: center;
  height: auto;
  /* gap: 8px;
  width: auto !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  cursor: pointer; */
}

/* Kill any pseudo-element that might be drawing an extra box/border */
.facets--vertical .facets__inputs-list label::before,
.facets--vertical .facets__inputs-list label::after,
.facets--vertical .facets__inputs-list .facets__label-list::before,
.facets--vertical .facets__inputs-list .facets__label-list::after {
  content: none !important;
  border: none !important;
  background: none !important;
}

/* Give ourselves a clean, single custom checkbox using a plain span */
.facets--vertical .facets__inputs-list label span:first-child,
.facets--vertical .facets__inputs-list .facets__label-list span:first-child {
  width: 14px;
  height: 14px;
  min-width: 14px;
  border: 1px solid var(--color-border, #999);
  border-radius: 3px;
  display: inline-block;
  position: relative;
  background: #fff;
}

/* Checked state - fill the box */
.facets--vertical .facets__inputs-list input[type="checkbox"]:checked + span:first-child,
.facets--vertical .facets__inputs-list label:has(input:checked) span:first-child {
  background: var(--color-foreground, #1a1a1a);
  border-color: var(--color-foreground, #1a1a1a);
}

/* Text label, plain, no uppercase, no button look */
.facets--vertical .facets__inputs-list label span:last-child,
.facets--vertical .facets__inputs-list .facets__label-list span:last-child {
  font-size: 13px;
  font-weight: 400;
  text-transform: none;
  color: var(--color-foreground, #333);
}

/* Stack vertically */
.facets--vertical .facets__inputs-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px;
  flex-wrap: nowrap !important;
}

.facets--vertical .facets__inputs-list--grid {
  display: flex !important;
  grid-template-columns: none !important;
}

/* Remove pill/button/border look from the label */
.facets--vertical .facets__inputs-list label,
.facets--vertical .facets__inputs-list .facets__label-list,
.facets--vertical .facets__inputs-list li {
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: auto !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  cursor: pointer;
}

/* Kill any pseudo-element drawing an extra box/border */
.facets--vertical .facets__inputs-list label::before,
.facets--vertical .facets__inputs-list label::after {
  content: none !important;
  border: none !important;
  background: none !important;
}

/* Make the native checkbox visible and normal-sized, in its natural position */
.facets--vertical .facets__inputs-list input[type="checkbox"] {
  all: revert;
  position: static !important;
  opacity: 1 !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px;
  margin: 0 !important;
  accent-color: var(--color-foreground, #1a1a1a);
  cursor: pointer;
  order: -1; /* forces checkbox to appear before the text, regardless of markup order */
}

/* Plain text label, no uppercase, no button styling */
.facets--vertical .facets__inputs-list label span,
.facets--vertical .facets__inputs-list .facets__label-list span {
  font-size: 13px;
  font-weight: 400;
  text-transform: none;
  color: var(--color-foreground, #333);
}

/* Stack vertically */
.facets--vertical .facets__inputs-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px;
  flex-wrap: nowrap !important;
}

.facets--vertical .facets__inputs-list--grid {
  display: flex !important;
  grid-template-columns: none !important;
}

.checkbox .icon-checkmark{
    display: none;
}

.facets__pill-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start !important;
  gap: 8px;
}

.header-menu{
  height: 50% !important;
}
/* ------------------------------------------------------------------
   Buy-button hover effect: black fill sweeps in from left to right.
   Applies to Add to Cart and Buy It Now.
   ------------------------------------------------------------------ */
.product-form-buttons .add-to-cart-button,
.product-form-buttons .shopify-payment-button__button--unbranded {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: color 0.3s ease;
}

/* The black layer: 125% wide so the last 20% is a soft, feathered edge.
   At rest it sits fully off-screen to the left. */
.product-form-buttons .add-to-cart-button::before,
.product-form-buttons .shopify-payment-button__button--unbranded::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 125%;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    #000 0%,
    #000 78%,
    rgb(0 0 0 / 0.55) 90%,
    rgb(0 0 0 / 0) 100%
  );
  transform: translateX(-100%);
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
#whatsapp-link{
  top: -28px;
  right: 30px;
}

@media (hover: hover) {
  .product-form-buttons .add-to-cart-button:hover::before,
  .product-form-buttons .shopify-payment-button__button--unbranded:hover::before {
    transform: translateX(0);
  }

  .product-form-buttons .add-to-cart-button:hover,
  .product-form-buttons .shopify-payment-button__button--unbranded:hover {
    color: #fff !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .product-form-buttons .add-to-cart-button::before,
  .product-form-buttons .shopify-payment-button__button--unbranded::before {
    transition: none;
  }
}

@media (max-width: 767px){
  .announcement-bar__text{
  font-size: 11px;
}

.baDropdownStyle .bacurr-choiceDesign{
  bottom: 60px;
  right: 8px;
}
#whatsapp-link{
  top: -56px;
  right: 7px;
}
.sticky-add-to-cart__bar .add-to-cart-button{
  height: 20px;
}


  variant-picker fieldset.variant-option--buttons
  > label.variant-option__button-label {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

.menu-drawer__menu-item-text{
  font-size: 14px;
}


.marquee__repeated-items p{
  font-size: 11px;
}
.facets-controls-wrapper.facets--horizontal {
  display: none;
}
.menu-list__link-title{
  display: none !important;
}
.template-collection .product-grid{
  width: 95%;
}
.template-collection .text-block p{
  font-size: 10px;
}
.template-collection .price-item--sale{
  font-size: 10px;
}
.template-collection .compare-at-price{
  font-size: 10px;
}
main > .shopify-section:first-child .section:not(.disable-section-top-offset) {
    &.spacing-style, & .spacing-style {
        :is(.spacing-style, .inherit-spacing) {
          gap: 10px !important;
        }
      }

.menu-list{
  display: none !important;
}

/* .menu-drawer-container .header__icon--summary{
  display: block !important;
} */
}
 .menu-list__link-title{
  padding-top: 0px !important;
  font-family: Inter !important;
  font-weight: 500 !important;
  font-size: 14px !important;

}
.variant-option__button-label{
  display: none;
}

.menu-list__link-title{
  font-family: Inter !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}

.mega-menu{
  background: #fff;
  padding-bottom: 20px;
}

.collection-card--image-bg .collection-card__inner {
  position: relative;
}

.collection-card--image-bg .collection-card__inner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 55%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0));
  pointer-events: none;
  z-index: 1;
}

.marquee__repeated-items > * {
  position: relative;
}

.marquee__repeated-items > *::after {
  content: "•";
  position: absolute;
  top: 50%;
  right: calc(var(--marquee-gap) / -2);
  transform: translate(50%, -50%);
  opacity: 0.6;
  white-space: nowrap;
}

.mega-menu__grid {
  display: grid;
  grid-template-columns: repeat(var(--menu-columns-tablet), max-content) !important;
  gap: var(--menu-vertical-gap) var(--menu-horizontal-gap) !important;
  /* width: max-content !important; */

  @media screen and (min-width: 990px) {
    grid-template-columns: repeat(var(--menu-columns-desktop), max-content) !important;
  }
}

.mega-menu__link .wrap-text {
  white-space: nowrap !important;
}

.mega-menu__link {
  font-size: var(--menu-child-font-size, 0.875rem) !important;
}

.collection-card--image-bg .collection-card__content {
  position: relative;
  z-index: 2;
}

/* Make the active/open menu item (megamenu trigger) slightly bolder */
.header-menu .menu-list__link[aria-haspopup][aria-expanded='true'],
.header-menu .menu-list__link[aria-haspopup]:hover {
  font-weight: 800;
}

/* Keep it bold while the mega menu itself is being hovered/interacted with */
.header__row:has(.mega-menu__list:hover) .menu-list__link[aria-expanded='true'],
.header__row:has(.menu-list__link[aria-haspopup][aria-expanded='true']) .menu-list__link[aria-expanded='true'] {
  font-weight: 800;
}

/* Overflow menu items (when menu collapses into "more" dropdown) */
.header-menu .menu-list__list-item[slot='overflow'] .menu-list__link[aria-haspopup][aria-expanded='true'] {
  font-weight: 800;
}

.header__column--left, .header__column--center{
  gap: 0px !important;
}

.menu-drawer-container .header__icon--summary{
  display: none !important;
}

.header__column--left .button-unstyled{
  display: none !important;
}

.header__column--right .search-action{
  display: block !important;
}

/* Anchor the submenu to the specific clicked menu item, not the full header row */
.menu-list__list-item:where(:not([slot='overflow'])) {
  position: relative;
}

.menu-list__list-item:where(:not([slot='overflow'])) > .menu-list__submenu {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  /* width: max-content !important; */
  max-width: 400px;
  top: calc(100% + 8px) !important; 
  clip-path: none !important;
}


.menu-list__list-item:where(:not([slot='overflow'])) > .menu-list__submenu .menu-list__submenu-inner {
  padding-block-start: 5px !important;
  padding-block-end: 30px !important;
  padding-inline: 20px !important;
  transform: none !important;
  max-height: none !important;
}

/* Stack the mega-menu links vertically like a simple list */
.menu-list__list-item:where(:not([slot='overflow'])) .mega-menu__grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.menu-list__list-item:where(:not([slot='overflow'])) .mega-menu__list {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.menu-list__list-item:where(:not([slot='overflow'])) .mega-menu__column {
  grid-column: unset !important;
}

.menu-list__list-item:where(:not([slot='overflow'])):has(.menu-list__link[aria-expanded='true']) ~ * .header__underlay-open,
.header:has(.menu-list__list-item:where(:not([slot='overflow'])) .menu-list__link[aria-expanded='true']) .header__underlay-open {
  background: none !important;
}

.header:has(.menu-list__list-item:where(:not([slot='overflow'])) .menu-list__link[aria-expanded='true']) .header__underlay-open::after {
  box-shadow: none !important;
}
.header__underlay-open {
  background: none !important;
}
.header__underlay-open::after {
  box-shadow: none !important;
}


/* 1. Only allow the layout to flatten into mobile columns below desktop widths */
@media screen and (max-width: 749px) {
  #header-component[data-menu-style='drawer'] .header__column {
    display: contents;
  }

  
.menu-drawer-container .header__icon--summary{
  display: block !important;
}

.header__column--left .button-unstyled{
  display: block !important;
}

.product-information{
  padding-block-start: unset !important;
}

}

/* 2. Wrap the drawer grid overrides so they don't hijack ultra-wide screens */
@media screen and (max-width: 989px) { /* Adjust 989px to your theme's specific desktop breakpoint if needed */
  #header-component[data-menu-style='drawer'] .header__columns {
    --header-template-columns: var(--header-mobile-bookend) var(--header-mobile-bookend) 1fr
      var(--header-mobile-bookend) var(--header-mobile-bookend);

    grid-template-areas: 'leftA leftB center rightA rightB';
    grid-column: span 3;
    column-gap: 0;
    align-items: center;
    padding-block: 0;
    padding-inline: 0 var(--padding-3xs);

    .header-logo {
      grid-area: center;
    }

    &:not(:has(header-actions)) .search-action {
      grid-area: leftB;
    }

    &:not(:has(shopify-account)) .search-action {
      grid-area: rightA;
    }

    .search-action {
      grid-area: leftB;
    }

    header-actions {
      grid-area: rightB;
    }
  }
}