/* ============================================
   WHATSONMK SHOP — WooCommerce CSS Override
   Supplemental styles loaded after WC defaults
   ============================================ */

/* Trust Badges */
.product-trust-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--light-grey);
}
.trust-badge {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--font-condensed);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--mid);
  letter-spacing: 0.04em;
}
.trust-badge svg { color: var(--red); flex-shrink: 0; }

/* Related / Upsell sections */
.related.products, .upsells.products, .cross-sells {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 3rem 2rem;
}
.related.products > h2,
.upsells.products > h2,
.cross-sells > h2 {
  font-family: var(--font-display) !important;
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  color: var(--black) !important;
  margin-bottom: 2rem !important;
}

/* Stock badge */
.in-stock, .out-of-stock {
  font-family: var(--font-condensed) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}
.in-stock { color: #16a34a !important; }
.out-of-stock { color: var(--red) !important; }

/* SKU */
.sku_wrapper {
  font-family: var(--font-condensed) !important;
  font-size: 0.82rem !important;
  color: var(--grey) !important;
  letter-spacing: 0.06em !important;
}

/* Product rating stars */
.star-rating span::before { color: var(--red) !important; }
.woocommerce-product-rating .woocommerce-review-link {
  font-family: var(--font-condensed) !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: var(--red) !important;
  letter-spacing: 0.06em !important;
}

/* Variation select */
.variations select {
  border: 1.5px solid var(--light-grey) !important;
  border-radius: var(--radius) !important;
  padding: 0.65rem 1rem !important;
  font-family: var(--font-condensed) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--dark) !important;
  background: var(--white) !important;
  outline: none !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  min-width: 160px;
}
.variations select:focus { border-color: var(--red) !important; box-shadow: 0 0 0 3px var(--red-glow) !important; }

.variations label {
  font-family: var(--font-condensed) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--dark) !important;
}

/* Variable product reset link */
.reset_variations {
  font-family: var(--font-condensed) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--grey) !important;
}
.reset_variations:hover { color: var(--red) !important; }

/* Cart page table */
.woocommerce-cart-form table.shop_table {
  border: 1.5px solid var(--light-grey) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden;
}
.woocommerce-cart-form table.shop_table th {
  font-family: var(--font-condensed) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--grey) !important;
  background: var(--off-white) !important;
  padding: 1rem 1.2rem !important;
  border: none !important;
}
.woocommerce-cart-form table.shop_table td {
  border: none !important;
  border-bottom: 1px solid var(--light-grey) !important;
  padding: 1rem 1.2rem !important;
  vertical-align: middle !important;
}
.woocommerce-cart-form table.shop_table .product-name a {
  font-family: var(--font-condensed) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--black) !important;
}
.woocommerce-cart-form table.shop_table .product-name a:hover { color: var(--red) !important; }
.woocommerce-cart-form table.shop_table .product-price,
.woocommerce-cart-form table.shop_table .product-total {
  font-family: var(--font-condensed) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--black) !important;
}

/* Cart totals box */
.cart-collaterals .cart_totals {
  background: var(--white) !important;
  border-radius: var(--radius-lg) !important;
  padding: 1.5rem !important;
  box-shadow: var(--shadow-sm) !important;
  border: 1.5px solid var(--light-grey) !important;
}
.cart_totals h2 {
  font-family: var(--font-display) !important;
  font-size: 1.6rem !important;
  color: var(--black) !important;
  margin-bottom: 1.2rem !important;
}
.cart_totals table th, .cart_totals table td {
  font-family: var(--font-condensed) !important;
  border: none !important;
  border-bottom: 1px solid var(--light-grey) !important;
  padding: 0.75rem 0 !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
}
.cart_totals table .order-total th,
.cart_totals table .order-total td {
  font-size: 1.1rem !important;
  color: var(--black) !important;
  font-weight: 700 !important;
  border-bottom: none !important;
}

/* Checkout */
#customer_details h3, #order_review_heading {
  font-family: var(--font-display) !important;
  font-size: 1.6rem !important;
  color: var(--black) !important;
  margin-bottom: 1.5rem !important;
}
.woocommerce-checkout #payment {
  background: var(--off-white) !important;
  border-radius: var(--radius-lg) !important;
  border: 1.5px solid var(--light-grey) !important;
}
.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid var(--light-grey) !important;
}
.woocommerce-checkout #payment ul.payment_methods li {
  font-family: var(--font-condensed) !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
}

/* Order review table on checkout */
.woocommerce-checkout-review-order table {
  border: 1.5px solid var(--light-grey) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
}

/* My Account */
.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--white) !important;
  border-radius: var(--radius-lg) !important;
  padding: 1rem !important;
  box-shadow: var(--shadow-sm) !important;
  border: 1.5px solid var(--light-grey) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  font-family: var(--font-condensed) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
  display: flex !important;
  align-items: center !important;
  padding: 0.7rem 1rem !important;
  border-radius: var(--radius) !important;
  transition: var(--transition) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  color: var(--red) !important;
  background: var(--off-white) !important;
}

/* Mini cart (WC fragment) */
.woocommerce-mini-cart__empty-message {
  font-family: var(--font-condensed) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--grey) !important;
  text-align: center !important;
  padding: 2rem 0 !important;
}
.woocommerce-mini-cart-item {
  display: flex !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: 1rem 0 !important;
  border-bottom: 1px solid var(--light-grey) !important;
}
.woocommerce-mini-cart-item img {
  width: 64px !important;
  height: 64px !important;
  object-fit: cover !important;
  border-radius: var(--radius) !important;
  flex-shrink: 0 !important;
}
.woocommerce-mini-cart-item .remove_from_cart_button {
  color: var(--grey) !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  transition: var(--transition) !important;
}
.woocommerce-mini-cart-item .remove_from_cart_button:hover { color: var(--red) !important; }

/* Header scroll states */
#site-header.scrolled {
  box-shadow: 0 4px 30px rgba(0,0,0,0.4);
}
#site-header.header-hidden {
  transform: translateY(-100%);
  transition: transform 0.3s ease;
}
#site-header {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
