/* ═══════════════════════════════════════════════════════════════════════
 * KamiKaze V8 — Cart page restyle (preview-cookie gated).
 * Layered ON TOP of Elessi's woocommerce/cart/cart.php — no template fork,
 * just heavy CSS + a few PHP hooks for the trust strip and mobile sticky bar.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Page wrapper width — match the rest of V8 */
body.kmk-v8.woocommerce-cart .nasa-content-page,
body.kmk-v8.woocommerce-cart .container { max-width: 1320px !important; padding-left: 16px !important; padding-right: 16px !important; }

/* Page title row */
body.kmk-v8.woocommerce-cart .title-cart,
body.kmk-v8.woocommerce-cart .nasa-page-title { background: #f7f7f7 !important; padding: 28px 16px !important; border-bottom: 1px solid #ececec !important; }
body.kmk-v8.woocommerce-cart .title-cart h1,
body.kmk-v8.woocommerce-cart .nasa-page-title h1 { font-size: clamp(20px, 3vw, 28px) !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; color: #0b0b0b !important; margin: 0 !important; }

/* ─── Cart table ─── */
body.kmk-v8.woocommerce-cart table.shop_table.cart { border: 1px solid #ececec !important; border-radius: 8px !important; overflow: hidden !important; background: #fff !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart thead th { background: #0b0b0b !important; color: #fff !important; font-size: 11px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.08em !important; padding: 14px 16px !important; border: 0 !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart tbody td { padding: 18px 16px !important; border-top: 1px solid #f0f0f0 !important; vertical-align: middle !important; background: #fff !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart tbody tr:first-child td { border-top: 0 !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-thumbnail img { width: 80px !important; height: 80px !important; object-fit: cover !important; border-radius: 6px !important; border: 1px solid #ececec !important; background: #fafafa !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-name a { color: #0b0b0b !important; font-weight: 700 !important; font-size: 14px !important; line-height: 1.35 !important; text-decoration: none !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-name a:hover { color: var(--kmk-red, #e30000) !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-name .variation,
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-name dl { font-size: 11px !important; color: #888 !important; margin-top: 4px !important; line-height: 1.4 !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-price,
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-subtotal { font-weight: 700 !important; color: #0b0b0b !important; font-size: 14px !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-subtotal { color: var(--kmk-red, #e30000) !important; font-weight: 800 !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-remove .remove { width: 28px !important; height: 28px !important; line-height: 26px !important; background: #f5f5f5 !important; color: #888 !important; border-radius: 50% !important; font-size: 18px !important; font-weight: 700 !important; text-align: center !important; transition: all .15s !important; display: inline-block !important; padding: 0 !important; position: relative !important; top: auto !important; right: auto !important; transform: none !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-remove .remove:hover { background: var(--kmk-red, #e30000) !important; color: #fff !important; }
/* Kill the nasa-stclose CSS-drawn X — we want our own × to show, not Elessi's pseudo-element X stacked on top of it */
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-remove .remove.nasa-stclose::before,
body.kmk-v8.woocommerce-cart table.shop_table.cart .product-remove .remove.nasa-stclose::after { display: none !important; content: none !important; background: transparent !important; }
body.kmk-v8.woocommerce-cart table.shop_table.cart .quantity .qty { width: 64px !important; height: 38px !important; border: 1px solid #ddd !important; border-radius: 5px !important; text-align: center !important; font-weight: 700 !important; font-size: 14px !important; padding: 0 !important; }

/* Hide Elessi's original .actions row entirely — we render our own V8 coupon block via PHP hook
   (woocommerce_after_cart_table) where we control markup + visibility on mobile.
   Update Cart button is also gone — Elessi's auto-update on qty change handles it.
   Multiple selectors so we hit the row no matter how Elessi/Nasa wraps it. */
body.kmk-v8.woocommerce-cart tr.nasa-no-border,
body.kmk-v8.woocommerce-cart table.shop_table.cart tr.nasa-no-border,
body.kmk-v8.woocommerce-cart td.actions,
body.kmk-v8.woocommerce-cart td.nasa-actions,
body.kmk-v8.woocommerce-cart table.shop_table.cart td.actions,
body.kmk-v8.woocommerce-cart table.shop_table.cart td.nasa-actions,
body.kmk-v8.woocommerce-cart .woocommerce-cart-form .actions,
body.kmk-v8.woocommerce-cart .woocommerce-cart-form .actions .coupon,
body.kmk-v8.woocommerce-cart .woocommerce-cart-form td .coupon { display: none !important; visibility: hidden !important; height: 0 !important; padding: 0 !important; margin: 0 !important; border: 0 !important; overflow: hidden !important; }

/* ─── V8 coupon block (rendered by woocommerce_after_cart_table hook) ─── */
.kmk-coupon-block { margin: 16px 0 0; padding: 18px; background: #fafafa; border: 1px solid #ececec; border-radius: 8px; }
.kmk-coupon-block .kmk-coupon-label { display: block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: #555; margin-bottom: 10px; }
.kmk-coupon-block .kmk-coupon-row { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; max-width: 480px; }
.kmk-coupon-block .kmk-coupon-input { flex: 1 1 240px; min-width: 0; height: 44px; padding: 0 14px; border: 1px solid #ddd; border-radius: 5px; font-size: 14px; background: #fff; color: #0b0b0b; box-sizing: border-box; font-family: inherit; }
.kmk-coupon-block .kmk-coupon-input:focus { border-color: #0b0b0b; outline: 0; }
.kmk-coupon-block .kmk-coupon-apply { background: #0b0b0b; color: #fff; height: 44px; padding: 0 22px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; border: 0; border-radius: 5px; cursor: pointer; transition: background .15s; flex: 0 0 auto; font-family: inherit; }
.kmk-coupon-block .kmk-coupon-apply:hover { background: #2a2a2a; }
.kmk-coupon-block .kmk-coupon-apply:disabled { opacity: 0.5; cursor: not-allowed; }
.kmk-coupon-block .kmk-coupon-msg { display: block; margin-top: 8px; font-size: 12px; font-weight: 600; }
.kmk-coupon-block .kmk-coupon-msg.is-error { color: var(--kmk-red, #e30000); }
.kmk-coupon-block .kmk-coupon-msg.is-ok { color: #1f9d3a; }
@media (max-width: 767px) {
  .kmk-coupon-block { padding: 14px; }
  .kmk-coupon-block .kmk-coupon-row { flex-wrap: wrap; }
  .kmk-coupon-block .kmk-coupon-input { flex: 1 1 100%; }
  .kmk-coupon-block .kmk-coupon-apply { width: 100%; }
}

/* Old block (kept here in case someone later un-hides Elessi's actions row) */
body.kmk-v8.woocommerce-cart .actions { padding: 18px 16px !important; background: #fafafa !important; border-top: 1px solid #f0f0f0 !important; }
body.kmk-v8.woocommerce-cart .actions .coupon { display: flex !important; gap: 8px !important; align-items: center !important; flex-wrap: nowrap !important; max-width: 460px !important; }
body.kmk-v8.woocommerce-cart .actions .coupon label { display: none !important; }
body.kmk-v8.woocommerce-cart .actions .coupon input[type="text"] { height: 42px !important; padding: 0 14px !important; border: 1px solid #ddd !important; border-radius: 5px !important; font-size: 13px !important; min-width: 0 !important; flex: 1 1 280px !important; background: #fff !important; box-sizing: border-box !important; }
body.kmk-v8.woocommerce-cart .actions .coupon input[type="text"]:focus { border-color: #0b0b0b !important; outline: 0 !important; }
body.kmk-v8.woocommerce-cart .actions .coupon button[name="apply_coupon"] { background: #0b0b0b !important; color: #fff !important; height: 42px !important; padding: 0 18px !important; font-size: 12px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; border: 0 !important; border-radius: 5px !important; cursor: pointer !important; transition: background .15s !important; }
body.kmk-v8.woocommerce-cart .actions .coupon button[name="apply_coupon"]:hover { background: #2a2a2a !important; }
body.kmk-v8.woocommerce-cart .actions button[name="update_cart"] { background: #fff !important; color: #0b0b0b !important; border: 1px solid #ddd !important; height: 42px !important; padding: 0 18px !important; font-size: 12px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; border-radius: 5px !important; cursor: pointer !important; transition: all .15s !important; }
body.kmk-v8.woocommerce-cart .actions button[name="update_cart"]:hover:not([disabled]) { background: #0b0b0b !important; color: #fff !important; border-color: #0b0b0b !important; }
body.kmk-v8.woocommerce-cart .actions button[name="update_cart"][disabled] { opacity: 0.4 !important; cursor: not-allowed !important; }

/* ─── Cart totals (right column) ─── */
body.kmk-v8.woocommerce-cart .cart-collaterals .cart_totals { background: #fff !important; border: 1px solid #ececec !important; border-radius: 8px !important; padding: 24px !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals .cart_totals h2 { font-size: 16px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.06em !important; color: #0b0b0b !important; margin: 0 0 16px !important; padding-bottom: 14px !important; border-bottom: 2px solid #0b0b0b !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table { border: 0 !important; background: transparent !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table tr { border: 0 !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table th,
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table td { padding: 12px 0 !important; border: 0 !important; border-bottom: 1px dashed #ececec !important; background: transparent !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table th { font-weight: 700 !important; color: #555 !important; font-size: 13px !important; text-transform: none !important; letter-spacing: 0 !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table td { font-weight: 700 !important; color: #0b0b0b !important; font-size: 14px !important; text-align: right !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table .order-total td,
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table .order-total th { font-size: 16px !important; font-weight: 800 !important; padding-top: 16px !important; border-bottom: 0 !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals table.shop_table .order-total td .amount { color: var(--kmk-red, #e30000) !important; font-size: 22px !important; font-weight: 800 !important; }

/* Shipping calculator inside totals */
body.kmk-v8.woocommerce-cart .cart-collaterals .shipping-calculator-button { display: inline-block !important; color: #0b0b0b !important; font-size: 12px !important; font-weight: 700 !important; text-decoration: underline !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals .shipping-calculator-form input,
body.kmk-v8.woocommerce-cart .cart-collaterals .shipping-calculator-form select { width: 100% !important; height: 38px !important; border: 1px solid #ddd !important; border-radius: 5px !important; padding: 0 10px !important; font-size: 13px !important; margin-bottom: 8px !important; background: #fff !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals .shipping-calculator-form button { background: #0b0b0b !important; color: #fff !important; padding: 8px 16px !important; font-size: 11px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; border: 0 !important; border-radius: 5px !important; }

/* Proceed to checkout button — V8 red, full width */
body.kmk-v8.woocommerce-cart .cart-collaterals .wc-proceed-to-checkout { padding-top: 20px !important; margin-top: 4px !important; border-top: 1px solid #ececec !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals .wc-proceed-to-checkout .checkout-button,
body.kmk-v8.woocommerce-cart .cart-collaterals .checkout-button { display: block !important; width: 100% !important; background: var(--kmk-red, #e30000) !important; color: #fff !important; padding: 16px 24px !important; font-size: 14px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.08em !important; border: 0 !important; border-radius: 6px !important; text-align: center !important; text-decoration: none !important; transition: background .15s !important; box-shadow: 0 4px 16px rgba(227, 0, 0, 0.25) !important; }
body.kmk-v8.woocommerce-cart .cart-collaterals .wc-proceed-to-checkout .checkout-button:hover,
body.kmk-v8.woocommerce-cart .cart-collaterals .checkout-button:hover { background: var(--kmk-red-d, #b50000) !important; }

/* ─── Trust strip below totals (injected by PHP hook) ─── */
.kmk-cart-trust { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 16px; padding: 16px; background: #fafafa; border: 1px solid #ececec; border-radius: 8px; }
.kmk-cart-trust > div { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: #0b0b0b; line-height: 1.3; }
.kmk-cart-trust svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--kmk-red, #e30000); }
.kmk-cart-trust a { color: inherit !important; text-decoration: none !important; display: flex; align-items: center; gap: 8px; width: 100%; }
.kmk-cart-trust a:hover { color: var(--kmk-red, #e30000) !important; }
.kmk-cart-trust a svg { color: #25D366; }

/* ─── Sticky behavior on desktop ─── */
@media (min-width: 1024px) {
  body.kmk-v8.woocommerce-cart .cart-collaterals { position: sticky !important; top: 100px !important; align-self: flex-start !important; max-height: calc(100vh - 120px) !important; overflow-y: auto !important; }
  /* Make the parent row a flex container so sticky works */
  body.kmk-v8.woocommerce-cart .nasa-content-page > .row { display: flex !important; align-items: flex-start !important; }
}

/* ─── Cross-sells (below cart) restyled like V8 product cards ─── */
body.kmk-v8.woocommerce-cart .cross-sells { margin-top: 48px !important; padding-top: 40px !important; border-top: 1px solid #ececec !important; }
body.kmk-v8.woocommerce-cart .cross-sells > h2 { font-size: 18px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.06em !important; color: #0b0b0b !important; margin: 0 0 24px !important; }
body.kmk-v8.woocommerce-cart .cross-sells > h2::before { content: ''; display: inline-block; width: 4px; height: 18px; background: var(--kmk-red, #e30000); margin-right: 12px; vertical-align: middle; }

/* ─── Empty cart state — big centered card ─── */
/* Only the actual "your cart is empty" message gets the big card treatment.
   Success notices ("Cart updated.", "Coupon applied.") stay compact toasts. */
body.kmk-v8.woocommerce-cart .cart-empty,
body.kmk-v8.woocommerce-cart .woocommerce > .cart-empty,
body.kmk-v8.woocommerce-cart .wc-empty-cart-message {
  background: #fafafa !important;
  padding: 36px 24px !important;
  border-radius: 8px !important;
  border: 1px solid #ececec !important;
  text-align: center !important;
  font-size: 15px !important;
  color: #333 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  line-height: 1.5 !important;
}
body.kmk-v8.woocommerce-cart .cart-empty::before,
body.kmk-v8.woocommerce-cart .wc-empty-cart-message::before { position: static !important; transform: none !important; margin: 0 0 4px !important; color: var(--kmk-red, #e30000) !important; font-size: 22px !important; left: auto !important; top: auto !important; }

/* ─── Inline notices (Cart updated / Coupon applied / Item removed) — compact toast ─── */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info:not(.cart-empty),
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error {
  padding: 10px 16px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 12px !important;
  line-height: 1.4 !important;
  border: 1px solid !important;
}
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message { background: #f3faf5 !important; border-color: #c5e6d0 !important; color: #1f6f3a !important; }
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info:not(.cart-empty) { background: #f7f7f7 !important; border-color: #e2e2e2 !important; color: #333 !important; }
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error { background: #fdecec !important; border-color: #f5b8b8 !important; color: var(--kmk-red, #e30000) !important; }
/* Make notice icon inline + small */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message::before,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info:not(.cart-empty)::before,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error::before { position: static !important; transform: none !important; left: auto !important; top: auto !important; margin: 0 !important; padding: 0 !important; font-size: 16px !important; line-height: 1 !important; }

/* Close-X on the notice — Elessi adds .nasa-close-notice (Pe-icon font, 200% size, 50px wide) +
   sometimes .nasa-stclose (CSS pseudo-element X). Both render too big. Force them small + tucked. */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-close-notice,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-close-notice,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-close-notice,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-close-notice,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-close-node {
  position: absolute !important;
  top: 50% !important;
  right: 8px !important;
  bottom: auto !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  font-size: 0 !important;
  line-height: 22px !important;
  background: transparent !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  color: #888 !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  flex-shrink: 0 !important;
  z-index: 2 !important;
}
/* Pe-icon-7-stroke close glyph (\e680) shrunk to 14px */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-close-notice::after,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-close-notice::after,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-close-notice::after,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-close-notice::after { font-size: 14px !important; line-height: 1 !important; color: #888 !important; }
/* Hide the .nasa-stclose CSS-drawn X, replace with a clean × character */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-stclose::before,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-stclose::after,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose::before,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose::after,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-stclose::before,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-stclose::after,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-stclose::before,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-stclose::after { display: none !important; content: none !important; background: transparent !important; }
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-stclose,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-stclose { font-size: 16px !important; }
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose::before { content: "\00d7" !important; display: block !important; position: static !important; transform: none !important; background: transparent !important; width: auto !important; height: auto !important; color: #888 !important; font-size: 18px !important; line-height: 22px !important; font-weight: 700 !important; }
/* Hover state on close */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-close-notice:hover,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .nasa-stclose:hover,
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose:hover,
body.kmk-v8.woocommerce-cart .woocommerce-info .nasa-stclose:hover,
body.kmk-v8.woocommerce-cart .woocommerce-error .nasa-stclose:hover { background: var(--kmk-red, #e30000) !important; color: #fff !important; }
body.kmk-v8.woocommerce-cart .woocommerce-message .nasa-stclose:hover::before { color: #fff !important; }

/* Make notice container relative so the absolute close X positions correctly + padding-right room */
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message,
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info:not(.cart-empty),
body.kmk-v8.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error { position: relative !important; padding-right: 40px !important; }
body.kmk-v8.woocommerce-cart .return-to-shop { text-align: center !important; margin-top: 20px !important; }
body.kmk-v8.woocommerce-cart .return-to-shop .button { display: inline-block !important; background: var(--kmk-red, #e30000) !important; color: #fff !important; padding: 14px 28px !important; font-size: 13px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.06em !important; border-radius: 6px !important; text-decoration: none !important; box-shadow: 0 4px 16px rgba(227, 0, 0, 0.25) !important; }
body.kmk-v8.woocommerce-cart .return-to-shop .button:hover { background: var(--kmk-red-d, #b50000) !important; }

/* ─── Mobile responsive cart table (stack rows) ─── */
@media (max-width: 767px) {
  body.kmk-v8.woocommerce-cart table.shop_table.cart thead { display: none !important; }
  /* PRODUCT rows only — grid layout for thumb + meta + remove */
  body.kmk-v8.woocommerce-cart table.shop_table.cart tbody tr.cart_item { display: grid !important; grid-template-columns: 80px 1fr 32px !important; grid-template-areas: "img name remove" "img price price" "img qty subtotal" !important; gap: 6px 14px !important; padding: 16px !important; border-top: 1px solid #f0f0f0 !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tbody tr.cart_item td { display: block !important; padding: 0 !important; border: 0 !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-thumbnail { grid-area: img !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-thumbnail img { width: 80px !important; height: 80px !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-name { grid-area: name !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-price { grid-area: price !important; font-size: 13px !important; color: #555 !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-quantity { grid-area: qty !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-subtotal { grid-area: subtotal !important; align-self: center !important; text-align: right !important; }
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.cart_item .product-remove { grid-area: remove !important; align-self: start !important; }
  /* ACTIONS row — keep as normal block so coupon + buttons can render full-width */
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.nasa-no-border,
  body.kmk-v8.woocommerce-cart table.shop_table.cart tr.nasa-no-border td.actions { display: block !important; width: 100% !important; }
  body.kmk-v8.woocommerce-cart .actions .row { display: block !important; margin: 0 !important; }
  body.kmk-v8.woocommerce-cart .actions .row > .columns,
  body.kmk-v8.woocommerce-cart .actions .row > .large-7,
  body.kmk-v8.woocommerce-cart .actions .row > .large-5 { width: 100% !important; max-width: 100% !important; padding: 0 !important; float: none !important; text-align: left !important; }
  /* Hide the duplicate WC mobile data-title labels */
  body.kmk-v8.woocommerce-cart table.shop_table.cart tbody tr td::before { display: none !important; }
  /* Coupon: stack input above button so it's always visible on narrow screens.
     Using extreme specificity + redundant overrides because something in Elessi's
     mobile cascade was hiding the input even with !important on a normal selector. */
  body.kmk-v8.woocommerce-cart .actions .nasa-min-height,
  body.kmk-v8.woocommerce-cart .actions .large-7,
  body.kmk-v8.woocommerce-cart .actions .large-7.columns { display: block !important; visibility: visible !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; padding: 0 !important; }
  body.kmk-v8.woocommerce-cart .actions .coupon { display: flex !important; flex-wrap: wrap !important; max-width: none !important; width: 100% !important; gap: 8px !important; visibility: visible !important; height: auto !important; overflow: visible !important; }
  body.kmk-v8.woocommerce-cart .actions .coupon label.hidden-tag,
  body.kmk-v8.woocommerce-cart .actions .coupon label.screen-reader-text { position: absolute !important; clip: rect(0 0 0 0) !important; width: 1px !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; margin: 0 !important; border: 0 !important; }
  body.kmk-v8.woocommerce-cart .actions .coupon input[type="text"],
  body.kmk-v8.woocommerce-cart .actions .coupon input.input-text,
  body.kmk-v8.woocommerce-cart .actions .coupon input#coupon_code,
  body.kmk-v8.woocommerce-cart .actions .coupon input[name="coupon_code"] {
    display: block !important;
    width: 100% !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 44px !important;
    padding: 0 14px !important;
    margin: 0 0 8px 0 !important;
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    background: #fff !important;
    color: #0b0b0b !important;
    font-size: 14px !important;
    line-height: normal !important;
    box-sizing: border-box !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    transform: none !important;
    clip: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    z-index: 1 !important;
  }
  body.kmk-v8.woocommerce-cart .actions .coupon button[name="apply_coupon"] { display: block !important; width: 100% !important; height: 44px !important; visibility: visible !important; }
  /* Update Cart button on its own row, full width, below coupon */
  body.kmk-v8.woocommerce-cart .actions button[name="update_cart"] { display: block !important; width: 100% !important; margin-top: 12px !important; height: 44px !important; }
  /* Reserve space for the mobile sticky bar at bottom */
  body.kmk-v8.woocommerce-cart { padding-bottom: 88px !important; }
  /* Hide the desktop checkout button on mobile (we have the sticky bar instead) */
  body.kmk-v8.woocommerce-cart .cart-collaterals .wc-proceed-to-checkout { display: none !important; }
}

/* ─── Mobile sticky checkout bar ─── */
.kmk-cart-mobile-bar { display: none; }
@media (max-width: 767px) {
  body.kmk-v8.woocommerce-cart .kmk-cart-mobile-bar {
    display: flex !important;
    align-items: center;
    gap: 12px;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 990;
    background: #0b0b0b;
    color: #fff;
    padding: 10px 14px;
    border-top: 2px solid var(--kmk-red, #e30000);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.4);
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  }
  .kmk-cart-mobile-bar .kcb-info { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
  .kmk-cart-mobile-bar .kcb-count { font-size: 11px; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; }
  .kmk-cart-mobile-bar .kcb-total { font-size: 18px; font-weight: 800; color: var(--kmk-yellow, #ffe200); margin-top: 2px; }
  .kmk-cart-mobile-bar .kcb-total .woocommerce-Price-currencySymbol { font-size: 13px; opacity: 0.85; margin-right: 2px; }
  .kmk-cart-mobile-bar .kcb-btn {
    background: var(--kmk-red, #e30000);
    color: #fff !important;
    padding: 12px 20px;
    border-radius: 6px;
    font-weight: 800;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none !important;
    flex-shrink: 0;
    white-space: nowrap;
  }
  .kmk-cart-mobile-bar .kcb-btn:hover { background: var(--kmk-red-d, #b50000); }
}

/* Hide Elessi's own mobile bottom-bar on cart so the V8 checkout bar sits cleanly */
@media (max-width: 767px) {
  body.kmk-v8.woocommerce-cart .ns_btn-fixed { display: none !important; }
}