/* ═══════════════════════════════════════════════════════════════════
   DISTRACTION-FREE BASKET & CHECKOUT (theme v1.1.39)
   Loaded only when Shop Tweaks → Basket & Checkout → minimal layout is on
   and we're on basket / checkout / (optionally) order-received.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Header ───────────────────────────────────────────────────────── */
.co-header {
  position: sticky;
  top: var(--wp-bar-h, 0px);
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid var(--color-grey-200);
}
.co-header__bar { background: var(--color-charcoal-dark); }
.co-header__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 64px;
  padding: 0 var(--container-padding, 24px);
  max-width: var(--container-max, 1280px);
  margin: 0 auto;
}
.co-header__back,
.co-header__secure {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-subheading);
  font-size: var(--text-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-grey-400);
  text-decoration: none;
  white-space: nowrap;
}
.co-header__back:hover { color: var(--color-bronze-light); }
.co-header__secure { justify-self: end; }
.co-header__logo { display: block; line-height: 0; }
.co-header__logo img, .co-header__logo svg { height: 26px; width: auto; }

/* Progress strip */
.co-steps {
  list-style: none;
  margin: 0;
  padding: 10px var(--container-padding, 24px) 12px;
  display: flex;
  justify-content: center;
  gap: clamp(16px, 5vw, 48px);
  border-top: 1px solid var(--color-grey-100);
}
.co-steps__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-subheading);
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-grey-500);
}
.co-steps__num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid currentColor;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}
.co-steps__item.is-current { color: var(--color-charcoal); }
.co-steps__item.is-current .co-steps__num { background: var(--color-charcoal); border-color: var(--color-charcoal); color: #fff; }
.co-steps__item.is-done { color: var(--color-bronze); }

/* Page offset: replace the 100px dark-header clearance */
.checkout-minimal.has-solid-header #main-content { padding-top: var(--space-6); }

/* ── Footer ───────────────────────────────────────────────────────── */
.co-footer { border-top: 1px solid var(--color-grey-200); padding: var(--space-8) 0 var(--space-8); margin-top: var(--space-12); background: #fff; }
.co-footer__trust {
  list-style: none;
  margin: 0 0 var(--space-6);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-3) var(--space-8);
}
.co-footer__trust li { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-subheading); font-size: var(--text-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-grey-700); }
.co-footer__icon { color: var(--color-bronze); width: 1.1em; height: 1.1em; }
.co-footer__legal { text-align: center; font-size: var(--text-xs); color: var(--color-grey-600); }
.co-footer__legal p { margin: 0 0 var(--space-2); }
.co-footer__links { list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; gap: var(--space-5); flex-wrap: wrap; }
.co-footer__links a { color: var(--color-grey-600); text-decoration: none; }
.co-footer__links a:hover { color: var(--color-bronze); }
.co-footer__help { margin-top: var(--space-3) !important; }

/* ── Live chat widget hidden while paying ─────────────────────────── */
.checkout-minimal--no-chat #chat-widget-container { display: none !important; }

/* ── Cart block: mobile tidy-ups (rewritten v1.1.49) ───────────────── */
/* Page-content "BASKET" / "CHECKOUT" banner block: the header strip already
   names the step, so the band is optional (Shop Tweaks). */
.checkout-minimal--no-page-header .block-section-header { display: none; }
.checkout-minimal .block-section-header { padding-top: var(--space-4); }

/* Cross-sells block: heading + cards in theme voice on every viewport */
.checkout-minimal .wp-block-woocommerce-cart-cross-sells-block { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--color-grey-200); }
.checkout-minimal .wp-block-woocommerce-cart-cross-sells-block .wp-block-heading {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 400;
  letter-spacing: 0.02em;
  margin: 0 0 var(--space-5);
}
.checkout-minimal .cross-sells-product .wc-block-components-product-name { font-family: var(--font-subheading); font-size: var(--text-sm); color: var(--color-charcoal); text-decoration: none; }
.checkout-minimal .cross-sells-product .wc-block-components-product-price { font-size: var(--text-sm); color: var(--color-grey-700); margin-bottom: var(--space-3); }
/* Cross-sell buttons: styled in woocommerce.css (v1.1.50) so they match the
   product-grid "Shop now" button whether or not the minimal layout is on. */

@media (max-width: 720px) {
  /* Order on phones: items → totals + checkout → cross-sells (WC puts the
     cross-sells inside the items column, so they'd otherwise sit above the
     total). Only in column layout, hence the narrow breakpoint. */
  .checkout-minimal .wc-block-cart .wc-block-components-sidebar-layout > .wc-block-cart__main { display: contents; }
  .checkout-minimal .wc-block-cart .wp-block-woocommerce-cart-line-items-block { order: 1; width: 100%; }
  .checkout-minimal .wc-block-cart .wc-block-cart__sidebar { order: 2; width: 100%; }
  .checkout-minimal .wc-block-cart .wp-block-woocommerce-cart-cross-sells-block { order: 3; width: 100%; }

  .checkout-minimal--xsell-hide .wp-block-woocommerce-cart-cross-sells-block,
  .checkout-minimal--xsell-hide .wp-block-woocommerce-product-new { display: none !important; }

  /* Horizontal strip: 1.6 cards visible so the scroll is obvious */
  .checkout-minimal--xsell-strip .wc-block-cart__cross-sells,
  .checkout-minimal--xsell-strip .wp-block-woocommerce-cart-cross-sells-block :has(> .cross-sells-product) {
    display: flex;
    gap: var(--space-3);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin: 0 calc(-1 * var(--container-padding, 20px));
    padding: 0 var(--container-padding, 20px) var(--space-2);
  }
  .checkout-minimal--xsell-strip .wc-block-cart__cross-sells::-webkit-scrollbar,
  .checkout-minimal--xsell-strip .wp-block-woocommerce-cart-cross-sells-block :has(> .cross-sells-product)::-webkit-scrollbar { display: none; }
  .checkout-minimal--xsell-strip .cross-sells-product {
    display: block !important;
    flex: 0 0 58%;
    width: auto !important;
    padding-right: 0 !important;
    margin-bottom: 0 !important;
    text-align: left !important;
    scroll-snap-align: start;
  }
  .checkout-minimal--xsell-strip .cross-sells-product .wc-block-components-product-image { margin-bottom: var(--space-2) !important; }

  /* WooCommerce's own fixed "Proceed to checkout" bar (it adds
     --sticky when the real button is below the fold): brand it and leave
     room for the total that checkout-minimal.js injects. */
  .checkout-minimal .wc-block-cart .wc-block-cart__submit-container--sticky {
    padding: 10px var(--container-padding, 20px) calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    border-top: 1px solid var(--color-grey-200);
    box-shadow: 0 -8px 24px -12px rgba(0, 0, 0, 0.25);
    background: rgba(255, 255, 255, 0.97) !important;
  }
  .checkout-minimal .co-sticky-total { display: none; }
  .checkout-minimal .wc-block-cart__submit-container--sticky .co-sticky-total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 0 0 8px;
    font-family: var(--font-subheading);
    font-size: var(--text-xs);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-grey-600);
  }
  .checkout-minimal .co-sticky-total strong { font-family: var(--font-body); font-size: var(--text-base); letter-spacing: 0; text-transform: none; color: var(--color-charcoal); }
  .checkout-minimal--sticky-cta .wc-block-cart__submit-container--sticky .wc-block-cart__submit-button { width: 100%; }
  /* Option off → let the button scroll with the page */
  .checkout-minimal:not(.checkout-minimal--sticky-cta) .wc-block-cart__submit-container--sticky { position: static !important; padding: 0 !important; box-shadow: none; border: 0; }
}

@media (max-width: 600px) {
  .co-header__inner { height: 56px; grid-template-columns: 1fr auto 1fr; }
  .co-header__back span { display: none; }           /* arrow only */
  .co-header__secure span { display: none; }         /* lock only */
  .co-header__logo img, .co-header__logo svg { height: 22px; }
  .co-steps { gap: 18px; padding-top: 8px; padding-bottom: 10px; }
  .co-steps__label { display: none; }
  .co-steps__item.is-current .co-steps__label { display: inline; }
}