/* ---------------------------------------------------------------------------
   The Spirit Shoppe – custom fixes
   This file exists because logs showed it was being requested but 404'ing:
   /wp-content/themes/fastest-store/custom-fixes.css
   --------------------------------------------------------------------------- */

/* Scope to WPMobile.App:
   WPMobile injects: <span class="wpappninja wpmobileapp" style="display:none"></span> */
body:has(.wpappninja.wpmobileapp) {
  -webkit-text-size-adjust: 100%;
}

/* WooCommerce Blocks cart quantity selector (app-only):
   Fix "+" clipping in iOS WebView by forcing a stable square button box */
body:has(.wpappninja.wpmobileapp) .wc-block-components-quantity-selector__button {
  min-width: 44px;
  width: 44px;
  height: 44px;

  padding: 0;
  line-height: 44px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  overflow: visible;
  text-indent: 0;
  letter-spacing: 0;

  font-family: inherit;
  font-weight: 600;
  font-size: 20px;

  -webkit-font-smoothing: antialiased;
}

/* Nudge the plus slightly left to avoid right-edge clipping in WebView */
body:has(.wpappninja.wpmobileapp) .wc-block-components-quantity-selector__button--plus {
  position: relative;
  left: -1px;
}

/* Classic WooCommerce quantity buttons fallback */
body:has(.wpappninja.wpmobileapp) .quantity .plus,
body:has(.wpappninja.wpmobileapp) .quantity .minus {
  min-width: 44px;
  width: 44px;
  height: 44px;

  padding: 0;
  line-height: 44px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  overflow: visible;
  font-family: inherit;
  font-weight: 600;
  font-size: 20px;
}

/* Neuter any leftover canary styling in the app */
body:has(.wpappninja.wpmobileapp) .tss-canary,
body:has(.wpappninja.wpmobileapp) .canary,
body:has(.wpappninja.wpmobileapp) [data-canary="1"] {
  background: unset !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------------
   WKWebView (WPMobile.app) — clamp quantity pill so + can't overflow
   (Desktop doesn’t reproduce; this is a WebKit-in-app layout guard.)
   ------------------------------------------------------------------ */

/* Scope to app: prefer :has() when available, plus a few fallbacks */
@supports selector(:has(*)) {
  body:has(.wpappninja.wpmobileapp) .wc-block-components-quantity-selector {
    display: flex !important;
    align-items: stretch !important;
    overflow: hidden !important;        /* KEY: prevents right-edge bleed */
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  body:has(.wpappninja.wpmobileapp) .wc-block-components-quantity-selector__button {
    flex: 0 0 44px !important;          /* true fixed-width button */
    width: 44px !important;
    min-width: 44px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;        /* avoid rounding math weirdness */
  }

  body:has(.wpappninja.wpmobileapp) .wc-block-components-quantity-selector__input {
    flex: 1 1 auto !important;
    min-width: 0 !important;            /* allow shrink; prevents pushing + off */
  }

  body:has(.wpappninja.wpmobileapp) .wc-block-components-quantity-selector__button--plus {
    left: auto !important;
    right: 0 !important;
    transform: none !important;
  }
}

/* Fallback scopes if :has() is not applied for any reason */
html.wpappninja .wc-block-components-quantity-selector,
body.wpappninja .wc-block-components-quantity-selector {
  display: flex !important;
  align-items: stretch !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
}
html.wpappninja .wc-block-components-quantity-selector__button,
body.wpappninja .wc-block-components-quantity-selector__button {
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
html.wpappninja .wc-block-components-quantity-selector__input,
body.wpappninja .wc-block-components-quantity-selector__input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* ==================================================================
   WPMobile.app (WKWebView) — Quantity pill overflow fix (v2)
   Scope to body classes that ACTUALLY exist:
   body.theme-wpappninja.wpmobileapp.wpappninja ...
   ================================================================== */

/* Prefer the most specific app scope first */
body.wpmobileapp.wpappninja .wc-block-components-quantity-selector,
body.wpmobileapp.wpapp-ios .wc-block-components-quantity-selector,
body.theme-wpappninja .wc-block-components-quantity-selector {
  display: inline-flex !important;
  align-items: stretch !important;

  /* Hard clamp: prevents + from bleeding outside rounded pill in WKWebView */
  overflow: hidden !important;
  border-radius: 9999px !important;

  box-sizing: border-box !important;
  max-width: 100% !important;

  /* iOS/WebKit clipping reliability */
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
  transform: translateZ(0) !important;
}

/* Buttons: fixed width, no weird margins/padding */
body.wpmobileapp.wpappninja .wc-block-components-quantity-selector__button,
body.wpmobileapp.wpapp-ios .wc-block-components-quantity-selector__button,
body.theme-wpappninja .wc-block-components-quantity-selector__button {
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
  overflow: hidden !important; /* extra safety if icon itself overflows */
}

/* Input: allow shrink so it can’t push + out */
body.wpmobileapp.wpappninja .wc-block-components-quantity-selector__input,
body.wpmobileapp.wpapp-ios .wc-block-components-quantity-selector__input,
body.theme-wpappninja .wc-block-components-quantity-selector__input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: center !important;
}

/* If the plus/minus icons are SVGs, keep them centered and bounded */
body.wpmobileapp.wpappninja .wc-block-components-quantity-selector__button svg,
body.wpmobileapp.wpapp-ios .wc-block-components-quantity-selector__button svg,
body.theme-wpappninja .wc-block-components-quantity-selector__button svg {
  max-width: 100% !important;
  max-height: 100% !important;
}

/* ==================================================================
   WKWebView / WPMobile.App — force quantity “pill” to keep + inside
   We cannot scrape the injected markup server-side (rendered by JS),
   so we target robust patterns inside the cart page in-app.
   ================================================================== */

body.wpmobileapp.wpappninja.woocommerce-cart,
body.theme-wpappninja.wpmobileapp.woocommerce-cart {

  /* Make sizing predictable in the app WebView */
  --tss-qty-btn: 44px;
}

/* Guard rail: any likely quantity/stepper wrapper cannot overflow */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-cart-item__quantity,
  .wc-block-components-quantity-selector,
  .wc-block-components-quantity-selector__controls,
  .quantity,
  [class*="quantity"][class*="selector"],
  [class*="quantity"][class*="stepper"],
  [class*="stepper"]
) {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* The pill/container: force flex and clamp overflow */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector,
  [class*="quantity"][class*="selector"],
  [class*="quantity"][class*="stepper"]
) {
  display: flex !important;
  align-items: stretch !important;
  overflow: hidden !important;        /* KEY: stops right-edge bleed */
  border-radius: 999px !important;    /* keep “pill” shape */
  min-width: 0 !important;
}

/* Buttons: fixed width, never translate/offset out of pill */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__button,
  .quantity button,
  button[class*="quantity"],
  button[aria-label*="Increase"],
  button[aria-label*="Decrease"]
) {
  flex: 0 0 var(--tss-qty-btn) !important;
  width: var(--tss-qty-btn) !important;
  min-width: var(--tss-qty-btn) !important;
  max-width: var(--tss-qty-btn) !important;

  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;

  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* If any implementation absolutely positions the +, pin it inside */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__button--plus,
  button[aria-label*="Increase"]
) {
  right: 0 !important;
  inset-inline-end: 0 !important;
}

/* Input: allow shrinking so it can’t push the + out */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__input,
  input[type="number"],
  input.input-text.qty
) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

/* Last resort: if some inner element is wider, clip it */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-cart-item__quantity,
  .wc-block-components-quantity-selector
) * {
  box-sizing: border-box !important;
}


/* ================================================================
   HARD FORCE (WPMobile.app / WKWebView)
   If the + is still bleeding, lock the qty control into a 3-col grid
   so the + cannot overflow regardless of WebKit layout quirks.
   ================================================================ */

body.wpmobileapp.wpappninja.woocommerce-cart,
body.theme-wpappninja.wpmobileapp.woocommerce-cart {
  --tss-qty-btn: 44px;
  --tss-qty-mid: 56px;   /* middle input area; increase if you want */
}

/* Target the WC Blocks quantity selector (and robust pattern fallbacks) */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector,
  [class*="quantity"][class*="selector"],
  [class*="quantity"][class*="stepper"]
) {
  display: grid !important;
  grid-template-columns: var(--tss-qty-btn) minmax(var(--tss-qty-mid), 1fr) var(--tss-qty-btn) !important;
  align-items: stretch !important;

  overflow: hidden !important;        /* clamp anything trying to spill */
  box-sizing: border-box !important;

  width: calc(var(--tss-qty-btn) * 2 + var(--tss-qty-mid)) !important; /* fixed, since you have space */
  max-width: 100% !important;

  border-radius: 999px !important;
}

/* Buttons occupy their grid cells exactly */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__button,
  button[aria-label*="Increase"],
  button[aria-label*="Decrease"]
) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  position: static !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;

  box-sizing: border-box !important;
  line-height: var(--tss-qty-btn) !important;
}

/* Middle input stays inside and can shrink */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__input,
  input[type="number"],
  input.input-text.qty
) {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* If icons/pseudo-elements are the thing bleeding, keep them boxed */
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__button,
  button[aria-label*="Increase"],
  button[aria-label*="Decrease"]
)::before,
body.wpmobileapp.wpappninja.woocommerce-cart :is(
  .wc-block-components-quantity-selector__button,
  button[aria-label*="Increase"],
  button[aria-label*="Decrease"]
)::after {
  max-width: 100% !important;
}


/* ================================================================
   Basket (/basket/) — Coupon section styling (DESKTOP + APP)
   Scope: cart page only
   ================================================================ */

body.woocommerce-cart {
  --tss-row-h: 44px;
  --tss-radius: 999px;
  --tss-border: rgba(0,0,0,.18);
  --tss-gap: 10px;
}

/* Wrapper spacing */
body.woocommerce-cart .wc-block-components-totals-coupon {
  margin-top: 12px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Toggle ("Add a coupon") */
body.woocommerce-cart .wc-block-components-totals-coupon__button,
body.woocommerce-cart .wc-block-components-totals-coupon__link {
  min-height: var(--tss-row-h) !important;
  height: var(--tss-row-h) !important;
  border-radius: var(--tss-radius) !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: var(--tss-row-h) !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}

/* Form layout */
body.woocommerce-cart .wc-block-components-totals-coupon__content {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.woocommerce-cart .wc-block-components-totals-coupon__form {
  display: flex !important;
  align-items: stretch !important;
  gap: var(--tss-gap) !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Input wrapper */
body.woocommerce-cart .wc-block-components-text-input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Input */
body.woocommerce-cart .wc-block-components-text-input input,
body.woocommerce-cart .wc-block-components-text-input__input {
  height: var(--tss-row-h) !important;
  min-height: var(--tss-row-h) !important;
  border-radius: var(--tss-radius) !important;
  padding: 0 14px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  border: 1px solid var(--tss-border) !important;
  outline: none !important;
}

/* Apply button (be conservative: only within coupon form) */
body.woocommerce-cart .wc-block-components-totals-coupon__form button,
body.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
body.woocommerce-cart .wc-block-components-totals-coupon__form .components-button {
  height: var(--tss-row-h) !important;
  min-height: var(--tss-row-h) !important;
  border-radius: var(--tss-radius) !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

/* Prevent horizontal spill (helps iOS WebView and narrow desktops) */
body.woocommerce-cart .wc-block-components-totals-coupon,
body.woocommerce-cart .wc-block-components-totals-coupon__content,
body.woocommerce-cart .wc-block-components-totals-coupon__form {
  overflow-x: hidden !important;
}

/* Notices a bit softer */
body.woocommerce-cart .wc-block-components-notice-banner,
body.woocommerce-cart .wc-block-components-validation-error {
  border-radius: 14px !important;
}


/* ================================================================
   Basket coupon refinements
   - Put "Enter code" ABOVE the field (disable floating label)
   - Make Apply button match pill styling/height
   ================================================================ */

body.woocommerce-cart {
  --tss-row-h: 44px;
  --tss-radius: 999px;
  --tss-border: rgba(0,0,0,.18);
  --tss-accent: #7a1240; /* matches the site’s maroon header */
}

/* Align the Apply button with the bottom of the input (since label is above) */
body.woocommerce-cart .wc-block-components-totals-coupon__form {
  align-items: flex-end !important;
}

/* Make the coupon input stack as: label (top) + input (bottom) */
body.woocommerce-cart .wc-block-components-totals-coupon .wc-block-components-text-input {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

/* Force label above the field (disable floating/absolute label behaviour) */
body.woocommerce-cart .wc-block-components-totals-coupon .wc-block-components-text-input__label,
body.woocommerce-cart .wc-block-components-totals-coupon .wc-block-components-text-input label {
  position: static !important;
  transform: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Coupon input (keep pill) */
body.woocommerce-cart .wc-block-components-totals-coupon .wc-block-components-text-input input,
body.woocommerce-cart .wc-block-components-totals-coupon .wc-block-components-text-input__input {
  height: var(--tss-row-h) !important;
  min-height: var(--tss-row-h) !important;
  border-radius: var(--tss-radius) !important;
  padding: 0 14px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  border: 1px solid var(--tss-border) !important;
}

/* Apply button — match height + pill look */
body.woocommerce-cart .wc-block-components-totals-coupon__form button,
body.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
body.woocommerce-cart .wc-block-components-totals-coupon__form .components-button,
body.woocommerce-cart .wc-block-components-totals-coupon__content button,
body.woocommerce-cart .wc-block-components-totals-coupon__content .wc-block-components-button,
body.woocommerce-cart .wc-block-components-totals-coupon__content .components-button {
  height: var(--tss-row-h) !important;
  min-height: var(--tss-row-h) !important;
  line-height: var(--tss-row-h) !important;
  border-radius: var(--tss-radius) !important;
  padding: 0 18px !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;

  background: var(--tss-accent) !important;
  color: #fff !important;
  border: 1px solid var(--tss-accent) !important;
}

/* Nicer focus without changing layout */
body.woocommerce-cart .wc-block-components-totals-coupon__form button:focus,
body.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button:focus,
body.woocommerce-cart .wc-block-components-totals-coupon__form .components-button:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(122,18,64,.25) !important;
}

/* TSS_COUPON_STYLES_BEGIN */
/* Mobile/app-webview: keep Coupon input + Apply button visible (no horizontal clip) */
@media (max-width: 782px) {
  .woocommerce-cart .wc-block-components-totals-coupon,
  .woocommerce-checkout .wc-block-components-totals-coupon {
    overflow: visible !important;
  }

  .wc-block-components-totals-coupon__content,
  .wc-block-components-totals-coupon__form {
    overflow: visible !important;
  }

  .wc-block-components-totals-coupon__form {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .wc-block-components-totals-coupon__input,
  .wc-block-components-totals-coupon__form .wc-block-components-text-input {
    flex: 1 1 180px !important;
    min-width: 0 !important;
    width: auto !important;
    box-sizing: border-box !important;
  }

  .wc-block-components-totals-coupon__button,
  .wc-block-components-totals-coupon__form .wc-block-components-button {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }
}

/* Very narrow screens: let the button drop to its own line */
@media (max-width: 420px) {
  .wc-block-components-totals-coupon__button,
  .wc-block-components-totals-coupon__form .wc-block-components-button {
    width: 100% !important;
  }
}
/* TSS_COUPON_STYLES_END */




/* ============================================================
   TSS Coupon UI Fix (Basket totals) — v6
   Goals:
   - Remove black focus rectangle on Apply
   - Align Apply button with coupon input
   - Move "Enter code" label ABOVE the input
   ============================================================ */

/* Make the coupon form a clean 2-column row: input grows, button stays snug */
.woocommerce-cart .wc-block-components-totals-coupon__form,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form,
.wc-block-cart .wc-block-components-totals-coupon__form {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important; /* align to input bottom */
  gap: 10px !important;
  width: 100% !important;
  overflow: visible !important;
}

/* Input wrapper fills remaining space */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input,
.wc-block-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__input,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__input,
.wc-block-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  display: flex !important;
  flex-direction: column !important; /* label then input */
}

/* Force the label ABOVE the input even if markup order is input->label */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__label,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__label,
.wc-block-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__label,
.woocommerce-cart .wc-block-components-totals-coupon__form label,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form label,
.wc-block-cart .wc-block-components-totals-coupon__form label {
  order: -1 !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  height: auto !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Normalize the input height so button can align perfectly */
.woocommerce-cart .wc-block-components-totals-coupon__form input,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form input,
.wc-block-cart .wc-block-components-totals-coupon__form input,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__input,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__input,
.wc-block-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__input {
  height: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}

/* Apply button: keep it in-flow, aligned, and kill the black rectangle */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__button,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__button,
.wc-block-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__button,
.woocommerce-cart .wc-block-components-totals-coupon__form button,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form button,
.wc-block-cart .wc-block-components-totals-coupon__form button,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
.wc-block-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__form .components-button,
.wc-block-cart .wc-block-components-totals-coupon__form .components-button {
  align-self: flex-end !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;

  height: 44px !important;
  min-height: 44px !important;
  line-height: 44px !important;

  outline: none !important;
  box-shadow: none !important;
}

/* Replace ugly focus outline with a soft (non-black) focus ring */
.woocommerce-cart .wc-block-components-totals-coupon__form button:focus,
.woocommerce-cart .wc-block-components-totals-coupon__form button:focus-visible,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button:focus,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(127, 23, 74, 0.25) !important;
}


/* ============================================================
   TSS Coupon UI Fix (Basket totals) — v7 (hard override)
   - Nuke pseudo-element focus rectangles
   - Force proper alignment even if WC applies weird wrapper styles
   ============================================================ */

/* Ensure the button wrapper itself doesn't introduce offsets */
.woocommerce-cart .wc-block-components-totals-coupon__button,
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__button,
.wc-block-cart .wc-block-components-totals-coupon__button {
  display: flex !important;
  align-items: flex-end !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}

/* Kill any pseudo-element rings/boxes */
.woocommerce-cart .wc-block-components-totals-coupon__form button::before,
.woocommerce-cart .wc-block-components-totals-coupon__form button::after,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button::before,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button::after,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button::before,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button::after {
  box-shadow: none !important;
  outline: none !important;
  border: 0 !important;
}

/* Some themes apply a focus ring via -webkit-appearance / outline-offset */
.woocommerce-cart .wc-block-components-totals-coupon__form button,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button {
  outline-offset: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* If label is being "floated" below, force the whole text-input block to stack */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input {
  display: flex !important;
  flex-direction: column !important;
}


/* ============================================================
   TSS Coupon UI Fix (Basket totals) — v8 (strong override)
   Fixes:
   - Move "Enter code" above the input
   - Align Apply button to input bottom
   - Remove black rectangle (usually outline/border on inner span/pseudo)
   ============================================================ */

.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-coupon__content,
.woocommerce-cart .wc-block-components-totals-coupon__form {
  overflow: visible !important;
}

/* Force the form layout: input grows, button stays at the end */
.woocommerce-cart .wc-block-components-totals-coupon__form {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  gap: 10px !important;
  width: 100% !important;
}

/* Make the input block a flex container and reverse order so label goes ABOVE */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;

  display: flex !important;
  flex-direction: column-reverse !important; /* input then label in DOM => label above visually */
}

/* Label styling (ensure it behaves like a normal label above the field) */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__label,
.woocommerce-cart .wc-block-components-totals-coupon__form label {
  position: static !important;
  transform: none !important;
  inset: auto !important;

  display: block !important;
  margin: 0 0 6px !important;
  padding: 0 !important;

  height: auto !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
}

/* Normalize input height */
.woocommerce-cart .wc-block-components-totals-coupon__form input,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__input {
  height: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}

/* Button wrapper: keep it in-flow and aligned */
.woocommerce-cart .wc-block-components-totals-coupon__button {
  display: flex !important;
  align-items: flex-end !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}

/* Apply button: align with input and remove outlines/odd focus boxes */
.woocommerce-cart .wc-block-components-totals-coupon__form button,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button {
  align-self: flex-end !important;

  height: 44px !important;
  min-height: 44px !important;
  line-height: 44px !important;

  outline: none !important;
  box-shadow: none !important;
  outline-offset: 0 !important;

  -webkit-appearance: none !important;
  appearance: none !important;
}

/* The black rectangle in your screenshot is usually on an inner span or pseudo-element */
.woocommerce-cart .wc-block-components-totals-coupon__form button *,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button *,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button * {
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

.woocommerce-cart .wc-block-components-totals-coupon__form button::before,
.woocommerce-cart .wc-block-components-totals-coupon__form button::after,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button::before,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button::after,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button::before,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button::after {
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Replace focus with a soft ring (not black) */
.woocommerce-cart .wc-block-components-totals-coupon__form button:focus,
.woocommerce-cart .wc-block-components-totals-coupon__form button:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(127, 23, 74, 0.25) !important;
}


/* ============================================================
   TSS Coupon UI Fix (Basket totals) — v9 (alignment + label)
   ============================================================ */

/* Keep form items bottom-aligned to the INPUT (not the label) */
.woocommerce-cart .wc-block-components-totals-coupon__form {
  align-items: flex-end !important;
}

/* Ensure the input+label wrapper is a vertical stack */
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__input {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

/* Force “Enter code” ABOVE the input (works whether it’s <label> or the WC label class) */
.woocommerce-cart .wc-block-components-totals-coupon__form label[for="wc-block-components-totals-coupon__input-coupon"],
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-text-input__label {
  position: static !important;
  transform: none !important;
  inset: auto !important;

  display: block !important;
  order: -1 !important;           /* label first */
  margin: 0 0 6px !important;
  padding: 0 !important;

  height: auto !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
}

/* Input stays second + has consistent height */
.woocommerce-cart #wc-block-components-totals-coupon__input-coupon {
  order: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}

/* Button wrapper + button: hard-align to input bottom */
.woocommerce-cart .wc-block-components-totals-coupon__button {
  display: flex !important;
  align-items: flex-end !important;
  align-self: flex-end !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-cart .wc-block-components-totals-coupon__form button,
.woocommerce-cart .wc-block-components-totals-coupon__form .wc-block-components-button,
.woocommerce-cart .wc-block-components-totals-coupon__form .components-button {
  align-self: flex-end !important;
  margin: 0 !important;

  height: 44px !important;
  min-height: 44px !important;
  line-height: 44px !important;
}


/* ============================================================
   TSS Coupon UI Fix (Basket totals) — v7 (alignment)
   - Keep label above input
   - Drop Apply button down to align with the input pill
   ============================================================ */

.woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form {
  align-items: flex-start !important; /* align at top of label+field block */
}

/* ============================================================
   TSS Coupon Section — FINAL LAYOUT (v2)
   - Label above input
   - Button aligned to INPUT row
   - No stray margin-top hacks
   ============================================================ */

.woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form,
#wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto 44px !important;
  column-gap: 12px !important;
  row-gap: 6px !important;
  width: 100% !important;
  max-width: none !important;
  align-items: end !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* Promote label + input into the form grid */
.woocommerce-cart #wc-block-components-totals-coupon__form .wc-block-components-text-input.wc-block-components-totals-coupon__input,
#wc-block-components-totals-coupon__form .wc-block-components-text-input.wc-block-components-totals-coupon__input{
  display: contents !important;
}

.woocommerce-cart #wc-block-components-totals-coupon__form label[for="wc-block-components-totals-coupon__input-coupon"],
#wc-block-components-totals-coupon__form label[for="wc-block-components-totals-coupon__input-coupon"]{
  grid-column: 1 !important;
  grid-row: 1 !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
}

.woocommerce-cart #wc-block-components-totals-coupon__form input#wc-block-components-totals-coupon__input-coupon,
#wc-block-components-totals-coupon__form input#wc-block-components-totals-coupon__input-coupon{
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}

.woocommerce-cart #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button,
#wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button{
  grid-column: 2 !important;
  grid-row: 2 !important;
  justify-self: end !important;
  align-self: end !important;
  margin: 0 !important;          /* kill any old margin-top */
  position: static !important;
  inset: auto !important;
  transform: none !important;
  height: 44px !important;
  min-height: 44px !important;
  line-height: 44px !important;
}

 (max-width: 600px){
  .woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form,
  #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form{
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 44px 44px !important;
  }

  .woocommerce-cart #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button,
  #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button{
    grid-column: 1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }
}



/* ============================================================
   TSS Coupon Section — REBUILD v3 (robust grid, no display:contents)
   Goal: Button aligned with INPUT row, label above input.
   ============================================================ */

.woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto 44px !important; /* label row, input/button row */
  column-gap: 12px !important;
  row-gap: 6px !important;
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

/* Left column wrapper becomes its own grid that mirrors the form rows */
.woocommerce-cart #wc-block-components-totals-coupon__form .wc-block-components-text-input.wc-block-components-totals-coupon__input{
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;

  display: grid !important;
  grid-template-rows: auto 44px !important;
  row-gap: 6px !important;

  width: 100% !important;
  margin: 0 !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Label sits in row 1 (above) */
.woocommerce-cart #wc-block-components-totals-coupon__form label[for="wc-block-components-totals-coupon__input-coupon"]{
  grid-row: 1 !important;

  position: static !important;
  inset: auto !important;
  transform: none !important;

  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Input sits in row 2 */
.woocommerce-cart #wc-block-components-totals-coupon__form input#wc-block-components-totals-coupon__input-coupon{
  grid-row: 2 !important;

  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}

/* Button sits in form row 2 (aligned with input) */
.woocommerce-cart #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button{
  grid-column: 2 !important;
  grid-row: 2 !important;

  justify-self: end !important;
  align-self: stretch !important;

  margin: 0 !important;
  margin-top: 0 !important; /* nukes any older “push down” rules */
  position: static !important;
  inset: auto !important;
  transform: none !important;

  height: 44px !important;
  min-height: 44px !important;
  line-height: 44px !important;
}

/* If Woo changes structure, still force the button to behave */
.woocommerce-cart #wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__button{
  margin-top: 0 !important;
}

/* Mobile: stack input then button */
@media (max-width: 600px){
  .woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form{
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 44px 44px !important;
  }

  .woocommerce-cart #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button{
    grid-column: 1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }
}


/* ============================================================
   TSS Coupon Section — REBUILD v3 (robust grid, no display:contents)
   Goal: Button aligned with INPUT row, label above input.
   ============================================================ */

.woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto 44px !important; /* label row, input/button row */
  column-gap: 12px !important;
  row-gap: 6px !important;
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

/* Left column wrapper becomes its own grid that mirrors the form rows */
.woocommerce-cart #wc-block-components-totals-coupon__form .wc-block-components-text-input.wc-block-components-totals-coupon__input{
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;

  display: grid !important;
  grid-template-rows: auto 44px !important;
  row-gap: 6px !important;

  width: 100% !important;
  margin: 0 !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Label sits in row 1 (above) */
.woocommerce-cart #wc-block-components-totals-coupon__form label[for="wc-block-components-totals-coupon__input-coupon"]{
  grid-row: 1 !important;

  position: static !important;
  inset: auto !important;
  transform: none !important;

  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Input sits in row 2 */
.woocommerce-cart #wc-block-components-totals-coupon__form input#wc-block-components-totals-coupon__input-coupon{
  grid-row: 2 !important;

  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}

/* Button sits in form row 2 (aligned with input) */
.woocommerce-cart #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button{
  grid-column: 2 !important;
  grid-row: 2 !important;

  justify-self: end !important;
  align-self: stretch !important;

  margin: 0 !important;
  margin-top: 0 !important; /* kills any earlier “push down” rules */
  position: static !important;
  inset: auto !important;
  transform: none !important;

  height: 44px !important;
  min-height: 44px !important;
  line-height: 44px !important;
}

/* If Woo changes structure, still force the button to behave */
.woocommerce-cart #wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__button{
  margin-top: 0 !important;
}

/* Mobile: stack input then button */
@media (max-width: 600px){
  .woocommerce-cart #wc-block-components-totals-coupon__form.wc-block-components-totals-coupon__form{
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 44px 44px !important;
  }

  .woocommerce-cart #wc-block-components-totals-coupon__form > button.wc-block-components-totals-coupon__button{
    grid-column: 1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }
}


/* ============================================================
   TSS Basket Totals Coupon — Scrollbar + Divider Fix (v2)
   - Remove inner scrollbar when coupon is expanded
   - Make divider under coupon full-width (no right-side gap)
   ============================================================ */

/* 1) Remove the internal scrolling behaviour (Woo sometimes sets overflow/height) */
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-coupon__content,
.woocommerce-cart .wc-block-components-totals-coupon__form,
.woocommerce-cart .wc-block-components-totals-coupon__content > *,
.woocommerce-cart .wc-block-components-totals-coupon__form > * {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  max-height: none !important;
  height: auto !important;
}

/* If a scrollbar is still forced by the browser/UA styles, hide it */
.woocommerce-cart .wc-block-components-totals-coupon__content,
.woocommerce-cart .wc-block-components-totals-coupon__content * {
  scrollbar-width: none !important; /* Firefox */
}
.woocommerce-cart .wc-block-components-totals-coupon__content::-webkit-scrollbar,
.woocommerce-cart .wc-block-components-totals-coupon__content *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

/* 2) Replace the “short” divider with our own full-width divider */
.woocommerce-cart .wc-block-components-totals-coupon {
  padding-bottom: 16px !important;
  margin-bottom: 16px !important;
  border-bottom: 1px solid rgba(0,0,0,0.12) !important;
  box-sizing: border-box !important;
}

/* Prevent double-lines / weird spacing if the next totals row adds its own border */
.woocommerce-cart .wc-block-components-totals-coupon + .wc-block-components-totals-item,
.woocommerce-cart .wc-block-components-totals-coupon + .wc-block-components-totals-item--tax,
.woocommerce-cart .wc-block-components-totals-coupon + .wc-block-components-totals-item--total,
.woocommerce-cart .wc-block-components-totals-coupon + .wc-block-components-totals-item--fees {
  border-top: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* ============================================================
   TSS Basket Totals — Fix vertical border gap (v1)
   Draw the totals border as an overlay so inner blocks can't mask it.
   ============================================================ */

.woocommerce-cart .wc-block-components-totals-wrapper,
.woocommerce-cart .wp-block-woocommerce-cart-totals-block,
.woocommerce-cart .wc-block-cart__totals {
  position: relative !important;
}

/* Paint the border on TOP of inner content (prevents the “gap”) */
.woocommerce-cart .wc-block-components-totals-wrapper::after,
.woocommerce-cart .wp-block-woocommerce-cart-totals-block::after,
.woocommerce-cart .wc-block-cart__totals::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  z-index: 10 !important;
}

/* Extra safety: ensure coupon block itself isn't painting over edges */
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-coupon__content,
.woocommerce-cart .wc-block-components-totals-coupon__form {
  background: transparent !important;
}


/* ============================================================
   TSS Basket totals — Clean card layout (v1)
   - Disable the previous overlay border hack (prevents double borders)
   - Make ONE outer border + gentle row dividers
   - Remove inner “boxed” borders Woo Blocks adds
   Scope: cart page only
   ============================================================ */

/* 1) Disable previous overlay border hack (no need to edit older CSS) */
.woocommerce-cart .wc-block-components-totals-wrapper::after,
.woocommerce-cart .wp-block-woocommerce-cart-totals-block::after,
.woocommerce-cart .wc-block-cart__totals::after {
  content: none !important;
  display: none !important;
}

/* 2) Make the totals area a single clean card */
.woocommerce-cart .wc-block-components-totals-wrapper,
.woocommerce-cart .wp-block-woocommerce-cart-totals-block,
.woocommerce-cart .wc-block-cart__totals {
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 6px !important;
  background: #fff !important;
  overflow: hidden !important; /* ensures no “gap” in border */
  box-shadow: none !important;
}

/* 3) Remove inner borders/boxes so we don’t get “lines everywhere” */
.woocommerce-cart .wc-block-components-totals-wrapper *,
.woocommerce-cart .wp-block-woocommerce-cart-totals-block *,
.woocommerce-cart .wc-block-cart__totals * {
  box-shadow: none !important;
}

/* These are the common “boxed row” elements in WC Blocks totals */
.woocommerce-cart .wc-block-components-totals-item,
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-coupon__content,
.woocommerce-cart .wc-block-components-totals-coupon__form,
.woocommerce-cart .wc-block-components-totals-wrapper .wc-block-components-panel,
.woocommerce-cart .wc-block-components-totals-wrapper .wc-block-components-panel__content {
  border: 0 !important;
  background: transparent !important;
}

/* 4) Recreate clean row dividers (one line between sections) */
.woocommerce-cart .wc-block-components-totals-wrapper > * {
  padding: 16px 16px !important;
  margin: 0 !important;
  border-top: 1px solid rgba(0,0,0,0.10) !important;
}

/* No divider above the first row */
.woocommerce-cart .wc-block-components-totals-wrapper > *:first-child {
  border-top: 0 !important;
}

/* 5) Coupon row: keep it tidy (collapsed + expanded) */
.woocommerce-cart .wc-block-components-totals-coupon__link,
.woocommerce-cart .wc-block-components-totals-coupon-link {
  margin: 0 !important;
}

/* Prevent any inner container from painting over edges */
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-coupon__content {
  overflow: visible !important;
}


/* ============================================================
   TSS Basket Totals — Minimalist Card (v1)
   Makes the totals area a single clean card:
   - Remove “box per row” borders + big padding
   - Use subtle dividers between rows
   - Hide empty spacer row (the blank bordered box)
   Scope: cart page only
   ============================================================ */

.woocommerce-cart .wc-block-components-totals-wrapper,
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-item,
.woocommerce-cart .wc-block-components-totals-footer-item,
.woocommerce-cart .wc-block-components-totals-coupon__content {
  box-shadow: none !important;
  background: transparent !important;
}

/* Remove the “multiple nested boxes” look */
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-item,
.woocommerce-cart .wc-block-components-totals-footer-item {
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

/* Compact spacing across rows */
.woocommerce-cart .wc-block-components-totals-coupon,
.woocommerce-cart .wc-block-components-totals-item,
.woocommerce-cart .wc-block-components-totals-footer-item {
  padding: 14px 0 !important;
}

/* Subtle dividers between rows (instead of boxes) */
.woocommerce-cart .wc-block-components-totals-wrapper > * + * {
  border-top: 1px solid rgba(0,0,0,0.10) !important;
}

/* Coupon block: don’t add its own panel styling */
.woocommerce-cart .wc-block-components-totals-coupon__content {
  padding: 10px 0 0 !important; /* small breathing room when expanded */
  border: 0 !important;
}

/* Make label/value align nicely like a minimalist summary */
.woocommerce-cart .wc-block-components-totals-item,
.woocommerce-cart .wc-block-components-totals-footer-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

/* Keep the text tidy */
.woocommerce-cart .wc-block-components-totals-item__label,
.woocommerce-cart .wc-block-components-totals-footer-item__label {
  margin: 0 !important;
}

.woocommerce-cart .wc-block-components-totals-item__value,
.woocommerce-cart .wc-block-components-totals-footer-item__value {
  margin: 0 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

/* Hide the empty spacer row that shows as a blank box */
@supports selector(:has(*)) {
  .woocommerce-cart .wc-block-components-totals-wrapper
  .wc-block-components-totals-item:has(.wc-block-components-totals-item__label:empty)
  :has(.wc-block-components-totals-item__value:empty) {
    display: none !important;
    padding: 0 !important;
    border: 0 !important;
  }
}

/* Fallback: if the empty row is literally empty */
.woocommerce-cart .wc-block-components-totals-wrapper > *:empty {
  display: none !important;
}


/* ============================================================
   TSS Basket totals — Minimal Card Refactor (v2)
   Goal: ONE clean container, minimal dividers, no nested boxes.
   Scope: cart page totals sidebar only.
   ============================================================ */

/* Target the totals "card" area in the cart sidebar */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 12px !important;
  padding: 16px !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Nuke all the inner "boxes" that Woo + theme like to add */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper *,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper *::before,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper *::after {
  box-shadow: none !important;
}

/* Remove borders/radii/backgrounds from inner sections so it doesn't look like stacked panels */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper > * {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

/* Section spacing + a single subtle divider line between blocks */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper > * + * {
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(0,0,0,0.10) !important;
}

/* Hide any empty spacer rows that render as blank boxes/lines */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper > *:empty {
  display: none !important;
}

/* Make totals rows read like a clean summary (label left, value right) */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-item,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-footer-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 0 !important; /* wrapper provides spacing */
  border: 0 !important;
}

/* Keep label/value tight */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-item__label,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-footer-item__label,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-item__value,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-footer-item__value {
  margin: 0 !important;
}

/* Coupon header/link: no surrounding panel */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-coupon {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Remove the extra "expanded panel" styling */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-coupon__content {
  padding: 10px 0 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

/* Ensure the coupon form itself doesn't create extra borders */
.woocommerce-cart .wc-block-cart__sidebar #wc-block-components-totals-coupon__form {
  margin: 0 !important;
}

/* Keep the checkout button separated cleanly (no extra box around it) */
.woocommerce-cart .wc-block-cart__sidebar .wc-block-cart__submit,
.woocommerce-cart .wc-block-cart__sidebar .wc-block-cart__submit-container {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-top: 16px !important;
}


/* ============================================================
   Basket totals — Minimal / clean (v1)
   Goal: ONE container, no nested “boxes”, simple row dividers.
   Scope: /basket totals block only
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block{
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 14px !important;
  background: #fff !important;
  overflow: hidden !important; /* keeps header corners clean */
}

/* Remove all the nested card/panel/totals wrapper “boxes” */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-panel,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-card,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-wrapper,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-panel__content{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
}

/* Give the content area sane padding (without creating boxes) */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-wrapper{
  padding: 18px !important;
}

/* Coupon accordion header: keep it clean, no boxed look */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-panel__button{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 14px !important;
}

/* Coupon content: no border/box; just spacing */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-coupon__content{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
}

/* Totals rows: remove per-row boxes and use subtle dividers */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-top: 1px solid rgba(0,0,0,0.10) !important;
  padding: 14px 0 !important;
  margin: 0 !important;
}

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item:first-child{
  border-top: 0 !important;
  padding-top: 0 !important;
}

/* Make the final total feel like “the” number, without boxing it */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--total,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item.is-total{
  padding-top: 16px !important;
}

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--total .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item.is-total .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--total .wc-block-components-totals-item__value,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item.is-total .wc-block-components-totals-item__value{
  font-weight: 700 !important;
}

/* Ensure no stray overflow scrollbars appear inside the totals block */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block *{
  overflow: visible !important;
}


/* ============================================================
   Basket totals — Minimal / clean (v1)
   Goal: ONE container, no nested “boxes”, simple row dividers.
   Scope: /basket totals block only
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block{
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 14px !important;
  background: #fff !important;
  overflow: hidden !important; /* keeps header corners clean */
}

/* Remove all the nested card/panel/totals wrapper “boxes” */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-panel,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-card,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-wrapper,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-panel__content{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
}

/* Give the content area sane padding (without creating boxes) */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-wrapper{
  padding: 18px !important;
}

/* Coupon accordion header: keep it clean, no boxed look */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-panel__button{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 14px !important;
}

/* Coupon content: no border/box; just spacing */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-coupon__content{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
}

/* Totals rows: remove per-row boxes and use subtle dividers */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-top: 1px solid rgba(0,0,0,0.10) !important;
  padding: 14px 0 !important;
  margin: 0 !important;
}

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item:first-child{
  border-top: 0 !important;
  padding-top: 0 !important;
}

/* Make the final total feel like “the” number, without boxing it */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--total,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item.is-total{
  padding-top: 16px !important;
}

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--total .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item.is-total .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--total .wc-block-components-totals-item__value,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item.is-total .wc-block-components-totals-item__value{
  font-weight: 700 !important;
}

/* Ensure no stray overflow scrollbars appear inside the totals block */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block *{
  overflow: visible !important;
}


/* ============================================================
   Basket totals — Taxes row: kill inner vertical borders (v1)
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes *{
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Some themes draw “lines” using pseudo elements */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes::after,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes *::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes *::after{
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}

/* If the value column is what’s drawing the verticals */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wc-block-components-totals-item--taxes .wc-block-components-totals-item__value,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wc-block-components-totals-item--taxes .wc-block-components-totals-item__label{
  border-left: 0 !important;
  border-right: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}


/* ============================================================
   TSS Basket totals — Taxes block: remove inner vertical borders (v1)
   Scope: only the Taxes section inside Basket totals
   ============================================================ */

/* Kill any left/right borders (and shadow divider effects) inside Taxes */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block,
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block *{
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}

/* Some themes draw “vertical rules” using pseudo-elements */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block *::before,
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block *::after{
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}


/* ============================================================
   TSS Basket totals — Taxes row: remove remaining inner verticals (v2)
   (Targets the actual totals “taxes” item + its label/value cells)
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes > *,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes .wc-block-components-totals-item__value{
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* Nuke any divider lines drawn via pseudo elements on the taxes row */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes::after,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes *::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-components-totals-item--taxes *::after{
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
  content: none !important;
}


/* ============================================================
   TSS Basket totals — Taxes: remove inner vertical dividers (v3)
   Reason: Woo Blocks often draws “column rules” using borders,
   inset shadows, or pseudo-elements on label/value cells.
   Scope: ONLY inside the Taxes block in Basket totals.
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block,
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block *{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* Target common totals row/cell classes that may exist inside Taxes */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block [class*="wc-block-components-totals-item"],
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block [class*="wc-block-components-totals-item__label"],
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block [class*="wc-block-components-totals-item__value"],
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block [class*="totals-item--tax"],
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block [class*="totals-item--taxes"]{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* Kill divider pseudo-elements inside Taxes (vertical rules are often ::before/::after) */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block *::before,
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block *::after{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* If the “rule” is an inset shadow on label/value cells, neutralise it hard */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-taxes-block .wc-block-components-totals-item__value{
  box-shadow: none !important;
  outline: 0 !important;
}


/* ============================================================
   TSS Basket totals — Taxes rows: remove inner vertical dividers (v4)
   IMPORTANT: Taxes rows are often ".wc-block-components-totals-item--tax"
   Scope: ONLY inside the Taxes block in the Basket totals sidebar.
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block .wp-block-woocommerce-cart-order-summary-taxes-block{
  overflow: visible !important;
}

/* Remove any column rules on BOTH tax row variants */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block
.wc-block-components-totals-item--tax,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block
.wc-block-components-totals-item--taxes{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* Label/value cells are the most common place the vertical divider is drawn */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block
.wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block
.wc-block-components-totals-item__value{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* If the “divider” is a pseudo element (very common), kill it only in taxes */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block *::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block *::after{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
  content: none !important;
}


/* ============================================================
   TSS Basket totals — Taxes: kill any remaining vertical dividers (v4.1)
   Covers:
   - totals-item--tax (singular) AND totals-item--taxes
   - pseudo-elements on the taxes BLOCK ITSELF (common culprit)
   Scope: cart sidebar taxes block only
   ============================================================ */

body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block *{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* IMPORTANT: also remove pseudos on the taxes block element itself */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block::after,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block *::before,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block *::after{
  content: none !important;
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}

/* Cover both tax row class variants explicitly */
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block .wc-block-components-totals-item--tax,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block .wc-block-components-totals-item--taxes,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block .wc-block-components-totals-item__label,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block
.wp-block-woocommerce-cart-order-summary-taxes-block .wc-block-components-totals-item__value{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}


/* ============================================================
   TSS Basket totals — Clean minimalist refactor (v5 FINAL)
   Goal: ONE clean card, no nested boxes, no inner vertical rules
   Scope: /basket sidebar totals only
   ============================================================ */

/* 0) Disable the old “border overlay” hack that created extra lines */
body.woocommerce-cart .wc-block-components-totals-wrapper::after,
body.woocommerce-cart .wp-block-woocommerce-cart-totals-block::after,
body.woocommerce-cart .wc-block-cart__totals::after{
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 1) The ONE card */
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 12px !important;
  padding: 16px !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* 2) Remove “nested panels/boxes” inside the order summary ONLY
      (but do NOT touch inputs/buttons so coupon keeps its styling) */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block *:not(input):not(button):not(select):not(textarea){
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* 3) One subtle horizontal rhythm (no vertical rules) */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block > * + *{
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(0,0,0,0.10) !important;
}

/* 4) Totals rows: clean 2-column summary */
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-item,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-footer-item{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Kill any “column divider” styling on label/value cells (THIS is usually the vertical line) */
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-item__label,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-item__value,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-footer-item__label,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-footer-item__value{
  margin: 0 !important;
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* 5) Taxes block: be extra aggressive about pseudo dividers */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-taxes-block,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-taxes-block *{
  border-left: 0 !important;
  border-right: 0 !important;
  border-inline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-taxes-block::before,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-taxes-block::after,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-taxes-block *::before,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-taxes-block *::after{
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
}


/* ============================================================
   TSS Basket totals — restore "Order totals" title bar (v1)
   Scope: /basket sidebar totals card only
   ============================================================ */

body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block{
  display: block !important;

  /* make it a bar across the card */
  margin: -16px -16px 14px !important;
  padding: 12px 16px !important;

  border-bottom: 1px solid rgba(0,0,0,0.10) !important;
  border-radius: 12px 12px 0 0 !important;

  background: rgba(0,0,0,0.03) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

/* If Woo injects a heading element, keep it tidy */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block h1,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block h2,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block h3,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block .wp-block-heading{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* If the heading block is empty (common in server HTML), inject the label */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block:empty::before{
  content: "Order totals" !important;
  display: block !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}


/* ============================================================
   TSS Basket totals — heading bar: maroon bg + white text (v2)
   Scope: /basket sidebar totals heading only
   ============================================================ */

body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block{
  background: #7f174a !important;      /* maroon */
  color: #fff !important;
  border-bottom: 0 !important;
}

/* Ensure any inner heading elements inherit white text */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block *{
  color: #fff !important;
}

/* If we inject the label via ::before, force it white too */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block:empty::before{
  color: #fff !important;
}


/* ============================================================
   TSS Basket totals — "Order Totals" title bar styling (v1)
   Goal: maroon bar + white text, full-width inside the totals card
   Scope: /basket sidebar only
   ============================================================ */

body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block{
  background: #7f174a !important;
  color: #fff !important;

  /* make it look like a proper title bar */
  border: 0 !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;

  /* stretch across the totals card (wrapper has padding) */
  margin: -16px -16px 14px !important;
}

/* Force any heading/text inside to be visible (some themes set white-on-white) */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block *,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block h1,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block h2,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block h3,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block p,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block span{
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Remove any decorative lines/pseudos that can clash with the bar */
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block::before,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block::after,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block *::before,
body.woocommerce-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-heading-block *::after{
  content: none !important;
}


/* ============================================================
   TSS Basket totals — Order Totals title bar (v2)
   Woo Blocks renders the visible heading inside .wc-block-components-totals-wrapper
   (NOT inside the empty ...order-summary-heading-block div in server HTML).
   ============================================================ */

body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper__header,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper__heading,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper__title{
  display: block !important;
  background: #7f174a !important;
  color: #fff !important;

  padding: 14px 16px !important;

  /* make it span full card width (card has 16px padding) */
  margin: -16px -16px 14px !important;

  border: 0 !important;
  border-radius: 10px !important;

  box-shadow: none !important;
  background-image: none !important;
}

/* Ensure any nested text inside the header is white */
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper__header *,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper__heading *,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper__title *{
  color: #fff !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Defensive: some themes use h2/h3 as the title inside the wrapper */
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper > h2,
body.woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper > h3{
  display: block !important;
  background: #7f174a !important;
  color: #fff !important;
  padding: 14px 16px !important;
  margin: -16px -16px 14px !important;
  border-radius: 10px !important;
  border: 0 !important;
}


/* ============================================================
   TSS Single product — Add to basket pill container (v2)
   Theme markup: plus + .quantity + minus are SIBLINGS inside form.cart
   Goal: one continuous pill with qty controls + add-to-basket
   ============================================================ */

/* 1) SIMPLE products: wrap the qty controls + button into one continuous pill */
body.single-product div.product form.cart:not(.variations_form){
  display: inline-flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;

  gap: 0 !important;
  padding: 0 !important;

  border: 1px solid var(--tss-border, rgba(0,0,0,.18)) !important;
  border-radius: 999px !important;
  background: #fff !important;
  overflow: hidden !important;

  margin: 14px 0 !important;
}

/* 2) VARIABLE products: only wrap the final add-to-cart row (not the variations table) */
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart{
  display: inline-flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;

  gap: 0 !important;
  padding: 0 !important;

  border: 1px solid var(--tss-border, rgba(0,0,0,.18)) !important;
  border-radius: 999px !important;
  background: #fff !important;
  overflow: hidden !important;

  margin: 14px 0 !important;
}

/* Shared: normalise heights */
body.single-product div.product form.cart:not(.variations_form) > button.plus,
body.single-product div.product form.cart:not(.variations_form) > button.minus,
body.single-product div.product form.cart:not(.variations_form) > .quantity,
body.single-product div.product form.cart:not(.variations_form) > .quantity input.qty,
body.single-product div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.plus,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.minus,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > .quantity,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > .quantity input.qty,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{
  height: var(--tss-row-h, 44px) !important;
  min-height: var(--tss-row-h, 44px) !important;
  line-height: var(--tss-row-h, 44px) !important;
}

/* Qty buttons (+ / -) live as direct children of the form row */
body.single-product div.product form.cart:not(.variations_form) > button.plus,
body.single-product div.product form.cart:not(.variations_form) > button.minus,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.plus,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.minus{
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;

  width: 44px !important;
  min-width: 44px !important;

  background: rgba(0,0,0,.05) !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 0 !important;
  box-shadow: none !important;
}

/* The Woo .quantity wrapper should NOT be its own pill; it’s the middle segment */
body.single-product div.product form.cart:not(.variations_form) > .quantity,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > .quantity{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;

  display: flex !important;
  align-items: stretch !important;

  /* separators around the middle value */
  border-left: 1px solid rgba(0,0,0,.25) !important;
  border-right: 1px solid rgba(0,0,0,.25) !important;
}

/* keep label accessible but out of layout */
body.single-product .woocommerce div.product form.cart .quantity .screen-reader-text{
  position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}

/* input itself */
body.single-product div.product form.cart:not(.variations_form) > .quantity input.qty,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > .quantity input.qty{
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;

  width: 56px !important;
  min-width: 56px !important;

  text-align: center !important;
  box-shadow: none !important;
}

/* Divider between qty block and add-to-basket button */
body.single-product div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{
  border-left: 1px solid rgba(0,0,0,.18) !important;
}

/* Add-to-basket button: let the OUTER pill handle the rounding */
body.single-product div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{
  padding: 0 22px !important;
  border-radius: 0 !important;

  background: var(--tss-maroon, #7f174a) !important;
  color: #fff !important;

  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;

  box-shadow: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* Swap visual order: minus left, plus right (markup is plus ... minus) */
body.single-product div.product form.cart:not(.variations_form) > button.minus,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.minus{ order: 1 !important; }

body.single-product div.product form.cart:not(.variations_form) > .quantity,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > .quantity{ order: 2 !important; }

body.single-product div.product form.cart:not(.variations_form) > button.plus,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.plus{ order: 3 !important; }

body.single-product div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{ order: 4 !important; }

/* Mobile: full width, button takes remaining space */
@media (max-width: 520px){
  body.single-product div.product form.cart:not(.variations_form),
  body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart{
    width: 100% !important;
  }

  body.single-product div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
  body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{
    flex: 1 1 auto !important;
  }
}

/* TSS SINGLE QTY FIX END */

/* ============================================================
   TSS SINGLE PRODUCT PILL MOBILE TUNING START
   Prevents pill/controls from squashing/overflowing on small screens
   ============================================================ */

@media (max-width: 520px){
  /* Keep everything on one row, but let the button take remaining space */
  body.single-product div.product form.cart:not(.variations_form),
  body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart{
    justify-content: flex-start !important; /* override space-between */
    gap: 10px !important;
    padding: 8px 10px !important;
  }

  body.single-product div.product form.cart:not(.variations_form) .quantity,
  body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart .quantity{
    flex: 0 0 auto !important;
  }

  body.single-product div.product form.cart:not(.variations_form) button.single_add_to_cart_button,
  body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart button.single_add_to_cart_button{
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    padding: 0 14px !important;
    font-size: 14px !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
}

/* Extra squeeze for very small phones */
@media (max-width: 360px){
  body.single-product .woocommerce div.product form.cart .quantity button.plus,
  body.single-product .woocommerce div.product form.cart .quantity button.minus{
    width: 40px !important;
    min-width: 40px !important;
  }

  body.single-product .woocommerce div.product form.cart .quantity input.qty{
    width: 48px !important;
    min-width: 48px !important;
  }

  body.single-product div.product form.cart:not(.variations_form) button.single_add_to_cart_button,
  body.single-product div.product form.variations_form .woocommerce-variation-add-to-cart button.single_add_to_cart_button{
    padding: 0 12px !important;
    font-size: 13px !important;
  }
}

/* TSS SINGLE PRODUCT PILL MOBILE TUNING END */

/* === TSS: WPMobileapp hide bottom search v1 ===
   Goal: remove the full-width Search control shown at the bottom in the app theme.
   Scope: app only (detected by .wpappninja.wpmobileapp marker).
================================================== */

body:has(.wpappninja.wpmobileapp) .wpappninja-search,
body:has(.wpappninja.wpmobileapp) .wpappninja_search,
body:has(.wpappninja.wpmobileapp) #wpappninja_search,
body:has(.wpappninja.wpmobileapp) .wpappninja-bottom-search,
body:has(.wpappninja.wpmobileapp) .wpappninja_bottom_search,
body:has(.wpappninja.wpmobileapp) .wpmobileapp-search,
body:has(.wpappninja.wpmobileapp) .wpmobileapp_search,
body:has(.wpappninja.wpmobileapp) #wpmobileapp-search,
body:has(.wpappninja.wpmobileapp) .native-interface-search,
body:has(.wpappninja.wpmobileapp) .native_interface_search,
body:has(.wpappninja.wpmobileapp) .bottom-search,
body:has(.wpappninja.wpmobileapp) .bottom_search,
body:has(.wpappninja.wpmobileapp) a[aria-label="Search"],
body:has(.wpappninja.wpmobileapp) button[aria-label="Search"],
body:has(.wpappninja.wpmobileapp) a[title="Search"],
body:has(.wpappninja.wpmobileapp) button[title="Search"]{
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* If it’s a bottom “bar” wrapper, kill the reserved space too */
body:has(.wpappninja.wpmobileapp) .wpappninja-bottom-bar,
body:has(.wpappninja.wpmobileapp) .wpmobileapp-bottom-bar{
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* === /TSS: WPMobileapp hide bottom search v1 === */


/* TSS_FIX_RESTORE_AWS_BUTTON */
#global-aws-search .aws-search-btn,
#global-aws-search .aws-form-btn,
#global-aws-search button[type="submit"],
#global-aws-search input[type="submit"]{
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* === TSS: hide fastest-store menu in WPMobileapp v1 === */
/* WPMobile.App injects .wpmobileapp/.wpappninja on the WebView body/html */

/* Hide the hamburger / menu toggle in-app */
body.wpmobileapp .fastest-shop-rd-navbar-toggle,
html.wpmobileapp .fastest-shop-rd-navbar-toggle,
body.wpappninja .fastest-shop-rd-navbar-toggle,
html.wpappninja .fastest-shop-rd-navbar-toggle{
  display: none !important;
}

/* Hide the actual off-canvas / mobile nav container in-app */
body.wpmobileapp #navbar,
html.wpmobileapp #navbar,
body.wpappninja #navbar,
html.wpappninja #navbar{
  display: none !important;
  visibility: hidden !important;
}

/* If the theme wraps the nav in a container, hide that too (harmless if absent) */
body.wpmobileapp .navbar-wrap,
body.wpappninja .navbar-wrap{
  display: none !important;
}

/* === /TSS: hide fastest-store menu in WPMobileapp v1 === */



/* === TSS: Hide AWS bar when WOC closed banner present v1 === */
body.tss-woc-banner-on #global-aws-search{
  display: none !important;
}
/* (optional) remove extra space if your CSS adds padding-bottom for the bar */
@media (max-width: 768px){
  body.tss-woc-banner-on{
    padding-bottom: 0 !important;
  }
}
/* === /TSS: Hide AWS bar when WOC closed banner present v1 === */