/** Shopify CDN: Minification failed

Line 282:0 Unexpected "}"
Line 299:0 Unexpected "}"
Line 308:0 Unexpected "}"

**/
.sam-mosaic { padding: var(--sam-paddingY, 18px) 0; }
.sam-mosaic__inner { max-width: 1400px; margin: 0 auto; padding: 0 16px; }

.sam-mosaic__titleLink { color: inherit; text-decoration: none; }
.sam-mosaic__titleLink:hover { text-decoration: underline; }

.sam-mosaic__grid{
  display: grid;
  gap: var(--sam-gap, 10px);
  grid-template-columns: repeat(var(--sam-cols, 4), minmax(0, 1fr));
}
@media (min-width: 990px){ .sam-mosaic__grid { --sam-cols: var(--sam-cols-desktop, 4); } }
@media (max-width: 989px){ .sam-mosaic__grid { --sam-cols: var(--sam-cols-mobile, 2); } }

.sam-mosaic__tile{
    /* perf: isolate layout/paint work per tile (helps scroll smoothness) */
  contain: layout paint;
position: relative;
  overflow: hidden;
  border-radius: var(--sam-radius, 16px);
  background: rgba(0,0,0,0.06);
  aspect-ratio: var(--sam-ar, 1/1);
  display: block;
  transform: translateZ(0);
  text-decoration: none;
  color: inherit;
}
.sam-mosaic__tile:focus-visible{
  outline: 2px solid rgba(255,255,255,0.35);
  outline-offset: 2px;
}

.sam-mosaic__img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: var(--sam-fit, cover);
  object-position: var(--sam-pos, center);
  background: var(--sam-contain-bg, #000);
  will-change: transform, filter;
  transform: scale(1);
  transition: transform 240ms ease, filter 220ms ease;
}

/* GRAY MODE */
.sam-mosaic.sam-mosaic--gray .sam-mosaic__img{
  filter: grayscale(var(--sam-gray-amount, 100%));
}
.sam-mosaic.sam-mosaic--gray .sam-mosaic__tile:hover .sam-mosaic__img,
.sam-mosaic.sam-mosaic--gray .sam-mosaic__tile.is-active .sam-mosaic__img{
  filter: grayscale(0%);
}

.sam-mosaic__tile:hover .sam-mosaic__img{ transform: scale(1.02); }

/* Black veil */
.sam-mosaic__veil{
  position:absolute; inset:0;
  background: #000;
  opacity: 0;
  transition: opacity var(--sam-blackfade, 900ms) ease-in-out;
  pointer-events: none;
  will-change: opacity;
}
.sam-mosaic__veil.is-on{ opacity: 1; }

/* Overlay */
.sam-mosaic__overlay{
  position:absolute; inset:0;
  opacity: 0;
  transition: opacity 180ms ease;
  background: rgba(0,0,0,0.18);
  pointer-events: none;
}
.sam-mosaic__tile:hover .sam-mosaic__overlay,
.sam-mosaic__tile.is-active .sam-mosaic__overlay{
  opacity: 1;
  pointer-events: auto;
}

/* PRODUCT NAME (above price) */
.sam-mosaic__pname{
  position:absolute;
  left:50%;
  top:58%;
  transform: translate(-50%, -50%);
  text-align:center;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #ffffff;
  text-shadow: 0 2px 12px rgba(0,0,0,0.55);
  line-height: 1.15;
  padding: 6px 10px;
  border-radius: 10px;
  background: rgba(0,0,0,0.22);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  max-width: calc(100% - 22px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}

/* PRICE at 2/3 */
.sam-mosaic__price{
  position:absolute;
  left:50%;
  top:66.666%;
  transform: translate(-50%, -50%);
  text-align:center;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #FAAB00;
  text-shadow: 0 2px 10px rgba(0,0,0,0.45);
  line-height: 1.1;
  padding: 6px 10px;
  border-radius: 10px;
  background: rgba(0,0,0,0.25);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.sam-mosaic__priceWas{
  display:inline-block;
  font-weight:700;
  opacity:0.85;
  text-decoration: line-through;
  margin-right: 8px;
}
.sam-mosaic__priceNow{
  display:inline-block;
  font-weight:900;
}

/* Buttons bottom row */
.sam-mosaic__btnRow{
  position:absolute;
  left:50%;
  bottom:12px;
  transform: translateX(-50%);
  display:flex;
  gap:10px;
  justify-content:center;
  align-items:center;
  width: calc(100% - 18px);
  max-width: 360px;
}
.sam-mosaic__btn{
  appearance:none;
  border:none;
  cursor:pointer;
  padding:10px 12px;
  border-radius: var(--sam-btn-radius, 6px);
  font-weight:800;
  letter-spacing:0.02em;
  text-transform:uppercase;
  font-size:12px;
  line-height:1;
  text-decoration:none;
  flex:1;
  text-align:center;
}
.sam-mosaic__view{
  background: var(--sam-btn-view-bg, #000);
  color: var(--sam-btn-view-txt, #FAAB00);
}
.sam-mosaic__atc{
  background: var(--sam-btn-atc-bg, #FAAB00);
  color: var(--sam-btn-atc-txt, #000);
}
.sam-mosaic__btn:disabled{ opacity: 0.75; cursor: not-allowed; }

/* NAV */
.sam-mosaic__nav{
  display:flex;
  justify-content:center;
  gap:10px;
}
.sam-mosaic__nav--header{ margin-top: 12px; }
.sam-mosaic__nav--footer{ margin-top: 14px; }

.sam-mosaic__navBtn{
  width: var(--sam-nav-w, 46px);
  height: var(--sam-nav-h, 38px);
  border-radius: var(--sam-nav-radius, 10px);
  border: 1px solid var(--sam-nav-border, rgba(255,255,255,0.18));
  background: var(--sam-nav-bg, rgba(255,255,255,0.08));
  cursor: pointer;
  font-size: var(--sam-nav-font, 24px);
  line-height: 1;
  font-weight: 900;
  color: var(--sam-nav-txt, #BDBDBD);
  transition: transform 120ms ease, background 160ms ease, border-color 160ms ease, opacity 160ms ease;
}
.sam-mosaic__navBtn:hover{ background: rgba(255,255,255,0.12); }
.sam-mosaic__navBtn:active{ transform: translateY(1px); }
.sam-mosaic__navBtn:focus-visible{
  outline: 2px solid rgba(250,171,0,0.55);
  outline-offset: 2px;
}


/* ===========================
   SAM – Mosaic ATC Added state
   =========================== */
.sam-mosaic__atc.is-added{
  background: #117a2f !important;
  color: #ffffff !important;
  border-color: #117a2f !important;
  cursor: default !important;
  opacity: 1 !important;
}
.sam-mosaic__atc.is-added:hover,
.sam-mosaic__atc.is-added:focus{
  background: #117a2f !important;
  color: #ffffff !important;
}
.sam-mosaic__atc.is-added[disabled]{
  pointer-events: none !important;
}


/* --- SAM FIX: prevent the collection hero image from taking the whole screen --- */
.collection-hero { max-height: 520px; overflow: hidden; }
@media (max-width: 768px){
  .collection-hero { max-height: 360px; }
}
/* Brooklyn uses a padding-bottom trick via ::after; cap it */
.collection-hero__image-wrapper::after { padding-bottom: 32% !important; }
@media (max-width: 768px){
  .collection-hero__image-wrapper::after { padding-bottom: 55% !important; }
}
.collection-hero__image { height: 100%; object-fit: cover; }


/* --- SAM FORCE: always 2 columns mobile and 3 columns desktop --- */
.sam-colmosaic__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
@media (min-width: 990px){
  .sam-colmosaic__grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}



/* --- SAM: Judge.me stars always visible (top of card) --- */
.sam-colmosaic__rating{
  position:absolute;
  top: var(--samcm-jdgm-top, 0px);
  left: var(--samcm-jdgm-left, 10px);
  transform: scale(var(--samcm-jdgm-scale-desktop, 0.8));
  transform-origin: top left;
  z-index:6;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  background: rgba(0,0,0,0.35);
  padding: 6px 10px;
  border-radius: 999px;
  max-width: calc(100% - 24px);
  white-space: nowrap;
}
.sam-colmosaic__rating .jdgm-prev-badge{
  margin:0 !important;
}
.sam-colmosaic__rating .jdgm-prev-badge__text{
  margin-left:6px !important;
  font-size:12px !important;
  line-height:1 !important;
}


  .sam-colmosaic__rating .jdgm-prev-badge__text{
    font-size: 10px !important;
  }
}


/* Judge.me markup can vary; force scaling on the whole badge */
  .sam-colmosaic__rating .jdgm-prev-badge{
    display: inline-flex !important;
    align-items: center !important;
    transform: scale(0.5) !important; /* half of current (badge already small) */
    transform-origin: center center !important;
  }

  /* If stars are separate element, also scale them */
  /* Some themes/apps set star size via font-size or SVG width */
  .sam-colmosaic__rating .jdgm-prev-badge__text{
    font-size: 9px !important;
    line-height: 1 !important;
  }
}


/* --- SAM: reduce Judge.me badge size on mobile (badge as a whole) --- */
/* Keep text readable but smaller (optional) */
  .sam-colmosaic__rating .jdgm-prev-badge__text{
    font-size: 10px !important;
    line-height: 1 !important;
  }
}


/* === SAM FIX: Judge.me badge scaling on mobile (scale the wrapper, not the injected badge) === */
}


/* ===========================
   SAM – Collection Mosaic ATC Added state (match Home Mosaic)
   =========================== */
.sam-colmosaic__atc.is-added{
  background: #117a2f !important;
  color: #ffffff !important;
  border-color: #117a2f !important;
  cursor: default !important;
  opacity: 1 !important;
}
.sam-colmosaic__atc.is-added:hover,
.sam-colmosaic__atc.is-added:focus{
  background: #117a2f !important;
  color: #ffffff !important;
}
.sam-colmosaic__atc.is-added[disabled]{
  pointer-events: none !important;
}
.sam-colmosaic__atc[data-busy="1"]{
  opacity: 0.85;
  cursor: progress;
}


/* Ensure Judge.me injected elements don't apply their own transforms */
.sam-colmosaic__rating .jdgm-prev-badge,
.sam-colmosaic__rating .jdgm-prev-badge__stars,
.sam-colmosaic__rating .jdgm-star,
.sam-colmosaic__rating .jdgm-star svg{
  transform: none !important;
}


/* --- SAM: Judge.me badge scale on mobile --- */

@media (max-width: 989px){
  .sam-colmosaic__rating{
    transform: scale(var(--samcm-jdgm-scale-mobile, 0.5));
    transform-origin: top left;
  }
}

/* ===========================
   SAM FIX — Collection Mosaic: square corners (no rounded edges)
   =========================== */

/* Tile + link */
.sam-colmosaic__tile,
.sam-colmosaic__tile a{
  border-radius: 0 !important;
}

/* Media wrappers + image */
.sam-colmosaic__media,
.sam-colmosaic__media img,
.sam-colmosaic__image,
.sam-colmosaic__image img,
.sam-colmosaic__tile img,
.sam-colmosaic__tile picture,
.sam-colmosaic__tile video{
  border-radius: 0 !important;
}

/* If any overlay/veil layer inherits radius, force square too */
.sam-colmosaic__overlay,
.sam-colmosaic__veil{
  border-radius: 0 !important;
}

/* ===========================
   SAM FIX — Collection Mosaic: 1px gap between cards
   =========================== */

.sam-colmosaic__grid{
  gap: 1px !important;
}

/* Safety for older layouts using margins */
.sam-colmosaic__tile{
  margin: 0 !important;
}