/** Shopify CDN: Minification failed

Line 9:0 Unexpected "{"
Line 9:1 Expected identifier but found "%"
Line 10:0 Unexpected "="
Line 14:1 Expected identifier but found "%"

**/
{% comment %}
===============================================================================
File: assets/cc-card.css
Purpose: Styles for card/badges/notes/pills (collection grid).
===============================================================================
{% endcomment %}

/* =================
   CARD – BASE
   ================= */
.cc-card{
  background:#fff;border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;height:100%;
  box-shadow:0 10px 28px rgba(0,0,0,.06);
  transition: box-shadow .25s ease, transform .25s ease;
}
.cc-card:hover{ transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0,0,0,.10); }

.cc-card__media{ position:relative; display:block; isolation:isolate; }
.cc-card__img{ width:100%; height:auto; display:block; aspect-ratio:4/5; object-fit:cover; }
.cc-card__img--placeholder{ background:#f6f6f6; aspect-ratio:4/5; }

.cc-card__body{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:8px; }
.cc-card__title{ margin:0; font-size:1.02rem; line-height:1.25; font-weight:800; }
.cc-card__title a{ color:inherit; text-decoration:none; }

/* parent so overlays can anchor to image */
.cc-card__media-wrap{ position:relative; display:block; isolation:isolate; }

/* =================
   BADGES (Men / All-Weather)
   ================= */
.cc-card__badges{
  position:absolute; top:12px; left:12px; right:12px;
  display:flex; gap:12px; align-items:flex-start;
  pointer-events:none; z-index:6;
  justify-content: space-between;
}
.cc-card__badges .cc-badge{
  pointer-events:auto;
  flex:0 0 auto;
  white-space:nowrap;
}
.cc-card__badges .cc-badge--weather{ margin-left:auto; }

.cc-badge{
  /* padding bumped to avoid text touching the border */
  padding:.50rem 1.00rem; border-radius:999px;
  background:rgba(255,255,255,.98);
  border:1px solid #dedede;
  color:#111; font-weight:800; font-size:.92rem;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  letter-spacing:.2px;
  line-height:1;
}
.cc-badge--dark{ background:#111; color:#fff; border-color:#111; opacity:.95; }

/* =================
   PRICE + SIZE
   ================= */
.cc-card__price-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cc-price--sale{ color:#ff4d2f; font-weight:900; }
.cc-price--compare{ opacity:.55; }
.cc-pill{ border:1px solid #e7e7e7; border-radius:999px; padding:.25rem .6rem; background:#fff; font-size:.85rem; }

/* =================
   NOTES + META
   ================= */
.cc-card__notes{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:14px; }
.cc-chip{
  display:inline-flex; align-items:center; line-height:1;
  padding:.60rem 1.05rem; font-size:1.05rem;
  font-weight:800; background:#f6f7f9; border:0; border-radius:999px;
  box-shadow:0 3px 12px rgba(0,0,0,.06); letter-spacing:.2px;
}

/* bigger on desktop */
@media (min-width:1200px){
  .cc-chip{ font-size:1.10rem; padding:.68rem 1.15rem; }
}

/* =================
   CTA BUTTON
   ================= */
.cc-card__cta{ margin-top:10px; display:flex; }
.cc-btn{ appearance:none; border:0; border-radius:12px; padding:.8rem 1.2rem; font-weight:800; cursor:pointer; }

.cc-btn--primary{
  width:100%; padding:1rem 1.2rem; font-weight:800; font-size:1rem;
  background:#ff4d2f; color:#fff; box-shadow:0 10px 22px rgba(255,77,47,.25);
  transform:scale(1); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.cc-btn--primary:hover, .cc-btn--primary:focus-visible, .cc-card:hover .cc-btn--primary{
  transform:scale(1.03); box-shadow:0 14px 28px rgba(255,77,47,.30);
}
.cc-btn--primary:active{ transform:scale(.98); }
@media (prefers-reduced-motion: reduce){ .cc-btn--primary{ transition:none; } }

/* Hide legacy overlay quick add if any */
.cc-quick-add{ display:none; }

/* =================
   GRID HELPERS (Dawn)
   ================= */
.collection .product-grid .grid__item{ width:auto !important; max-width:none !important; }
.collection .product-grid .card-wrapper{ max-width:none !important; margin:0 !important; }

@media (min-width:990px){
  .collection .product-grid.grid--3-col-desktop{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; }
}
@media (max-width:989px){
  .collection .product-grid.grid--2-col-tablet-down{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
}

/* =================
   “NOTES” LINE LIKE TEXT (borderless)
   ================= */
.cc-card__notes .cc-chip{
  background:transparent; border:0; box-shadow:none;
  padding:.32rem .70rem; font-size:1.06rem; font-weight:600;
}
@media (max-width:989px){ .cc-card__notes .cc-chip{ font-size:1.02rem; } }
@media (max-width:749px){ .cc-card__notes .cc-chip{ font-size:.98rem; } }

/* =================
   INSPIRED BY – pill below title
   ================= */
.cc-card__inspired{ margin-top:2px; }
.cc-pill--inspired{
  background:#fff;
  border:1px solid rgba(0,0,0,.18);
  box-shadow:0 6px 16px rgba(0,0,0,.07);
  border-radius:999px;
  padding:.42rem .78rem;
  font-weight:600;
}
.cc-link{ color:#ff4d2f; text-decoration:none; font-weight:700; }

/* =================
   BRAND FONTS
   ================= */
:root{
  --brand-heading: "Roboto Condensed", sans-serif;
  --brand-body: "Roboto Condensed", sans-serif;
}
html, body{ font-family:var(--brand-body) !important; }
h1,h2,h3,h4,h5,h6,
.product__title,
.collection-hero__title,
.card-information__text,
.price__sale,
.button,.btn,.cc-btn{
  font-family:var(--brand-heading) !important;
  letter-spacing:.02em;
}
.cc-card__title{
  font-family:var(--brand-heading) !important;
  font-weight:700;
}

/* ===============================
   COLLECTION GRID – LIGHTER TYPE
   =============================== */
.collection .cc-card,
.collection .cc-card *{
  font-family: var(--font-body-family) !important;
}
.collection .cc-card .cc-card__title,
.collection .cc-card .cc-card__title a{
  font-weight:600 !important;
  letter-spacing:.2px;
  color:#111;
}
.collection .cc-card .cc-chip,
.collection .cc-card .cc-card__meta,
.collection .cc-card .cc-card__notes,
.collection .cc-card .cc-pill,
.collection .cc-card .notes-chip,
.collection .cc-card .notes-item{
  font-weight:400 !important;
}
.collection .cc-card .cc-badge,
.collection .cc-card .cc-badge--dark{ font-weight:500 !important; }
.collection .cc-card .cc-price--sale{ font-weight:700 !important; }
.collection .cc-card .cc-btn--primary,
.collection .cc-card .cc-btn--overlay{ font-weight:700 !important; }

/* ============================================
   BIGGER TYPE SCALE FOR COLLECTION CARDS
   ============================================ */
.collection .cc-card{
  --cc-title:   1.30rem;
  --cc-badge:   1.06rem;
  --cc-notes:   1.10rem;
  --cc-pill:    1.06rem;
  --cc-price:   1.16rem;
  --cc-compare: 1.02rem;
  --cc-btn:     1.06rem;
}
.collection .cc-card .cc-card__title{ font-size: var(--cc-title) !important; }
.collection .cc-card .cc-badge,
.collection .cc-card .cc-badge--dark{ font-size: var(--cc-badge) !important; }
.collection .cc-card .cc-card__notes .cc-chip{ font-size: var(--cc-notes) !important; }
.collection .cc-card .cc-card__inspired .cc-pill{ font-size: var(--cc-pill) !important; padding:.46rem .90rem; border-radius:999px; }
.collection .cc-card .cc-price--sale,
.collection .cc-card .cc-price > span:not(.cc-price--compare){ font-size: var(--cc-price) !important; }
.collection .cc-card .cc-price--compare{ font-size: var(--cc-compare) !important; }
.collection .cc-card .cc-btn--primary{ font-size: var(--cc-btn) !important; }

@media (max-width: 989px){
  .collection .cc-card{
    --cc-title:   1.22rem;
    --cc-badge:   1.02rem;
    --cc-notes:   1.06rem;
    --cc-pill:    1.02rem;
    --cc-price:   1.12rem;
    --cc-compare: 1.00rem;
    --cc-btn:     1.04rem;
  }
}
@media (max-width: 749px){
  .collection .cc-card{
    --cc-title:   1.16rem;
    --cc-badge:   1.00rem;
    --cc-notes:   1.02rem;
    --cc-pill:    1.00rem;
    --cc-price:   1.08rem;
    --cc-compare: .98rem;
    --cc-btn:     1.02rem;
  }
}

/* =========================================
   MOBILE – 1-CARD LIST LAYOUT (image left, compact)
   ========================================= */
.collection .product-grid { display: grid; }

@media (max-width: 749px){

  .collection .product-grid{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .cc-card{
    flex-direction: row;
    align-items: stretch;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(0,0,0,.06);
    padding: 10px;
    gap: 10px;
    box-sizing: border-box;
  }

  .cc-card__media-wrap{
    flex: 0 0 36%;
    max-width: 36%;
    display: flex;
    flex-direction: column;
    background: transparent;
    padding: 0;
  }

  .cc-card__badges{
    position: static !important;
    order: 0;
    margin: 0 2px 6px !important;
    padding: 0;
    display: flex !important;
    gap: 8px;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    width: 100%;
    background: transparent !important; /* make sure no pill bg on mobile either */
    border: 0 !important;
    box-shadow: none !important;
  }

  .cc-badge{
    font-size: .85rem;
    padding: .32rem .68rem;
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
  }

  .cc-card__media{ order: 1; }
  .cc-card__img{
    width: 100%;
    height: auto !important;
    aspect-ratio: 4 / 3;
    max-height: 180px;
    object-fit: cover;
    border-radius: 12px;
  }

  .cc-card__body{
    flex: 1;
    padding: 6px 6px 8px;
    gap: 6px;
    display: flex;
    flex-direction: column;
  }

  .cc-card__title{
    font-size: 1.02rem !important;
    line-height: 1.22;
    font-weight: 700 !important;
    margin: 0 0 2px;
  }

  .cc-card__inspired{ margin-top: 0; }
  .cc-card__inspired .cc-pill{
    padding: .16rem .44rem;
    font-size: .86rem !important;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.15);
    box-shadow: 0 4px 12px rgba(0,0,0,.05);
    background: #fff;
  }

  .cc-card__notes{ gap: 6px; margin-top: 6px; }
  .cc-card__notes .cc-chip{
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    font-size: .90rem !important;
    letter-spacing: .2px;
  }

  .cc-card__price-row{
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
  }
  .cc-price--sale,
  .cc-price > span:not(.cc-price--compare){
    font-size: 1.00rem !important;
    font-weight: 700 !important;
  }
  .cc-price--compare{ font-size: .92rem !important; }

  .cc-pill{ padding: .18rem .48rem; font-size: .86rem; }

  .cc-card__cta{ margin-top: auto; }
  .cc-btn--primary{
    background: transparent;
    color: #ff4d2f;
    border: 2px solid #ff4d2f;
    box-shadow: none;
    padding: .6rem .8rem;
    border-radius: 12px;
    font-size: .92rem !important;
  }
  .cc-btn--primary:hover,
  .cc-btn--primary:focus-visible{
    background: #ff4d2f;
    color: #fff;
  }
}

/* MOBILE — slightly taller card */
@media (max-width: 749px){
  .cc-card{ padding: 14px; gap: 12px; }
  .cc-card__media-wrap{ flex: 0 0 40%; max-width: 40%; }
  .cc-card__img{ aspect-ratio: 4 / 3; max-height: 220px; }
  .cc-card__body{ padding: 10px 10px 12px; gap: 8px; }
  .cc-card__title{ font-size: 1.12rem !important; }
  .cc-card__inspired .cc-pill{ font-size: .92rem !important; padding: .24rem .60rem; }
  .cc-price--sale,
  .cc-price > span:not(.cc-price--compare){ font-size: 1.06rem !important; }
  .cc-btn--primary{ padding: .72rem 1rem; font-size: .96rem !important; }
}

/* ==== MOBILE IMAGE FILL ==== */
@media (max-width: 749px){
  .cc-card__media-wrap{
    flex: 0 0 40% !important;
    max-width: 40% !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    background: transparent !important;
  }
  .cc-card__media{
    order: 1;
    flex: 1 1 auto !important;
    display: block !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    height: auto !important;
  }
  .cc-card__img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    aspect-ratio: auto !important;
    max-height: none !important;
    border-radius: 12px !important;
  }
}

/* === Brand accent override (example) === */
:root{
  --ny-accent: 15,109,122;
  --ny-accent-hex: #0F6D7A;
}
.cc-price--sale,
.cc-link { color: var(--ny-accent-hex) !important; }
.cc-btn--primary{
  background: var(--ny-accent-hex) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(var(--ny-accent), .25) !important;
}
.cc-btn--primary:hover,
.cc-btn--primary:focus-visible,
.cc-card:hover .cc-btn--primary{
  box-shadow: 0 14px 28px rgba(var(--ny-accent), .30) !important;
}
@media (max-width: 749px){
  .cc-btn--primary{
    background: transparent !important;
    color: var(--ny-accent-hex) !important;
    border-color: var(--ny-accent-hex) !important;
  }
  .cc-btn--primary:hover,
  .cc-btn--primary:focus-visible{
    background: var(--ny-accent-hex) !important;
    color: #fff !important;
  }
}
.badge--sale,
.badge[aria-label="Sale"]{
  background: rgba(var(--ny-accent), .12) !important;
  border-color: rgba(var(--ny-accent), .35) !important;
  color: var(--ny-accent-hex) !important;
}

/* ============================================================================
   HARD OVERRIDE: remove any pill styling on the *wrapper* and pin badges on desktop
   ============================================================================ */
.collection .cc-card__badges{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

/* Desktop/tablet: overlay & pin left/right */
@media (min-width: 990px){
  .collection .cc-card__media-wrap{ position: relative !important; }
  .collection .cc-card__badges{
    position: absolute !important;
    top: 0; left: 0; right: 0;
    height: 0;           /* use only the top edge */
    display: block !important;
    pointer-events: none;
  }
  .collection .cc-card__badges .cc-badge{
    position: absolute !important;
    margin: 0 !important;
    pointer-events: auto;
    max-width: 45%;
  }
  .collection .cc-card__badges .cc-badge--audience{ top:12px !important; left:12px !important; }
  .collection .cc-card__badges .cc-badge--weather{  top:12px !important; right:12px !important; left:auto !important; }
}
/* === FINAL MOBILE FIX (wins over all desktop overrides) === */
@media (max-width: 749px){
  /* keep the wrapper in normal flow above the image */
  .collection .cc-card .cc-card__badges{
    position: static !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 2px 8px !important;
    padding: 0 !important;

    /* ensure no pill-like background on the wrapper itself */
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  /* badges should behave like inline pills on one line */
  .collection .cc-card .cc-card__badges .cc-badge{
    position: static !important;   /* cancel the desktop absolute pins */
    max-width: none !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }
}