/** Shopify CDN: Minification failed

Line 347:31 Expected identifier but found whitespace
Line 350:77 Unterminated string token

**/
/* ============================================================
   Evereve-spec collection filters, toolbar, sort & chips.
   Breakpoint contract: exactly one — 1000px.
     <= 999px : mobile Filter By drawer + bottom sort sheet
     >= 1000px: persistent 240px sidebar + sort popover
   Decimal sizes from the audit (358.8, 82.4, 49.4 …) are derived
   from the generating rules implemented here (min(92vw,400px),
   16px paddings, type metrics) — not hardcoded.
   ============================================================ */

:root {
  --ee-ink: #101820;
  --ee-border: #dbdcde;
  --ee-surface: #fff;
  --ee-overlay: rgb(0 0 0 / 60%);
  --ee-sidebar-width: 240px;
  --ee-mobile-gutter: 20px;
  --ee-drawer-width: min(92vw, 400px);
}

/* ---------- Shared: facet rows (rail + drawer) ---------- */

.filters .filter-group__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid var(--ee-border);
  min-height: 0;
  cursor: pointer;
}
.filters .filter-group:first-of-type > .filter-group__heading {
  padding-top: 0;
}
.filters .filter-group__heading__text {
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  color: var(--ee-ink);
  font-family: inherit;
}
.filters .filter-group__heading__indicator {
  display: inline-flex;
  /* Evereve: transform .2s ease (measured on their accordion toggle) */
  transition: transform 200ms ease;
}
.filters .filter-group__heading__indicator svg {
  width: 10px;
  height: 10px;
  stroke-width: 1.5;
  color: var(--ee-ink);
}
/* Chevron rotates 180deg when the group is open (toggler class present = collapsed) */
.filters .filter-group__heading:not(.toggle-target-toggler--is-hidden) .filter-group__heading__indicator {
  transform: rotate(180deg);
}
.filters .filter-group {
  margin: 0;
}
.filters .filter-group__items {
  padding: 10px 0 14px;
}

/* Checkbox options */
.filters .filter-group__item {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* theme uses space-between, which strands the label mid-row */
  gap: 12px;
  margin: 0 0 5px;
  padding: 0;
  font-size: 14px;
  line-height: 22px;
  color: var(--ee-ink);
  cursor: pointer;
}
.filters .filter-group__item .filter-group__item__text {
  flex: 0 1 auto;
  margin: 0;
}
.filters .filter-group__checkbox {
  /* fully un-hide: the theme renders the native input 0.1rem, absolute, clipped */
  -webkit-appearance: none;
  appearance: none;
  position: static;
  overflow: visible;
  clip: auto;
  clip-path: none;
  opacity: 1;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--ee-border);
  border-radius: 0;
  background: var(--ee-surface) center / 70% no-repeat;
  cursor: pointer;
}
.filters .filter-group__checkbox:checked {
  border-color: var(--ee-ink);
  background-color: var(--ee-ink);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}
.filters .filter-group__item .filter-tick {
  display: none; /* replaced by the real checkbox above */
}
/* Kill the theme's pseudo-element checkbox (it drew a second box over the text) */
.filters .filter-group__item .filter-group__item__text::before,
.filters .filter-group__item .filter-group__checkbox:checked + .filter-group__item__text::before {
  content: none !important;
  display: none !important;
}
.filters .filter-group__item .filter-group__item__text {
  padding-left: 0;
}
.filters .filter-group__item__text {
  font-size: 14px;
  line-height: 22px;
  color: var(--ee-ink);
  display: inline;
}
/* Row geometry — measured from evereve.com, sidebar and drawer captured
   separately because they differ. Label opacity is deliberately NOT copied:
   theirs sits at .7, ours stays full ink for readability.

   Desktop  27px rows + 10px margin = 37px pitch, top-aligned, square box.
   Mobile   23px rows + 10px          = 33px pitch, centred, 2px radius.
   Both     80% ink checkbox border (was pale grey), 20px right padding on the
            group body so values inset from the rail edge as theirs do. */
.filters .filter-group__checkbox {
  border-color: rgb(16 24 32 / 80%);
  transition: background-color .2s ease-in-out, border-color .2s ease-in-out;
}
.filters .filter-group__items .toggle-target-container {
  padding-right: 20px;
}
@media (max-width: 999.98px) {
  .filters .filter-group__checkbox {
    border-radius: 2px;
  }
  .filters .filter-group__item {
    min-height: 23px;
  }
}
@media (min-width: 1000px) {
  .filters .filter-group__item {
    align-items: flex-start;
    min-height: 27px;
    margin-bottom: 10px;
  }
}

/* Counts inline in parentheses: "Tops (106)" */
.filters .filter-group__item__count {
  color: var(--ee-ink);
  font-size: 14px;
  line-height: 22px;
  margin-left: 4px;
}
.filters .filter-group__item__count::before { content: "("; }
.filters .filter-group__item__count::after { content: ")"; }
.filters .filter-group__item--disabled {
  opacity: 0.45;
}

/* Color swatches — measured from evereve.com (sidebar, 2026-08):
   34px circle, 50% radius, 2px padding inside a 1px transparent border, wrap
   with 8px column gap. Their vertical rhythm is 8px row-gap + 5px item margin
   = 13px, which is what the row gap below reproduces. 5 per 220px row.

   Symmetry does NOT paint the swatch on the label: it draws a 22px ::before
   with margin-inline-end:10px inside a bordered pill. Overriding only the
   label leaves that dot shoved left inside a bordered box, so the pseudo is
   resized to fill instead. Keeping it (rather than painting the label) means
   the theme's own --swatch-background-color/image plumbing still feeds it.

   The transparent border is the selected-state ring: padding holds a 2px gap
   so the ring can appear on select without the swatch changing size. Hence
   overflow:visible — the previous overflow:hidden would clip it. */
.filters .filter-group--swatch .toggle-target-container {
  display: flex;
  flex-wrap: wrap;
  gap: 13px 8px;
}
.filters .filter-group--swatch .filter-group__item {
  position: relative; /* anchors the theme's hover tooltip */
  display: block;
  /* flex child of the wrapping container: without this it shrinks below 34px
     and the ::before fill (sized at 100% of the content box) shrinks with it */
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  margin: 0;
  padding: 2px;
  border: 1px solid transparent;
  border-radius: 50%;
  background: none;
  overflow: visible;
}
.filters .filter-group--swatch .filter-group__item::before {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
  border-radius: 50%;
  background-clip: padding-box;
  /* Evereve puts a grey hairline on White only, via a markup class. CSS can't
     branch on the fill, so every swatch gets an inset hairline: invisible on
     dark fills, and it keeps White, Gold and Silver from vanishing. */
  box-shadow: inset 0 0 0 1px rgb(16 24 32 / 12%);
}
/* The native input is un-hidden globally so it can BE the checkbox in list
   groups. Inside a swatch group that draws a 22px white box on top of the
   colour circle, so put it back to sr-only here — the swatch itself is the
   control. Evereve does the same (their input carries .sr-only). */
.filters .filter-group--swatch .filter-group__checkbox {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.filters .filter-group--swatch .filter-group__item--active {
  border-color: var(--ee-ink);
  box-shadow: none;
}
/* The label text is left alone deliberately: Symmetry's no-label layout
   already renders it as a hover tooltip above the swatch, which is what
   Evereve does with data-tooltip. It is sr-only below 768px. */

/* Price range — measured from evereve.com (sidebar, 2026-08).
   Their order is TRACK first, inputs below; ours ships inputs first, so the
   bar is pulled up with flex order rather than by moving markup (the slider
   JS positions the handles against .cc-price-range__bar and is left alone).
   Target body height 66px: 2px track + 18px gap + 42px input row + 4px top. */
.filters .cc-price-range {
  display: flex;
  flex-direction: column;
  padding-top: 4px;
}
.filters .cc-price-range__bar {
  order: -1;
  /* 7px side margin = half a handle, so the end dots don't clip.
     Evereve runs the track full width and lets the dots overhang. */
  margin: 0 7px 18px;
}
.filters .cc-price-range__bar-inactive {
  height: 2px;
  border-radius: 2px;
  background: rgb(16 24 32 / 12%);
}
.filters .cc-price-range__bar-active {
  border-radius: 2px;
  background: var(--ee-ink);
}

/* Handles: Evereve uses small solid ink dots, not outlined circles.
   Control box stays 22px (its -11px inline start centres it on the value);
   the visible dot is 14px centred inside via the 4px margin, and top:-10px
   puts the dot's centre on the 2px track. The 44px ::before hit area that
   Symmetry provides is deliberately kept for touch. */
.filters .cc-price-range__control {
  top: -10px;
}
.filters .cc-price-range__control::after {
  width: 14px;
  height: 14px;
  margin: 4px;
  border: 0;
  border-radius: 50%;
  background: var(--ee-ink);
}

/* Input row: two equal fields with a subdued "to" between them. */
.filters .cc-price-range__input-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
}
.filters .cc-price-range__input-container {
  /* 1 1 0, not Evereve's 1 0 0: a text input's intrinsic width is far wider
     than the 240px rail, so shrink must stay enabled (with min-width:0) or
     the two fields overflow the sidebar. */
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  align-items: center;
  justify-content: space-between;
  height: 37.4px;
  padding: 7px;
  border: 1px solid rgb(16 24 32 / 12%);
  border-radius: 0;
  font-size: 13px;
}
.filters .cc-price-range__input-separator {
  flex: 0 0 auto;
  color: rgb(16 24 32 / 65%);
  font-size: 13px;
}
.filters .cc-price-range__input-currency-symbol {
  margin-right: 0;
  color: rgb(16 24 32 / 65%);
  font-size: 13px;
}
/* Border lives on the container only — the theme borders that, and this
   layer used to border the input as well, which drew a second box. */
.filters .cc-price-range .cc-price-range__input {
  width: auto;
  min-width: 0;
  flex: 1 1 auto;
  margin-left: 10px;
  padding: 0;
  border: 0;
  font-size: 13px;
  text-align: end;
}

/* Long facet groups: cap the body and scroll inside it.
   Measured on evereve.com (2026-08): every group body carries
   max-height:350px; their SIZE group holds 44 values / 1638px of content
   and scrolls within that 350px.

   DESKTOP ONLY, and deliberately so. Below 1000px our filter drawer's
   .filters__inner is the single scroll container (overflow-y:auto), so a
   per-group scroller would nest inside it and create a touch scroll-trap.
   Evereve drops the cap on mobile for the same reason — measured at 390px
   wide: max-height:none, overflow-y:visible, SIZE body 1466px tall.

   Applied to .toggle-target-container (the inner element), NOT to
   .filter-group__items — that one is the animated toggle-target and
   Symmetry transitions its height on expand/collapse. */
   The price group is excluded. overflow-y:auto makes the container a scroll
   box on BOTH axes (overflow-x computes to auto too), which clipped the
   slider handles — they sit at top:-10px and the min handle at -11px inline
   start, i.e. deliberately outside the track's box. Evereve exempts price as
   well: measured max-height:none on their price group. */
@media (min-width: 1000px) {
  .filters .filter-group__items .toggle-target-container {
    max-height: 350px;
    overflow-y: auto;
  }
  .filters .filter-group--price .toggle-target-container {
    max-height: none;
    overflow: visible;
  }
}

/* Brand truncation */
.filter-group--truncatable .filter-group__item--overflow {
  display: none;
}
.filter-group--truncatable.filter-group--expanded .filter-group__item--overflow {
  display: flex;
}
.filter-group__view-more {
  background: none;
  border: 0;
  padding: 6px 0 0;
  font-size: 13px;
  text-decoration: underline;
  color: var(--ee-ink);
  cursor: pointer;
}

/* Sidebar chrome we retire on every viewport */
.filters .filter-group--availability,
.filters .filter-group--applied {
  display: none !important;
}

/* ---------- Chips above the grid ---------- */
.ee-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin: 0 0 16px;
}
.ee-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--ee-border);
  background: var(--ee-surface);
  color: var(--ee-ink);
  font-size: 13px;
  line-height: 21.45px;
  text-decoration: none;
}
.ee-chip__icon { display: inline-flex; }
.ee-chip__icon svg { width: 10px; height: 10px; }
.ee-chips__clear {
  font-size: 13px;
  text-decoration: underline;
  color: var(--ee-ink);
}

/* ---------- Toolbar (shared skeleton) ---------- */
.ee-toolbar {
  display: flex;
  align-items: center;
}
.ee-toolbar__label {
  font-size: 12px;
  line-height: 13.8px;
  letter-spacing: 0.48px;
  text-transform: uppercase;
  color: var(--ee-ink);
}
.ee-toolbar__chevron { display: inline-flex; }
.ee-toolbar__chevron svg { width: 10px; height: 10px; }
.ee-toolbar__count {
  font-size: 14px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: 0.42px;
  color: var(--ee-ink);
}
.ee-sheet-head { display: none; }

/* ============================================================
   DESKTOP: >= 1000px
   ============================================================ */
@media (min-width: 1000px) {
  /* Layout: 240px rail + fluid product area */
  .filter-container.filter-container--side {
    display: grid !important;
    grid-template-columns: var(--ee-sidebar-width) minmax(0, 1fr);
    gap: 0 clamp(32px, 3.5vw, 50px);
  }
  .filter-container--side .filters {
    display: block !important;
    visibility: visible !important;
    position: static;
    transform: none;
    width: var(--ee-sidebar-width);
    max-width: var(--ee-sidebar-width);
    padding: 0;
    border: 0;
  }
  .filter-container--side .filters .filters__inner {
    padding: 0;
    width: auto;
  }
  .filters .sticky-column-desktop,
  sticky-scroll.sticky-column-desktop {
    position: sticky;
    top: var(--theme-sticky-header-height, 94px);
  }
  /* No Filter By trigger, no drawer chrome, no shade on desktop */
  .ee-toolbar__filter,
  .filters__heading,
  .filters__footer,
  .filter-shade {
    display: none !important;
  }

  /* Toolbar: count far left, 200px sort far right */
  .ee-toolbar {
    justify-content: space-between;
    border: 0;
    padding: 0;
    min-height: 50.8px;
  }
  .ee-toolbar__sort {
    width: 200px;
    border-bottom: 1px solid var(--ee-border);
  }
  .ee-toolbar__sort .link-dropdown__button {
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 0;
    background: none;
    border: 0;
  }

  /* Sort popover */
  .ee-toolbar__sort .link-dropdown__options {
    min-width: 162px;
    right: 0;
    left: auto;
    border: 1px solid var(--ee-border);
    background: var(--ee-surface);
  }
  .ee-toolbar__sort .link-dropdown__options-inner {
    display: grid;
    gap: 12px;
    padding: 16px 21px;
  }
  .ee-toolbar__sort .link-dropdown__link {
    font-size: 14px;
    line-height: 16.1px;
    padding: 0;
    color: var(--ee-ink);
  }

  /* Product grid: 30px column / 32px row gaps */
  .filter-container--side .product-grid {
    column-gap: 30px;
    row-gap: 32px;
  }

  /* Collection bottom margin */
  .filter-container.filter-container--side {
    margin-bottom: 56px;
  }
}

/* ============================================================
   MOBILE: <= 999px  (drawer + bottom sheet)
   ============================================================ */
@media (max-width: 999.98px) {
  /* --- Toolbar: full-bleed 42px two-cell bar --- */
  .ee-toolbar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "filter sort" "count count";
    border: 0;
    padding: 0;
    /* true full-bleed regardless of the theme's container gutter */
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
  .ee-toolbar__filter {
    grid-area: filter;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 42px;
    padding: 12px 0;
    border-top: 1px solid var(--ee-border);
    border-bottom: 1px solid var(--ee-border);
    border-right: 1px solid var(--ee-border);
    text-decoration: none;
  }
  .ee-toolbar__sort {
    grid-area: sort;
    border-top: 1px solid var(--ee-border);
    border-bottom: 1px solid var(--ee-border);
  }
  .ee-toolbar__sort .link-dropdown__button {
    width: 100%;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 0;
    background: none;
    border: 0;
  }
  .ee-toolbar__count {
    grid-area: count;
    padding: 24px var(--ee-mobile-gutter) 0;
  }
  /* grid top rhythm: count bottom to grid = 24px */
  .ee-toolbar + .filter-container .collection-listing {
    padding-top: 24px;
  }

  /* --- Filter drawer --- */
  .filter-shade {
    background: var(--ee-overlay);
  }
  /* specificity (0,3,0) to override the theme's left-slide drawer system */
  .filter-container.filter-container--show-filters-mobile .filter-shade {
    display: block;
    visibility: visible;
    position: fixed;
    inset: 0;
    z-index: 8001;
    opacity: 1;
    background: var(--ee-overlay);
    pointer-events: auto;
  }
  .filter-container.filter-container--side .filters {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    height: 100%;
    width: var(--ee-drawer-width);
    max-width: var(--ee-drawer-width);
    z-index: 8002;
    background: var(--ee-surface);
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    transform: translateX(100%);
    transition: transform 200ms ease;
    visibility: hidden;
  }
  .filter-container.filter-container--show-filters-mobile .filters {
    transform: translateX(0);
    visibility: visible;
  }
  .filter-container--side .filters .block,
  .filter-container--side .filters sticky-scroll {
    position: static !important;
    display: flex !important;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
  }
  .filters .filters__inner {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0 var(--ee-mobile-gutter) 20px;
  }
  /* Drawer header: fixed 60px */
  .filters .filters__heading {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 60px;
    padding: 16px 0;
    margin: 0 0 20px;
    background: var(--ee-surface);
    border-bottom: 1px solid var(--ee-border);
  }
  .filters .filters__heading-text {
    font-size: 18px;
    line-height: 22.5px;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--ee-ink);
    font-family: inherit;
  }
  .filters .filters__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-right: -15px;
    opacity: 0.6;
  }
  .filters .filters__close svg {
    width: 14px;
    height: 14px;
  }
  /* Drawer footer: sticky View Results */
  .filters .filters__footer {
    flex: 0 0 auto;
    padding: 16px var(--ee-mobile-gutter);
    background: var(--ee-surface);
    border-top: 1px solid var(--ee-border);
  }
  .filters .filters__view-results {
    display: block;
    width: 100%;
    padding: 16px 28px;
    background: var(--ee-ink);
    border: 1px solid var(--ee-ink);
    color: #fff;
    font-size: 14px;
    line-height: 15.4px;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    cursor: pointer;
  }

  /* Mobile checkboxes: 14px */
  .filters .filter-group__checkbox {
    width: 14px;
    height: 14px;
  }
  .filters .filter-group__item {
    line-height: 23.1px;
    margin-bottom: 10px;
  }

  /* --- Sort bottom sheet --- */
  .ee-toolbar__sort link-dropdown[aria-expanded="true"]::before,
  .ee-toolbar__sort .link-dropdown__button[aria-expanded="true"]::before {
    content: "";
    position: fixed;
    inset: 0;
    background: var(--ee-overlay);
    z-index: 599;
  }
  .ee-toolbar__sort .link-dropdown__options {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    width: 100%;
    z-index: 600;
    background: var(--ee-surface);
    border: 0;
    padding: 0 var(--ee-mobile-gutter) 20px;
  }
  .ee-sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52.5px;
    padding: 15px 0;
  }
  .ee-sheet-head__title {
    font-size: 18px;
    line-height: 22.5px;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.5px;
  }
  .ee-sheet-head__close {
    background: none;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-right: -15px;
    opacity: 0.6;
    cursor: pointer;
  }
  .ee-sheet-head__close svg { width: 14px; height: 14px; }
  .ee-toolbar__sort .link-dropdown__options-inner {
    display: grid;
    gap: 12px;
  }
  .ee-toolbar__sort .link-dropdown__link {
    font-size: 14px;
    line-height: 16.1px;
    padding: 0;
    color: var(--ee-ink);
  }
}

/* Between the theme's old 768px breakpoint and our 1000px one, the theme's
   desktop-only/mobile-only helpers disagree with the 1000px contract. */
@media (min-width: 768px) and (max-width: 999.98px) {
  .filter-container--side .filters:not(.filter-container--show-filters-mobile .filters) {
    /* drawer styles above already position it off-canvas */
  }
  .filter-container.filter-container--side {
    display: block !important;
  }
}

/* Body scroll lock while the mobile drawer is open */
body.ee-drawer-lock {
  overflow: hidden;
}

/* Collection title / toolbar gap.
   Stock Symmetry pulls the title down into its utility bar with
   .template-collection .page-header:not(.page-header--with-background)
   .pagetitle { margin-bottom: -25px }, sized for the toolbar it shipped with.
   Our Evereve toolbar sits differently, so that negative margin overlapped the
   two — measured -5px between the h1's bottom and the toolbar's top, i.e. the
   bar sat *inside* the heading. Zeroing it yields a 20px gap, which is what
   Evereve runs (spacing lives on .collection-heading-banner__container,
   margin: 20px 0 — their h1 itself has no margin at all). */
.template-collection .page-header:not(.page-header--with-background) .pagetitle:last-child {
  margin-bottom: 0;
}

/* Collection title type is deliberately NOT overridden. An earlier pass copied
   Evereve's h1 (24/30 mobile, 28/35 desktop, uppercase, left-aligned); reverted
   on request. Stock Symmetry centres it in mixed-case Trirong 400 and scales it
   fluidly with the viewport (22.68px at 389px wide -> 27.16px at 1280px), which
   the fixed two-step override was throwing away. The toolbar gap fix above is
   separate and stays. */