/* Four selectable category presentations. The admin choice is stored server-side. */
#collections {
  --category-green: var(--canna-green-accent, #63d321);
  --category-deep: var(--canna-green-deep, #0b5528);
  --category-ink: #050806;
  padding: clamp(42px, 5vw, 76px) 0 clamp(34px, 4vw, 64px);
  background: #fff;
  color: var(--category-ink);
  scroll-margin-top: 110px;
  transition: background .32s ease, color .32s ease;
}

#collections > .section-shell { width: min(100%, 2048px); max-width: none; }
#collections [hidden] { display: none !important; }

#collections .collections-heading {
  width: min(100% - 48px, 1760px);
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 42px;
}

#collections .collections-heading .eyebrow {
  margin: 0 0 13px;
  color: #278516;
  font-family: 'Cannabus Display', Arial, sans-serif;
  font-size: .8rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .18em;
  text-transform: uppercase;
}

#collections .collections-heading .eyebrow::after {
  content: '';
  display: block;
  width: 48px;
  height: 4px;
  margin-top: 12px;
  background: var(--category-green);
}

#collections .collections-heading h2 {
  margin: 0;
  font-family: 'Cannabus Display', Arial, sans-serif;
  font-size: clamp(3rem, 5vw, 5.6rem);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.025em;
  text-transform: uppercase;
}

#collections .collections-heading-tools {
  max-width: none;
  display: flex;
  align-items: center;
}

#collections .collection-shortcuts { display: flex; align-items: center; gap: 10px; }

#collections .collection-shortcut {
  min-height: 46px;
  padding: 12px 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  border: 1px solid #9ba49a;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-family: 'Cannabus Display', Arial, sans-serif;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}

#collections .collection-shortcut:hover,
#collections .collection-shortcut:focus-visible { border-color: #287a20; background: #eef8e9; outline: 0; }
#collections .collection-shortcut.active { border-color: #7cdd4b; background: #7cdd4b; color: #061008; }

#collections .category-view-editor {
  width: min(100% - 48px, 1760px);
  min-height: 76px;
  margin: 32px auto 0;
  padding: 13px 16px 13px 20px;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  align-items: center;
  gap: 20px;
  border: 1px solid #9cc98a;
  background: #f4faef;
  color: #0a2d16;
  box-shadow: 0 14px 34px rgba(36, 94, 26, .08);
}

#collections .category-view-editor-copy span {
  display: block;
  font-family: 'Cannabus Display', Arial, sans-serif;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#collections .category-view-editor-copy small { display: block; margin-top: 5px; color: #59705a; font-size: .78rem; }

#collections .category-view-options { display: flex; gap: 7px; }
#collections .category-view-options button {
  min-height: 42px;
  padding: 8px 13px;
  border: 1px solid #b7c5b4;
  background: #fff;
  color: #152316;
  font: 700 .73rem/1 'Cannabus Display', Arial, sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
#collections .category-view-options button b { margin-right: 5px; color: #5c9155; font-size: .62rem; }
#collections .category-view-options button:hover { transform: translateY(-2px); border-color: #23791c; }
#collections .category-view-options button[aria-pressed="true"] { background: #0b401d; border-color: #0b401d; color: #fff; }
#collections .category-view-options button[aria-pressed="true"] b { color: #98ec67; }
#collections [data-category-view-status] { min-width: 82px; margin: 0; color: #4f654f; font-size: .7rem; text-align: right; }
#collections [data-category-view-status].is-saving { color: #8a6a00; }
#collections [data-category-view-status].is-error { color: #a02e22; }

#collections .collection-viewport { width: 100%; margin-top: clamp(25px, 3.2vw, 52px); overflow: hidden; }
#collections .collection-showcase-stage { display: none; }
#collections .collection-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  transition: opacity .24s ease, transform .24s ease;
}

#collections.is-view-changing .collection-grid { animation: category-view-in .34s cubic-bezier(.2,.7,.2,1); }
@keyframes category-view-in {
  from { opacity: .25; transform: translateY(14px) scale(.99); }
  to { opacity: 1; transform: none; }
}

#collections .collection-card {
  position: relative;
  min-width: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
  transform: none;
  transition: transform .26s ease, filter .26s ease, box-shadow .26s ease;
}

#collections .collection-card:focus-visible { outline: 3px solid var(--category-green); outline-offset: -3px; z-index: 5; }
#collections .collection-card:hover .collection-image { transform: scale(1.018); }
#collections .collection-card.active,
#collections .collection-card.is-browsing { z-index: 3; }
#collections .collection-card.active .collection-meta b,
#collections .collection-card.is-browsing .collection-meta b { color: #257f16; }

#collections .collection-number {
  position: absolute;
  top: 18px;
  right: 20px;
  z-index: 4;
  font: 700 .68rem/1 'Cannabus Display', Arial, sans-serif;
  letter-spacing: .12em;
  opacity: .78;
}

#collections .collection-word { display: none; }
#collections .collection-image {
  position: relative;
  width: 100%;
  height: clamp(245px, 23vw, 430px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  background: #020403;
  transition: transform .36s cubic-bezier(.2,.7,.2,1);
}

#collections .collection-crop {
  position: relative;
  display: block;
  width: min(100%, calc(var(--crop-width) * 1px));
  aspect-ratio: var(--crop-width) / var(--crop-height);
  overflow: hidden;
  flex: none;
}

#collections .collection-crop img {
  display: block;
  position: absolute;
  width: var(--image-width);
  max-width: none;
  height: auto;
  left: var(--image-left);
  top: var(--image-top);
  user-select: none;
  pointer-events: none;
}

#collections .collection-light-art {
  position: absolute;
  inset: 0;
  display: none;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  pointer-events: none;
}

#collections .collection-light-art img { display: block; max-width: none; object-fit: contain; filter: drop-shadow(0 22px 20px rgba(20, 40, 20, .18)); }
#collections .collection-light-flower img { width: min(112%, 760px); height: 112%; object-position: 50% 76%; }
#collections .collection-light-prerolls img { width: 38%; height: 92%; margin-inline: -7.5%; object-position: center bottom; }
#collections .collection-light-prerolls img:nth-child(2) { z-index: 2; transform: translateY(-2%); }
#collections .collection-light-edibles img { width: 47%; height: 82%; margin-inline: -11%; object-position: center bottom; }
#collections .collection-light-edibles img:nth-child(2) { z-index: 2; transform: translateY(-3%); }

#collections .collection-meta {
  position: relative;
  z-index: 4;
  min-height: 112px;
  padding: 22px clamp(20px, 2vw, 34px);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 4px 20px;
  border: 0;
  background: #fff;
  color: var(--category-ink);
  text-align: left;
}

#collections .collection-meta b {
  display: block;
  font-family: 'Cannabus Display', Arial, sans-serif;
  font-size: clamp(1.55rem, 2vw, 2.3rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

#collections .collection-meta small { display: block; grid-column: 1; color: #5d665e; font-size: clamp(.78rem, .86vw, .96rem); line-height: 1.35; }
#collections .collection-meta em {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #31512e;
  font-family: 'Cannabus Display', Arial, sans-serif;
  font-size: .67rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
#collections .collection-meta i { color: #31931f; font-family: Arial, sans-serif; font-size: 1.4rem; font-style: normal; transition: transform .2s ease; }
#collections .collection-card:hover .collection-meta i { transform: translate(3px, -3px); }

#collections .collection-pager {
  width: min(100% - 48px, 1760px);
  margin: 22px auto 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}
#collections .collection-pager button {
  width: 44px;
  height: 44px;
  border: 1px solid #aab2a8;
  background: transparent;
  color: inherit;
  font-size: 1.15rem;
  cursor: pointer;
}
#collections .collection-pager button:hover,
#collections .collection-pager button:focus-visible { background: #153d1c; border-color: #153d1c; color: #fff; outline: 0; }
#collections .collection-pager span { min-width: 58px; color: #6b746a; font: 700 .72rem/1 'Cannabus Display', Arial, sans-serif; letter-spacing: .09em; text-align: center; }
#collections .collection-pager b { color: #247b17; }

/* 01 — one continuous black product banner with a single white caption rail. */
#collections[data-category-view="showcase"] { padding-bottom: 0; }
#collections[data-category-view="showcase"] .collection-viewport { border-top: 2px solid #71d33d; }
#collections[data-category-view="showcase"] .collection-showcase-stage {
  position: relative;
  height: clamp(250px, 18.46vw, 378px);
  display: block;
  overflow: hidden;
  background: #020403;
}
#collections[data-category-view="showcase"] .collection-showcase-stage > img {
  position: absolute;
  top: -47.1%;
  left: 0;
  width: 100%;
  max-width: none;
  height: auto;
  pointer-events: none;
  user-select: none;
}
#collections[data-category-view="showcase"] .collection-showcase-hotspots {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#collections[data-category-view="showcase"] .collection-showcase-hotspots button {
  position: relative;
  border: 0;
  background: transparent;
  cursor: pointer;
}
#collections[data-category-view="showcase"] .collection-showcase-hotspots button::after {
  content: '';
  position: absolute;
  inset: 10px;
  border: 1px solid transparent;
  transition: border-color .22s ease, background .22s ease;
}
#collections[data-category-view="showcase"] .collection-showcase-hotspots button:hover::after,
#collections[data-category-view="showcase"] .collection-showcase-hotspots button:focus-visible::after,
#collections[data-category-view="showcase"] .collection-showcase-hotspots button.active::after {
  border-color: rgba(126, 225, 73, .76);
  background: linear-gradient(180deg, transparent 70%, rgba(71, 157, 35, .1));
}
#collections[data-category-view="showcase"] .collection-showcase-hotspots button:focus-visible { outline: 0; }
#collections[data-category-view="showcase"] .collection-grid {
  background: #fff;
  border-bottom: 1px solid #dfe3dd;
}
#collections[data-category-view="showcase"] .collection-card {
  border-right: 1px solid #cfd4ce;
  background: #fff;
}
#collections[data-category-view="showcase"] .collection-card:last-child { border-right: 0; }
#collections[data-category-view="showcase"] .collection-image,
#collections[data-category-view="showcase"] .collection-number,
#collections[data-category-view="showcase"] .collection-word { display: none; }
#collections[data-category-view="showcase"] .collection-meta {
  min-height: 130px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-align: center;
}
#collections[data-category-view="showcase"] .collection-meta b { font-size: clamp(1.65rem, 2.15vw, 2.55rem); text-align: center; }
#collections[data-category-view="showcase"] .collection-meta b::after { content: '↗'; margin-left: 12px; color: #47b827; font-family: Arial, sans-serif; font-size: .86em; font-weight: 500; }
#collections[data-category-view="showcase"] .collection-meta small { color: #5b625b; font-size: clamp(.9rem, 1.1vw, 1.15rem); text-align: center; }
#collections[data-category-view="showcase"] .collection-meta em { display: none; }
#collections[data-category-view="showcase"] .collection-card:hover,
#collections[data-category-view="showcase"] .collection-card.active,
#collections[data-category-view="showcase"] .collection-card.is-browsing { background: #f2faee; box-shadow: inset 0 -4px 0 #71d33d; }
#collections[data-category-view="showcase"] .collection-pager { display: none; }

/* 02 — quiet asymmetric editorial layout on a soft shelf-like field. */
#collections[data-category-view="editorial"] .collection-viewport { width: min(100% - 48px, 1760px); margin-inline: auto; }
#collections[data-category-view="editorial"] .collection-grid { grid-template-columns: 1.16fr .84fr; grid-template-rows: repeat(2, minmax(260px, 1fr)); gap: 18px; }
#collections[data-category-view="editorial"] .collection-card {
  min-height: 290px;
  background: radial-gradient(circle at 80% 15%, rgba(255,255,255,.95), transparent 30%), linear-gradient(138deg, #e8e5dd 0%, #f7f7f3 58%, #dfe6dc 100%);
  border: 1px solid #dfe3dc;
}
#collections[data-category-view="editorial"] .collection-card:first-child { grid-row: 1 / span 2; min-height: 610px; }
#collections[data-category-view="editorial"] .collection-image { height: 100%; min-height: 290px; background: transparent; }
#collections[data-category-view="editorial"] .collection-card:first-child .collection-image { min-height: 610px; }
#collections[data-category-view="editorial"] .collection-crop { display: none; }
#collections[data-category-view="editorial"] .collection-light-art { display: flex; }
#collections[data-category-view="editorial"] .collection-word {
  position: absolute;
  top: 28px;
  left: 30px;
  z-index: 3;
  display: block;
  color: rgba(10, 53, 24, .11);
  font: 900 clamp(2.7rem, 6vw, 7rem)/.84 'Cannabus Display', Arial, sans-serif;
  letter-spacing: -.04em;
}
#collections[data-category-view="editorial"] .collection-meta {
  position: absolute;
  inset: auto 22px 22px;
  min-height: 92px;
  padding: 18px 20px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 35px rgba(10, 30, 15, .12);
  backdrop-filter: blur(8px);
}
#collections[data-category-view="editorial"] .collection-number { color: #236f1a; }
#collections[data-category-view="editorial"] .collection-card.active,
#collections[data-category-view="editorial"] .collection-card.is-browsing { box-shadow: 0 0 0 3px #63bf35, 0 22px 52px rgba(24, 75, 18, .14); }

/* 03 — high-energy campaign panels with supplied product cutouts. */
#collections[data-category-view="color"] .collection-viewport { width: min(100% - 48px, 1760px); margin-inline: auto; }
#collections[data-category-view="color"] .collection-grid { gap: 8px; }
#collections[data-category-view="color"] .collection-card { min-height: clamp(470px, 37vw, 650px); isolation: isolate; }
#collections[data-category-view="color"] .collection-card:nth-child(1) { background: linear-gradient(145deg, #00d4d4 0 54%, #fb4a26 54%); }
#collections[data-category-view="color"] .collection-card:nth-child(2) { background: linear-gradient(145deg, #fc25a9 0 49%, #833cff 49%); }
#collections[data-category-view="color"] .collection-card:nth-child(3) { background: linear-gradient(145deg, #b3ed28 0 52%, #ff791b 52%); }
#collections[data-category-view="color"] .collection-image { height: 100%; min-height: clamp(470px, 37vw, 650px); background: transparent; }
#collections[data-category-view="color"] .collection-crop { display: none; }
#collections[data-category-view="color"] .collection-light-art { display: flex; }
#collections[data-category-view="color"] .collection-word {
  position: absolute;
  top: 28px;
  left: 24px;
  right: 20px;
  z-index: 3;
  display: block;
  overflow: hidden;
  color: rgba(255,255,255,.92);
  font: 900 clamp(2.2rem, 4.6vw, 5.2rem)/.85 'Cannabus Display', Arial, sans-serif;
  letter-spacing: -.055em;
  white-space: nowrap;
}
#collections[data-category-view="color"] .collection-number { color: #07130a; }
#collections[data-category-view="color"] .collection-meta {
  position: absolute;
  inset: auto 18px 18px;
  min-height: 102px;
  background: rgba(4, 7, 5, .93);
  color: #fff;
  box-shadow: 0 16px 34px rgba(0,0,0,.24);
}
#collections[data-category-view="color"] .collection-meta small { color: #d9e2d7; }
#collections[data-category-view="color"] .collection-meta em { color: #a4e97b; }
#collections[data-category-view="color"] .collection-card.active,
#collections[data-category-view="color"] .collection-card.is-browsing { transform: translateY(-7px); filter: saturate(1.12); box-shadow: 0 20px 44px rgba(0, 0, 0, .2); }

/* 04 — dark product wall, close to the original draft. */
#collections[data-category-view="dark"] { background: #020403; color: #fff; }
#collections[data-category-view="dark"] .collections-heading-tools > p { color: #abb3ab; }
#collections[data-category-view="dark"] .collection-shortcut { border-color: #536055; color: #fff; }
#collections[data-category-view="dark"] .collection-shortcut:hover { background: #122416; border-color: #8ad957; }
#collections[data-category-view="dark"] .category-view-editor { background: #0b130c; border-color: #345938; color: #fff; }
#collections[data-category-view="dark"] .category-view-editor-copy small,
#collections[data-category-view="dark"] [data-category-view-status] { color: #a7b7a6; }
#collections[data-category-view="dark"] .category-view-options button { background: #111612; border-color: #3a443b; color: #fff; }
#collections[data-category-view="dark"] .category-view-options button[aria-pressed="true"] { background: #72d13b; border-color: #72d13b; color: #071008; }
#collections[data-category-view="dark"] .collection-grid { width: min(100% - 48px, 1760px); margin-inline: auto; gap: 18px; }
#collections[data-category-view="dark"] .collection-card { background: #000; }
#collections[data-category-view="dark"] .collection-image { height: clamp(255px, 23vw, 420px); }
#collections[data-category-view="dark"] .collection-number { color: #8fe65b; }
#collections[data-category-view="dark"] .collection-meta { min-height: 98px; background: #020403; color: #fff; text-align: center; }
#collections[data-category-view="dark"] .collection-meta b { text-align: center; }
#collections[data-category-view="dark"] .collection-meta small { color: #cad1c9; text-align: center; }
#collections[data-category-view="dark"] .collection-meta em { display: none; }
#collections[data-category-view="dark"] .collection-card.active,
#collections[data-category-view="dark"] .collection-card.is-browsing { box-shadow: inset 0 0 0 2px #77da40; }
#collections[data-category-view="dark"] .collection-pager span { color: #aab2aa; }
#collections[data-category-view="dark"] .collection-pager button { border-color: #3b443c; color: #fff; }

#wholesaleBenefits { display: block; width: var(--shell); margin: 0 auto; }

@media (max-width: 980px) {
  #collections .category-view-editor { grid-template-columns: 1fr; align-items: start; }
  #collections [data-category-view-status] { position: absolute; right: 20px; top: 17px; }
  #collections .category-view-editor { position: relative; }
  #collections .category-view-options { flex-wrap: wrap; }
  #collections .collections-heading-tools { max-width: 310px; }
  #collections .collection-meta em { display: none; }
  #collections .collection-meta { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  #collections { padding-top: 38px; }
  #collections .collections-heading { width: calc(100% - 36px); display: block; }
  #collections .collections-heading-tools { max-width: none; margin-top: 22px; }
  #collections .category-view-editor { width: calc(100% - 36px); margin-top: 24px; padding: 16px; }
  #collections .category-view-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  #collections .category-view-options button { padding-inline: 8px; }
  #collections .collection-viewport,
  #collections[data-category-view="editorial"] .collection-viewport,
  #collections[data-category-view="color"] .collection-viewport { width: 100%; overflow: visible; }
  #collections .collection-grid,
  #collections[data-category-view="editorial"] .collection-grid,
  #collections[data-category-view="color"] .collection-grid,
  #collections[data-category-view="dark"] .collection-grid {
    width: 100%;
    margin-inline: 0;
    padding-inline: 18px;
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  #collections .collection-grid::-webkit-scrollbar { display: none; }
  #collections .collection-card,
  #collections[data-category-view="editorial"] .collection-card,
  #collections[data-category-view="editorial"] .collection-card:first-child,
  #collections[data-category-view="color"] .collection-card {
    flex: 0 0 min(82vw, 430px);
    min-height: 0;
    scroll-snap-align: center;
  }
  #collections .collection-image,
  #collections[data-category-view="editorial"] .collection-image,
  #collections[data-category-view="editorial"] .collection-card:first-child .collection-image,
  #collections[data-category-view="color"] .collection-image { height: min(74vw, 390px); min-height: min(74vw, 390px); }
  #collections[data-category-view="editorial"] .collection-meta,
  #collections[data-category-view="color"] .collection-meta { inset: auto 14px 14px; }
  #collections .collection-meta { min-height: 96px; padding: 18px; }
  #collections .collection-meta b { font-size: 1.55rem; }
  #collections .collection-pager { width: calc(100% - 36px); justify-content: center; }
  #collections[data-category-view="showcase"] { padding-bottom: 34px; }
  #collections[data-category-view="showcase"] .collection-viewport { border-top: 2px solid #71d33d; }
  #collections[data-category-view="showcase"] .collection-showcase-stage { display: none; }
  #collections[data-category-view="showcase"] .collection-grid { padding-block: 14px; background: #020403; border-bottom: 0; }
  #collections[data-category-view="showcase"] .collection-card { border: 0; background: #020403; }
  #collections[data-category-view="showcase"] .collection-image { display: flex; }
  #collections[data-category-view="showcase"] .collection-number { display: block; color: #8fe65b; }
  #collections[data-category-view="showcase"] .collection-meta { min-height: 96px; align-items: flex-start; text-align: left; }
  #collections[data-category-view="showcase"] .collection-meta b,
  #collections[data-category-view="showcase"] .collection-meta small { text-align: left; }
  #collections[data-category-view="showcase"] .collection-pager { display: flex; }
}

@media (max-width: 480px) {
  #collections .collections-heading h2 { font-size: 3rem; }
  #collections .collections-heading-tools > p { font-size: .84rem; }
  #collections .category-view-editor-copy { padding-right: 70px; }
  #collections .collection-card,
  #collections[data-category-view="editorial"] .collection-card,
  #collections[data-category-view="editorial"] .collection-card:first-child,
  #collections[data-category-view="color"] .collection-card { flex-basis: 86vw; }
  #collections .collection-light-prerolls img { width: 43%; }
  #collections .collection-light-edibles img { width: 51%; }
}

@media (prefers-reduced-motion: reduce) {
  #collections,
  #collections *,
  #collections *::before,
  #collections *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
