/** Shopify CDN: Minification failed

Line 20:18 Expected identifier but found whitespace
Line 20:20 Unexpected "{"
Line 20:30 Expected ":"
Line 21:17 Expected identifier but found whitespace
Line 21:19 Unexpected "{"
Line 21:29 Expected ":"
Line 22:19 Expected identifier but found whitespace
Line 22:21 Unexpected "{"
Line 22:31 Expected ":"

**/
/* 
  YARNOX Premium Athletics & Sublimation Streetwear Custom Styling
  File: /assets/yarnox-theme.css
*/

:root {
  --color-primary: {{ settings.color_primary | default: '#6A531D' }};
  --color-accent: {{ settings.color_accent | default: '#FF6600' }};
  --color-bg-light: {{ settings.color_bg_light | default: '#faf9f6' }};
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: var(--color-bg-light);
  color: #1c1917;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Barlow', 'Space Grotesk', sans-serif;
  letter-spacing: -0.02em;
}

.metric-hud, .mono-data {
  font-family: 'JetBrains Mono', monospace;
}

::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-track {
  background: var(--color-bg-light);
}
::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 9px;
}

/* ============================================================
   UNIVERSAL PRODUCT MEDIA CONTAINMENT & SIZING ENGINE
   Guarantees 5000x4200 high-res images never take resolution height
   and never get cut off at edges (uses object-contain with padding)
   ============================================================ */
.product-card-media,
.yarnox-product-media,
.aspect-\[4\/5\],
.carousel-product-card .yarnox-product-media,
.collection-grid .yarnox-product-media {
  position: relative !important;
  width: 100% !important;
  height: 280px !important;
  max-height: 280px !important;
  min-height: 280px !important;
  overflow: hidden !important;
  background-color: #f5f5f4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.product-card-media img,
.yarnox-product-media img,
.aspect-\[4\/5\] img,
#yarnox-products-section img.product-img,
#yarnox-trending-section img.product-img,
.carousel-product-card img,
.yarnox-product-card img {
  width: 100% !important;
  height: 100% !important;
  max-height: 280px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  margin: 0 auto !important;
  padding: 8px !important;
  transition: transform 0.5s ease;
}

/* Hover Zoom */
.group:hover .product-card-media img,
.group:hover .yarnox-product-media img,
.carousel-product-card:hover img {
  transform: scale(1.05);
}

/* Button & Badge Overrides */
.product-card .btn,
.product-form__submit,
.quick-add__submit,
a[href*="/products/"] button,
.yarnox-btn-yellow {
  background-color: #FFCC00 !important;
  color: #000000 !important;
  font-weight: 800 !important;
  border: 1px solid #e5b800 !important;
}

.product-card .btn:hover,
.product-form__submit:hover,
.quick-add__submit:hover,
.yarnox-btn-yellow:hover {
  background-color: #f5b700 !important;
  color: #000000 !important;
  transform: translateY(-1px);
}

.badge--sale,
.price__badge-sale {
  background-color: #FF6600 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* Clean swatches */
.yarnox-color-swatch {
  transition: all 0.2s ease;
}
.yarnox-color-swatch:hover {
  transform: scale(1.1);
}

/* ========================================================
   SHOPIFY NATIVE CHECKOUT & CART EXPERIENCE THEMING
   ======================================================== */
.checkout-button,
a[href*="/checkout"],
button[name="checkout"],
input[name="checkout"] {
  background-color: #FFCC00 !important;
  color: #111827 !important;
  font-family: 'Space Grotesk', 'Barlow', 'Inter', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  transition: all 0.2s ease !important;
}

.checkout-button:hover,
a[href*="/checkout"]:hover,
button[name="checkout"]:hover,
input[name="checkout"]:hover {
  background-color: #f59e0b !important;
  transform: translateY(-1px);
}

/* Native payment button styling (Shopify Pay, GPay, Apple Pay) */
.shopify-payment-button__button--unbranded {
  background-color: #FFCC00 !important;
  color: #111827 !important;
  font-weight: 800 !important;
  border-radius: 2px !important;
}

/* Ensure Header and Footer match preview styling consistently */
#shopify-section-header,
header.yarnox-site-header {
  background-color: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

#shopify-section-footer,
footer.yarnox-site-footer {
  background-color: #faf9f6 !important;
  color: #57534e !important;
  border-top: 1px solid #e7e5e4 !important;
}