/* ── Shop checkout, reworked (owner approved the mock-up 2026-11-02:
   https://claude.ai/artifact/EegfZZ6SkGZ1yHJ2LKR5ZU). Loaded ONLY on the basket and checkout pages,
   after woocommerce.css (g3m-checkout-look.php), so these rules win on order — the !important flags
   below exist only where woocommerce.css itself used !important.
   Numbered steps in cards, plain-case headings and labels, rounded fields, a sticky summary,
   the express buttons framed at the top, and a grey placeholder while Stripe draws the card form.
   ⚠ Stripe copies the look of `.wc-block-components-text-input` (#email, its label) into the card
   form, so the field rules here also style the card number box. Keep them readable on dark. */

.wc-block-checkout {
  --co-panel: var(--card, #0b1120);
  --co-field: #071525;
  --co-line: #1e3a50;
  --co-dim: #8fa6ba;
  --co-ink: #eef3f8;
  --co-key: var(--cyan, #00fff7);
  --co-good: #34d399;
  counter-reset: co-step;
}

/* ── Steps as numbered cards ── */
.wc-block-checkout .wc-block-components-checkout-step,
.wc-block-checkout .wc-block-components-checkout-step--with-step-number {
  background: var(--co-panel);
  border: 1px solid var(--co-line) !important;
  border-radius: 12px;
  padding: 22px 22px 24px !important;
  margin-bottom: 16px;
}
.wc-block-checkout .wc-block-components-checkout-step__heading { margin: 0 0 14px; }
.wc-block-checkout .wc-block-components-checkout-step__title {
  counter-increment: co-step;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--co-ink);
}
.wc-block-checkout .wc-block-components-checkout-step__title::before {
  content: counter(co-step) !important;
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-size: 12px;
  line-height: 1;
}
.wc-block-checkout .wc-block-components-checkout-step__description { color: var(--co-dim); font-size: 13px; margin: 6px 0 0 38px; }
.wc-block-checkout .wc-block-checkout__guest-checkout-notice { color: var(--co-dim); font-size: 13px; }

/* ── Fields: labels above, plain case, rounded ── */
.wc-block-checkout .wc-block-components-text-input label,
.wc-block-checkout .wc-blocks-components-select__label {
  font-size: 13px !important;
  letter-spacing: 0;
  text-transform: none;
  color: var(--co-dim) !important;
}
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-blocks-components-select__select,
.wc-block-checkout .wc-block-components-address-form input:not([type="checkbox"]):not([type="radio"]),
.wc-block-checkout .wc-block-components-address-form select {
  border-radius: 8px !important;
  border-color: var(--co-line) !important;
  min-height: 48px;
}
.wc-block-checkout .wc-blocks-components-select__container { border-radius: 8px; }
.wc-block-checkout .wc-block-components-address-form__address_2-toggle { color: var(--co-key); font-size: 13px; }

/* ── Delivery and payment choices as bordered rows ── */
.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option {
  border: 1px solid var(--co-line) !important;
  border-radius: 10px;
  margin-bottom: 10px;
  padding: 14px 14px 14px 46px !important;
}
.wc-block-checkout .wc-block-components-radio-control__option--checked-option-highlighted,
.wc-block-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
  border-color: var(--co-key) !important;
  background: rgba(0, 255, 247, 0.04);
}
.wc-block-checkout .wc-block-components-radio-control .wc-block-components-radio-control__option .wc-block-components-radio-control__input { left: 14px; }
.wc-block-checkout .wc-block-components-radio-control__label { font-weight: 600; color: var(--co-ink); }
.wc-block-checkout .wc-block-components-radio-control__secondary-label { color: var(--co-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.wc-block-checkout .wc-block-components-radio-control__description,
.wc-block-checkout .wc-block-components-radio-control__secondary-description { color: var(--co-dim); font-size: 13px; }
.wc-block-checkout .wc-block-components-radio-control-accordion-content { padding: 12px 0 0; }

/* ── Express checkout framed at the top (checkout page only; woocommerce.css hides it elsewhere) ── */
.wc-block-checkout .wc-block-components-express-payment,
.wc-block-checkout .wc-block-components-express-payment-continue-rule { display: block !important; }
.wc-block-checkout .wc-block-components-express-payment {
  border: 1px solid var(--co-line);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 14px;
}
.wc-block-checkout .wc-block-components-express-payment__title-container { text-align: center; }
.wc-block-checkout .wc-block-components-express-payment__title {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--co-dim) !important;
}
.wc-block-checkout .wc-block-components-express-payment-continue-rule {
  color: var(--co-dim);
  font-size: 13px;
  text-transform: none;
  letter-spacing: 0;
  margin: 0 0 18px;
}
.wc-block-checkout .wc-block-components-express-payment-continue-rule::before,
.wc-block-checkout .wc-block-components-express-payment-continue-rule::after { border-color: var(--co-line); }
/* Hide the express area entirely while it has no buttons (e.g. a download in the basket). */
.wc-block-checkout .wc-block-components-express-payment:not(:has(iframe, button)),
.wc-block-checkout .wc-block-components-express-payment:not(:has(iframe, button)) + .wc-block-components-express-payment-continue-rule { display: none !important; }

/* ── Grey placeholder until Stripe has drawn the card form (checkout.js sets .g3m-co-loading) ── */
.wc-block-checkout .wcstripe-payment-element { position: relative; min-height: 48px; }
.wc-block-checkout .wcstripe-payment-element.g3m-co-loading { min-height: 168px; }
.wc-block-checkout .wcstripe-payment-element.g3m-co-loading::before {
  content: "Loading the secure card form…";
  position: absolute;
  inset: 0;
  display: grid;
  align-content: end;
  padding: 0 0 6px;
  font-size: 13px;
  color: var(--co-dim);
  background:
    linear-gradient(var(--co-field), var(--co-field)) 0 0 / 100% 48px no-repeat,
    linear-gradient(var(--co-field), var(--co-field)) 0 60px / 48% 48px no-repeat,
    linear-gradient(var(--co-field), var(--co-field)) 100% 60px / 48% 48px no-repeat;
  border-radius: 8px;
  pointer-events: none;
}
/* No pulse: an opacity animation would take the placeholder text below readable contrast (LESSONS). */

/* ── Terms line and the pay button ── */
.wc-block-checkout .wc-block-checkout__terms {
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--co-dim) !important;
  line-height: 1.55;
}
.wc-block-checkout .wc-block-components-checkout-place-order-button {
  min-height: 54px;
  border-radius: 10px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}
.wc-block-checkout .wc-block-checkout__actions_row { flex-direction: column; align-items: stretch; gap: 12px; }
.g3m-co-trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 18px;
  margin: 12px 0 0;
  font-size: 12px;
  color: #8fa6ba;
}

/* ── Order summary: a panel that stays beside you on desktop ── */
.wc-block-checkout .wc-block-checkout__sidebar {
  background: var(--co-panel) !important;
  border: 1px solid var(--co-line) !important;
  border-radius: 12px;
}
@media (min-width: 783px) {
  .wc-block-checkout .wc-block-checkout__sidebar.is-sticky { top: 24px; }
}
.wc-block-checkout .wc-block-components-checkout-order-summary__title-text,
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block h2 {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.wc-block-checkout .wc-block-components-totals-item__label { color: var(--co-dim); }
.wc-block-checkout .wc-block-components-totals-item__value { font-variant-numeric: tabular-nums; }
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-size: 22px !important; }

/* The two lines checkout.js adds to the summary */
.g3m-co-meta { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 4px; }
.g3m-co-meta p {
  margin: 0;
  font-size: 13px;
  border-radius: 8px;
  padding: 8px 10px;
}
.g3m-co-meta .g3m-co-points { border: 1px solid rgba(52, 211, 153, 0.35); color: #b9f3dc; }
.g3m-co-meta .g3m-co-free { border: 1px dashed #1e5a6a; color: #c9d6e2; }
.g3m-co-meta strong { color: #fff; }

/* ── Polish after the first render (2026-11-02) ── */
/* 1. The country box's floating label sat on top of the chosen country. */
.wc-block-checkout .wc-blocks-components-select__select {
  padding: 22px 14px 6px !important;
  height: auto;
  line-height: 1.3;
}
.wc-block-checkout .wc-blocks-components-select__label { top: 7px; left: 14px; font-size: 12px !important; }

/* 2. Payment: one framed choice, not a box inside a box. */
.wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option {
  border: 0 !important;
  margin: 0;
  padding: 0 !important;
  background: transparent;
}

/* 3 + 4. Tick-box labels and the terms line in plain case, readable size. */
.wc-block-checkout .wc-block-components-checkbox__label,
.wc-block-checkout .wc-block-checkout__terms,
.wc-block-checkout .wc-block-checkout__terms * {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.wc-block-checkout .wc-block-components-checkbox__label { color: var(--co-ink) !important; }
.wc-block-checkout .wc-block-checkout__terms { color: var(--co-dim) !important; }
.wc-block-checkout .wc-block-checkout__terms a { color: var(--co-key) !important; }

/* 5. On phones the order summary reuses the step-title class: no number for it, and it does not count. */
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-step__title { counter-increment: none; }
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-step__title::before { display: none !important; }

/* ═══ BASKET, reworked (owner approved the mock-up 2026-11-02: https://claude.ai/artifact/GhyQAWPxvTSi8Q9YxWYoVE) ═══
   Same world as the checkout above. Items as card rows (picture | details | line total), a plain summary card,
   a solid "Go to checkout" button, and on phones a bottom bar with the total that never covers the totals.
   Scoped to .wp-block-woocommerce-cart; !important only where woocommerce.css used it. */
.wp-block-woocommerce-cart {
  --co-panel: var(--card, #0b1120);
  --co-field: #071525;
  --co-line: #1e3a50;
  --co-dim: #8fa6ba;
  --co-ink: #eef3f8;
  --co-key: var(--cyan, #00fff7);
  --co-good: #34d399;
}

/* Items: drop the table header and turn each row into a card. */
.wp-block-woocommerce-cart .wc-block-cart-items__header { display: none !important; }
.wp-block-woocommerce-cart table.wc-block-cart-items,
.wp-block-woocommerce-cart table.wc-block-cart-items tbody { display: block !important; width: 100%; border: 0 !important; background: none !important; }
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row {
  display: grid !important;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  background: var(--co-panel);
  border: 1px solid var(--co-line) !important;
  border-radius: 12px;
  padding: 16px !important;
  margin: 0 0 12px;
}
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row td {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  width: auto !important;
}
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__image { grid-column: 1 !important; grid-row: 1 !important; width: 88px !important; }
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__image img { width: 88px !important; height: 88px !important; border-radius: 10px; object-fit: cover; }
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__product { grid-column: 2 !important; grid-row: 1 !important; min-width: 0; }
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__total { grid-column: 3 !important; grid-row: 1 !important; text-align: right; padding: 0 !important; }
.wp-block-woocommerce-cart .wc-block-cart-item__wrap { display: flex; flex-direction: column; gap: 4px; }
.wp-block-woocommerce-cart .wc-block-components-product-name { font-size: 16px !important; font-weight: 600; }
.wp-block-woocommerce-cart .wc-block-cart-item__prices,
.wp-block-woocommerce-cart .wc-block-cart-item__prices .wc-block-components-formatted-money-amount {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--co-dim) !important;
  padding: 0 !important;
  margin: 0 !important;
}
.wp-block-woocommerce-cart .wc-block-cart-item__prices { display: inline-flex !important; align-items: baseline; gap: 4px; }
.wp-block-woocommerce-cart .wc-block-cart-item__prices .wc-block-components-product-price { padding: 0 !important; margin: 0 !important; }
.wp-block-woocommerce-cart .wc-block-cart-item__prices::after { content: "each"; }
.wp-block-woocommerce-cart .wc-block-components-product-metadata { color: var(--co-dim); font-size: 13px; }
.wp-block-woocommerce-cart .wc-block-cart-item__total .wc-block-components-formatted-money-amount {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700;
  color: var(--co-ink) !important;
  font-variant-numeric: tabular-nums;
}
/* Quantity: a bigger control and a plain "Remove" link beside it. */
.wp-block-woocommerce-cart .wc-block-cart-item__quantity { display: flex !important; align-items: center; gap: 14px; margin-top: 10px; flex-wrap: wrap; }
.wp-block-woocommerce-cart .wc-block-components-quantity-selector {
  height: 40px;
  border: 1px solid var(--co-line) !important;
  border-radius: 8px !important;
  overflow: hidden;
  background: var(--co-field);
  width: 128px !important;
}
.wp-block-woocommerce-cart .wc-block-components-quantity-selector__button { min-width: 40px !important; color: var(--co-key) !important; font-size: 18px !important; }
.wp-block-woocommerce-cart .wc-block-components-quantity-selector__input {
  font-weight: 600 !important;
  font-size: 15px !important;
  border-left: 1px solid var(--co-line) !important;
  border-right: 1px solid var(--co-line) !important;
  min-height: 38px;
}
.wp-block-woocommerce-cart .wc-block-cart-item__remove-link {
  color: var(--co-dim) !important;
  font-size: 13px !important;
  text-decoration: underline !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  min-height: 24px;
}
.wp-block-woocommerce-cart .wc-block-cart-item__remove-link svg { display: none; }
.wp-block-woocommerce-cart .wc-block-cart-item__remove-link::after { content: "Remove"; }

/* Free-delivery bar, item count and "Continue shopping" (added by checkout.js). */
.g3m-cart-free {
  border: 1px dashed #1e5a6a;
  border-radius: 12px;
  padding: 14px 16px;
  margin: 0 0 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 14px;
  color: #c9d6e2;
}
.g3m-cart-free strong { color: #fff; }
.g3m-cart-free__track { height: 6px; border-radius: 999px; background: #16243a; overflow: hidden; }
.g3m-cart-free__fill { height: 100%; border-radius: 999px; background: var(--cyan, #00fff7); }
.g3m-cart-free.is-free { border-style: solid; border-color: rgba(52, 211, 153, 0.45); color: #b9f3dc; }
.g3m-cart-count { color: #8fa6ba; font-size: 15px; font-family: 'Inter', sans-serif; margin-left: 12px; text-transform: none; letter-spacing: 0; }
.g3m-cart-continue { display: inline-block; margin: 4px 0 0; font-size: 14px; color: var(--cyan, #00fff7); }

/* Summary card. */
.wp-block-woocommerce-cart .wc-block-cart__sidebar {
  background: var(--co-panel) !important;
  border: 1px solid var(--co-line) !important;
  border-radius: 12px;
  padding: 20px !important;
}
.wp-block-woocommerce-cart .wc-block-cart__sidebar::before { display: none !important; }
.wp-block-woocommerce-cart .wc-block-cart__totals-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--co-ink) !important;
  padding: 0 0 8px !important;
}
.wp-block-woocommerce-cart .wc-block-components-totals-item__label { color: var(--co-dim); text-transform: none; letter-spacing: 0; }
.wp-block-woocommerce-cart .wc-block-components-totals-item__value { font-variant-numeric: tabular-nums; }
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-size: 22px !important; }
.wp-block-woocommerce-cart .wc-block-cart__submit-button {
  min-height: 54px;
  border-radius: 10px !important;
  background: var(--co-key) !important;
  border-color: var(--co-key) !important;
  color: #00201f !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}
.wp-block-woocommerce-cart .g3m-co-trust { margin-top: 14px; }

/* Phones: one column; the sticky bar shows the total and the page leaves room for it. */
@media (max-width: 781px) {
  .wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row { grid-template-columns: 72px minmax(0, 1fr); }
  .wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__image,
  .wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__image img { width: 72px !important; height: 72px !important; }
  .wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-item__total { grid-column: 2 !important; grid-row: 2 !important; text-align: left; }
  .wp-block-woocommerce-cart .wc-block-cart { padding-bottom: 96px; }
  .wp-block-woocommerce-cart .wc-block-cart__submit-container--sticky {
    display: flex !important;
    align-items: center;
    gap: 12px;
    padding: 12px 16px !important;
    background: rgba(6, 10, 16, 0.96) !important;
    border-top: 1px solid var(--co-line);
    box-shadow: none !important;
  }
  .wp-block-woocommerce-cart .wc-block-cart__submit-container--sticky::before { display: none !important; }
  .wp-block-woocommerce-cart .wc-block-cart__submit-container--sticky .wc-block-cart__submit-button { flex: 1; min-height: 48px; }
  .g3m-cart-bar-total { display: flex; flex-direction: column; font-size: 12px; color: #8fa6ba; line-height: 1.2; }
  .g3m-cart-bar-total strong { font-size: 18px; color: #fff; }
}
@media (min-width: 782px) { .g3m-cart-bar-total { display: none; } }

/* Phones: lift the floating "Report a bug" and help buttons above the basket's bottom bar (they covered the total). */
@media (max-width: 781px) {
  body:has(.wc-block-cart__submit-container--sticky) .bb-fab,
  body:has(.wc-block-cart__submit-container--sticky) #bb-fab,
  body:has(.wc-block-cart__submit-container--sticky) #g3m-support-toggle { bottom: 102px !important; }   /* bar is 90px tall, measured */
}

/* ═══ Closing the gaps with the approved checkout mock-up (2026-11-02) ═══ */

/* Slim header: "Basket › Checkout › Done", the title, "Secure checkout". */
.g3m-co-header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 20px; }
.g3m-co-header__steps { order: 0; flex-basis: 100%; margin: 0; font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #8fa6ba; }
.g3m-co-header__steps strong { color: var(--cyan, #00fff7); font-weight: 700; }
.g3m-co-header__title { margin: 0; font-family: 'Syne', sans-serif; font-size: clamp(26px, 4vw, 34px); }
.g3m-co-header__secure { margin: 0; font-size: 13px; color: #8fa6ba; }

/* Labels ABOVE the fields, not floating inside them. */
.wc-block-checkout .wc-block-components-text-input,
.wc-block-checkout .wc-blocks-components-select__container {
  display: flex !important;
  flex-direction: column-reverse;
  gap: 6px;
  margin-top: 14px !important;
}
.wc-block-checkout .wc-block-components-text-input label,
.wc-block-checkout .wc-blocks-components-select__label {
  position: static !important;
  transform: none !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  max-width: none !important;
}
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-blocks-components-select__select { padding: 12px 14px !important; min-height: 46px; }
.wc-block-checkout .wc-blocks-components-select__container { height: auto !important; }
.wc-block-checkout .wc-blocks-components-select__label { order: 2; }
.wc-block-checkout .wc-blocks-components-select__select { order: 1; }

/* The free-delivery line under the delivery choice (checkout.js). */
.g3m-co-free-inline { margin: 4px 0 0; font-size: 13px; color: var(--co-good); }

/* Summary as in the mock-up: one card, plain numbers, no box inside a box. */
.wc-block-checkout .wc-block-components-order-summary,
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
.wc-block-checkout .wc-block-components-order-summary-item__image img { width: 56px !important; height: 56px !important; border-radius: 8px; object-fit: cover; }
.wc-block-checkout .wc-block-components-order-summary-item__quantity {
  background: #8fa6ba !important; color: #060a10 !important; border: 0 !important; font-weight: 700;
}
.wc-block-checkout .wc-block-components-order-summary-item .wc-block-components-product-name { font-weight: 600; }
.wc-block-checkout .wc-block-components-order-summary-item__individual-prices { display: none; }
.wc-block-checkout .wc-block-components-order-summary-item__description,
.wc-block-checkout .wc-block-components-product-metadata { color: var(--co-dim) !important; font-size: 13px !important; }
.wc-block-checkout .wc-block-components-order-summary-item__total-price .wc-block-components-formatted-money-amount,
.wc-block-checkout .wc-block-components-totals-item__value,
.wc-block-checkout .wc-block-components-totals-item__value .wc-block-components-formatted-money-amount {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  color: var(--co-ink) !important;
  font-variant-numeric: tabular-nums;
}
.wc-block-checkout .wc-block-components-totals-item { padding: 6px 0 !important; }
.wc-block-checkout .wc-block-components-totals-wrapper { border-color: var(--co-line) !important; padding: 10px 0 !important; }
.wc-block-checkout .wc-block-components-totals-item__label { font-size: 14px !important; }
.wc-block-checkout .wc-block-components-totals-item__description,
.wc-block-checkout .wc-block-components-totals-shipping__via { color: var(--co-dim) !important; font-size: 12px !important; }
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font-size: 16px !important; font-weight: 600 !important; color: var(--co-ink) !important; }
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value .wc-block-components-formatted-money-amount {
  font-size: 22px !important;
  font-weight: 700 !important;
}
.wc-block-checkout .wc-block-components-totals-footer-item-tax { color: var(--co-dim) !important; font-size: 12px !important; }
.wc-block-checkout .wc-block-components-totals-item__value { color: var(--co-ink); }
.wc-block-checkout .wc-block-components-totals-discount .wc-block-components-totals-item__value,
.wc-block-checkout .wc-block-components-totals-fees .wc-block-components-totals-item__value,
.wc-block-checkout .wc-block-components-totals-fees .wc-block-components-formatted-money-amount { color: var(--co-good) !important; }
/* Polish 2 (2026-11-02): the country label sat on a white strip; payment content touched the edge; a stray border under the delivery options. */
.wc-block-checkout .wc-blocks-components-select__container { background: transparent !important; border: 0 !important; }
.wc-block-checkout .wc-blocks-components-select__label { background: transparent !important; padding: 0 !important; color: var(--co-dim) !important; }
.wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-content { padding: 12px 16px 16px !important; }
.wc-block-checkout #shipping-option .wc-block-components-radio-control,
.wc-block-checkout #shipping-option .wc-block-components-shipping-rates-control__package { border: 0 !important; box-shadow: none !important; padding-bottom: 0 !important; }

/* ── FIX 2026-11-03 (owner's screenshot): the order summary slid over the form. WooCommerce stacks the
   summary above the form when the CHECKOUT ITSELF is narrower than ~1000px (it marks the layout is-medium /
   is-small / is-mobile), but woocommerce.css still pinned it at 380px wide and position:sticky; top:100px —
   and only released that below a 768px WINDOW. From 768px to ~1048px windows the stacked summary stayed
   pinned and covered the steps when scrolled. Follow WooCommerce's own layout classes, not window widths. */
.wc-block-components-sidebar-layout:is(.is-medium, .is-small, .is-mobile) {
  flex-direction: column !important;
}
.wc-block-components-sidebar-layout:is(.is-medium, .is-small, .is-mobile) > .wc-block-components-sidebar,
.wc-block-components-sidebar-layout:is(.is-medium, .is-small, .is-mobile) > .wc-block-components-main {
  position: static !important;
  top: auto !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* ── Sorting the basket + checkout (2026-11-03, owner: "still need the cart and checkout page sorted") ── */
/* Basket summary heading: woocommerce.css hid WooCommerce's own heading for a ::before label that is now gone,
   leaving an empty band. Show the real one ("Summary", via the wording filter). */
.wp-block-woocommerce-cart .wc-block-cart__totals-title { display: block !important; margin: 0 0 6px !important; padding: 0 !important; border: 0 !important; }

/* Basket summary numbers: plain, as on the checkout (woocommerce.css made every value gold Space Mono with 14px rows). */
.wp-block-woocommerce-cart .wc-block-components-totals-item { padding: 6px 0 !important; border-bottom: 0 !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-wrapper { border-color: var(--co-line) !important; padding: 10px 0 !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-item__label { font-size: 14px !important; color: var(--co-dim) !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-item__value,
.wp-block-woocommerce-cart .wc-block-components-totals-item__value .wc-block-components-formatted-money-amount {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--co-ink) !important;
}
.wp-block-woocommerce-cart .wc-block-components-totals-item__description,
.wp-block-woocommerce-cart .wc-block-components-totals-shipping__via { color: var(--co-dim) !important; font-size: 12px !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-fees .wc-block-components-totals-item__value,
.wp-block-woocommerce-cart .wc-block-components-totals-fees .wc-block-components-formatted-money-amount,
.wp-block-woocommerce-cart .wc-block-components-totals-discount .wc-block-components-totals-item__value { color: var(--co-good) !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font-size: 16px !important; font-weight: 600 !important; color: var(--co-ink) !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value .wc-block-components-formatted-money-amount { font-size: 22px !important; font-weight: 700 !important; }
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item-tax { color: var(--co-dim) !important; font-size: 12px !important; }

/* The points box (g3m-loyalty.php) lined up with the page and in the same plain style, on both pages. */
.g3m-loyalty-block.loyalty-redeem-wrap {
  max-width: 1100px;
  margin: 0 auto 16px !important;
  border: 1px solid #1e3a50 !important;
  border-radius: 12px;
  background: var(--card, #0b1120) !important;
  padding: 16px 20px !important;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.g3m-loyalty-block .loyalty-redeem-title { font-size: 15px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; }
.g3m-loyalty-block .loyalty-redeem-balance { margin-left: auto; font-size: 14px !important; }
.g3m-loyalty-block .loyalty-redeem-hint { font-size: 13px !important; color: #8fa6ba !important; margin: 0; }
.g3m-loyalty-block .loyalty-redeem-input { border-radius: 8px !important; min-height: 44px; }
.g3m-loyalty-block .loyalty-redeem-btn { border-radius: 8px !important; min-height: 44px; text-transform: none !important; letter-spacing: 0 !important; font-weight: 700; }
/* Same width as the columns below it: the basket's layout is 1200px wide, the checkout's 1100px (woocommerce.css). */
.woocommerce-cart-wrap .g3m-loyalty-block.loyalty-redeem-wrap { max-width: 1200px; }

/* ── Audit fixes (2026-11-03, MCP screenshot audit items 2–5 and 7) ── */
/* 2. The radio sits IN the option's flow (not absolutely placed), so the 46px left padding pushed the text
      79px in and squeezed the delivery names onto three lines on phones. Small padding; the radio supplies the gap. */
.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option .wc-block-components-radio-control__option {
  padding: 14px !important;
  display: flex !important;
  align-items: flex-start;
  gap: 12px;
}
.wc-block-checkout .wc-block-components-radio-control .wc-block-components-radio-control__option .wc-block-components-radio-control__input {
  position: relative !important;   /* in the flow, but still the anchor for the checked dot (woocommerce.css ::after) */
  left: auto !important;
  top: auto !important;
  flex: none;
  margin: 2px 0 0 !important;
  transform: none !important;
}
.wc-block-checkout .wc-block-components-radio-control__option-layout { flex: 1 1 auto; min-width: 0; }

/* 3. Payment option header: name and "Test Mode" badge left-aligned beside the radio, not centred. */
.wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control__label,
.wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option__label {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start !important;
  gap: 6px 8px;
  text-align: left !important;
}
.wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control__label-group { justify-content: flex-start !important; }

/* 4. Stripe: "the parent container is not wide enough for Express Checkout Element" — give it the full width. */
.wc-block-checkout .wc-block-components-express-payment { padding: 12px !important; }
.wc-block-checkout .wc-block-components-express-payment__content { padding: 0 !important; margin: 0 !important; width: 100%; }

/* 5. WooCommerce draws the selected-option outline as a pseudo-element; with our own borders it left a stray empty box. */
.wc-block-checkout .wc-block-components-radio-control--highlight-checked::after,
.wc-block-checkout .wc-block-components-radio-control--highlight-checked::before,
.wc-block-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted::after { display: none !important; content: none !important; }

/* 7. Empty summary sections (fees, discounts, taxes when there are none) were still 20px tall each. */
.wc-block-components-totals-wrapper { padding: 0 !important; }
.wc-block-components-totals-wrapper > *:first-child { padding-top: 8px; }
.wc-block-components-totals-wrapper > *:last-child { padding-bottom: 8px; }
.wc-block-components-totals-wrapper:not(:has(*)) ,
.wc-block-components-totals-wrapper:not(:has(.wc-block-components-totals-item, .wc-block-components-totals-coupon, .wc-block-components-panel, .wc-block-components-order-summary, .g3m-co-meta, .wc-block-components-totals-footer-item, button, input)) { display: none !important; }
/* 3b. A Style Editor override (g3m_style_overrides / style-overrides.json seed) gives
   `#radio-control-wc-payment-method-options-stripe__label > span` 50px left padding !important — it cleared the radio
   when the radio floated over the text. The radio now sits in line (2 above), so that 50px centred the label.
   The Style Editor prints last and uses !important, so beat it on SPECIFICITY (same id + two classes), not order.
   It can also be removed in the Style Editor itself; this rule is then simply redundant. */
.wc-block-checkout .wc-block-checkout__payment-method #radio-control-wc-payment-method-options-stripe__label > span,
.wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control__label > span { padding-left: 0 !important; }

/* ── Owner's screenshots 2026-11-03: in the stacked (narrower) layouts the order summary's content touched its frame —
   "Your order" flush left in the collapsed panel, the product image sitting on the border of the box above Pay.
   The frames (the stacked sidebar card, and .checkout-order-summary-block-fill) had borders but no padding once the
   summary's own padding was removed for desktop. Pad the FRAMES, consistently with the other cards. */
.wc-block-components-sidebar-layout:is(.is-medium, .is-small, .is-mobile) > .wc-block-checkout__sidebar {
  padding: 4px 16px !important;
  border-radius: 12px;
}
.wc-block-checkout .checkout-order-summary-block-fill {
  padding: 4px 16px 8px !important;
  border: 1px solid #1e3a50 !important;
  border-radius: 12px;
  background: var(--card, #0b1120);
}
.wc-block-checkout .wc-block-components-checkout-order-summary__title { padding-left: 0 !important; padding-right: 0 !important; }
/* Phones: woocommerce.css padded the form column on one side only (40px left / 24px right at 390). Every card now
   sits 24px from both edges, the same as the collapsed order summary above it. */
.wc-block-components-sidebar-layout.is-mobile > .wc-block-checkout__main,
.wc-block-components-sidebar-layout.is-mobile > .wc-block-checkout__sidebar { margin-left: 0 !important; margin-right: 0 !important; }
.wc-block-components-sidebar-layout.is-mobile > .wc-block-checkout__main { padding-left: 0 !important; padding-right: 0 !important; }
/* Inside the box above Pay, WooCommerce pads some rows again (totals 12px, coupon toggle 16px), so rows started at three
   different depths. The frame supplies the padding; rows add none. Same as the desktop summary, which already measures even. */
.wc-block-checkout .checkout-order-summary-block-fill .wc-block-components-totals-item,
.wc-block-checkout .checkout-order-summary-block-fill .wc-block-components-totals-coupon,
.wc-block-checkout .checkout-order-summary-block-fill .wc-block-components-panel__button,
.wc-block-checkout .checkout-order-summary-block-fill .wc-block-components-panel,
.wc-block-checkout .checkout-order-summary-block-fill .wc-block-components-order-summary,
.wc-block-checkout .checkout-order-summary-block-fill .wc-block-components-totals-footer-item { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
/* Style Editor adjustments from the old layout indent every summary LABEL 12px and every AMOUNT 12px (printed last,
   !important), but not the coupon row, product image or delivery note — so rows started at different depths
   (owner's screenshot). Overridden on specificity for the basket and checkout only; the Style Editor entries remain. */
.wc-block-checkout .wc-block-components-totals-item .wc-block-components-totals-item__label,
.wp-block-woocommerce-cart .wc-block-components-totals-item .wc-block-components-totals-item__label { padding-left: 0 !important; }
.wc-block-checkout .wc-block-components-totals-item .wc-block-formatted-money-amount.wc-block-components-formatted-money-amount.wc-block-components-totals-item__value,
.wp-block-woocommerce-cart .wc-block-components-totals-item .wc-block-formatted-money-amount.wc-block-components-formatted-money-amount.wc-block-components-totals-item__value,
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-formatted-money-amount.wc-block-components-formatted-money-amount.wc-block-components-totals-footer-item-tax-value,
.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-formatted-money-amount.wc-block-components-formatted-money-amount.wc-block-components-totals-footer-item-tax-value { padding-right: 0 !important; }
/* The desktop sidebar's coupon toggle carried its own 16px; align it with the rest. */
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-panel__button,
.wp-block-woocommerce-cart .wc-block-cart__sidebar .wc-block-components-panel__button { padding-left: 0 !important; padding-right: 0 !important; }
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-totals-coupon,
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-panel,
.wp-block-woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-coupon,
.wp-block-woocommerce-cart .wc-block-cart__sidebar .wc-block-components-panel { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
/* Leftovers 2026-11-04: the item price's box reached the edge but its text was left-aligned, so "£10.00" stopped short
   of the amounts below it. Right-align it like every other amount. */
.wc-block-checkout .wc-block-components-order-summary-item__total-price,
.wp-block-woocommerce-cart .wc-block-cart-item__total { text-align: right !important; justify-content: flex-end !important; margin-left: auto; }
/* …the real cause: the price sits in a .price element that inherits the product-card padding (16px right). */
.wc-block-checkout .wc-block-components-order-summary-item__total-price .price,
.wp-block-woocommerce-cart .wc-block-cart-item__total .price { padding: 0 !important; margin: 0 !important; }