/**
 * Stage 13 — Cart product-card refinement.
 *
 * Presentation only. Improves hierarchy, contrast and action grouping on the
 * WooCommerce Cart without changing product data, quantity logic or totals.
 */

/* Make the transactional surfaces read as intentional white cards against the
 * storefront's warm off-white page background. */
body.woocommerce-cart .wc-block-cart-items,
body.woocommerce-cart .wc-block-components-sidebar.wc-block-cart__sidebar {
  background: #fff !important;
  border-color: #d4d9dc !important;
  box-shadow:
    0 22px 56px rgba(17, 19, 21, .12),
    0 3px 10px rgba(17, 19, 21, .045) !important;
}

body.woocommerce-cart .wc-block-cart-items thead {
  background: #f4f5f4 !important;
}

/* Keep the table header useful but visually secondary to the actual product. */
body.woocommerce-cart .wc-block-cart-items th {
  padding-top: .76rem !important;
  padding-bottom: .76rem !important;
  color: #535b61 !important;
  font-size: .73rem !important;
  letter-spacing: .085em !important;
}

/* The TOTAL heading and the line-total stack use the same inset so the right
 * edge reads as a designed column instead of text pinned to the card border. */
body.woocommerce-cart .wc-block-cart-items th:last-child {
  padding-right: 1.55rem !important;
}

/* Give the product information the majority of the row and keep the total in
 * a stable, intentionally aligned column. */
body.woocommerce-cart .wc-block-cart-item__product {
  padding-right: clamp(1.25rem, 3vw, 2.25rem) !important;
}

body.woocommerce-cart .wc-block-cart-item__total {
  width: 158px !important;
  min-width: 158px !important;
  padding-left: 1rem !important;
  padding-right: 1.55rem !important;
  color: var(--ecms-ink, #111315) !important;
  font-size: 1.08rem !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  text-align: right !important;
  white-space: nowrap;
}

body.woocommerce-cart .wc-block-cart-item__total .wc-block-components-product-price,
body.woocommerce-cart .wc-block-cart-item__total .wc-block-components-formatted-money-amount {
  display: block !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

/* Make the relationship between quantity, unit price and WooCommerce's
 * authoritative line total explicit without duplicating calculation logic. */
body.woocommerce-cart .ecms-cart-line-breakdown {
  display: block;
  margin: 0 0 .28rem;
  color: #687077;
  font-size: .78rem;
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: .01em;
  text-align: right;
  white-space: nowrap;
}

/* The line price is intentionally quieter than the line total. */
body.woocommerce-cart .wc-block-cart-item__prices,
body.woocommerce-cart .wc-block-cart-item__prices .wc-block-components-product-price,
body.woocommerce-cart .wc-block-cart-item__prices .wc-block-components-formatted-money-amount {
  color: #2f3539 !important;
  font-size: .94rem !important;
  font-weight: 780 !important;
  line-height: 1.35 !important;
}

body.woocommerce-cart .wc-block-cart-item__prices {
  margin-top: .1rem !important;
  margin-bottom: .65rem !important;
}

/* Use the available width instead of clipping metadata prematurely. If the
 * source copy itself contains an ellipsis, this intentionally leaves the data
 * untouched; only CSS truncation is removed. */
body.woocommerce-cart .wc-block-components-product-metadata,
body.woocommerce-cart .wc-block-components-product-metadata__description {
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

body.woocommerce-cart .wc-block-components-product-metadata__description,
body.woocommerce-cart .wc-block-components-product-metadata__description p,
body.woocommerce-cart .wc-block-components-product-metadata > p {
  display: block !important;
  overflow: visible !important;
  max-height: none !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: initial !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

/* Treat selected technical configuration as a distinct information tier when
 * WooCommerce exposes it through the product-details element. */
body.woocommerce-cart .wc-block-components-product-details {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .3rem .8rem !important;
  margin-top: .55rem !important;
  padding-top: .55rem !important;
  border-top: 1px solid #e5e8ea;
  color: #4d555b !important;
  font-size: .84rem !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

body.woocommerce-cart .wc-block-components-product-details li,
body.woocommerce-cart .wc-block-components-product-details__name,
body.woocommerce-cart .wc-block-components-product-details__value {
  margin: 0 !important;
}

/* Quantity and remove are one compact action group. */
body.woocommerce-cart .wc-block-cart-item__quantity {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: .45rem !important;
  margin-top: .85rem !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector {
  grid-template-columns: 40px 44px 40px !important;
  width: 124px !important;
  min-width: 124px !important;
  max-width: 124px !important;
  min-height: 42px !important;
  border-color: #cbd2d6 !important;
  border-radius: 11px !important;
}

body.woocommerce-cart .wc-block-components-quantity-selector button,
body.woocommerce-cart .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
  min-height: 40px !important;
}

body.woocommerce-cart .wc-block-cart-item__remove-link {
  display: inline-flex !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid transparent;
  border-radius: 10px !important;
}

body.woocommerce-cart .wc-block-cart-item__remove-link:hover,
body.woocommerce-cart .wc-block-cart-item__remove-link:focus-visible {
  border-color: rgba(215, 25, 32, .14);
  background: rgba(215, 25, 32, .07) !important;
}

/* Maintain the same surface treatment on the totals card while preserving its
 * stronger hierarchy as the purchase summary. */
body.woocommerce-cart .wc-block-components-sidebar.wc-block-cart__sidebar {
  box-shadow:
    0 24px 60px rgba(17, 19, 21, .13),
    0 3px 10px rgba(17, 19, 21, .05) !important;
}

/* Final integrated line-total column. The total is treated as the counterpart
 * to the unit price on the left, not as an independent badge in the corner. */
body.woocommerce-cart .wc-block-cart-items th:last-child {
  box-sizing: border-box;
  width: 212px !important;
  min-width: 212px !important;
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
  text-align: center !important;
}

body.woocommerce-cart .wc-block-cart-item__total {
  box-sizing: border-box;
  width: 212px !important;
  min-width: 212px !important;
  padding: 1.35rem 1.25rem 1rem !important;
  vertical-align: top !important;
  color: var(--ecms-ink, #111315) !important;
  text-align: center !important;
  white-space: nowrap;
}

body.woocommerce-cart .wc-block-cart-item__total > * {
  width: 100%;
  text-align: center !important;
}

body.woocommerce-cart .ecms-cart-line-breakdown {
  display: block !important;
  width: auto !important;
  margin: .08rem auto .12rem !important;
  padding: 0 !important;
  border: 0 !important;
  color: #737a80 !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: .005em;
  text-align: center !important;
}

body.woocommerce-cart .wc-block-cart-item__total .wc-block-components-product-price,
body.woocommerce-cart .wc-block-cart-item__total .wc-block-components-formatted-money-amount {
  display: block !important;
  width: auto !important;
  margin: 0 auto !important;
  color: var(--ecms-ink, #111315) !important;
  font-size: 1.08rem !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  text-align: center !important;
}

@media (max-width: 767px) {
  body.woocommerce-cart .wc-block-cart-items th:last-child {
    width: auto !important;
    min-width: 0 !important;
    padding-right: 1rem !important;
  }

  body.woocommerce-cart .wc-block-cart-item__total {
    width: auto !important;
    min-width: 0 !important;
    padding: 1rem !important;
  }

  body.woocommerce-cart .ecms-cart-line-breakdown {
    font-size: .7rem !important;
  }

  body.woocommerce-cart .wc-block-components-quantity-selector {
    grid-template-columns: 38px 42px 38px !important;
    width: 118px !important;
    min-width: 118px !important;
    max-width: 118px !important;
  }

  body.woocommerce-cart .wc-block-components-product-details {
    gap: .25rem .6rem !important;
  }
}