/* cart-checkout-order-summary.css — Order Summary row alignment (cart + checkout, mobile).
   Each row of the Order Summary (Subtotal / Discount / Shipping / Total) aligns its
   label, coupon tag, amount and Remove link on one shared centre line, and every
   amount ends on the same right edge. Previously the rows used top-aligned cells with
   uneven padding, so items within a row sat up to 12px above or below each other, the
   Remove link wrapped onto its own line on the cart, and the discount amount stopped
   short of the column the other amounts use.

   Cart and checkout render this block from two different systems, so each gets its own
   scope below. Both scopes start at the page's body class and end at the Order Summary
   wrapper, so nothing outside that block can be affected.

   The `body` prefix is required, not decorative: the rules being corrected are
   themselves marked !important, and among !important rules the more specific selector
   wins. Without the page-level class these declarations lose on the checkout by a
   single element and silently do nothing.

   Only the four named rows are targeted. Hidden rows (a savings line, a shipping
   notice, an empty tax spacer) are deliberately left out so they cannot inherit
   spacing they were never designed with.

   Mobile only (max-width: 768px). At wider widths this file changes nothing. */

/* ---------- CART ---------- */
@media (max-width: 768px) {

  /* centre cell contents, symmetrise padding, match the line boxes */
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-subtotal > th,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > th,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.shipping:not(.revive-eo-shipping-notification) > th,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.order-total > th,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-subtotal > td,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > td,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.shipping:not(.revive-eo-shipping-notification) > td,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.order-total > td {
    vertical-align: middle !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    line-height: 24px !important;
  }

  /* the amount is an inline span (sometimes inside <strong>) that keeps its own
     font metrics; make the parent a flex row so the span is the centred box */
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-subtotal > td strong,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > td strong,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.shipping:not(.revive-eo-shipping-notification) > td strong,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.order-total > td strong {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    line-height: 24px !important;
  }

  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-subtotal > td .woocommerce-Price-amount,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > td .woocommerce-Price-amount,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.shipping:not(.revive-eo-shipping-notification) > td .woocommerce-Price-amount,
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.order-total > td .woocommerce-Price-amount {
    line-height: 24px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* the coupon pill carries an authored position:relative; top:3px.
     OVERRIDE ONLY — owner not located, see note 1 */
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > th [class*="coupon-label"] {
    top: 0 !important;
    bottom: auto !important;
    height: 24px !important;
    line-height: 24px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    vertical-align: top !important;
  }

  /* ONLY this cell needs flexing: it holds TWO line boxes because [Remove] wraps,
     and no padding value can centre two line boxes.
     gap MUST be 0 — the minus sign is a BARE TEXT NODE, so a gap makes it its own
     flex item and renders "[Remove]  -  $16.00". Space the link with its own margin. */
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > td:not([colspan]) {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 0 !important;
  }

  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > td a[class*="remove-coupon"],
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.cart-discount > td a.rc-coupon-remove {
    order: -1;            /* [Remove] first, so the AMOUNT holds the column edge */
    margin-right: 8px;
  }

  /* Where the cart offers a CHOICE of shipping methods, this row holds two line
     boxes and the label centred on the row middle then aligns with neither option.
     Align it with the FIRST method instead. :has() keeps this to multi-option rows,
     so single-method carts keep the centred label; where :has() is unsupported the
     label simply stays centred.
     padding-top is DERIVED, not chosen: the label must sit on the first option line.
     Re-measure it if this row gains a different font-size or line-height. */
  body.woocommerce-cart.RO56 .cart-totals-wrapper table.cart-totals-native.RO56--totalstable tr.shipping:not(.revive-eo-shipping-notification):has(.RO56-ship-option + .RO56-ship-option) > th {
    vertical-align: top !important;
    padding-top: 7px !important;
  }
}

/* ---------- CHECKOUT ---------- */
@media (max-width: 768px) {

  /* centre cell contents, symmetrise padding, match the line boxes */
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-subtotal > th,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > th,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.shipping:not(.revive-eo-shipping-notification) > th,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.order-total > th,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-subtotal > td,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > td,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.shipping:not(.revive-eo-shipping-notification) > td,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.order-total > td {
    vertical-align: middle !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    line-height: 24px !important;
  }

  /* the amount is an inline span (sometimes inside <strong>) that keeps its own
     font metrics; make the parent a flex row so the span is the centred box */
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-subtotal > td strong,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > td strong,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.shipping:not(.revive-eo-shipping-notification) > td strong,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.order-total > td strong {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    line-height: 24px !important;
  }

  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-subtotal > td .woocommerce-Price-amount,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > td .woocommerce-Price-amount,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.shipping:not(.revive-eo-shipping-notification) > td .woocommerce-Price-amount,
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.order-total > td .woocommerce-Price-amount {
    line-height: 24px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* the coupon pill carries an authored position:relative; top:3px.
     OVERRIDE ONLY — owner not located, see note 1 */
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > th [class*="coupon-label"] {
    top: 0 !important;
    bottom: auto !important;
    height: 24px !important;
    line-height: 24px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    vertical-align: top !important;
  }

  /* ONLY this cell needs flexing: it holds TWO line boxes because [Remove] wraps,
     and no padding value can centre two line boxes.
     gap MUST be 0 — the minus sign is a BARE TEXT NODE, so a gap makes it its own
     flex item and renders "[Remove]  -  $16.00". Space the link with its own margin. */
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > td:not([colspan]) {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 0 !important;
  }

  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > td a[class*="remove-coupon"],
  body.woocommerce-checkout.RO84-mixed .RO84--summary-body table.RO84--summary-footer-table tr.cart-discount > td a.rc-coupon-remove {
    order: -1;            /* [Remove] first, so the AMOUNT holds the column edge */
    margin-right: 8px;
  }
}