/* ============================================================
   Sparky Doll — Cart page (block + classic) UI/UX overhaul
   Loaded only on is_cart().  RTL-aware.  v1.0.6
   ============================================================ */

:root{
  --sd-line:#ece6ea;
  --sd-line-strong:#e3d8e0;
  --sd-ink:#2b2230;
  --sd-muted:#7a6f78;
  --sd-card:#faf7f9;
}

/* ---- 1. NEUTRALIZE THE WRAPPER CHAIN -----------------------
   The classic theme stacks 80px side-padding + a 1280 max-width
   on .wrap > article > .entry-content > .wp-block-…cart, which
   squeezes the cart block to ~640px. Strip those caps on the
   cart page and build one clean centered container instead.   */
body.woocommerce-cart main.wrap,
body.woocommerce-cart article,
body.woocommerce-cart .hentry,
body.woocommerce-cart .entry-content,
body.woocommerce-cart .entry-content > *,
body.woocommerce-cart .wp-block-woocommerce-cart{
  max-width:100% !important;
  width:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
  float:none !important;
}

/* single centered container that the layout lives in */
body.woocommerce-cart .wp-block-woocommerce-cart,
body.woocommerce-cart .woocommerce{
  max-width:1180px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:clamp(16px,4vw,40px) !important;
  padding-right:clamp(16px,4vw,40px) !important;
  padding-top:8px !important;
  box-sizing:border-box !important;
}

/* kill any horizontal overflow on the whole cart document */
body.woocommerce-cart{overflow-x:hidden;}
body.woocommerce-cart .wp-block-woocommerce-cart,
body.woocommerce-cart .wc-block-cart{overflow-x:clip;}

/* ============================================================
   2. DESKTOP — two-column 65 / 30 with sticky totals
   ============================================================ */
.wc-block-components-sidebar-layout{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:flex-start !important;
  gap:clamp(28px,4vw,56px) !important;
}
.wc-block-cart__main{
  flex:1 1 65% !important;
  max-width:none !important;
  min-width:0 !important;          /* prevents flex overflow */
  padding:0 !important;
}
.wc-block-cart__sidebar{
  flex:0 0 31% !important;
  max-width:360px !important;
  min-width:0 !important;
  position:sticky !important;
  top:110px !important;
  align-self:flex-start !important;
  background:var(--sd-card) !important;
  border:1px solid var(--sd-line) !important;
  border-radius:16px !important;
  padding:26px 24px !important;
  box-shadow:none !important;
}

/* ============================================================
   3. STRIP LEGACY WOO CHROME (block cart)
   ============================================================ */
.wc-block-cart table.wc-block-cart-items,
.wc-block-cart-items,
.wc-block-cart-items td,
.wc-block-cart-items th,
.wc-block-cart__main table{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* hide the heavy "Product / Total" header row */
.wc-block-cart-items__header{
  display:none !important;
}

/* each line item → airy row with a hairline separator */
.wc-block-cart-items__row{
  border:0 !important;
  border-bottom:1px solid var(--sd-line) !important;
  background:transparent !important;
  box-shadow:none !important;
  padding-top:22px !important;
  padding-bottom:22px !important;
}
.wc-block-cart-items__row td{
  border:0 !important;
  background:transparent !important;
  vertical-align:middle !important;
}

/* thumbnail */
.wc-block-cart-item__image{width:96px !important;}
.wc-block-cart-item__image img{
  width:88px !important;height:88px !important;
  object-fit:cover !important;
  border-radius:12px !important;
  border:1px solid var(--sd-line) !important;
}

/* title + meta */
.wc-block-cart-item__product{padding-inline-start:6px !important;}
.wc-block-cart-item__product .wc-block-components-product-name{
  font-weight:600 !important;
  color:var(--sd-ink) !important;
  text-decoration:none !important;
}
.wc-block-cart-item__prices,
.wc-block-cart-item__total{color:var(--sd-ink) !important;}

/* quantity stepper — minimal pill */
.wc-block-components-quantity-selector{
  border:1px solid var(--sd-line-strong) !important;
  border-radius:999px !important;
  background:#fff !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
.wc-block-components-quantity-selector__button{
  border:0 !important;background:transparent !important;color:var(--sd-ink) !important;
}

/* ---- totals card internals ---- */
.wc-block-cart__sidebar .wc-block-components-totals-wrapper,
.wc-block-cart__sidebar table{
  border:0 !important;background:transparent !important;box-shadow:none !important;
}
.wc-block-cart__sidebar .wc-block-components-totals-item{
  background:transparent !important;
}
.wc-block-cart__sidebar .wc-block-components-totals-footer-item{
  border-top:1px solid var(--sd-line) !important;
}

/* ---- Proceed to Checkout — full-width rose pill ---- */
.wc-block-cart__submit,
.wc-block-cart__submit-container,
.wp-block-woocommerce-proceed-to-checkout-block{width:100% !important;}
.wc-block-cart__submit-button,
.wp-block-woocommerce-proceed-to-checkout-block a,
.wc-block-cart__submit-container a,
.wc-block-components-button.contained{
  display:flex !important;
  width:100% !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:54px !important;
  padding:0 20px !important;
  background:var(--rose,#c8688a) !important;
  color:#fff !important;
  font-weight:600 !important;
  letter-spacing:.01em !important;
  border:0 !important;
  border-radius:999px !important;
  box-shadow:none !important;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-button.contained:hover{filter:brightness(.96);}

/* ============================================================
   4. CLASSIC (shortcode) CART fallback — same look
   ============================================================ */
.woocommerce table.shop_table{
  border:0 !important;background:transparent !important;border-radius:0 !important;
}
.woocommerce table.shop_table thead{display:none !important;}
.woocommerce table.shop_table td,
.woocommerce table.shop_table th{border:0 !important;border-bottom:1px solid var(--sd-line) !important;}
.woocommerce .cart-collaterals .cart_totals{
  background:var(--sd-card) !important;border:1px solid var(--sd-line) !important;
  border-radius:16px !important;padding:24px !important;
}
.woocommerce .wc-proceed-to-checkout a.checkout-button{
  width:100% !important;display:flex !important;justify-content:center !important;
  background:var(--rose,#c8688a) !important;color:#fff !important;border-radius:999px !important;
  min-height:54px !important;align-items:center !important;
}

/* ============================================================
   5. MOBILE  (< 768px) — stacked cards, zero overflow
   ============================================================ */
@media (max-width:768px){

  body.woocommerce-cart .wp-block-woocommerce-cart,
  body.woocommerce-cart .woocommerce{
    padding-left:14px !important;padding-right:14px !important;
  }

  /* single column */
  .wc-block-components-sidebar-layout{
    flex-direction:column !important;
    gap:22px !important;
  }
  .wc-block-cart__main,
  .wc-block-cart__sidebar{
    flex:1 1 100% !important;
    max-width:100% !important;
    width:100% !important;
  }
  .wc-block-cart__sidebar{
    position:static !important;       /* no sticky on mobile */
    top:auto !important;
  }

  /* dismantle the table → each row becomes a card */
  .wc-block-cart-items,
  .wc-block-cart-items tbody,
  .wc-block-cart-items__row,
  .wc-block-cart-items td{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .wc-block-cart-items__row{
    border:1px solid var(--sd-line) !important;
    border-radius:14px !important;
    padding:16px !important;
    margin-bottom:14px !important;
    display:grid !important;
    grid-template-columns:84px 1fr !important;
    grid-template-areas:
      "img  product"
      "qty  total" !important;
    column-gap:14px !important;
    row-gap:14px !important;
    align-items:start !important;
  }
  .wc-block-cart-item__image{grid-area:img !important;width:84px !important;}
  .wc-block-cart-item__image img{width:84px !important;height:84px !important;}
  .wc-block-cart-item__product{grid-area:product !important;padding:0 !important;}
  .wc-block-cart-item__quantity{grid-area:qty !important;}
  .wc-block-cart-item__total{
    grid-area:total !important;
    text-align:end !important;
    align-self:center !important;
    font-weight:600 !important;
  }

  /* classic fallback rows on mobile */
  .woocommerce table.shop_table,
  .woocommerce table.shop_table tbody,
  .woocommerce table.shop_table tr,
  .woocommerce table.shop_table td{display:block !important;width:100% !important;}
  .woocommerce table.shop_table tr{
    border:1px solid var(--sd-line) !important;border-radius:14px !important;
    padding:14px !important;margin-bottom:14px !important;
  }

  /* coupon row never overflows */
  .wc-block-components-totals-coupon__form,
  .woocommerce .coupon{display:flex !important;flex-wrap:wrap !important;gap:8px !important;}
  .wc-block-components-totals-coupon__input,
  .woocommerce .coupon input{flex:1 1 auto !important;min-width:0 !important;}

  img{max-width:100% !important;height:auto;}
}