/*
AnnGhar Cart Experience — WooCommerce Blocks Cart redesign. Scoped under body.agce-cart-experience; loads only on is_cart(). Cosmetic-only: no WC Blocks DOM, sizing, or positioning is touched.

Verified against the installed WooCommerce version's actual source
(wp-content/plugins/woocommerce/assets/client/blocks/cart.js + cart.css)
and the installed woo-razorpay plugin. Read this before adding rules:

1. `.wc-block-cart` (= `.wp-block-woocommerce-cart`) is the CSS
   `container-type:inline-size` root that WC's own `@container` queries
   measure to decide desktop-vs-stacked layout. NEVER add horizontal
   (left/right) padding/margin/width to this selector — it shrinks the
   measured size and can flip the container-query breakpoint at the
   wrong viewport. Vertical (top/bottom) spacing is fine.

2. WC already ships a 65%/35% column split via `width` + percentage
   `padding` (box-sizing:border-box) on `.wc-block-components-main` /
   `.wc-block-components-sidebar` — NOT via flexbox `gap`. Adding our
   own `gap` on `.wc-block-components-sidebar-layout` would stack on
   top of that padding and inflate the space between columns. NEVER set
   `gap`, `flex`, `flex-basis`, or `width` on `.wc-block-cart__main`,
   `.wc-block-components-main`, `.wc-block-cart__sidebar`, or
   `.wc-block-components-sidebar` — box-sizing:border-box means padding
   changes on these are safe (doesn't change their outer column width),
   so all card styling below uses padding/background/border/radius/
   shadow only, never width/flex/gap.

3. Flex's default `align-items` (stretch) is what keeps the Cart and
   Order Summary columns visually top-aligned and equal height out of
   the box. NEVER set `align-items` or `position:sticky` on the sidebar
   — both defeat that stretch and are what previously caused the
   "detached column" / blank-space bug.

4. WC's own `@container (max-width:699px)` rule already reorders and
   stacks the sidebar on narrow containers, and a separate
   `@media(max-width:782px)` rule gives the checkout button container a
   `--sticky` fixed-to-bottom mobile bar. NEVER add our own
   `flex-direction`, `position`, or breakpoint-based stacking rules —
   they fight WC's native responsive behaviour instead of complementing
   it.

5. `.wc-block-cart-items` is a literal `<table>` and
   `.wc-block-cart-items__row` is a literal `<tr>` — `<tr>` does not
   support `margin` in any browser and unreliably supports
   `border-radius`/`box-shadow`. So: ONE card treatment on the `<table>`
   itself (background/border/radius/shadow via border-collapse:separate
   + overflow:hidden), row separation via `border-bottom` on `<td>`
   cells, never per-row shadows/margins.

6. `.wc-block-cart-item__wrap` and `.wc-block-cart-item__quantity` ARE
   plain `<div>`s (confirmed in source) nested inside the product
   `<td>` — safe to use flex/gap freely here, they don't participate in
   the table's column sizing or the container-query system above.

7. Razorpay's Magic Checkout (`woo-razorpay` + the externally-loaded
   magic-rzp.js) binds its popup via a document-level click listener that
   matches on an EXACT `event.target.id === 'btn-1cc'` — nothing to do
   with `display`, `width`, or `position`. `assets/js/cart.min.js` is the
   only non-CSS part of this plugin: it stamps that id onto the existing
   checkout button (never replacing/cloning/intercepting it), watched by
   a childList/subtree MutationObserver since the button mounts
   asynchronously and no reliable "ready" event exists to hook instead —
   see that file for the full rationale. The checkout button below is
   restyled with paint-only properties (background-color, color,
   border-radius, box-shadow, padding, a non-reflowing hover transform)
   and nothing that changes its box model, confirmed redundant against
   WC's own `width:100%` default. A defensive `:has(#btn-1cc)`-gated rule
   re-hides the original button if some other stylesheet on the site
   re-shows it after woo-razorpay hides it — see the comment directly
   above that rule for why it's gated the way it is, and IMPORTANTLY why
   that `:has()` is scoped to `.wc-block-cart__submit-container` and not
   `body`: `id="btn-1cc"` is also used, independently, by
   annghar-premium-cart's own site-wide drawer checkout button, present
   in the DOM on every page. A body-scoped check is satisfied by that
   unrelated button and hides this page's real button with nothing to
   replace it.
*/
body.agce-cart-experience{--agce-bg:#F8F5ED;--agce-primary:#2F5A2E;--agce-primary-dark:#25491F;--agce-accent:#C89B3C;--agce-card:#FFFFFF;--agce-border:#ECE7DD;--agce-muted:#8C8571;--agce-font:'Google Sans',Inter,Poppins,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--agce-heading-font:'Google Sans',Poppins,Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--agce-radius-lg:24px;--agce-radius-md:16px;--agce-radius-pill:999px;--agce-shadow:0 2px 12px rgba(47,90,46,.06);--agce-shadow-lg:0 12px 32px rgba(47,90,46,.10)}

/* Typography only — no box-model properties on the container-query root */
body.agce-cart-experience .wc-block-cart{font-family:var(--agce-font)}
body.agce-cart-experience .wc-block-cart--is-loading{opacity:.6;transition:opacity .2s ease}

/* Page heading */
body.agce-cart-experience .wc-block-cart__main h1{font-family:var(--agce-heading-font);color:var(--agce-primary-dark);font-weight:600;letter-spacing:-.01em}

/* Cart items: ONE card for the whole table (never per-row — <tr> can't take margin/reliable radius) */
body.agce-cart-experience .wc-block-cart-items{background:var(--agce-card);border:1px solid var(--agce-border);border-radius:var(--agce-radius-md);box-shadow:var(--agce-shadow);border-collapse:separate;border-spacing:0;overflow:hidden}
body.agce-cart-experience .wc-block-cart-items__header{color:var(--agce-muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
body.agce-cart-experience .wc-block-cart-items__header-image,
body.agce-cart-experience .wc-block-cart-items__header-product,
body.agce-cart-experience .wc-block-cart-items__header-total{padding:14px 20px;border-bottom:1px solid var(--agce-border)}
body.agce-cart-experience .wc-block-cart-item__image,
body.agce-cart-experience .wc-block-cart-item__product,
body.agce-cart-experience .wc-block-cart-item__total{padding:20px;border-bottom:1px solid var(--agce-border);vertical-align:top}
body.agce-cart-experience .wc-block-cart-items__row:last-child .wc-block-cart-item__image,
body.agce-cart-experience .wc-block-cart-items__row:last-child .wc-block-cart-item__product,
body.agce-cart-experience .wc-block-cart-items__row:last-child .wc-block-cart-item__total{border-bottom:none}

/* Product image: cream frame, rounded corners, clean crop — <td> padding + <img> radius only */
body.agce-cart-experience .wc-block-cart-item__image{background:var(--agce-bg);border-radius:var(--agce-radius-md)}
body.agce-cart-experience .wc-block-cart-item__image img{border-radius:12px;object-fit:cover;display:block}

/* Product name / description — .wc-block-cart-item__wrap is a real <div>, safe for spacing */
body.agce-cart-experience .wc-block-components-product-name{font-family:var(--agce-heading-font);font-weight:600;color:var(--agce-primary-dark);font-size:16px;line-height:1.4;text-decoration:none}
body.agce-cart-experience .wc-block-cart-item__prices{margin-top:6px}

/* Quantity + remove: .wc-block-cart-item__quantity is a real <div>, safe for flex/gap */
body.agce-cart-experience .wc-block-cart-item__quantity{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px}
body.agce-cart-experience .wc-block-components-quantity-selector{border:1px solid var(--agce-border);border-radius:var(--agce-radius-pill);background:var(--agce-bg);overflow:hidden}
body.agce-cart-experience .wc-block-components-quantity-selector__button{color:var(--agce-primary);font-weight:700;transition:background-color .2s ease,color .2s ease}
body.agce-cart-experience .wc-block-components-quantity-selector__button:hover{background-color:var(--agce-border);color:var(--agce-primary-dark)}
body.agce-cart-experience .wc-block-components-quantity-selector__input{background:transparent;font-weight:600;color:var(--agce-primary-dark)}
body.agce-cart-experience .wc-block-cart-item__remove-link{color:var(--agce-muted);font-size:13px;font-weight:500;text-decoration:underline;text-underline-offset:3px;transition:color .2s ease}
body.agce-cart-experience .wc-block-cart-item__remove-link:hover{color:var(--agce-primary-dark)}

/* Price + sale badge */
body.agce-cart-experience .wc-block-components-product-price__value{font-weight:700;color:var(--agce-primary-dark);font-size:15px}
body.agce-cart-experience .wc-block-components-product-price__regular{color:var(--agce-muted);text-decoration:line-through;font-weight:400;margin-right:6px}
body.agce-cart-experience .wc-block-components-sale-badge,
body.agce-cart-experience .wc-block-components-product-sale-badge{background:var(--agce-accent);color:#fff;border:none;border-radius:var(--agce-radius-pill);padding:3px 10px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}

/* Order Summary card — padding/background/border/radius/shadow only; WC's own width:35% + stretch alignment is untouched */
body.agce-cart-experience .wc-block-cart__sidebar,
body.agce-cart-experience .wc-block-components-sidebar{background:var(--agce-card);border:1px solid var(--agce-border);border-radius:var(--agce-radius-lg);box-shadow:var(--agce-shadow-lg);padding:32px}
body.agce-cart-experience .wc-block-cart__totals-title{font-family:var(--agce-heading-font);font-size:20px;font-weight:600;color:var(--agce-primary-dark);margin:0 0 20px}
body.agce-cart-experience .wc-block-components-totals-item{padding:12px 0;border-bottom:1px solid var(--agce-border)}
body.agce-cart-experience .wc-block-components-totals-item:last-child{border-bottom:none}
body.agce-cart-experience .wc-block-components-totals-item__label{color:var(--agce-muted);font-weight:500;font-size:14px}
body.agce-cart-experience .wc-block-components-totals-item__value{color:var(--agce-primary-dark);font-weight:600;font-size:14px}

/* Coupon form + applied coupon chip */
body.agce-cart-experience .wc-block-components-totals-coupon__content input,
body.agce-cart-experience .wc-block-components-totals-coupon__input input{border:1px solid var(--agce-border);border-radius:var(--agce-radius-pill);padding:10px 18px;font-size:14px}
body.agce-cart-experience .wc-block-components-totals-coupon__content input:focus,
body.agce-cart-experience .wc-block-components-totals-coupon__input input:focus{border-color:var(--agce-primary);outline:none}
body.agce-cart-experience .wc-block-components-totals-coupon__button{border-radius:var(--agce-radius-pill)}
body.agce-cart-experience .wc-block-components-totals-discount__coupon-list-item{background:var(--agce-bg);border:1px solid var(--agce-border);border-radius:var(--agce-radius-pill);padding:5px 14px;font-size:13px;color:var(--agce-primary-dark)}

/* Checkout button: paint-only restyle. No display/width/position — WC's own width:100% + centering is kept, Razorpay's clone inherits these classes untouched. */
/* Defensive re-assertion of woo-razorpay's own hide rule for the original button once #btn-1cc exists INSIDE THIS SAME submit-container. A conflicting `display:block !important` rule from an unrelated source (not this plugin, not woo-razorpay) was found in production's page source, targeting the identical selector — with equal specificity, whichever rule is LAST in source order wins the cascade, which was letting the original button stay visible/clickable alongside the real #btn-1cc. Adding `body.agce-cart-experience` ahead of the same selector raises specificity enough to win regardless of source order or where that other rule lives.
   Scoped to `:has(#btn-1cc)` on `.wc-block-cart__submit-container` specifically (NOT `body`): `id="btn-1cc"` is also used, independently, by the annghar-premium-cart plugin's own site-wide drawer checkout button, which is present in the DOM on every page including this one. A body-scoped `:has(#btn-1cc)` is satisfied by that unrelated button and hides the Cart Block's real button with nothing to replace it — confirmed live via DevTools. Scoping to the submit-container itself means this only fires when a #btn-1cc genuinely exists as a sibling inside this exact container. */
body.agce-cart-experience .wc-block-cart__submit-container:has(#btn-1cc) .wc-block-cart__submit-button:not(#btn-1cc){display:none!important}
body.agce-cart-experience .wc-block-cart__submit-button{background-color:var(--agce-primary);color:#fff;border:none;border-radius:var(--agce-radius-pill);padding:16px 24px;font-family:var(--agce-font);font-weight:600;font-size:16px;box-shadow:0 6px 16px rgba(47,90,46,.16);transition:background-color .2s ease,box-shadow .2s ease,transform .2s ease}
body.agce-cart-experience .wc-block-cart__submit-button:hover{background-color:var(--agce-primary-dark);box-shadow:0 8px 20px rgba(47,90,46,.22);transform:translateY(-1px)}
body.agce-cart-experience .wc-block-cart__submit-button:active{transform:translateY(0)}
body.agce-cart-experience .wc-block-cart__submit-button:focus-visible{outline:2px solid var(--agce-accent);outline-offset:2px}

/* WC's own button sets isLoading=true after the first click via its async dispatchOnProceedToCheckout() hook and never resets it except on a full pageshow (browser back/forward) — not on closing the Magic Checkout modal. Left alone, the label stays permanently visibility:hidden and its Spinner stays permanently visible after the very first click, which reads as "stuck" to a shopper even though Magic Checkout is working correctly underneath. Cosmetic-only override: always show the label, never the spinner. Doesn't touch cart.min.js's id-tagging at all — that already tags every descendant of the button (spinner included), so hiding the spinner here has no effect on Magic Checkout still opening. */
body.agce-cart-experience .wc-block-cart__submit-button--loading .wc-block-components-button__text{visibility:visible!important}
body.agce-cart-experience .wc-block-cart__submit-button .wc-block-components-spinner{display:none!important}

/* Cross-sells: typography only */
body.agce-cart-experience .wc-block-cart__cross-sells h2{font-family:var(--agce-heading-font);color:var(--agce-primary-dark)}

/* Responsive: cosmetic spacing only. WC's own @container query already handles stacking/reordering. */
@media (max-width:600px){
body.agce-cart-experience .wc-block-cart-item__image,
body.agce-cart-experience .wc-block-cart-item__product,
body.agce-cart-experience .wc-block-cart-item__total{padding:14px}
body.agce-cart-experience .wc-block-cart__sidebar,
body.agce-cart-experience .wc-block-components-sidebar{padding:24px}
body.agce-cart-experience .wc-block-components-quantity-selector__button{min-width:36px;min-height:36px}
}

/* Reduced motion: honour user preference */
@media (prefers-reduced-motion:reduce){
body.agce-cart-experience .wc-block-cart__submit-button,
body.agce-cart-experience .wc-block-components-quantity-selector__button{transition:none}
body.agce-cart-experience .wc-block-cart__submit-button:hover{transform:none}
}