/* Comfortrek V274 — premium storefront cleanup / mobile commerce polish */

/* Clean, intentional surfaces — remove accidental theme/pattern colour patchwork. */
body.appearance-dark #storefront-home,
body.appearance-auto.appearance-dark #storefront-home{
  background:#0d1012!important;
  background-image:none!important;
}
body.appearance-light #storefront-home,
body.appearance-auto.appearance-light #storefront-home{
  background:#f7f5f0!important;
  background-image:none!important;
}

/* Product cards: stronger hierarchy without changing the existing feature set. */
#storefront-home .tag-card{
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
}
body.appearance-dark #storefront-home .tag-card,
body.appearance-auto.appearance-dark #storefront-home .tag-card{
  background:#15191c!important;
  border-color:rgba(255,255,255,.12)!important;
}
body.appearance-light #storefront-home .tag-card,
body.appearance-auto.appearance-light #storefront-home .tag-card{
  background:#fff!important;
  border-color:#e5e0d7!important;
}
#storefront-home .tag-image{
  flex:0 0 auto!important;
  aspect-ratio:1/1!important;
  background:#eeebe4!important;
  border-radius:14px!important;
  overflow:hidden!important;
}
body.appearance-dark #storefront-home .tag-image,
body.appearance-auto.appearance-dark #storefront-home .tag-image{
  background:#24282b!important;
}
#storefront-home .tag-card h3{
  min-height:2.55em!important;
  margin:12px 0 5px!important;
  line-height:1.27!important;
  font-size:clamp(.92rem,2.2vw,1.05rem)!important;
}
#storefront-home .tag-card .price{
  display:flex!important;
  align-items:baseline!important;
  flex-wrap:wrap!important;
  gap:5px!important;
  font-size:1rem!important;
  font-weight:800!important;
}
#storefront-home .tag-card .spec-line{
  min-height:2.9em!important;
  line-height:1.45!important;
  margin-top:5px!important;
  font-size:.68rem!important;
  opacity:.78!important;
}

/* CTA readability in every appearance mode. */
#storefront-home .tag-card .card-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 46px!important;
  gap:8px!important;
  margin-top:auto!important;
  padding-top:10px!important;
}
#storefront-home .tag-card .add-to-cart-btn{
  min-height:44px!important;
  border-radius:13px!important;
  background:#d8b97a!important;
  color:#171717!important;
  -webkit-text-fill-color:#171717!important;
  border:1px solid #ecd7aa!important;
  font-weight:850!important;
  letter-spacing:.01em!important;
  text-shadow:none!important;
  opacity:1!important;
}
#storefront-home .tag-card .add-to-cart-btn:hover,
#storefront-home .tag-card .add-to-cart-btn:focus-visible{filter:brightness(1.05);transform:translateY(-1px)}
#storefront-home .quick-view-btn{
  width:46px!important;
  min-width:46px!important;
  min-height:44px!important;
  border-radius:13px!important;
  background:#1c2022!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.18)!important;
  cursor:pointer!important;
}
body.appearance-light #storefront-home .quick-view-btn,
body.appearance-auto.appearance-light #storefront-home .quick-view-btn{
  background:#f5f2eb!important;color:#181818!important;border-color:#d8d2c7!important;
}
#storefront-home .quick-view-btn:focus-visible,
#storefront-home .compare-checkbox-label:focus-within{outline:2px solid #b8935a;outline-offset:2px}

/* Compare control becomes a real interactive chip rather than loose text. */
#storefront-home .compare-checkbox-label{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:34px!important;
  margin-top:8px!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  cursor:pointer!important;
  user-select:none!important;
  font-size:.72rem!important;
  font-weight:750!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.035)!important;
}
body.appearance-light #storefront-home .compare-checkbox-label,
body.appearance-auto.appearance-light #storefront-home .compare-checkbox-label{
  border-color:#ddd7cc!important;background:#faf8f3!important;color:#333!important;
}
#storefront-home .compare-checkbox-label input{width:17px!important;height:17px!important;flex:0 0 17px;cursor:pointer;accent-color:#b8935a}
#storefront-home .compare-checkbox-label:has(input:checked){background:rgba(184,147,90,.16)!important;border-color:#b8935a!important}

/* Chat must never sit on top of the mobile store navigation or card actions. */
@media(max-width:760px){
  #live-chat-widget.cr-support-widget,
  #live-chat-widget.cr-support-widget > #chat-toggle-btn.cr-chat-toggle{
    right:14px!important;
    bottom:92px!important;
  }
  #live-chat-widget.cr-support-widget > .cr-support-greeting{right:14px!important;bottom:160px!important}
  #chat-window.cr-chat-window{bottom:86px!important;max-height:calc(100dvh - 104px)!important}
  body[data-theme-sticky-mobile-nav="1"] #storefront-home{padding-bottom:18px!important}
}

/* Mobile: keep two columns, but give the cards enough breathing room to remain premium. */
@media(max-width:560px){
  #storefront-home .product-grid{gap:11px!important}
  #storefront-home .tag-card{padding:10px!important;border-radius:18px!important}
  #storefront-home .tag-card h3{font-size:.91rem!important;min-height:2.6em!important}
  #storefront-home .tag-card .spec-line{font-size:.64rem!important}
  #storefront-home .card-actions{grid-template-columns:minmax(0,1fr) 42px!important;gap:6px!important}
  #storefront-home .quick-view-btn{width:42px!important;min-width:42px!important}
  #storefront-home .tag-card .add-to-cart-btn{font-size:.72rem!important;min-height:42px!important;padding:0 8px!important}
}