/* ============================================
   GIZA LOCA — EasyOrders v4 + Targeted Fixes
   Gold: #C69C6A | Magenta: #C40D58 | Black: #0F0F0F
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;900&family=Barlow:wght@400;600;700&display=swap');

/* ══ ROOT VARIABLES ══ */
:root {
  --color-primary: 198, 156, 106;
  --color-a11y: 15, 15, 15;
  --gl-gold: #C69C6A;
  --gl-magenta: #C40D58;
  --gl-black: #0F0F0F;
  --gl-surface: #1a1a1a;
  --gl-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --gl-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --gl-dur: 0.35s;
  --gl-dur-fast: 0.18s;
}

/* ══ GLOBAL ══ */
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html, body, #__next {
  background-color: #0F0F0F !important;
  color: #ffffff !important;
  font-family: 'Barlow', sans-serif !important;
}

body {
  overflow-x: hidden !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  -webkit-tap-highlight-color: rgba(196, 13, 88, 0.25) !important;
}

/* ══ MOTION (respect reduced-motion) ══ */
@media (prefers-reduced-motion: no-preference) {
  @keyframes gl-cta-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(196, 13, 88, 0.45); }
    55% { box-shadow: 0 0 24px 4px rgba(196, 13, 88, 0.28); }
  }
  @keyframes gl-badge-glow {
    0%, 100% {
      box-shadow:
        0 0 0 1px rgba(198, 156, 106, 0.35),
        0 6px 16px -4px rgba(196, 13, 88, 0.5);
    }
    50% {
      box-shadow:
        0 0 0 1px rgba(198, 156, 106, 0.55),
        0 10px 22px -2px rgba(196, 13, 88, 0.72);
    }
  }
  @keyframes gl-press-pop {
    0% { transform: scale(1); }
    40% { transform: scale(0.96); }
    100% { transform: scale(1); }
  }
}

@media (prefers-reduced-motion: no-preference) {
  button.bg-skin-primary,
  a.bg-skin-primary,
  input[type="submit"] {
    animation: gl-cta-pulse 2.6s ease-in-out infinite !important;
  }
}

/* ══ HERO IMAGE — FULL SCREEN ══ */
.feature-img {
  width: 100% !important;
  height: 100vh !important;
  max-height: 700px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

div.relative.overflow-hidden.feature-img {
  width: 100% !important;
  height: 100vh !important;
  max-height: 700px !important;
}

/* Remove gray placeholder behind hero */
span.absolute.inset-0.bg-\[\#f3f3f3\],
.bg-\[\#f3f3f3\] {
  background-color: #0F0F0F !important;
}

.css-1uhn2p,
.container {
  background-color: #0F0F0F !important;
  width: 100% !important;
}

[class*="css-"] > .container,
div[class="container"] {
  padding: 0 !important;
  max-width: 100% !important;
}

/* ══ NAVBAR ══ */
nav, header, .sticky, div.bg-white.sticky {
  background-color: #0F0F0F !important;
  border-bottom: 1px solid rgba(198,156,106,0.28) !important;
  box-shadow: 0 3px 14px -4px rgba(196, 13, 88, 0.35) !important;
}

nav a, header a {
  color: rgba(255,255,255,0.8) !important;
  font-family: 'Barlow', sans-serif !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
nav a:hover, header a:hover {
  color: #C40D58 !important;
  text-shadow: 0 0 18px rgba(196, 13, 88, 0.45) !important;
}

/* ══ SKIN UTILITIES ══
   text-skin-a11y = brand black on light surfaces; light on dark UI */
.bg-skin-primary { background-color: #C69C6A !important; }
.text-skin-primary { color: #C69C6A !important; }
.border-skin-primary { border-color: #C69C6A !important; }
.bg-skin-a11y { background-color: #0F0F0F !important; }

.text-skin-a11y { color: rgba(255,255,255,0.92) !important; }

.bg-skin-primary .text-skin-a11y,
.bg-skin-primary.text-skin-a11y {
  color: #0F0F0F !important;
}

button.bg-skin-primary .text-skin-a11y,
a.bg-skin-primary .text-skin-a11y,
input[type="submit"].bg-skin-primary .text-skin-a11y {
  color: #ffffff !important;
}

/* ══ WHITE → BLACK ══ */
.bg-white, [class*="bg-white"] {
  background-color: #0F0F0F !important;
}

/* ══ PRODUCT CARDS ══ */
span.bg-\[\#f3f3f3\],
div.bg-\[\#f3f3f3\],
.bg-\[\#f3f3f3\] {
  background-color: #1a1a1a !important;
}

[class*="product"],
[class*="card"],
[class*="Card"] {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(198,156,106,0.2) !important;
  border-radius: 0 !important;
  box-shadow: 0 0 0 0 rgba(196, 13, 88, 0) !important;
  transition:
    border-color var(--gl-dur) var(--gl-ease-out),
    transform var(--gl-dur) var(--gl-ease-out),
    box-shadow var(--gl-dur) var(--gl-ease-out) !important;
}

@media (hover: hover) and (pointer: fine) {
  [class*="product"]:hover,
  [class*="card"]:hover {
    border-color: #C40D58 !important;
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 28px -8px rgba(196, 13, 88, 0.35), 0 0 0 1px rgba(198, 156, 106, 0.25) !important;
  }
}

/* Touch: instant feedback (mobile-first feel) */
@media (hover: none) and (pointer: coarse) {
  [class*="product"]:active,
  [class*="card"]:active,
  [class*="Card"]:active {
    transform: scale(0.985) !important;
    border-color: rgba(196, 13, 88, 0.85) !important;
    box-shadow: 0 8px 20px -6px rgba(196, 13, 88, 0.4) !important;
    transition: transform 0.08s ease, border-color 0.08s ease !important;
  }
  [class*="category"]:active {
    transform: scale(0.99) !important;
    border-color: #C40D58 !important;
  }
}

[class*="product"] img,
[class*="card"] img,
.feature-img img {
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}

[class*="product"] h2,
[class*="product"] h3,
[class*="product"] p {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  letter-spacing: 0.04em !important;
}

/* ══ PRICES ══ */
[class*="price"]:not([class*="old"]):not([class*="original"]):not([class*="through"]),
.text-skin-primary[class*="price"] {
  color: #C69C6A !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}

[class*="line-through"],
[class*="old-price"],
[class*="original-price"],
s, del {
  color: rgba(255,255,255,0.3) !important;
  text-decoration: line-through !important;
}

/* ══ SALE / PROMO BADGE — ribbon energy ══ */
span[class*="bg-red"],
div[class*="bg-red"],
[class*="badge"][class*="sale"],
[class*="Badge"][class*="sale"] {
  background: linear-gradient(
    135deg,
    #C40D58 0%,
    #e01a6e 45%,
    #C40D58 100%
  ) !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  font-weight: 800 !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  box-shadow:
    0 0 0 1px rgba(198, 156, 106, 0.35),
    0 6px 16px -4px rgba(196, 13, 88, 0.55) !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35) !important;
  transform: skewX(-4deg) !important;
  display: inline-block !important;
  transition: transform var(--gl-dur-fast) var(--gl-ease-spring), box-shadow var(--gl-dur) !important;
}
@media (prefers-reduced-motion: no-preference) {
  span[class*="bg-red"],
  div[class*="bg-red"],
  [class*="badge"][class*="sale"],
  [class*="Badge"][class*="sale"] {
    animation: gl-badge-glow 2.8s ease-in-out infinite !important;
  }
}
@media (hover: hover) and (pointer: fine) {
  span[class*="bg-red"]:hover,
  div[class*="bg-red"]:hover {
    transform: skewX(-4deg) scale(1.05) !important;
    box-shadow:
      0 0 0 1px rgba(198, 156, 106, 0.5),
      0 10px 24px -4px rgba(196, 13, 88, 0.65) !important;
  }
}

/* ══ SECTION TITLES ══ */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  letter-spacing: 0.04em !important;
  line-height: 1.15 !important;
}

[class*="section"] h2,
[class*="section"] h3,
main h2, main h3 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: clamp(22px, 2.5vw, 28px) !important;
  font-weight: 900 !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border-bottom: 2px solid rgba(196, 13, 88, 0.75) !important;
  box-shadow: 0 1px 0 0 rgba(198, 156, 106, 0.45) !important;
  padding-bottom: 12px !important;
  margin-bottom: 20px !important;
}

a[href*="collections"],
[class*="more"],
[class*="More"] {
  color: #C40D58 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-bottom: 2px solid rgba(196, 13, 88, 0.85) !important;
  padding-bottom: 2px !important;
  transition: color var(--gl-dur) var(--gl-ease-out), border-color var(--gl-dur), transform var(--gl-dur) !important;
}
@media (prefers-reduced-motion: no-preference) {
  a[href*="collections"]:hover,
  [class*="more"]:hover,
  [class*="More"]:hover {
    transform: translateX(3px) !important;
  }
}
a[href*="collections"]:hover,
[class*="more"]:hover,
[class*="More"]:hover {
  color: #C69C6A !important;
  border-bottom-color: #C69C6A !important;
}

/* ══ CATEGORY CARDS ══ */
[class*="category"],
[class*="Category"] {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(198,156,106,0.15) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  transition: border-color 0.25s !important;
}

@media (hover: hover) and (pointer: fine) {
  [class*="category"]:hover {
    border-color: #C40D58 !important;
    box-shadow: 0 8px 20px -6px rgba(196, 13, 88, 0.3) !important;
  }
}

[class*="category"] span,
[class*="category"] div[class*="label"],
[class*="category"] div[class*="name"] {
  background-color: #0F0F0F !important;
  color: #ffffff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  border-radius: 0 !important;
}

/* ══ BUTTONS ══ */
button, [class*="btn"], a[class*="btn"], input[type="submit"] {
  font-family: 'Barlow', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  transition: all 0.2s ease !important;
  touch-action: manipulation !important;
}

button.bg-skin-primary,
a.bg-skin-primary,
input[type="submit"] {
  background-color: #C40D58 !important;
  border-color: #C40D58 !important;
  color: #ffffff !important;
}
button.bg-skin-primary:hover,
a.bg-skin-primary:hover,
input[type="submit"]:hover {
  background-color: #a00a47 !important;
  border-color: #a00a47 !important;
  color: #ffffff !important;
}

[class*="add-to-cart"],
[class*="addToCart"],
[class*="add_to_cart"] {
  background-color: transparent !important;
  border: 1.5px solid #C69C6A !important;
  color: #C69C6A !important;
}
[class*="add-to-cart"]:hover,
[class*="addToCart"]:hover {
  background-color: rgba(196, 13, 88, 0.22) !important;
  border-color: #C40D58 !important;
  color: #C69C6A !important;
  box-shadow: 0 0 0 1px rgba(196, 13, 88, 0.5) !important;
}

button.bg-white {
  background-color: rgba(198,156,106,0.15) !important;
  border: 1px solid rgba(198,156,106,0.4) !important;
  color: #C69C6A !important;
  border-radius: 0 !important;
}
button.bg-white:hover {
  background-color: #C69C6A !important;
  color: #0F0F0F !important;
}

/* SIZE / VARIANT — buttons only (avoids checkout option rows) */
button[class*="rounded"],
button[class*="size"],
a[class*="size"],
button[class*="variant"] {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(198,156,106,0.35) !important;
  color: rgba(255,255,255,0.7) !important;
  border-radius: 0 !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  transition: all 0.2s !important;
}

@media (hover: hover) and (pointer: fine) {
  button[class*="rounded"]:hover,
  button[class*="size"]:hover,
  a[class*="size"]:hover {
    border-color: #C69C6A !important;
    color: #C69C6A !important;
  }
}

button[class*="rounded"].bg-skin-primary,
button[class*="rounded"][class*="skin-primary"] {
  background-color: #C69C6A !important;
  border-color: #C69C6A !important;
  color: #0F0F0F !important;
  font-weight: 900 !important;
}

input, textarea, select {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(198,156,106,0.3) !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  font-family: 'Barlow', sans-serif !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
}

textarea {
  min-height: 120px !important;
}

input:focus, textarea:focus, select:focus {
  border-color: #C69C6A !important;
  outline: 2px solid rgba(196, 13, 88, 0.4) !important;
  outline-offset: 1px !important;
  box-shadow: 0 0 0 3px rgba(196, 13, 88, 0.12) !important;
}

::placeholder { color: rgba(255,255,255,0.35) !important; }

label,
[class*="label"],
form p,
form span,
form div[class*="field"] {
  color: rgba(255,255,255,0.78) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-family: 'Barlow', sans-serif !important;
  display: block !important;
  margin-bottom: 6px !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(255,255,255,0.3) !important;
}

form p:not([class*="label"]),
[class*="checkout"] p,
[class*="Checkout"] p {
  color: rgba(255,255,255,0.75) !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-weight: 400 !important;
}

/* ══ CHECKOUT — same dark UI as site (all breakpoints; mobile reinforced below) ══ */
[class*="checkout"],
[class*="Checkout"],
[id*="checkout"],
[id*="Checkout"],
[class*="payment-section"],
[class*="PaymentSection"],
[class*="shipping-form"],
[class*="ShippingForm"] {
  background-color: #0F0F0F !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

[class*="checkout"] .bg-white,
[class*="Checkout"] .bg-white,
[class*="checkout"] [class*="bg-white"],
[class*="Checkout"] [class*="bg-white"] {
  background-color: #1a1a1a !important;
}

[class*="checkout"] *,
[class*="Checkout"] * {
  color: inherit !important;
}

[class*="checkout"] a,
[class*="Checkout"] a {
  color: #C69C6A !important;
}

[class*="checkout"] a:hover,
[class*="Checkout"] a:hover {
  color: #C40D58 !important;
}

[class*="checkout"] [class*="text-gray"],
[class*="checkout"] [class*="text-slate"],
[class*="checkout"] [class*="text-zinc"],
[class*="checkout"] [class*="text-neutral"],
[class*="checkout"] [class*="text-stone"],
[class*="checkout"] [class*="text-black"],
[class*="checkout"] [class*="text-blue"],
[class*="checkout"] [class*="text-indigo"],
[class*="checkout"] [class*="text-skin-a11y"],
[class*="Checkout"] [class*="text-gray"],
[class*="Checkout"] [class*="text-slate"],
[class*="Checkout"] [class*="text-black"],
[class*="Checkout"] [class*="text-blue"],
[class*="Checkout"] [class*="text-skin-a11y"] {
  color: rgba(255, 255, 255, 0.92) !important;
}

[class*="checkout"] .text-skin-a11y,
[class*="Checkout"] .text-skin-a11y {
  color: rgba(255, 255, 255, 0.94) !important;
}

[class*="checkout"] label,
[class*="Checkout"] label,
[class*="checkout"] [class*="label"],
[class*="Checkout"] [class*="label"] {
  color: rgba(255, 255, 255, 0.82) !important;
}

[class*="checkout"] input,
[class*="checkout"] textarea,
[class*="checkout"] select,
[class*="Checkout"] input,
[class*="Checkout"] textarea,
[class*="Checkout"] select {
  background-color: #1a1a1a !important;
  border-color: rgba(198, 156, 106, 0.35) !important;
  color: #ffffff !important;
}

[class*="checkout"] [class*="order-summary"],
[class*="checkout"] [class*="orderSummary"],
[class*="Checkout"] [class*="order-summary"],
[class*="Checkout"] [class*="orderSummary"] {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(198, 156, 106, 0.25) !important;
  box-shadow: inset 0 0 0 1px rgba(196, 13, 88, 0.14) !important;
}

/* ══ CART, DRAWER & ORDER SUMMARY — readable totals (Tailwind / platform utilities) ══ */
[class*="order-summary"],
[class*="orderSummary"],
div[class*="summary"],
[class*="cart-drawer"],
[class*="CartDrawer"],
[class*="mini-cart"],
[class*="MiniCart"] {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(198,156,106,0.22) !important;
  box-shadow: inset 0 0 0 1px rgba(196, 13, 88, 0.12) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

/* Force light copy inside summary trees (fixes Product Total / Total values) */
[class*="order-summary"] *,
[class*="orderSummary"] *,
[class*="cart-drawer"] *,
[class*="CartDrawer"] *,
[class*="mini-cart"] *,
[class*="MiniCart"] * {
  color: inherit !important;
}

[class*="order-summary"] a,
[class*="orderSummary"] a,
[class*="cart-drawer"] a,
[class*="CartDrawer"] a {
  color: #C69C6A !important;
}

[class*="order-summary"] a:hover,
[class*="orderSummary"] a:hover {
  color: #C40D58 !important;
}

/* Platform “dark text” utilities on dark panels */
[class*="order-summary"] [class*="text-gray"],
[class*="orderSummary"] [class*="text-gray"],
[class*="order-summary"] [class*="text-slate"],
[class*="orderSummary"] [class*="text-slate"],
[class*="order-summary"] [class*="text-zinc"],
[class*="order-summary"] [class*="text-neutral"],
[class*="order-summary"] [class*="text-black"],
[class*="order-summary"] [class*="text-blue"],
[class*="order-summary"] [class*="text-indigo"],
[class*="order-summary"] [class*="text-skin-a11y"],
[class*="orderSummary"] [class*="text-gray"],
[class*="orderSummary"] [class*="text-black"],
[class*="orderSummary"] [class*="text-blue"],
[class*="cart"] [class*="text-gray"],
[class*="Cart"] [class*="text-gray"],
[class*="cart"] [class*="text-black"],
[class*="Cart"] [class*="text-black"],
[class*="cart"] [class*="text-blue"],
[class*="line-item"] [class*="text-gray"],
[class*="LineItem"] [class*="text-gray"] {
  color: rgba(255, 255, 255, 0.92) !important;
}

[class*="cart"] .text-skin-a11y,
[class*="Cart"] .text-skin-a11y,
[class*="order-summary"] .text-skin-a11y,
[class*="orderSummary"] .text-skin-a11y {
  color: rgba(255, 255, 255, 0.94) !important;
}

[class*="total"],
[class*="Total"],
[class*="subtotal"],
[class*="Subtotal"],
[class*="shipping"],
[class*="Shipping"],
[class*="product-total"],
[class*="ProductTotal"] {
  color: rgba(255,255,255,0.92) !important;
  font-size: 14px !important;
  font-family: 'Barlow', sans-serif !important;
  font-weight: 600 !important;
}

/* Currency / line amounts — gold */
[class*="order-summary"] [class*="price"]:not([class*="line-through"]):not([class*="old"]),
[class*="orderSummary"] [class*="price"]:not([class*="line-through"]):not([class*="old"]),
[class*="cart"] [class*="price"]:not([class*="line-through"]):not([class*="old"]) {
  color: #C69C6A !important;
  font-weight: 700 !important;
}

[class*="grand-total"],
[class*="grandTotal"],
[class*="order-total"] {
  color: #C69C6A !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

[class*="order-summary"] [class*="Total"]:last-of-type,
[class*="orderSummary"] [class*="Total"]:last-of-type {
  color: #C69C6A !important;
}

[class*="order-summary"] p,
[class*="orderSummary"] p,
[class*="summary"] p,
[class*="order-summary"] span,
[class*="orderSummary"] span {
  color: rgba(255,255,255,0.88) !important;
  font-size: 13px !important;
}

[class*="order-summary"] h3,
[class*="order-summary"] h4,
[class*="orderSummary"] h3 {
  color: #ffffff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  text-transform: uppercase !important;
}

/* Dividers in cart — gold + magenta hint */
[class*="order-summary"] hr,
[class*="orderSummary"] hr,
[class*="cart"] hr {
  border: 0 !important;
  height: 1px !important;
  margin: 14px 0 !important;
  background: linear-gradient(
    90deg,
    rgba(198, 156, 106, 0.15) 0%,
    rgba(196, 13, 88, 0.65) 50%,
    rgba(198, 156, 106, 0.15) 100%
  ) !important;
  opacity: 1 !important;
}

/* Quantity steppers — visible icons */
[class*="quantity"] button,
[class*="qty"] button {
  background-color: #2a2a2a !important;
  border: 1.5px solid rgba(196, 13, 88, 0.55) !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  min-height: 44px !important;
  min-width: 44px !important;
  transition: background-color var(--gl-dur), border-color var(--gl-dur), color var(--gl-dur) !important;
}

[class*="quantity"] button svg,
[class*="qty"] button svg {
  color: #ffffff !important;
}
[class*="quantity"] button svg path,
[class*="qty"] button svg path,
[class*="quantity"] button svg line,
[class*="qty"] button svg line,
[class*="quantity"] button svg polyline,
[class*="qty"] button svg polyline {
  stroke: #ffffff !important;
  fill: currentColor !important;
}

[class*="quantity"] button:hover,
[class*="qty"] button:hover {
  background-color: rgba(196, 13, 88, 0.35) !important;
  border-color: #C40D58 !important;
  color: #ffffff !important;
}

button[class*="delete"],
button[class*="remove"],
[class*="delete"] button {
  color: rgba(196,13,88,0.85) !important;
  background: transparent !important;
  border: none !important;
  min-height: 44px !important;
}
button[class*="delete"]:hover { color: #C40D58 !important; }

span[class*="bg-skin-primary"],
[class*="discount"],
[class*="percent"] {
  background: linear-gradient(135deg, #C40D58, #d41462 50%, #C40D58) !important;
  color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  border-radius: 0 !important;
  padding: 4px 9px !important;
  letter-spacing: 0.1em !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  box-shadow: 0 4px 12px -2px rgba(196, 13, 88, 0.5) !important;
  transform: skewX(-3deg) !important;
  display: inline-block !important;
}

main, .container_class, .content_container, section {
  background-color: #0F0F0F !important;
}

footer, footer.bg-white, footer.bg-skin-primary {
  background-color: #0a0a0a !important;
  border-top: 1px solid rgba(198,156,106,0.2) !important;
}
footer * { color: rgba(255,255,255,0.45) !important; }
footer a:hover {
  color: #C40D58 !important;
  text-shadow: 0 0 12px rgba(196, 13, 88, 0.35) !important;
}
footer h3, footer h4, footer h5 {
  color: #C69C6A !important;
  font-size: 11px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}
footer a[href*="easy-orders"] {
  color: rgba(255,255,255,0.2) !important;
  font-size: 11px !important;
}

a { color: #C69C6A !important; }
a:hover { color: #C40D58 !important; }
hr { border-color: rgba(198,156,106,0.2) !important; }
.border-\[\#E2E2E2\] { border-color: rgba(198,156,106,0.2) !important; }

.bg-gray-50, .bg-gray-100, .bg-gray-200, [class*="bg-gray"] {
  background-color: #1a1a1a !important;
}

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #0F0F0F; }
::-webkit-scrollbar-thumb { background: #C69C6A; border-radius: 0; }
::selection { background: #C40D58 !important; color: #fff !important; }

@media (max-width: 1024px) {
  nav a, header a {
    font-size: 11px !important;
  }
}

@media (max-width: 768px) {
  .feature-img,
  div.relative.overflow-hidden.feature-img {
    height: min(56vw, 380px) !important;
    max-height: 380px !important;
  }

  h1 { font-size: clamp(24px, 7vw, 44px) !important; }
  h2 { font-size: clamp(20px, 5.5vw, 36px) !important; }
  h3 { font-size: clamp(18px, 4.5vw, 28px) !important; }

  [class*="section"] h2,
  [class*="section"] h3,
  main h2,
  main h3 {
    font-size: clamp(20px, 5vw, 26px) !important;
    margin-bottom: 16px !important;
    border-bottom-width: 2px !important;
    box-shadow: 0 2px 0 rgba(198, 156, 106, 0.35), 0 8px 24px -12px rgba(196, 13, 88, 0.25) !important;
  }

  button:not([class*="quantity"]):not([class*="qty"]):not([class*="arrow"]):not([class*="slider"]):not(.bg-white),
  [class*="btn"]:not([class*="quantity"]):not([class*="qty"]) {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 50px !important;
  }

  [class*="quantity"] button,
  [class*="qty"] button,
  button.bg-white {
    width: auto !important;
    min-width: 46px !important;
    min-height: 46px !important;
  }

  main {
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
    padding-bottom: max(24px, env(safe-area-inset-bottom)) !important;
  }

  nav, header {
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }

  footer {
    padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }

  input, select, textarea {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 16px !important;
  }

  [class*="order-summary"],
  [class*="orderSummary"],
  div[class*="summary"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* —— Mobile checkout = same palette as rest of site —— */
  [class*="checkout"],
  [class*="Checkout"],
  [id*="checkout"] {
    background-color: #0F0F0F !important;
    color: rgba(255, 255, 255, 0.94) !important;
    padding-left: max(0px, env(safe-area-inset-left)) !important;
    padding-right: max(0px, env(safe-area-inset-right)) !important;
  }

  [class*="checkout"] main,
  [class*="Checkout"] main,
  [class*="checkout"] [class*="container"],
  [class*="Checkout"] [class*="container"] {
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
  }

  [class*="checkout"] *,
  [class*="Checkout"] * {
    color: inherit !important;
  }

  [class*="checkout"] [class*="text-gray"],
  [class*="checkout"] [class*="text-slate"],
  [class*="checkout"] [class*="text-zinc"],
  [class*="checkout"] [class*="text-neutral"],
  [class*="checkout"] [class*="text-stone"],
  [class*="checkout"] [class*="text-black"],
  [class*="checkout"] [class*="text-blue"],
  [class*="checkout"] [class*="text-indigo"],
  [class*="checkout"] [class*="text-skin-a11y"],
  [class*="Checkout"] [class*="text-gray"],
  [class*="Checkout"] [class*="text-black"],
  [class*="Checkout"] [class*="text-blue"],
  [class*="Checkout"] [class*="text-skin-a11y"] {
    color: rgba(255, 255, 255, 0.93) !important;
  }

  [class*="checkout"] .text-skin-a11y,
  [class*="Checkout"] .text-skin-a11y {
    color: rgba(255, 255, 255, 0.95) !important;
  }

  [class*="checkout"] a,
  [class*="Checkout"] a {
    color: #C69C6A !important;
  }

  [class*="checkout"] [class*="price"]:not([class*="line-through"]):not([class*="old"]),
  [class*="Checkout"] [class*="price"]:not([class*="line-through"]):not([class*="old"]) {
    color: #C69C6A !important;
    font-weight: 700 !important;
  }

  [class*="checkout"] [class*="grand-total"],
  [class*="checkout"] [class*="grandTotal"],
  [class*="checkout"] [class*="order-total"],
  [class*="Checkout"] [class*="grandTotal"],
  [class*="Checkout"] [class*="order-total"] {
    color: #C69C6A !important;
  }

  [class*="checkout"] [class*="order-summary"],
  [class*="checkout"] [class*="orderSummary"],
  [class*="Checkout"] [class*="order-summary"],
  [class*="Checkout"] [class*="orderSummary"] {
    background: linear-gradient(180deg, #1f1f1f 0%, #1a1a1a 100%) !important;
    border: 1px solid rgba(198, 156, 106, 0.3) !important;
    box-shadow:
      inset 0 0 0 1px rgba(196, 13, 88, 0.12),
      0 12px 32px -16px rgba(0, 0, 0, 0.6) !important;
    padding: 16px 14px !important;
    margin-bottom: 16px !important;
  }

  [class*="checkout"] input,
  [class*="checkout"] select,
  [class*="checkout"] textarea,
  [class*="Checkout"] input,
  [class*="Checkout"] select,
  [class*="Checkout"] textarea {
    background-color: #141414 !important;
    color: #ffffff !important;
    border: 1.5px solid rgba(198, 156, 106, 0.35) !important;
    min-height: 48px !important;
  }

  [class*="checkout"] fieldset,
  [class*="Checkout"] fieldset {
    border: 1px solid rgba(198, 156, 106, 0.2) !important;
    padding: 12px !important;
    margin: 0 0 16px 0 !important;
    background-color: rgba(26, 26, 26, 0.65) !important;
  }

  [class*="checkout"] legend,
  [class*="Checkout"] legend {
    color: #C69C6A !important;
    font-weight: 700 !important;
    padding: 0 8px !important;
  }

  [class*="checkout"] [class*="error"],
  [class*="checkout"] [class*="invalid"],
  [class*="Checkout"] [class*="error"] {
    color: #ff6b9d !important;
  }

  /* Tap feedback on primary actions */
  @media (prefers-reduced-motion: no-preference) {
    button.bg-skin-primary:active,
    a.bg-skin-primary:active,
    input[type="submit"]:active {
      animation: gl-press-pop 0.35s var(--gl-ease-spring) !important;
    }
  }

  [class*="quantity"] button:active,
  [class*="qty"] button:active {
    background-color: rgba(196, 13, 88, 0.45) !important;
    transform: scale(0.94) !important;
  }
}

@media (min-width: 1280px) {
  form[class*="checkout"],
  [class*="checkout"] form {
    max-width: 720px !important;
  }
}