/** Shopify CDN: Minification failed

Line 39:0 All "@import" rules must come first

**/
/* =============================================================
   Sprout — sd-collection.css  v2
   ─────────────────────────────────────────────────────────────
   Shared styles for the entire collection experience:
     Collection Gateway · Collection Banner · Catalog Layout ·
     Sidebar Filters · Mobile Panel · Product Grid · Product Cards ·
     Pagination · Cart Toast

   Design system (Enchanted Forest):
     --cv-bg              aged parchment #FDFBF2  page background
     --cv-fg              forest dark    #1C2B1F  all text
     --cv-primary         forest canopy  #2C4731  headings, borders
     --cv-accent          gilded gold    #C59B43  stars, premium badges
     --cv-accent-blue     deep river     #21496D  search focus, active states
     --color-cta-primary  gilded gold    #C59B43  EXCLUSIVELY:
       active filter checkboxes · sale badges · Quick Add ·
       free-ship bar · Clear filters CTA (dark text #1a2510 on gold)

   Von Restorff enforced: gold only on CTA elements above.
   ============================================================= */

/* ── Page load animation ── */
@keyframes sd-fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.sdcb-banner          { animation: sd-fade-up 0.5s ease both; animation-delay: 0.05s; }
section.sdcpg         { animation: sd-fade-up 0.5s ease both; animation-delay: 0.1s;  }
div.sd-catalog        { animation: sd-fade-up 0.5s ease both; animation-delay: 0.1s;  }
section.sdcl-gateway  { animation: sd-fade-up 0.5s ease both; animation-delay: 0.1s;  }
div.sdsr              { animation: sd-fade-up 0.5s ease both; animation-delay: 0.1s;  }

/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Nunito:wght@600;700;800&family=Playfair+Display:wght@400;700&display=swap');

/* ── Design tokens (mirror main-product.liquid) ── */
:root {
  --cv-bg:                   #FDFBF2;
  --cv-fg:                   #1C2B1F;
  --cv-card:                 #ffffff;
  --cv-primary:              #2C4731;
  --cv-primary-fg:           #FDFBF2;
  --cv-secondary:            #E8EBE3;
  --cv-muted-fg:             #425E3B;
  --cv-border:               #BDC9B6;
  --cv-radius:               1rem;
  --cv-shadow-sm:            0 1px 2px rgba(0,0,0,0.05);
  --cv-shadow:               0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.05);
  --cv-font-sans:            'Inter', system-ui, -apple-system, sans-serif;
  --cv-font-head:            'Nunito', system-ui, sans-serif;
  --cv-font-display:         'Playfair Display', Georgia, serif;
  --cv-accent:               #C59B43;
  --cv-accent-fg:            #1C2B1F;
  --cv-accent-hover:         #A8832C;
  --cv-accent-blue:          #21496D;
  --cv-success:              #3d7a1f;
  --cv-success-fg:           #FDFBF2;
  --cv-destructive:          #c94030;
  --cv-star:                 #C59B43;
  --color-cta-primary:       #C59B43;
  --color-cta-primary-fg:    #1a2510;
  --color-cta-primary-hover: #A8832C;
}

/* =============================================================
   COLLECTION GATEWAY — list-collections page
   .sdcl-*  (gateway)
   ============================================================= */

.sdcl-gateway {
  background: var(--cv-bg);
  padding: 3rem 1rem 4rem;
  font-family: var(--cv-font-sans);
}

.sdcl-gateway__inner {
  max-width: 90rem;
  margin: 0 auto;
}

.sdcl-gateway__heading {
  font-family: var(--cv-font-head);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 800;
  color: var(--cv-primary);
  letter-spacing: -0.02em;
  text-align: center;
  margin: 0 0 0.5rem;
}

.sdcl-gateway__subheading {
  font-size: 1.05rem;
  color: var(--cv-muted-fg);
  text-align: center;
  margin: 0 auto 2.5rem;
  max-width: 36rem;
}

.sdcl-gateway__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .sdcl-gateway__grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

/* Gateway card */
.sdcl-card {
  display: block;
  text-decoration: none;
  border-radius: calc(var(--cv-radius) * 2.5);
  overflow: hidden;
  border: 2px solid var(--cv-border);
  box-shadow: var(--cv-shadow);
  transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s;
  background: var(--cv-card);
  color: var(--cv-primary);
}

.sdcl-card:hover {
  border-color: var(--cv-primary);
  box-shadow: 0 8px 32px rgba(28,42,62,0.14);
  transform: translateY(-3px);
}

.sdcl-card__img-wrap {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--cv-secondary);
}

.sdcl-card__img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sdcl-card:hover .sdcl-card__img { transform: scale(1.05); }

.sdcl-card__img--placeholder {
  background: linear-gradient(135deg, var(--cv-secondary) 0%, var(--cv-border) 100%);
}

.sdcl-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom,
    rgba(28,42,62,0) 35%, rgba(28,42,62,0.72) 75%, rgba(28,42,62,0.88) 100%);
  display: flex; align-items: flex-end;
}

.sdcl-card__content { padding: 1.5rem; width: 100%; }

.sdcl-card__eyebrow {
  display: inline-block;
  font-size: 0.7rem; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; color: rgba(238,245,252,0.7);
  margin-bottom: 0.35rem;
}

.sdcl-card__title {
  font-family: var(--cv-font-head);
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 800; color: #FDFBF2;
  letter-spacing: -0.02em; margin: 0 0 0.5rem; line-height: 1.15;
}

.sdcl-card__desc {
  font-size: 0.85rem; color: rgba(238,245,252,0.75);
  margin: 0 0 1rem; line-height: 1.5;
}

.sdcl-card__cta {
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-size: 0.875rem; font-weight: 600; color: var(--color-cta-primary-fg);
  background: var(--color-cta-primary);
  padding: 0.5rem 1rem; border-radius: 999px;
  transition: background 0.2s; text-decoration: none;
}

.sdcl-card:hover .sdcl-card__cta { background: var(--color-cta-primary-hover); }
.sdcl-card__cta svg { flex-shrink: 0; }


/* =============================================================
   COLLECTION BANNER
   .sdcb-*
   ============================================================= */

.sdcb-banner {
  background: var(--cv-bg);
  border-bottom: 1px solid var(--cv-border);
  padding: 2rem 1rem 1.5rem;
  font-family: var(--cv-font-sans);
}

.sdcb-banner__inner {
  max-width: 90rem;
  margin: 0 auto;
}

.sdcb-banner__title {
  font-family: var(--cv-font-head);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 800;
  color: var(--cv-primary);
  letter-spacing: -0.025em;
  margin: 0.5rem 0 0.75rem;
  line-height: 1.15;
}

.sdcb-banner__desc {
  font-size: 0.95rem;
  color: var(--cv-muted-fg);
  max-width: 52rem;
  line-height: 1.65;
  margin: 0 0 1rem;
}

.sdcb-banner__desc p { margin: 0; }

.sdcb-banner__meta {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
}

.sdcb-banner__count {
  font-size: 0.8rem; font-weight: 500; color: var(--cv-muted-fg);
  background: var(--cv-secondary); padding: 0.25rem 0.65rem;
  border-radius: 999px;
}

.sdcb-banner__img-wrap {
  margin: 1rem 0 0;
  border-radius: var(--cv-radius);
  overflow: hidden;
  max-height: 18rem;
}
.sdcb-banner__img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}


/* =============================================================
   CATALOG LAYOUT — 2-column grid (sidebar + main)
   .sd-catalog*
   ============================================================= */

.sd-catalog {
  background: var(--cv-bg);
  font-family: var(--cv-font-sans);
}

/* Base wrapper (no sidebar) */
.sd-catalog__wrap {
  max-width: 90rem;
  margin: 0 auto;
  padding: 1.5rem 1rem 5rem;
}

/* Sidebar variant: 2-col grid on desktop */
.sd-catalog__wrap--sidebar {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

@media (min-width: 1024px) {
  .sd-catalog__wrap--sidebar {
    grid-template-columns: 280px 1fr;
    gap: 2.5rem;
    align-items: start;
  }
}


/* =============================================================
   SIDEBAR
   .sdcl-sidebar*
   ============================================================= */

/* Hidden on mobile; always visible on desktop */
.sdcl-sidebar {
  display: none;
}

@media (min-width: 1024px) {
  .sdcl-sidebar {
    display: block;
    position: sticky;
    top: 1.5rem;
    max-height: calc(100vh - 5rem);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: var(--cv-border) transparent;
    padding: 1rem 1rem 2rem;
    background: #ffffff;
    border-radius: 0.75rem;
    border: 1px solid var(--cv-border);
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  }
  body.sd-sticky-active .sdcl-sidebar {
    top: calc(var(--sd-header-height, 64px) + 1rem);
    max-height: calc(100vh - var(--sd-header-height, 64px) - 2rem);
  }
}

/* Sidebar header — "FILTERS" eyebrow + "Clear all" link */
.sdcl-sidebar__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0.875rem;
  margin-bottom: 0.125rem;
  border-bottom: 1px solid var(--cv-border);
}

.sdcl-sidebar__title {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cv-muted-fg);
}

/* Clear All — muted text link (Von Restorff: NOT green) */
.sdcl-sidebar__clear {
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--cv-muted-fg);
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: color 0.15s;
}
.sdcl-sidebar__clear:hover { color: var(--cv-fg); }

/* Sidebar sort */
.sdcl-sidebar__sort {
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--cv-border);
}

.sdcl-sidebar__sort-label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cv-muted-fg);
  margin-bottom: 0.5rem;
}

/* Full-width sort select variant (for sidebar) */
.sdcf-sort-select--full {
  width: 100%;
}

.sdcl-sidebar__empty {
  font-size: 0.82rem;
  color: var(--cv-muted-fg);
  font-style: italic;
  padding: 0.75rem 0;
}


/* =============================================================
   ACCORDION — sidebar filter groups
   .sdcl-accordion*
   ============================================================= */

.sdcl-accordion {
  border-bottom: 1px solid var(--cv-border);
}

.sdcl-accordion__header {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.9rem 0;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--cv-font-head); /* Nunito Bold */
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--cv-primary);
  text-align: left;
  gap: 0.5rem;
  transition: color 0.15s;
}
.sdcl-accordion__header:hover { color: var(--cv-fg); }

.sdcl-accordion__label { flex: 1; }

/* Active-count badge — green (CTA color, appropriate for active state indicator) */
.sdcl-accordion__badge {
  background: var(--color-cta-primary);
  color: #fff;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 700;
  padding: 0.1rem 0.42rem;
  line-height: 1.4;
  flex-shrink: 0;
}

.sdcl-accordion__chevron {
  flex-shrink: 0;
  color: var(--cv-muted-fg);
  transition: transform 0.22s ease;
}
.sdcl-accordion.is-open .sdcl-accordion__chevron  { transform: rotate(180deg); }
.sdcl-mobile-group.is-open .sdcl-accordion__chevron { transform: rotate(180deg); }

/* Accordion body — hidden until .is-open */
.sdcl-accordion__body {
  display: none;
  padding-bottom: 0.625rem;
}
.sdcl-accordion.is-open .sdcl-accordion__body { display: block; }

/* Filter option list */
.sdcl-accordion__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  max-height: 280px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--cv-border) transparent;
  scrollbar-gutter: stable;
}


/* =============================================================
   FILTER OPTIONS — shared between sidebar + mobile panel
   .sdcf-option*
   ============================================================= */

.sdcf-option__label {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 12px 4px;
  cursor: pointer;
  font-size: 0.84rem;
  color: var(--cv-fg);
  transition: background 0.1s;
  text-decoration: none;
  border-radius: calc(var(--cv-radius) - 2px);
}
.sdcf-option__label:hover { background: var(--cv-secondary); }

/* Disabled (zero results) */
.sdcf-option__label--disabled {
  opacity: 0.4;
  pointer-events: none;
}

/* Custom checkbox */
.sdcf-option__check {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  border: 1.5px solid var(--cv-primary);
  border-radius: 4px;
  background: transparent;
  transition: background 0.15s, border-color 0.15s;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Active checkbox — green fill (Von Restorff: active filter state) */
.sdcf-option__label.is-active .sdcf-option__check {
  background: var(--color-cta-primary);
  border-color: var(--color-cta-primary);
}
.sdcf-option__label.is-active .sdcf-option__check::after {
  content: '';
  display: block;
  width: 9px; height: 5px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(0, -1px);
}

.sdcf-option__text { flex: 1; }

.sdcf-option__count {
  font-size: 0.72rem;
  color: var(--cv-muted-fg);
  background: var(--cv-secondary);
  padding: 0.1rem 0.42rem;
  border-radius: 999px;
  flex-shrink: 0;
}


/* =============================================================
   PRICE RANGE FILTER
   .sdcl-price-range*
   ============================================================= */

.sdcl-price-range {
  padding: 0.25rem 0 0.25rem;
}

.sdcl-price-range__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 0.75rem;
}

.sdcl-price-range__field { flex: 1; min-width: 0; }

.sdcl-price-range__label {
  display: block;
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--cv-muted-fg);
  margin-bottom: 0.3rem;
}

.sdcl-price-range__wrap {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--cv-border);
  border-radius: var(--cv-radius);
  background: var(--cv-card);
  overflow: hidden;
  transition: border-color 0.15s;
}
.sdcl-price-range__wrap:focus-within { border-color: var(--cv-primary); }

.sdcl-price-range__symbol {
  padding: 0 0.25rem 0 0.55rem;
  font-size: 0.78rem;
  color: var(--cv-muted-fg);
  flex-shrink: 0;
}

.sdcl-price-range__input {
  flex: 1; min-width: 0;
  width: 100%; box-sizing: border-box;
  padding: 0.45rem 0.5rem 0.45rem 0;
  background: none; border: none; outline: none;
  font-size: 0.84rem; font-weight: 500; color: var(--cv-fg);
  font-family: var(--cv-font-sans);
}
.sdcl-price-range__input::-webkit-outer-spin-button,
.sdcl-price-range__input::-webkit-inner-spin-button { -webkit-appearance: none; }
.sdcl-price-range__input[type=number] { -moz-appearance: textfield; }

.sdcl-price-range__sep {
  font-size: 0.82rem;
  color: var(--cv-muted-fg);
  flex-shrink: 0;
}

.sdcl-price-range__apply {
  width: 100%;
  padding: 0.55rem;
  background: var(--cv-primary);
  color: var(--cv-primary-fg);
  border: none;
  border-radius: var(--cv-radius);
  font-size: 0.8rem; font-weight: 600;
  cursor: pointer;
  font-family: var(--cv-font-sans);
  transition: background 0.15s;
}
.sdcl-price-range__apply:hover { background: #1C2B1F; }

.sdcl-price-range__reset {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: var(--cv-muted-fg);
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  text-align: center;
  transition: color 0.15s;
}
.sdcl-price-range__reset:hover { color: var(--cv-fg); }


/* =============================================================
   ACTIVE FILTER PILLS + CLEAR ALL
   .sdcf-active-pills / .sdcf-pill / .sdcf-clear-all
   ============================================================= */

.sdcf-active-pills {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 1rem;
}

/* Green pills — active filter state (Von Restorff appropriate) */
.sdcf-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem; font-weight: 600;
  color: var(--color-cta-primary);
  background: rgba(61,122,31,0.10);
  border: 1px solid rgba(61,122,31,0.28);
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
  text-decoration: none;
  transition: background 0.15s;
}
.sdcf-pill:hover { background: rgba(61,122,31,0.18); }

.sdcf-pill__remove {
  display: flex; align-items: center; opacity: 0.7;
}
.sdcf-pill:hover .sdcf-pill__remove { opacity: 1; }

/* Clear All — muted link, NOT green (Von Restorff) */
.sdcf-clear-all {
  font-size: 0.75rem; font-weight: 600;
  color: var(--cv-muted-fg);
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  background: none; border: none;
  cursor: pointer; padding: 0.25rem 0.25rem;
  transition: color 0.15s;
}
.sdcf-clear-all:hover { color: var(--cv-fg); }


/* =============================================================
   TOPBAR — mobile filter trigger · product count · sort
   .sd-catalog__topbar / .sdcf-mobile-trigger
   ============================================================= */

.sd-catalog__topbar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding-bottom: 0.875rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--cv-border);
}

.sd-catalog__count {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--cv-muted-fg);
  margin: 0;
  flex: 1;                /* pushes sort to far right on desktop */
}

/* Mobile filter button — hidden on desktop */
.sdcf-mobile-trigger {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem; font-weight: 600;
  color: var(--cv-primary);
  background: var(--cv-card);
  border: 1.5px solid var(--cv-border);
  border-radius: var(--cv-radius);
  padding: 0.5rem 0.9rem;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color 0.15s, background 0.15s;
  font-family: var(--cv-font-sans);
}
.sdcf-mobile-trigger:hover { border-color: var(--cv-primary); }
.sdcf-mobile-trigger svg { flex-shrink: 0; }

/* Green badge on trigger when filters are active */
.sdcf-mobile-trigger__badge {
  background: var(--color-cta-primary);
  color: #fff;
  border-radius: 999px;
  font-size: 0.65rem; font-weight: 700;
  padding: 0.1rem 0.45rem;
  line-height: 1.4;
}

@media (min-width: 1024px) {
  .sdcf-mobile-trigger { display: none; }
}

/* Sort wrap — hidden on mobile (sort lives in mobile panel) */
.sd-catalog__sort-wrap {
  display: none;
  align-items: center;
  gap: 0.5rem;
}

@media (min-width: 768px) {
  .sd-catalog__sort-wrap { display: flex; }
}

.sd-catalog__sort-label {
  font-size: 0.8rem; font-weight: 500;
  color: var(--cv-muted-fg); white-space: nowrap;
}

/* Sort select (desktop topbar + sidebar) */
.sdcf-sort-select {
  font-size: 0.8rem; font-weight: 600;
  color: var(--cv-primary);
  background: var(--cv-card);
  border: 1.5px solid var(--cv-border);
  border-radius: var(--cv-radius);
  padding: 0.4rem 2.25rem 0.4rem 0.75rem;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231e3a5f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.6rem center;
  transition: border-color 0.15s;
}
.sdcf-sort-select:hover,
.sdcf-sort-select:focus { border-color: var(--cv-primary); outline: none; }


/* =============================================================
   MOBILE FILTER — inline accordion
   .sdcl-mobile-panel*
   ============================================================= */

.sdcl-mobile-panel {
  display: none;
  width: 100%;
  background: #fff;
  border: 1px solid #BDC9B6;
  border-radius: 8px;
  margin-bottom: 16px;
  overflow: hidden;
}
.sdcl-mobile-panel.is-open { display: block; }
@media (min-width: 1024px) { .sdcl-mobile-panel { display: none !important; } }

.sdcl-mobile-panel__body {
  padding: 16px;
}

/* Sort section */
.sdcl-mobile-sort {
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid #BDC9B6;
}
.sdcl-mobile-sort__title {
  font-size: 0.875rem;
  font-weight: 700;
  margin: 0 0 8px;
}
.sdcl-mobile-sort__options { display: flex; flex-direction: column; gap: 2px; }
.sdcf-sort-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 8px;
  font-size: 0.875rem;
  text-decoration: none;
  color: inherit;
  border-radius: 6px;
}
.sdcf-sort-option:hover { background: #f5f5f5; }
.sdcf-sort-option.is-active { font-weight: 600; }
.sdcf-sort-radio {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1.5px solid #ccc;
  flex-shrink: 0;
}
.sdcf-sort-option.is-active .sdcf-sort-radio {
  border-color: var(--color-cta-primary);
  background: var(--color-cta-primary);
  box-shadow: inset 0 0 0 3px #fff;
}

/* Filter accordion groups */
.sdcl-mobile-group {
  border-bottom: 1px solid #BDC9B6;
}
.sdcl-mobile-group__header {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 14px 0;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: left;
  gap: 8px;
}
.sdcl-mobile-group__header .sdcl-accordion__label { flex: 1; }
.sdcl-mobile-group__list {
  display: none;
  flex-direction: column;
  padding-bottom: 8px;
}
.sdcl-mobile-group.is-open .sdcl-mobile-group__list { display: flex; }

/* Clear all link */
.sdcl-mobile-panel__clear {
  padding-top: 12px;
  margin-top: 4px;
}
.sdcl-mobile-panel__clear-link {
  font-size: 0.85rem;
  color: #6b7280;
  text-decoration: underline;
}


/* =============================================================
   PRODUCT GRID
   .sdcpg*
   ============================================================= */

/* Base grid: 2 col mobile → 3 col tablet → 4 col desktop (no sidebar) */
.sdcpg__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.875rem;
}

@media (min-width: 640px) {
  .sdcpg__grid { grid-template-columns: repeat(3, 1fr); gap: 1rem; }
}

@media (min-width: 1024px) {
  .sdcpg__grid { grid-template-columns: repeat(4, 1fr); gap: 0.75rem; }
}

/* With sidebar — override to 3-col at 1024px (narrower grid area) */
@media (min-width: 1024px) {
  .sd-catalog__wrap--sidebar .sdcpg__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* With sidebar — 4-col at wide viewports */
@media (min-width: 1440px) {
  .sd-catalog__wrap--sidebar .sdcpg__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Empty state */
.sdcpg__empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 5rem 1rem 3rem;
  max-width: 32rem;
  margin: 0 auto;
}
.sdcpg__empty-icon { color: var(--cv-border); margin-bottom: 1.25rem; }

.sdcpg__empty-title {
  font-family: var(--cv-font-head);
  font-size: 1.375rem; font-weight: 800;
  color: var(--cv-primary); letter-spacing: -0.02em;
  margin: 0 0 0.5rem;
}

.sdcpg__empty-text {
  font-size: 0.9rem; color: var(--cv-muted-fg);
  margin: 0; line-height: 1.6;
}

/* Empty state CTA — green (Von Restorff: it IS a primary CTA) */
.sdcpg__empty-cta {
  display: inline-flex; align-items: center;
  margin-top: 1.5rem; padding: 0.65rem 1.75rem;
  border-radius: 999px;
  background: var(--color-cta-primary);
  color: var(--color-cta-primary-fg);
  font-weight: 600; font-size: 0.875rem;
  text-decoration: none; font-family: var(--cv-font-sans);
  transition: background 0.15s;
}
.sdcpg__empty-cta:hover { background: var(--color-cta-primary-hover); }

/* Pagination */
.sdcpg__pagination {
  margin-top: 2.5rem;
  display: flex; justify-content: center;
  gap: 0.4rem; flex-wrap: wrap;
  font-family: var(--cv-font-sans);
}

.sdcpg__page-link,
.sdcpg__page-current {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 0.6rem;
  border-radius: var(--cv-radius);
  font-size: 0.85rem; font-weight: 600;
  text-decoration: none;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.sdcpg__page-link {
  background: var(--cv-card);
  border: 1.5px solid var(--cv-border);
  color: var(--cv-fg);
}
.sdcpg__page-link:hover {
  border-color: var(--cv-primary);
  color: var(--cv-primary);
}

.sdcpg__page-current {
  background: var(--cv-primary);
  border: 1.5px solid var(--cv-primary);
  color: var(--cv-primary-fg);
}

.sdcpg__page-dots {
  display: inline-flex; align-items: center;
  color: var(--cv-muted-fg); font-size: 0.85rem; padding: 0 0.25rem;
}


/* =============================================================
   PRODUCT CARD
   .sdpc*
   ============================================================= */

.sdpc {
  background: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #BDC9B6;
  box-shadow: 0 4px 12px rgba(0,0,0,0.04);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: box-shadow 0.2s, border-color 0.2s, transform 0.2s;
  position: relative;
}

.sdpc:hover {
  box-shadow: 0 8px 28px rgba(28,42,62,0.14);
  border-color: #c8c4be;
  transform: translateY(-5px);
}

/* Out of stock: slight opacity fade */
.sdpc--sold-out { opacity: 0.72; }
.sdpc--sold-out:hover { opacity: 0.85; }

/* ── Image ── */
.sdpc__img-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: transparent;
  flex-shrink: 0;
}

.sdpc__img-link {
  display: block;
  height: 100%;
  position: relative;
}

.sdpc__img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sdpc__img--hover {
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity 0.35s ease;
}

@media (hover: hover) {
  .sdpc:hover .sdpc__img--primary { opacity: 0; }
  .sdpc:hover .sdpc__img--hover { opacity: 1; }
}

.sdpc:hover .sdpc__img--primary { transform: scale(1.04); }

/* ── Badges ── */
.sdpc__badges {
  position: absolute; top: 0.5rem; left: 0.5rem;
  display: flex; flex-direction: column; gap: 0.3rem; z-index: 2;
}

.sdpc__badge {
  display: inline-block;
  font-size: 0.65rem; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase; padding: 0.22rem 0.55rem;
  border-radius: 999px; line-height: 1.2;
}

/* Sale badge — green (Von Restorff) */
.sdpc__badge--sale {
  background: var(--color-cta-primary);
  color: var(--color-cta-primary-fg);
}

/* Sold out — muted grey, clearly NOT a CTA */
.sdpc__badge--sold-out {
  background: #e2e0dc;
  color: var(--cv-muted-fg);
}

/* ── Quick Add (overlay on image) ── */
.sdpc__quick-add-wrap {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 0.5rem; z-index: 3;
  opacity: 1; transform: translateY(0);
  transition: opacity 0.22s, transform 0.22s;
}

/* On hover-capable devices: hidden until hover */
@media (hover: hover) {
  .sdpc__quick-add-wrap {
    opacity: 0; transform: translateY(6px);
  }
  .sdpc:hover .sdpc__quick-add-wrap {
    opacity: 1; transform: translateY(0);
  }
  .sdpc__img-wrap::after {
    content: ''; position: absolute; bottom: 0; left: 0; right: 0;
    height: 60%;
    background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.25));
    opacity: 0; transition: opacity 0.22s; pointer-events: none;
  }
  .sdpc:hover .sdpc__img-wrap::after { opacity: 1; }
}

/* Quick Add button — green (Von Restorff: primary add-to-cart action) */
.sdpc__quick-add {
  width: 100%;
  padding: 0.55rem 0.75rem;
  background: var(--color-cta-primary);
  color: var(--color-cta-primary-fg);
  border: none; border-radius: var(--cv-radius);
  font-size: 0.78rem; font-weight: 700;
  cursor: pointer; letter-spacing: 0.02em;
  transition: background 0.15s;
  display: flex; align-items: center; justify-content: center; gap: 0.4rem;
  font-family: var(--cv-font-sans);
}
.sdpc__quick-add:hover { background: var(--color-cta-primary-hover); }
.sdpc__quick-add:disabled {
  background: var(--cv-muted-fg); cursor: not-allowed;
}

/* "Select Options" variant — slate (NOT green; navigates to PDP) */
.sdpc__quick-add--goto { background: var(--cv-primary); }
.sdpc__quick-add--goto:hover { background: #1C2B1F; }

/* ── Card body ── */
.sdpc__body {
  padding: 0.6rem 0.75rem 0.75rem;
  display: flex; flex-direction: column; gap: 0.15rem; flex: 1;
}

.sdpc__vendor {
  font-size: 0.7rem; font-weight: 500; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--cv-muted-fg);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.sdpc__title {
  font-family: var(--cv-font-head);
  font-size: 0.85rem; font-weight: 600;
  color: var(--cv-primary); line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden; flex: 1;
}

.sdpc__price-row {
  display: flex; align-items: baseline;
  gap: 0.45rem; flex-wrap: wrap; margin-top: 0.15rem;
}

.sdpc__price-current {
  font-family: var(--cv-font-head);
  font-size: 0.95rem; font-weight: 700; color: var(--cv-primary);
}

.sdpc__price-compare {
  font-size: 0.8rem; color: var(--cv-muted-fg); text-decoration: line-through;
}

.sdpc__type {
  font-size: 0.68rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--cv-muted-fg);
  margin: 0;
}

/* ── Skeleton loading ── */
.sdpc--skeleton .sdpc__img-wrap {
  background: linear-gradient(90deg, var(--cv-secondary) 25%, var(--cv-border) 50%, var(--cv-secondary) 75%);
  background-size: 200% 100%;
  animation: sdpc-shimmer 1.5s infinite;
}
@keyframes sdpc-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}


/* =============================================================
   CART TOAST NOTIFICATION
   .sd-toast*
   ============================================================= */

.sd-toast {
  position: fixed; bottom: 1.5rem; right: 1.5rem;
  background: var(--cv-primary); color: var(--cv-primary-fg);
  padding: 0.75rem 1.25rem;
  border-radius: calc(var(--cv-radius) * 1.5);
  font-family: var(--cv-font-sans); font-size: 0.875rem; font-weight: 500;
  box-shadow: 0 4px 20px rgba(28,42,62,0.25);
  z-index: 9999;
  display: flex; align-items: center; gap: 0.6rem;
  opacity: 0; transform: translateY(8px);
  transition: opacity 0.25s, transform 0.25s;
  pointer-events: none;
  max-width: calc(100vw - 3rem);
}
.sd-toast.is-visible {
  opacity: 1; transform: translateY(0); pointer-events: auto;
}

.sd-toast--success .sd-toast__icon { color: var(--color-cta-primary); }
.sd-toast--error   .sd-toast__icon { color: #e05252; }

.sd-toast__icon { flex-shrink: 0; display: flex; align-items: center; }
.sd-toast__close {
  margin-left: 0.5rem;
  background: none; border: none;
  color: rgba(238,245,252,0.6); cursor: pointer;
  padding: 0; line-height: 1; flex-shrink: 0;
  display: flex; align-items: center;
}
.sd-toast__close:hover { color: var(--cv-primary-fg); }


/* =============================================================
   MOBILE-ONLY UX IMPROVEMENTS  (max-width: 768px)
   ─────────────────────────────────────────────────────────────
   Strict constraint: every rule here is wrapped in the mobile
   breakpoint — desktop experience is completely unaltered.
   ============================================================= */

@media (max-width: 768px) {

  /* ── 1. Hide Quick Add button entirely on mobile ── */
  .sdpc__quick-add-wrap {
    display: none;
  }

  /* ── 2a. Hide vendor/brand label on mobile ── */
  .sdpc__vendor {
    display: none;
  }

  /* ── 2b. Allow title to wrap to 3 lines so unique set name is readable ── */
  .sdpc__title {
    -webkit-line-clamp: 3;
    font-size: 0.8rem;
  }

  /* ── 3. Tighten card body padding so image fills more of the card ── */
  .sdpc__body {
    padding: 0.45rem 0.55rem 0.55rem;
    gap: 0.15rem;
  }

  /* Reduce image-wrap internal spacing: aspect-ratio stays 1/1 but
     the card border-radius shrinks slightly to feel less chunky */
  .sdpc {
    border-radius: var(--cv-radius);
  }

  /* ── 4. Badges — larger, bolder, high-contrast colours on mobile ── */
  .sdpc__badge {
    font-size:   0.72rem;
    font-weight: 800;
    padding:     0.3rem 0.65rem;
    letter-spacing: 0.05em;
  }

  /* Sale badge → distinct red (clear danger/discount signal) */
  .sdpc__badge--sale {
    background: #d93025;
    color:      #ffffff;
  }

  /* New badge → bright indigo-blue (distinct from sale red and CTA green) */
  .sdpc__badge--new {
    background: #1a6fe8;
    color:      #ffffff;
  }

  /* Sold-out badge — slightly more prominent on mobile too */
  .sdpc__badge--sold-out {
    font-size: 0.68rem;
    font-weight: 700;
  }


  /* ══════════════════════════════════════════════════════════
     GAMEOLOGY-STYLE MOBILE GRID
     ─────────────────────────────────────────────────────────
     Reference: ~8px outer gutters, ~8px column gap, ~10px card
     radius, white card surface, hairline border + whisper shadow.
     All rules use !important to defeat Shopify base-theme
     specificity (main { padding: 2rem }, grid vars, Dawn classes).
     ══════════════════════════════════════════════════════════ */

  /* ── 1a. Escape the base.css `main { padding: 2rem }` wrapper ──
     sd-collection.css is only loaded on collection pages, so
     this override is completely safe and page-scoped. ── */
  main {
    padding-left:  0 !important;
    padding-right: 0 !important;
  }

  /* ── 1b. 8px outer gutters — matches Gameology proportions ── */
  .sd-catalog__wrap {
    padding-left:  8px !important;
    padding-right: 8px !important;
    padding-top:   0.75rem;
  }

  /* Safety net: target .page-width and any app-injected wrappers */
  .page-width,
  .page-width--wide,
  .collection-grid-wrapper {
    padding-left:  8px !important;
    padding-right: 8px !important;
  }

  /* ── 2. 8px column gap — consistent with outer gutters ── */
  .sdcpg__grid {
    gap: 8px !important;

    /* Override all Shopify/Dawn grid-spacing CSS variable names */
    --grid-mobile-horizontal-spacing:  8px !important;
    --grid-horizontal-spacing:         8px !important;
    --product-grid-horizontal-spacing: 8px !important;
    --column-gap:                      8px !important;
  }

  /* ── 3. Image container — flush, no padding, top corners rounded ──
     The card radius clips the image's top-left and top-right corners.
     The image-wrap has flat bottom edges so it seats cleanly against
     the card body below, exactly as in the Gameology reference. ── */
  .sdpc__img-wrap {
    padding:       0                   !important;
    margin:        0                   !important;
    border-radius: 10px 10px 0 0       !important;
                                       /* top corners match card radius;
                                          bottom corners flat (no gap/seam) */
  }

  /* Image itself — zero margins, no independent radius */
  .sdpc__img {
    display:       block;
    margin:        0 !important;
    padding:       0 !important;
    border-radius: 0 !important;
  }

  /* ── 4. Gameology card surface — white, 10px radius, hairline border ──
     Pure white background so the card reads as a distinct surface.
     10px radius curves corners cleanly (Gameology appears ~10–12px).
     Hairline 1px border + barely-there shadow give premium "lift"
     without the heavy box look from the previous state. ── */
  .sdpc {
    background:    #ffffff !important;
    border:        none    !important;
    box-shadow:    none    !important;
    border-radius: 10px    !important;
    overflow:      hidden  !important;
  }

  /* On touch devices — no lift transform, preserve the card surface */
  .sdpc:hover {
    box-shadow:    none    !important;
    border:        none    !important;
    transform:     none    !important;
    border-radius: 10px    !important;
  }

  /* ── Safety net: Dawn / app-injected card classes ── */
  .card__inner,
  .card__media {
    border-radius: 10px !important;
    overflow:      hidden !important;
  }

  .card--product,
  .card-wrapper {
    border-radius: 10px    !important;
    border:        none    !important;
    box-shadow:    none    !important;
    background:    #ffffff !important;
    overflow:      hidden  !important;
  }


} /* end @media (max-width: 768px) */


/* =============================================================
   COLLECTION LIST PAGE — list-collections enhancements
   Hero band · 3-column grid modifier · product count badges
   ============================================================= */

/* ── Hero header band ── */
.sdcl-gateway__hero {
  background: var(--cv-primary);
  padding: 4rem 1.5rem 3.5rem;
  text-align: center;
}

.sdcl-gateway__hero-inner {
  max-width: 52rem;
  margin: 0 auto;
}

.sdcl-gateway__hero-heading {
  font-family: Nunito, sans-serif;
  font-size: clamp(2.25rem, 5.5vw, 3.5rem);
  font-weight: 800;
  color: var(--cv-primary-fg);
  letter-spacing: -0.025em;
  margin: 0 0 0.75rem;
  line-height: 1.1;
}

.sdcl-gateway__hero-sub {
  font-size: 1.05rem;
  color: rgba(253, 251, 242, 0.78);
  margin: 0 auto;
  line-height: 1.65;
  max-width: 40rem;
}

/* ── 3-column grid modifier ── */
@media (min-width: 768px) {
  .sdcl-gateway__grid--3col {
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;
  }
}

@media (min-width: 1024px) {
  .sdcl-gateway__grid--3col {
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
}

/* ── Product count / Coming Soon badge ── */
.sdcl-card__badge {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--color-cta-primary-fg);
  background: var(--cv-accent);
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  line-height: 1.4;
  pointer-events: none;
  white-space: nowrap;
}

.sdcl-card__badge--soon {
  background: var(--cv-muted-fg);
  color: var(--cv-primary-fg);
}

/* ── Empty collection card — reduced visual weight ── */
.sdcl-card--empty {
  opacity: 0.72;
}

.sdcl-card--empty:hover {
  transform: none;
  border-color: var(--cv-border);
  box-shadow: var(--cv-shadow);
}
