/** Shopify CDN: Minification failed

Line 330:0 Unexpected "}"
Line 481:0 Expected "}" to go with "{"

**/
/* ==========================================================================
   collection-parity.css
   Collection-page CSS ported from the retail live theme
   (status-anxiety-2, theme #187826241899 "Max 250 collection", pulled 2026-07-23)
   so the wholesale collection pages match the main site layout.
   Loaded from layout/theme.liquid AFTER theme.css so these rules win the
   cascade. Wholesale-specific global styles live in theme.css untouched.
   ========================================================================== */
/* ---- Sidebar text sizing (retail theme.css 21513-21516) ---- */
.collection__sidebar,
.collection__sidebar * {
  font-size: 12px !important;
}

/* ---- Filter drawer sticky positioning (sits below sticky collection nav) (retail theme.css 21553-21606) ---- */
.collection__sidebar__slider {
  display: flex;
  flex-direction: column;
  background: var(--COLOR-BG);
  border: 1px solid var(--COLOR-BORDER-HAIRLINE);
  visibility: hidden;
  overflow: hidden;
}
@media only screen and (min-width: 750px) {
  .collection__sidebar__slider {
    position: sticky;
    position: -webkit-sticky;
    top: calc(var(--newsletter-small-height) + var(--collection-nav-height, 0px));
    max-height: var(--full-screen);
    width: 0;
    min-width: 0;
    margin-right: -2px;
    transition-property: min-width, margin, transform, visibility;
    transition-duration: var(--duration);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}
@media only screen and (max-width: 749px) {
  .collection__sidebar__slider {
    position: fixed;
    z-index: 6100;
    top: 0;
    height: 100%;
    transform: translateX(-100%);
    transition: transform var(--duration) cubic-bezier(0.215, 0.61, 0.355, 1),
      visibility var(--duration);
  }
}

@media only screen and (max-width: 749px) {
  .collection__sidebar__slider.drawer--animated {
    --base-animation-delay: 200ms;
  }
}

@media only screen and (min-width: 750px) {
  .collection__sidebar__slider ~ .drawer__underlay {
    display: none;
  }
}

.has-sticky-header .collection__sidebar__slider {
  top: calc(var(--newsletter-small-height) + var(--menu-height) + var(--collection-nav-height, 0px));
}
@media only screen and (max-width: 749px) {
  .has-sticky-header .collection__sidebar__slider {
    top: 0;
  }
}

/* ---- Sort accordion title + sidebar heading (retail theme.css 21718-21731) ---- */
.sort-accordion__title {
  font-size: 12px;
}

.collection__sidebar__heading {
  position: relative;
  border-bottom: 1px solid var(--COLOR-BORDER-HAIRLINE);
  padding: 0 15px 5px 0;
  margin-bottom: 0;
  /* Body weight, not BODY-BOLD (2026-07-28). The retail port brought the bold
     heading across, which reads too heavy in Futura at 12px uppercase.
     Hierarchy is carried by the uppercase + hairline border instead.
     Keep in sync with the SORT BY rule near the end of this file. */
  font-weight: var(--FONT-WEIGHT-BODY);
  font-size: 12px;
  text-transform: uppercase;
  cursor: pointer;
}

/* ---- Toggle button text sizing (retail theme.css 27808-27823) ---- */
.style-toggle {
    width: auto;
}

.style-toggle span {
    font-size: 11px;
}

/* Hide the 2-col / 4-col grid toggle on collection + search (2026-07-28).
   !important is load-bearing: snippets/collection-grid-toggle.liquid ships an
   inline <style> setting `.grid-toggle { display: flex }` in the body, which is
   equal specificity but LATER in document order than this file, so a plain
   `display: none` here would lose. Cosmetic hide only - the markup and
   grid-toggle.js still load. The clean removal is unchecking "Show grid toggle"
   per template (enable_grid_toggle), see note handed to Sam. */
.grid-toggle {
    display: none !important;
}

/* Hide the back-to-top control (2026-07-28). sections/collection.liquid ~L544
   renders `<a id="BackToTop">` plus a script toggling a .show class, but no CSS
   for #BackToTop or .show was ever written - so the Font Awesome SVG rendered at
   full intrinsic size and was permanently visible. Hidden rather than styled;
   if it's wanted later it needs real positioning/sizing rules first. */
#BackToTop {
    display: none !important;
}


.collection__nav .popout__toggle span {
    font-size: 11px;
}

.popout--sort span.popout__toggle__text {
    font-size: 0.8em;
}

/* ---- Hide sale badge (matches main site) (retail theme.css 29150-29152) ---- */
.sale-box.badge {
  display: none;
}

/* ---- Grid row gap (retail theme.css 29202-29204) ---- */
.product-grid {
    row-gap: 50px;
}

/* ---- Product colors margin (retail theme.css 29427-29429) ---- */
.product__colors {
  margin-left:0 !important;
}

/* ---- color_gold / font_minion helpers (banner-image & small templates) (retail theme.css 29826-29831) ---- */
.color_gold * {
  color:#b7ae8f !important;
}
.font_minion * {
      font-family: "minion-3", serif !important;
}

/* ---- Collection nav sticky, filter drawer, sort accordion, filter ordering (retail theme.css 29885-30026) ---- */
.supports-touch .product-item__bg__under.active, 
.supports-touch .double__image .product-item__bg__under.active,
.no-touch .double__image .product-item__bg__under.active {
  opacity:1 !important;
    z-index:9;
  display:block !important;
}
.supports-touch .double__image .product-item__bg__under.active {
  display:block;
}
.product-item .badge-boxes {
  z-index: 10;
}
nav.collection__nav {
  align-items: center;
  transition: top 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
nav.collection__nav.sticky {
  position: fixed;
  z-index: 91;
  width: 100%;
  left: 0;
}
.popout--sort span.popout__toggle__text {
      color: #8e8e8e;
}
.popout--sort {

}

.filter_sort .popout-list.pop-list--visible {
  opacity:1 !important;
  visibility: visible !important;
    pointer-events: auto !important;
  width:100% !important;
}
.popout--group .popout__toggle.popout__toggle--filters {
      border: 1px solid #000;
    padding: 1px 10px;
    margin-left: 20px;
    height: auto;
    min-height: 20px;
    text-transform: uppercase;
    font-size: 12px;
}
.collection__sidebar{
  -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.collection__sidebar {
 padding-bottom:100%;
}
.collection__sidebar{
  -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.collection__sidebar {
 padding-bottom:100%;
}
.filter_sort .popout__toggle {

  width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 0 !important;
}
.filter_sort .popout__toggle {
  font-weight:bold;
}
.filter_sort * {
  font-size:8.12px !important;
}
#popout--sort {
  border-bottom: 1px solid var(--COLOR-BORDER-HAIRLINE);
}
#sort-list * {
  color:#262626 !important;
}
.collection__filters .collection-nav {
  display:none;
}

.collection__filters {
  display:flex;
  flex-direction:column;
}
.collection__filters .collection__sidebar__group:first-of-type {
  order:1;
}
.collection__filters .collection__sidebar__group:first-of-type ul.collection-nav {
  display:block;
}
.collection__filters .collection__sidebar__group:nth-of-type(2) {
  order:2;
}
.collection__filters .filter_sort {
  order:3;
}
.collection__filters .collection__sidebar__group:nth-of-type(3) {
  order:4;
}
.collection__filters .collection__sidebar__group:nth-of-type(4) {
  order:5;
}
.sort-accordion__header-content * {
  color: #888888;
    font-weight: 500;
    font-size: 12px !important;
}
.sort-accordion__list span {
  font-size:12px !important;
  color:#262626;
}

#sort-bg {
  
}
.nav-right .popout--sort {
  opacity:0 !important;
  visibility:hidden;
  pointer-events:none;
}
.popout__toggle.collection__sidebar__heading .icon {
    stroke: rgb(136, 136, 136);
  top: -3px;
}

@media only screen and (max-width: 990px) {
nav.collection__nav {
  padding: 20px;
}
 .popout--group .popout__toggle.popout__toggle--filters {
   margin-left:0;
 }
}

/* ---- Filter sort popout visibility + gallery nav (retail theme.css 30113-30137) ---- */
.filter_sort > .popout--sort {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
.filter_sort #sort-list {
width: 100% !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  
}
.filter_sort .popout__toggle {
      border-bottom: 1px solid var(--COLOR-BORDER-HAIRLINE);
    padding-bottom: 10px !important;
    padding-top: 0;
}
.filter_sort .popout__toggle,
.filter_sort .popout-list__option {
  padding-left:0 !important;
}
.product-item__gallery-nav * {
  background:none !important;
}

/* ---- Product page swatch margin (mobile) (retail theme.css 30144-30148) ---- */
}
@media only screen and (max-width: 749px) {
.product__page ul.product__colors {
      margin-bottom: 0 !important;
}

/* ---- Related collections (mobile) (retail theme.css 30594-30598) ---- */
}
@media only screen and (max-width: 749px) {
  [data-section-type="related-collections"] .collection-list {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }

/* ---- Related collections spacing (retail theme.css 30604-30610) ---- */
[data-section-type="related-collections"] {
  padding-top: 40px;
}
[data-section-type="related-collections"] .collection-item__info p {
  font-size: calc(var(--font-2) * var(--FONT-ADJUST-HEADING));
  margin-bottom: var(--line);
}

/* ---- Filter & Sort drawer swatch grid + drawer text colors + small template first-product feature (retail theme.css 30858-30969) ---- */
/* ==========================================================================
   Filter & Sort drawer: 25px colour swatches, 5 per row, evenly spaced
   (2026-07-09: larger swatches added on mobile; gap tightened to 5px on
   2026-07-10; unified with desktop and switched to a 5-column grid on
   2026-07-14 so every row shows exactly 5 evenly spaced swatches on all
   screen sizes, not just below the old 749px mobile breakpoint; size
   tuned down from 40px to 25px on 2026-07-14.)
   An earlier custom override above shrinks all swatches globally to 20px
   (.swatch__button { --swatch-size: 20px; }); the rules below win here via
   higher selector specificity, regardless of viewport width.
   `display: grid` is !important because
   ".collection__filters .collection__sidebar__group:first-of-type ul.collection-nav"
   (line ~29966) has higher specificity and forces display:block on the
   colour swatch list (it's the first filter group), which would otherwise
   silently drop the grid below.
   ========================================================================== */
/* lay the colour swatch list out in a 5-column grid with even gaps */
.collection__sidebar .collection-nav--inline {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr);
  justify-items: start;
  gap: 5px;
  padding: 16px 0 6px;
}

/* row/column spacing now comes from the grid gap above */
.collection__sidebar .collection-nav--inline .sidebar__item--swatch {
  margin: 0;
}

.collection__sidebar .sidebar__item--swatch .swatch__button {
  --swatch-size: 25px;
  margin: 0;
}

/* keep the sold-out/disabled strike-through spanning the bigger circle
   (the base rule hardcodes a 32px line for the old size) */
.collection__sidebar .link--disable .swatch__button [data-swatch]::before {
  height: var(--swatch-size);
}

/* ============================================================
   Small collection template (templates/collection.small.json)
   Added 2026-07-09.
   Scoped by the "collection--first-product-feature" class set on
   the Collection products section in that template only, so no
   other collection pages are affected.
   On mobile (2-per-row grid) the first product spans the full
   width as a large square; remaining products stay 2 per row.
   ============================================================ */
@media only screen and (max-width: 767px) {
  .collection--first-product-feature #CollectionLoop > .product-item_product:first-child {
    width: 100% !important;
    grid-column: 1 / -1;
  }
}

/* Full-width first product tile: defaults to the lifestyle image on mobile
   only, on page load (2026-07-16). Rendered by snippets/product-grid-item.liquid
   whenever is_feature_mobile_lifestyle is true; the "active" class that
   actually shows it is added by assets/style-toggling.js at load time, not
   forced here in CSS - that way the existing style-toggle button still
   toggles this tile back and forth along with every other product, instead
   of being permanently pinned on regardless of toggle state. See the
   existing .active rules further up this file (search "supports-touch
   .product-item__bg__under.active") for the actual show/hide styling. */

/* "Filter & Sort" / "Show on Model" button text: pinned to a flat 12px on
   both (2026-07-16), superseding the earlier --FONT-SIZE-BASE-matching
   approach. See the min-height + font-size added directly to
   .popout--group .popout__toggle.popout__toggle--filters (~line 29910)
   and .style-toggle-btn (snippets/collection-style-toggle.liquid). Note
   the child span rules (".style-toggle span" / ".collection__nav
   .popout__toggle span", theme.css ~line 27801/27806) are what actually
   render the text - pinned directly to 11px on 2026-07-16 (previously a
   relative 0.9em, which wasn't visibly changing when the button's own
   font-size changed enough for it to be worth double-checking). */

/* Sam round-2 (2026-07-17). !important throughout is load-bearing: beats the
   global `p,li { color:#888888 !important }` (~L27314). Don't strip. */

/* Drawer text #262626 (incl. FILTERS/COLOUR/PRICE headings + Sort). */
.collection__sidebar,
.collection__sidebar p,
.collection__sidebar li,
.collection__sidebar a,
.collection__sidebar .collection__sidebar__heading,
.collection__sidebar .collection__sidebar__heading span,
.collection__sidebar .sort-accordion__header,
.collection__sidebar .sort-accordion__header-content,
.collection__sidebar .sort-accordion__header-content * {
  color: #262626 !important;
}

/* Match SORT BY weight to the other headings. The accordion pins its own
   weight, so this needs !important to win. Updated 2026-07-28 alongside
   .collection__sidebar__heading above - change both together or SORT BY
   desyncs from COLOUR/PRICE/STYLE. */
.collection__sidebar .sort-accordion__header-content,
.collection__sidebar .sort-accordion__header-content * {
  font-weight: var(--FONT-WEIGHT-BODY) !important;
}

/* SORT BY read heavier than COLOUR/PRICE/STYLE even at matching weight, because
   it's a <button>: theme.css ~L27311 pins `button, input, select, textarea` to
   Typekit's "futura-pt", while the <p> headings use the Shopify-hosted font via
   --FONT-STACK-BODY. Two different cuts of Futura, and the Typekit one is
   noticeably heavier at 12px uppercase. Force the sidebar sort header onto the
   same stack as its sibling headings. Scoped to .collection__sidebar so buttons
   elsewhere keep futura-pt. (2026-07-28) */
.collection__sidebar .sort-accordion__header,
.collection__sidebar .sort-accordion__header * {
  font-family: var(--FONT-STACK-BODY) !important;
  font-style: var(--FONT-STYLE-BODY);
}

/* Small-collection bottom blurb #262626; :not(.color_gold) keeps the banner hero blurb green. */
.collection-title-blurb:not(.color_gold) .collection-title-blurb__text,
.collection-title-blurb:not(.color_gold) .collection-title-blurb__text p {
  color: #262626 !important;
}

/* Mobile drawer "FILTERS" heading is outside .collection__sidebar; match subheadings (12px). */
@media only screen and (max-width: 749px) {
  .collection__sidebar__head h3 {
    font-size: 12px !important;
  }
}