/**
 * Nova Shop — checkout styling.
 *
 * Loaded only on the Cart & Checkout pages (see inc/enqueue.php), so it
 * costs nothing anywhere else on the store.
 *
 * PART A  Searchable Country/Region combobox (replaces the native <select>)
 * PART B  Checkout appearance — clean, minimal, single-card look
 */

/* ==========================================================================
   PART A — searchable Country / Region combobox
   Namespace: .ns-cs
   ========================================================================== */

/* The native select stays in the DOM (WooCommerce needs its value)
   but is pushed out of the way visually. */
.wc-blocks-components-select__container > select.ns-cs__native {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* The combobox wrapper sits exactly where the select used to be. */
.wc-blocks-components-select__container > .ns-cs {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 46px;
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid var(--nsco-border, #e0e0e0);
  border-radius: var(--nsco-radius, 4px);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wc-blocks-components-select__container > .ns-cs.ns-cs--open,
.wc-blocks-components-select__container > .ns-cs:focus-within {
  border-color: var(--nsco-ring, #111827);
  box-shadow: 0 0 0 1px var(--nsco-ring, #111827);
}

/* WooCommerce's own label is not shown on the address selects (matching a
   clean single-line field). Accessible name is preserved for screen readers. */
.wc-block-components-select > label,
.wc-block-components-country-input > label,
.wc-blocks-components-select__container > .wc-blocks-components-select__label {
  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;
}

.wc-blocks-components-select__container > .ns-cs__icon {
  flex: 0 0 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--nsco-muted, #757575);
}
.wc-blocks-components-select__container > .ns-cs__icon svg {
  width: 17px;
  height: 17px;
}

.wc-blocks-components-select__container > .ns-cs > .ns-cs__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  padding: 8px 4px 8px 0;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 15px;
  color: var(--nsco-ink, #1a1a1a);
  border-radius: 0;
}
.wc-blocks-components-select__container > .ns-cs > .ns-cs__input.ns-cs__input--placeholder {
  color: var(--nsco-muted, #757575);
}

.wc-blocks-components-select__container > .ns-cs > .ns-cs__toggle {
  flex: 0 0 42px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  cursor: pointer;
  color: var(--nsco-ink, #1a1a1a);
}
.ns-cs__caret {
  width: 8px;
  height: 8px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.18s ease;
}
.ns-cs--open .ns-cs__caret {
  transform: rotate(-135deg) translateY(-2px);
}

/* Results list -------------------------------------------------------- */
.wc-blocks-components-select__container > .ns-cs__list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 50;
  max-height: 300px;
  overflow-y: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--nsco-border, #e0e0e0);
  border-radius: 6px;
  box-shadow: 0 12px 32px rgba(17, 24, 39, 0.14);
  overscroll-behavior: contain;
}
.wc-blocks-components-select__container > .ns-cs__list[hidden] {
  display: none;
}

.ns-cs__option {
  padding: 10px 12px;
  border-radius: 4px;
  font-size: 15px;
  color: var(--nsco-ink, #1a1a1a);
  cursor: pointer;
  line-height: 1.35;
}
.ns-cs__option:hover,
.ns-cs__option.is-active {
  background: #f5f5f5;
}
.ns-cs__option.is-selected {
  font-weight: 700;
  color: var(--nsco-ring, #111827);
}
.ns-cs__empty {
  padding: 12px;
  font-size: 14px;
  color: var(--nsco-muted, #757575);
  text-align: center;
}

.ns-cs__option mark {
  background: #fff3bf;
  color: inherit;
  padding: 0 1px;
  border-radius: 2px;
}

@media (max-width: 600px) {
  .wc-blocks-components-select__container > .ns-cs {
    height: 50px;
  }
  .wc-blocks-components-select__container > .ns-cs__list {
    max-height: 46vh;
  }
  .ns-cs__option {
    padding: 12px 14px;
    font-size: 16px; /* prevents iOS zoom-on-focus */
  }
}

.has-dark-controls .wc-blocks-components-select__container > .ns-cs {
  background: #1f2937;
  border-color: #4b5563;
}
.has-dark-controls .wc-blocks-components-select__container > .ns-cs > .ns-cs__input {
  color: #f9fafb;
}
.has-dark-controls .wc-blocks-components-select__container > .ns-cs__list {
  background: #1f2937;
  border-color: #4b5563;
}
.has-dark-controls .ns-cs__option {
  color: #f9fafb;
}
.has-dark-controls .ns-cs__option:hover,
.has-dark-controls .ns-cs__option.is-active {
  background: #374151;
}


/* ==========================================================================
   PART B — checkout appearance
   Reference: minimal two-column layout, thin grey fields, one bordered
   order-summary card. Scoped to checkout/cart because this file only
   loads there.
   ========================================================================== */

/* B1 — design tokens --------------------------------------------------- */
:root {
  --nsco-border: #e0e0e0;
  --nsco-divider: #ececec;
  --nsco-ink: #1a1a1a;
  --nsco-muted: #757575;
  --nsco-radius: 4px;
  --nsco-field-h: 46px;
  --nsco-ring: #111827;
}

.wp-block-woocommerce-checkout,
.wp-block-woocommerce-cart,
.woocommerce-checkout,
.woocommerce-cart {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* B2 — two-column layout + sticky summary ------------------------------ */
@media (min-width: 1000px) {
  .wc-block-checkout__main {
    flex: 1 1 auto;
    min-width: 0;
  }
  .wc-block-checkout__sidebar {
    flex: 0 0 352px;
    width: 352px;
    max-width: 352px;
    position: sticky;
    top: 24px;
    align-self: flex-start;
  }
}

/* B3 — section headings ------------------------------------------------ */
.wc-block-components-checkout-step {
  margin-bottom: 26px;
}
.wc-block-components-checkout-step__title,
.wc-block-components-title,
.wc-block-checkout__contact-fields-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--nsco-ink) !important;
  letter-spacing: -0.01em;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

/* B4 — fields ---------------------------------------------------------- */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select select,
.wc-blocks-components-select__select,
.wc-block-components-country-input select,
.wc-block-components-combobox input,
.wc-block-components-address-form input,
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
  width: 100% !important;
  min-height: var(--nsco-field-h) !important;
  padding: 13px 15px !important;
  font-size: 15px !important;
  line-height: 1.3 !important;
  color: var(--nsco-ink) !important;
  background: #fff !important;
  border: 1px solid var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  box-shadow: none !important;
  outline: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* fields that carry a floated label need the extra top padding */
.wc-block-components-text-input.is-active input {
  padding: 22px 15px 7px !important;
}

.wc-block-components-text-input input::placeholder,
.wc-block-components-address-form input::placeholder {
  color: var(--nsco-muted) !important;
  opacity: 1;
}

.wc-block-components-text-input input:focus,
.wc-block-components-text-input textarea:focus,
.wc-block-components-select select:focus,
.wc-blocks-components-select__select:focus,
.wc-block-components-country-input select:focus,
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus {
  border-color: var(--nsco-ring) !important;
  box-shadow: 0 0 0 1px var(--nsco-ring) !important;
  outline: 0 !important;
}

/* floated / inline labels */
.wc-block-components-text-input label,
.wc-block-components-select label {
  color: var(--nsco-muted) !important;
  font-weight: 400 !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input:focus-within label {
  color: var(--nsco-muted) !important;
  font-size: 12px !important;
}

/* keep WC's error styling readable on the thin border */
.wc-block-components-text-input.has-error input,
.wc-block-components-select.has-error select {
  border-color: #dc2626 !important;
}
.wc-block-components-validation-error,
.wc-block-components-text-input.has-error + .wc-block-components-validation-error {
  font-size: 12.5px;
  color: #dc2626;
}

/* address grid spacing */
.wc-block-components-address-form__first-name,
.wc-block-components-address-form__last-name {
  margin-bottom: 12px;
}
.wc-block-components-address-form {
  row-gap: 12px;
}

/* "Add apartment, suite, etc." toggle */
.wc-block-components-address-form__address_2-toggle,
.wc-block-components-address-form__address_2-toggle button {
  font-size: 12.5px !important;
  color: var(--ns-primary, #2563eb) !important;
  background: none !important;
  border: 0 !important;
  padding: 6px 0 0 !important;
  cursor: pointer;
  text-decoration: none;
}
.wc-block-components-address-form__address_2-toggle button:hover {
  text-decoration: underline;
}

/* B5 — order summary card ---------------------------------------------- */
.wc-block-components-order-summary {
  background: #fff !important;
  border: 1px solid var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  padding: 22px 22px 18px !important;
  box-shadow: none !important;
}

.wc-block-components-order-summary__button-text,
.wc-block-components-order-summary__button .wc-block-components-panel__button-text {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--nsco-ink) !important;
}

/* The summary content uses display:table by default; flatten it so each
   item is a full-width block and we control the columns ourselves. */
.wc-block-components-order-summary__content {
  display: block !important;
  width: 100%;
}

/* keep the screen-reader price sentence out of the flex flow so it never
   claims a third/fourth grid cell */
.wc-block-components-order-summary-item > .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Three-column order line:
   [ thumbnail + qty badge ]  [ title / price / attributes ]  [ line total ] */
.wc-block-components-order-summary-item {
  display: flex !important;
  align-items: flex-start;
  gap: 16px;
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--nsco-divider) !important;
}
.wc-block-components-order-summary-item:first-child {
  padding-top: 4px !important;
}
.wc-block-components-order-summary-item:last-child {
  border-bottom: 0 !important;
  padding-bottom: 2px !important;
}

/* Column 1 — thumbnail (with the quantity badge pinned to its top-right) */
.wc-block-components-order-summary-item__image {
  position: relative;
  flex: 0 0 56px !important;
  width: 56px !important;
  align-self: flex-start;
}
.wc-block-components-order-summary-item__image > img,
.wc-block-components-order-summary-item__image img {
  display: block !important;
  width: 56px !important;
  max-width: 56px !important;
  height: 56px !important;
  border-radius: 4px !important;
  border: 1px solid var(--nsco-divider, #ececec) !important;
  background: #fafafa;
  object-fit: cover;
}

/* Column 2 — title, then price, then attributes (stacked, wraps) */
.wc-block-components-order-summary-item__description {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
  padding: 0 !important;
  word-break: break-word;
}
.wc-block-components-order-summary-item__description .wc-block-components-product-name {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: var(--nsco-ink) !important;
}
/* unit / individual price under the title */
.wc-block-components-order-summary-item__individual-prices {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--nsco-ink) !important;
  margin: 0 !important;
}
.wc-block-components-order-summary-item__individual-prices del {
  color: var(--nsco-muted) !important;
  font-weight: 400 !important;
}
.wc-block-components-order-summary-item__individual-prices ins {
  text-decoration: none;
}
/* short description (if shown) */
.wc-block-components-product-metadata__description {
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  color: var(--nsco-muted) !important;
  margin: 2px 0 0 !important;
}
/* variation attributes — compact uppercase line, e.g. "SIZE: S" */
.wc-block-components-product-details {
  list-style: none !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
}
.wc-block-components-product-details li {
  font-size: 11.5px !important;
  line-height: 1.5 !important;
  color: var(--nsco-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em;
}
.wc-block-components-product-details__name {
  color: inherit !important;
}
.wc-block-components-product-details__value {
  color: inherit !important;
  font-weight: 600 !important;
}

/* Column 3 — line total, top-aligned, never wraps */
.wc-block-components-order-summary-item__total-price {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  padding-top: 0 !important;
  text-align: right !important;
}
.wc-block-components-order-summary-item__total-price .wc-block-components-product-price {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--nsco-ink) !important;
  white-space: nowrap !important;
}
/* quantity badge → see B14 */

/* B6 — coupons panel, totals rows, dividers ---------------------------- */
.wc-block-components-totals-item,
.wc-block-components-totals-coupon,
.wc-block-components-panel,
.wc-block-components-order-summary .wc-block-components-totals-wrapper {
  border-top: 1px solid var(--nsco-divider) !important;
}
.wc-block-components-totals-item:first-child,
.wc-block-components-totals-coupon:first-child,
.wc-block-components-panel:first-child,
.wc-block-components-order-summary .wc-block-components-totals-wrapper:first-child {
  border-top: 0 !important;
}

.wc-block-components-totals-item {
  display: flex !important;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 0 !important;
  font-size: 14px !important;
  color: var(--nsco-ink) !important;
}
.wc-block-components-totals-item__label {
  color: var(--nsco-muted) !important;
}
.wc-block-components-totals-item__value {
  color: var(--nsco-ink) !important;
  font-weight: 500;
}

/* Total row — emphasised */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--nsco-ink) !important;
}

/* coupons panel button */
.wc-block-components-panel__button,
.wc-block-components-totals-coupon__button {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 13px 0 !important;
  background: none !important;
  border: 0 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--nsco-muted) !important;
  cursor: pointer;
  text-align: left;
}
.wc-block-components-panel__button svg,
.wc-block-components-totals-coupon__button svg {
  fill: var(--nsco-muted) !important;
  width: 16px;
  height: 16px;
}

/* B7 — payment methods -------------------------------------------------- */
.wc-block-components-radio-control__option,
.wc-block-components-radio-control-accordion-option {
  border: 1px solid var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  padding: 14px 16px !important;
  margin-bottom: 10px !important;
  background: #fff !important;
}
.wc-block-components-radio-control__option:last-child {
  margin-bottom: 0 !important;
}
.wc-block-components-radio-control-accordion-option--checked {
  border-color: var(--nsco-ring) !important;
}
.wc-block-components-radio-control__label {
  font-size: 14.5px !important;
  color: var(--nsco-ink) !important;
}
.wc-block-components-checkout-payment-methods .wc-block-components-title {
  margin-bottom: 12px !important;
}

/* B8 — place order button ---------------------------------------------- */
.wc-block-components-checkout-place-order-button,
.wc-block-components-button:not(.is-link):not(.wc-block-components-radio-control__option *) {
  border-radius: var(--nsco-radius) !important;
  font-weight: 600 !important;
}
.wc-block-components-checkout-place-order-button {
  background: var(--ns-dark, #111827) !important;
  color: #fff !important;
  font-size: 16px !important;
  padding: 17px 24px !important;
  width: 100%;
}
.wc-block-components-checkout-place-order-button:hover {
  background: var(--ns-primary, #2563eb) !important;
}
.wc-block-components-checkout-place-order-button .wc-block-components-button__text {
  color: #fff !important;
}

/* B9 — notices --------------------------------------------------------- */
.wc-block-components-notice-banner {
  border-radius: var(--nsco-radius) !important;
  font-size: 14px;
}

/* ==========================================================================
   B10 — CLASSIC (shortcode) checkout
   Markup: form.checkout > #customer_details (+ h3#order_review_heading +
   #order_review). Layout: customer details left, order summary + payment
   right. Disable the two-column layout with:
     add_filter( 'nova_shop_classic_checkout_columns', '__return_false' );
   ========================================================================== */

/* coupon toggle bar */
.woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-info {
  background: #fafafa !important;
  border: 1px solid var(--nsco-border) !important;
  border-top: 1px solid var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  color: var(--nsco-muted) !important;
  font-size: 13.5px !important;
  padding: 13px 16px !important;
  margin: 0 0 22px !important;
}
.woocommerce-form-coupon-toggle .woocommerce-info::before { color: var(--nsco-muted) !important; }
.woocommerce-form-coupon-toggle .woocommerce-info a { color: var(--ns-primary, #2563eb); }

/* section headings: Billing details / Your order / Additional information */
.woocommerce-checkout form.checkout h3,
.woocommerce-checkout #order_review_heading {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--nsco-ink) !important;
  letter-spacing: -0.01em;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
}

/* fields ---------------------------------------------------------------- */
.woocommerce-checkout form.checkout .form-row {
  margin: 0 0 14px;
  padding: 0;
}
.woocommerce-checkout form.checkout .form-row label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--nsco-muted) !important;
  margin: 0 0 6px;
  line-height: 1.4;
}
.woocommerce-checkout form.checkout .form-row label .required {
  color: #dc2626;
  text-decoration: none;
  font-weight: 400;
}
.woocommerce-checkout form.checkout .form-row input.input-text,
.woocommerce-checkout form.checkout .form-row select,
.woocommerce-checkout form.checkout .form-row textarea {
  width: 100%;
  min-height: var(--nsco-field-h);
  padding: 13px 15px;
  font-size: 15px;
  line-height: 1.3;
  color: var(--nsco-ink);
  background: #fff;
  border: 1px solid var(--nsco-border);
  border-radius: var(--nsco-radius);
  box-shadow: none;
  outline: 0;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.woocommerce-checkout form.checkout .form-row textarea {
  min-height: 118px;
  resize: vertical;
}
.woocommerce-checkout form.checkout .form-row input.input-text:focus,
.woocommerce-checkout form.checkout .form-row select:focus,
.woocommerce-checkout form.checkout .form-row textarea:focus {
  border-color: var(--nsco-ring);
  box-shadow: 0 0 0 1px var(--nsco-ring);
  outline: 0;
}

/* first / last name, town / postcode pairs */
.woocommerce-checkout form.checkout .form-row-first,
.woocommerce-checkout form.checkout .form-row-last {
  width: 48%;
  float: left;
  clear: none;
}
.woocommerce-checkout form.checkout .form-row-last { float: right; }
.woocommerce-checkout form.checkout .form-row-wide { clear: both; }

/* Select2 — classic checkout enhances Country/Region and Region with it */
.woocommerce-checkout .select2-container {
  width: 100% !important;
}
.woocommerce-checkout .select2-container .select2-selection--single {
  height: var(--nsco-field-h) !important;
  border: 1px solid var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  background: #fff !important;
}
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
  line-height: calc(var(--nsco-field-h) - 2px) !important;
  padding-left: 15px !important;
  padding-right: 42px !important;
  color: var(--nsco-ink) !important;
  font-size: 15px !important;
}
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow {
  height: calc(var(--nsco-field-h) - 2px) !important;
  right: 12px !important;
}
.woocommerce-checkout .select2-container--focus .select2-selection--single,
.woocommerce-checkout .select2-container--open .select2-selection--single {
  border-color: var(--nsco-ring) !important;
  box-shadow: 0 0 0 1px var(--nsco-ring) !important;
}
.woocommerce-checkout .select2-container--open .select2-dropdown {
  border-color: var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  box-shadow: 0 12px 32px rgba(17, 24, 39, 0.14) !important;
  overflow: hidden;
}
.woocommerce-checkout .select2-search--dropdown .select2-search__field {
  border: 1px solid var(--nsco-border) !important;
  border-radius: 4px !important;
  padding: 9px 12px !important;
  font-size: 14px;
}
.woocommerce-checkout .select2-results__option--highlighted[aria-selected] {
  background: #f5f5f5 !important;
  color: var(--nsco-ink) !important;
}

/* "Ship to a different address?" */
.woocommerce-checkout h3#ship-to-different-address {
  margin: 0 0 16px !important;
}
.woocommerce-checkout h3#ship-to-different-address label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--nsco-ink) !important;
  cursor: pointer;
  margin: 0;
}
.woocommerce-checkout h3#ship-to-different-address input[type="checkbox"] {
  width: 17px;
  height: 17px;
  min-height: 0;
  margin: 0;
  accent-color: var(--ns-dark, #111827);
}

/* order review table ---------------------------------------------------- */
.woocommerce-checkout #order_review {
  background: #fff !important;
  border: 1px solid var(--nsco-border) !important;
  border-radius: var(--nsco-radius) !important;
  padding: 18px 20px !important;
}
.woocommerce-checkout table.shop_table {
  border: 0 !important;
  border-collapse: collapse !important;
  margin: 0 0 16px !important;
  table-layout: auto;
}
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nsco-divider) !important;
  padding: 13px 0 !important;
  font-size: 14px;
  color: var(--nsco-ink);
  text-align: left;
  vertical-align: top;
  line-height: 1.45;
}
.woocommerce-checkout table.shop_table thead th {
  border-bottom: 1px solid var(--nsco-border) !important;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--nsco-muted);
  text-transform: none;
  letter-spacing: 0;
}
.woocommerce-checkout table.shop_table th.product-total,
.woocommerce-checkout table.shop_table td.product-total,
.woocommerce-checkout table.shop_table tfoot td {
  text-align: right;
}
.woocommerce-checkout table.shop_table tbody tr:last-child td {
  border-bottom: 1px solid var(--nsco-border) !important;
}
.woocommerce-checkout table.shop_table .product-name a {
  color: var(--nsco-ink);
}
.woocommerce-checkout table.shop_table .product-name .variation {
  font-size: 12px;
  color: var(--nsco-muted);
  margin-top: 4px;
}
.woocommerce-checkout table.shop_table tr.cart-subtotal th,
.woocommerce-checkout table.shop_table tr.cart-subtotal td {
  color: var(--nsco-muted);
}
.woocommerce-checkout table.shop_table tr.order-total th,
.woocommerce-checkout table.shop_table tr.order-total td {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--nsco-ink) !important;
  border-bottom: 0 !important;
  padding-top: 16px !important;
}

/* payment --------------------------------------------------------------- */
.woocommerce-checkout #payment {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.woocommerce-checkout #payment ul.wc_payment_methods {
  list-style: none !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
}
.woocommerce-checkout #payment ul.wc_payment_methods li {
  list-style: none;
  background: #fff;
  border: 1px solid var(--nsco-border);
  border-radius: var(--nsco-radius);
  padding: 14px 16px;
  margin: 0 0 10px;
}
.woocommerce-checkout #payment ul.wc_payment_methods li label {
  display: inline-block;
  margin: 0;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--nsco-ink);
  cursor: pointer;
}
.woocommerce-checkout #payment ul.wc_payment_methods li input.input-radio {
  margin-right: 9px;
  accent-color: var(--ns-dark, #111827);
}
.woocommerce-checkout #payment ul.wc_payment_methods li img {
  max-height: 26px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
  margin-left: 6px;
}
.woocommerce-checkout #payment div.payment_box {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 12px 0 0 !important;
  font-size: 13.5px;
  color: var(--nsco-muted);
}
.woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.woocommerce-checkout #payment .form-row.place-order {
  margin: 16px 0 0 !important;
  padding: 0 !important;
}
.woocommerce-checkout #payment #place_order {
  width: 100%;
  padding: 17px 24px;
  font-size: 16px;
  font-weight: 600;
  border: 0;
  border-radius: var(--nsco-radius);
  background: var(--ns-dark, #111827);
  color: #fff;
  cursor: pointer;
}
.woocommerce-checkout #payment #place_order:hover {
  background: var(--ns-primary, #2563eb);
  color: #fff;
}
.woocommerce-checkout .woocommerce-privacy-policy-text {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--nsco-muted);
  margin: 14px 0 16px;
}

/* two-column layout: details left, summary + payment right ------------- */
@media (min-width: 1000px) {
  body.ns-checkout-cols form.checkout.woocommerce-checkout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 372px;
    grid-template-areas:
      "customer head"
      "customer order";
    grid-template-rows: auto auto;
    column-gap: 56px;
    align-items: start;
  }
  body.ns-checkout-cols form.checkout.woocommerce-checkout #customer_details { grid-area: customer; }
  body.ns-checkout-cols form.checkout.woocommerce-checkout #order_review_heading {
    grid-area: head;
    margin-top: 0 !important;
  }
  body.ns-checkout-cols form.checkout.woocommerce-checkout #order_review {
    grid-area: order;
    position: sticky;
    top: 24px;
  }
  /* billing and shipping/notes stack instead of sitting side by side */
  body.ns-checkout-cols form.checkout.woocommerce-checkout .col2-set .col-1,
  body.ns-checkout-cols form.checkout.woocommerce-checkout .col2-set .col-2 {
    float: none;
    width: 100%;
  }
  body.ns-checkout-cols form.checkout.woocommerce-checkout .col2-set .col-2 {
    margin-top: 28px;
  }
  body.ns-checkout-cols form.checkout.woocommerce-checkout #customer_details::after {
    content: "";
    display: block;
    clear: both;
  }
}

/* B12 — WooCommerce PayPal Payments (express buttons) ------------------- */
.woocommerce-checkout .ppc-button-wrapper,
.woocommerce-checkout #ppc-button-ppcp-gateway,
.woocommerce-checkout #ppc-button {
  width: 100% !important;
  margin: 0 0 14px !important;
  position: relative;
  z-index: 1;
}
.woocommerce-checkout .ppc-button-wrapper .paypal-buttons,
.woocommerce-checkout .paypal-buttons,
.woocommerce-checkout #ppc-button-ppcp-gateway-container {
  min-width: 0 !important;
}
/* never let an express-button iframe escape its box */
.woocommerce-checkout #payment iframe,
.woocommerce-checkout .ppc-button-wrapper iframe {
  max-width: 100%;
  z-index: 0;
}

/* B11 — mobile --------------------------------------------------------- */
@media (max-width: 999px) {
  .wc-block-components-order-summary {
    padding: 18px !important;
  }
  .wc-block-components-checkout-step {
    margin-bottom: 22px;
  }
}

/* ==========================================================================
   B13 — CLASSIC checkout: product image preview in the order review table
   WooCommerce's classic checkout prints the product name only. The theme
   prepends the thumbnail (inc/woocommerce.php, section 9) and moves the
   quantity into a badge pinned to the image, mirroring the block checkout.
   Turn the markup off with:
     add_filter( 'nova_shop_checkout_thumbnails', '__return_false' );
   ========================================================================== */

/* self-contained screen-reader helper (no dependency on core CSS) */
.woocommerce-checkout table.shop_table .ns-sr-only {
  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;
}

.woocommerce-checkout table.shop_table td.product-name {
  position: relative;
}

.woocommerce-checkout table.shop_table td.product-name .ns-co-thumb {
  position: relative;
  float: left;
  margin: 3px 13px 4px 0;
  line-height: 0;
}

.woocommerce-checkout table.shop_table td.product-name .ns-co-thumb__img,
.woocommerce-checkout table.shop_table td.product-name .ns-co-thumb img {
  display: block;
  width: 56px;
  height: 56px;
  max-width: 56px;
  object-fit: cover;
  border-radius: var(--nsco-radius);
  border: 1px solid var(--nsco-divider);
  background: #fafafa;
}

.woocommerce-checkout table.shop_table td.product-name .ns-co-thumb__qty {
  position: absolute;
  top: -8px;
  right: -8px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--nsco-ink);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
  box-shadow: 0 0 0 2px #fff;
}

.woocommerce-checkout table.shop_table td.product-name .ns-co-name {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--nsco-ink);
  line-height: 1.4;
}
.woocommerce-checkout table.shop_table td.product-name .ns-co-price {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 500;
  color: var(--nsco-ink);
}

/* contain the float inside the cell */
.woocommerce-checkout table.shop_table td.product-name::after {
  content: "";
  display: block;
  clear: both;
}

/* variation attributes ("SIZE: M") — one compact uppercase line,
   matching the block checkout rendering */
.woocommerce-checkout table.shop_table td.product-name dl.variation {
  display: block;
  margin: 3px 0 0;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--nsco-muted);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.woocommerce-checkout table.shop_table td.product-name dl.variation dt,
.woocommerce-checkout table.shop_table td.product-name dl.variation dd {
  display: inline;
  float: none;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: 400;
  color: inherit;
}
.woocommerce-checkout table.shop_table td.product-name dl.variation dd {
  margin-left: 0.35em;
}
.woocommerce-checkout table.shop_table td.product-name dl.variation dd + dt::before {
  content: "\00b7\00a0";
}

/* small screens: slightly smaller image, same layout */
@media (max-width: 600px) {
  .woocommerce-checkout table.shop_table td.product-name .ns-co-thumb {
    margin-right: 11px;
  }
  .woocommerce-checkout table.shop_table td.product-name .ns-co-thumb__img,
  .woocommerce-checkout table.shop_table td.product-name .ns-co-thumb img {
    width: 48px;
    height: 48px;
    max-width: 48px;
  }
}

/* ==========================================================================
   B14 — quantity badge (block checkout)
   Markup (verified against WooCommerce source):
     .wc-block-components-order-summary-item__image
       > .wc-block-components-order-summary-item__quantity > span
       > img
   WooCommerce paints the badge with `background: currentColor` and colours
   the inner span with `var(--wp--preset--color--base, #fff)` — which turns
   dark on some themes and makes the number invisible. Pinned here.
   ========================================================================== */
.wc-block-components-order-summary-item__quantity {
  background: var(--nsco-ink) !important;
  color: #fff !important;
  min-width: 20px !important;
  min-height: 20px !important;
  border-radius: 20px !important;
  font-weight: 600 !important;
  box-shadow: 0 0 0 2px #fff;
  /* pin to the top-right corner of the thumbnail (Woo default, enforced) */
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  transform: translate(50%, -50%) !important;
  z-index: 2 !important;
}
.wc-block-components-order-summary-item__quantity span {
  color: #fff !important;
  padding: 0 0.4em !important;
}