/* ==========================================================================
   Checkout chrome
   --------------------------------------------------------------------------
   Lives in the delivery plugin rather than the deposits plugin, because this
   is general checkout layout: if deposits were ever switched off, the checkout
   should not lose its styling with it.
   ========================================================================== */

/* --------------------------------------------------------------------------
   One way back, not two.

   The theme prints its own "Back to shop" link, and WooCommerce's checkout
   actions block prints "Return to Cart" directly above it. Two back links
   stacked is confusing, so the theme's is hidden HERE ONLY — the
   order-received page also carries the woocommerce-checkout body class and
   still needs its "Back to shop", which is its only way out.
   -------------------------------------------------------------------------- */

body.woocommerce-checkout:not(.woocommerce-order-received) .entry > .back-link,
body.woocommerce-checkout:not(.woocommerce-order-received) .back-link {
  display: none !important;
}

/* --------------------------------------------------------------------------
   "Return to Cart" inherits the look the theme's back link had: pink, bold,
   arrow sliding on hover.
   -------------------------------------------------------------------------- */

.wc-block-components-checkout-return-to-cart-button,
a.wc-block-components-checkout-return-to-cart-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-family: var(--base-font, inherit);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--color-pink-3, #e5187c);
  text-decoration: none;
  transition: color var(--animation-duration, 0.3s) ease,
              gap var(--animation-duration, 0.3s) ease;
}

.wc-block-components-checkout-return-to-cart-button:hover,
.wc-block-components-checkout-return-to-cart-button:focus-visible {
  gap: 11px;
  color: var(--color-pink-1, #c20e66);
  text-decoration: none;
}

/* The arrow WooCommerce renders inside the link takes the same colour. */
.wc-block-components-checkout-return-to-cart-button svg,
.wc-block-components-checkout-return-to-cart-button path {
  fill: currentColor;
  stroke: currentColor;
}

/* --------------------------------------------------------------------------
   Delivery options step
   --------------------------------------------------------------------------
   1. Never shout. WooCommerce's theme styling uppercases the rate price, so
      "Free within 15 miles" rendered as "FREE WITHIN 15 MILES". The same fix
      exists in the deposits plugin for the TOTALS row — this is the separate
      markup used by the radio list, which is why fixing one did not fix the
      other.

   2. The whole step is hidden when single-rate.js finds exactly one option,
      because a numbered step containing one pre-selected radio asks the
      customer to make a decision that does not exist. The body class is set by
      that script, never here, so if a second method is ever added the step
      reappears on its own.
   -------------------------------------------------------------------------- */

.wc-block-components-shipping-rates-control,
.wc-block-components-shipping-rates-control *,
.wc-block-components-radio-control__option,
.wc-block-components-radio-control__option *,
.wc-block-components-radio-control__label,
.wc-block-components-radio-control__secondary-label,
.wc-block-components-radio-control__description {
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* Free delivery reads as good news here too, matching the order summary. */
.wc-block-components-radio-control__secondary-label {
  color: var(--color-green-1, #21a584);
}

/* single-rate.js adds this to the step element itself. It is deliberately NOT
   tied to a block wrapper class — the first version targeted
   .wp-block-woocommerce-checkout-shipping-method-block and matched nothing on
   production, because WooCommerce builds those inner steps in React and does
   not reliably emit the wp-block-* class the block name implies. */
.lsd-hidden-step {
  display: none !important;
}