/* ================================================================
   ZOONUM — CART PAGE CSS v1.0 (ADDITIVE)
   Styles the WooCommerce Cart page.
   Everything else inherits from the Homepage v5.1 CSS.
   ──────────────────────────────────────────────────────────────
   Paste into: WPCode > Add Snippet > CSS Snippet
   Requires:   Homepage v5.1 CSS snippet must also be active
   ================================================================ */

/* ================================================================
   CART HEADER
================================================================ */
.zn-cart-header {
  background:    var(--zn-light);
  padding:       40px 0 40px !important;
  border-bottom: 1px solid var(--zn-border);
}
.zn-cart-header .zn-container {
  padding-top: 75px !important;
}
.zn-cart-header__crumbs {
  font-family:     'Montserrat', sans-serif;
  font-size:       12px;
  font-weight:     500;
  color:           var(--zn-text-light);
  display:         flex;
  align-items:     center;
  gap:             6px;
  margin-bottom:   16px !important;
}
.zn-cart-header__crumbs a {
  color:      var(--zn-primary) !important;
  transition: color 0.2s;
}
.zn-cart-header__crumbs a:hover { color: var(--zn-primary-dark) !important; }
.zn-cart-header__crumbs span:last-child { color: var(--zn-text-muted); }
.zn-cart-header__title {
  font-family:    'Montserrat', sans-serif;
  font-size:      clamp(30px, 4vw, 48px);
  font-weight:    800;
  color:          var(--zn-text);
  line-height:    1.1;
  letter-spacing: -0.02em;
}

/* ================================================================
   WOOCOMMERCE CART — CONTAINER
================================================================ */
.woocommerce-cart .woocommerce,
.woocommerce-cart .entry-content .woocommerce {
  max-width:   1180px !important;
  margin:      0 auto !important;
  padding:     48px 24px 80px !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* ================================================================
   CART TABLE
================================================================ */
.woocommerce-cart-form__contents,
.woocommerce-cart .shop_table {
  width:           100% !important;
  border-collapse: separate !important;
  border-spacing:  0 !important;
  border:          1px solid var(--zn-border) !important;
  border-radius:   14px !important;
  overflow:        hidden !important;
  font-family:     'Montserrat', sans-serif !important;
  margin-bottom:   36px !important;
}

/* Table header */
.woocommerce-cart .shop_table thead th {
  font-family:     'Montserrat', sans-serif !important;
  font-size:       11px !important;
  font-weight:     700 !important;
  text-transform:  uppercase !important;
  letter-spacing:  0.06em !important;
  color:           var(--zn-text-muted) !important;
  background:      var(--zn-light-alt) !important;
  padding:         16px 20px !important;
  border-bottom:   1px solid var(--zn-border) !important;
  text-align:      left !important;
}

/* Table cells */
.woocommerce-cart .shop_table tbody td {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     14px !important;
  font-weight:   500 !important;
  color:         var(--zn-text) !important;
  padding:       20px !important;
  border-bottom: 1px solid var(--zn-border) !important;
  background:    var(--zn-light) !important;
  vertical-align: middle !important;
}
.woocommerce-cart .shop_table tbody tr:last-child td {
  border-bottom: none !important;
}

/* Product thumbnail */
.woocommerce-cart .shop_table .product-thumbnail img {
  width:         72px !important;
  height:        72px !important;
  object-fit:    cover !important;
  border-radius: 10px !important;
  border:        1px solid var(--zn-border) !important;
}

/* Product name */
.woocommerce-cart .shop_table .product-name a {
  font-family:     'Montserrat', sans-serif !important;
  font-size:       14px !important;
  font-weight:     700 !important;
  color:           var(--zn-text) !important;
  text-decoration: none !important;
  transition:      color 0.2s;
}
.woocommerce-cart .shop_table .product-name a:hover {
  color: var(--zn-primary) !important;
}

/* Price */
.woocommerce-cart .shop_table .product-price,
.woocommerce-cart .shop_table .product-subtotal {
  font-family: 'Montserrat', sans-serif !important;
  font-size:   14px !important;
  font-weight: 600 !important;
  color:       var(--zn-text) !important;
}

/* Quantity input */
.woocommerce-cart .shop_table .product-quantity .quantity input[type="number"] {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     14px !important;
  font-weight:   600 !important;
  color:         var(--zn-text) !important;
  background:    var(--zn-light-alt) !important;
  border:        1px solid var(--zn-border) !important;
  border-radius: 8px !important;
  padding:       8px 12px !important;
  width:         70px !important;
  text-align:    center !important;
  outline:       none !important;
  transition:    border-color 0.2s !important;
}
.woocommerce-cart .shop_table .product-quantity .quantity input:focus {
  border-color: var(--zn-primary) !important;
  background:   var(--zn-light) !important;
}

/* Remove button */
.woocommerce-cart .shop_table .product-remove a,
.woocommerce-cart .shop_table .product-remove .remove {
  color:           rgba(239,68,68,0.5) !important;
  font-size:       20px !important;
  font-weight:     300 !important;
  text-decoration: none !important;
  width:           32px !important;
  height:          32px !important;
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
  border-radius:   8px !important;
  transition:      background 0.2s, color 0.2s !important;
  background:      transparent !important;
}
.woocommerce-cart .shop_table .product-remove a:hover,
.woocommerce-cart .shop_table .product-remove .remove:hover {
  background: rgba(239,68,68,0.08) !important;
  color:      #ef4444 !important;
}

/* ================================================================
   ACTIONS ROW (coupon + update cart)
================================================================ */
.woocommerce-cart .shop_table .actions {
  padding:    20px !important;
  background: var(--zn-light-alt) !important;
  border-top: 1px solid var(--zn-border) !important;
}

/* Coupon form */
.woocommerce-cart .coupon {
  display:     flex !important;
  align-items: center !important;
  gap:         10px !important;
  flex-wrap:   wrap !important;
}
.woocommerce-cart .coupon label {
  display: none !important;
}
.woocommerce-cart .coupon input[type="text"] {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     13px !important;
  color:         var(--zn-text) !important;
  background:    var(--zn-light) !important;
  border:        1px solid var(--zn-border) !important;
  border-radius: 8px !important;
  padding:       10px 16px !important;
  width:         200px !important;
  outline:       none !important;
  transition:    border-color 0.2s !important;
}
.woocommerce-cart .coupon input[type="text"]:focus {
  border-color: var(--zn-primary) !important;
}
.woocommerce-cart .coupon input[type="text"]::placeholder {
  color: #94a3b8 !important;
}

/* Apply coupon button */
.woocommerce-cart .coupon .button {
  font-family:    'Montserrat', sans-serif !important;
  font-size:      12px !important;
  font-weight:    700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color:          var(--zn-primary) !important;
  background:     var(--zn-primary-bg) !important;
  border:         1px solid var(--zn-primary-bdr) !important;
  border-radius:  8px !important;
  padding:        10px 20px !important;
  cursor:         pointer !important;
  transition:     background 0.2s, color 0.2s !important;
  text-decoration: none !important;
}
.woocommerce-cart .coupon .button:hover {
  background: var(--zn-primary) !important;
  color:      #fff !important;
}

/* Update cart button */
.woocommerce-cart .actions button[name="update_cart"],
.woocommerce-cart .actions input[name="update_cart"] {
  font-family:    'Montserrat', sans-serif !important;
  font-size:      12px !important;
  font-weight:    700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color:          var(--zn-text-muted) !important;
  background:     transparent !important;
  border:         1px solid var(--zn-border) !important;
  border-radius:  8px !important;
  padding:        10px 20px !important;
  cursor:         pointer !important;
  transition:     background 0.2s, color 0.2s, border-color 0.2s !important;
  float:          right !important;
}
.woocommerce-cart .actions button[name="update_cart"]:hover,
.woocommerce-cart .actions input[name="update_cart"]:hover {
  border-color: var(--zn-primary) !important;
  color:        var(--zn-primary) !important;
}

/* ================================================================
   CART TOTALS
================================================================ */
.cart_totals,
.woocommerce-cart .cart_totals {
  float:         right !important;
  width:         420px !important;
  background:    var(--zn-light) !important;
  border:        1px solid var(--zn-border) !important;
  border-radius: 14px !important;
  padding:       32px 28px !important;
}
.cart_totals h2,
.woocommerce-cart .cart_totals h2 {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     18px !important;
  font-weight:   700 !important;
  color:         var(--zn-text) !important;
  margin-bottom: 20px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--zn-border) !important;
}

/* Totals table */
.cart_totals .shop_table,
.woocommerce-cart .cart_totals .shop_table {
  border:        none !important;
  border-radius: 0 !important;
  overflow:      visible !important;
  margin-bottom: 24px !important;
}
.cart_totals .shop_table th,
.woocommerce-cart .cart_totals .shop_table th {
  font-family:    'Montserrat', sans-serif !important;
  font-size:      13px !important;
  font-weight:    600 !important;
  color:          var(--zn-text-muted) !important;
  background:     transparent !important;
  padding:        12px 0 !important;
  border-bottom:  1px solid var(--zn-border) !important;
  text-align:     left !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.cart_totals .shop_table td,
.woocommerce-cart .cart_totals .shop_table td {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     14px !important;
  font-weight:   600 !important;
  color:         var(--zn-text) !important;
  background:    transparent !important;
  padding:       12px 0 !important;
  border-bottom: 1px solid var(--zn-border) !important;
  text-align:    right !important;
}
/* Order total row */
.cart_totals .shop_table .order-total th,
.cart_totals .shop_table .order-total td {
  font-size:   16px !important;
  font-weight: 800 !important;
  color:       var(--zn-text) !important;
  border-bottom: none !important;
  padding-top: 16px !important;
}
.cart_totals .shop_table .order-total td .amount {
  color: var(--zn-primary) !important;
  font-size: 18px !important;
}

/* Shipping */
.cart_totals .shop_table .shipping td {
  font-size: 13px !important;
}

/* Proceed to checkout */
.wc-proceed-to-checkout,
.woocommerce-cart .wc-proceed-to-checkout {
  padding-top: 0 !important;
}
.wc-proceed-to-checkout .checkout-button,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  font-family:    'Montserrat', sans-serif !important;
  font-size:      14px !important;
  font-weight:    700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  background:     var(--zn-primary) !important;
  color:          #fff !important;
  border:         none !important;
  border-radius:  50px !important;
  padding:        16px 32px !important;
  display:        block !important;
  width:          100% !important;
  text-align:     center !important;
  text-decoration: none !important;
  cursor:         pointer !important;
  transition:     background 0.2s, transform 0.2s, box-shadow 0.2s !important;
  box-shadow:     0 4px 14px rgba(var(--zn-primary-rgb), 0.25) !important;
  box-sizing:     border-box !important;
}
.wc-proceed-to-checkout .checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
  background: var(--zn-primary-dark) !important;
  transform:  translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(var(--zn-primary-rgb), 0.35) !important;
}

/* ================================================================
   EMPTY CART
================================================================ */
.woocommerce-cart .cart-empty,
.woocommerce-cart .woocommerce-info {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     15px !important;
  color:         var(--zn-text-muted) !important;
  background:    var(--zn-light-alt) !important;
  border:        1px solid var(--zn-border) !important;
  border-left:   3px solid var(--zn-primary) !important;
  border-radius: 10px !important;
  padding:       20px 24px !important;
  margin-bottom: 24px !important;
  text-align:    center !important;
}
.woocommerce-cart .return-to-shop .button,
.woocommerce-cart .cart-empty + .return-to-shop .button {
  font-family:    'Montserrat', sans-serif !important;
  font-size:      13px !important;
  font-weight:    700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  background:     var(--zn-primary) !important;
  color:          #fff !important;
  border:         none !important;
  border-radius:  50px !important;
  padding:        14px 32px !important;
  text-decoration: none !important;
  display:        inline-block !important;
  transition:     background 0.2s, transform 0.2s, box-shadow 0.2s !important;
  box-shadow:     0 4px 14px rgba(var(--zn-primary-rgb), 0.25) !important;
  margin-top:     8px !important;
}
.woocommerce-cart .return-to-shop .button:hover {
  background: var(--zn-primary-dark) !important;
  transform:  translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(var(--zn-primary-rgb), 0.35) !important;
}
.woocommerce-cart .return-to-shop {
  text-align: center !important;
}

/* ================================================================
   CROSS-SELLS (if enabled)
================================================================ */
.woocommerce-cart .cross-sells {
  float:      left !important;
  width:      calc(100% - 460px) !important;
  margin-top: 0 !important;
}
.woocommerce-cart .cross-sells h2 {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     18px !important;
  font-weight:   700 !important;
  color:         var(--zn-text) !important;
  margin-bottom: 20px !important;
}

/* ================================================================
   NOTICES
================================================================ */
.woocommerce-cart .woocommerce-message {
  font-family:   'Montserrat', sans-serif !important;
  font-size:     14px !important;
  color:         var(--zn-text-muted) !important;
  background:    var(--zn-light-alt) !important;
  border:        1px solid var(--zn-border) !important;
  border-left:   3px solid var(--zn-primary) !important;
  border-radius: 10px !important;
  padding:       16px 20px !important;
  margin-bottom: 24px !important;
}
.woocommerce-cart .woocommerce-message a {
  color: var(--zn-primary) !important;
}

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width: 768px) {
  .zn-cart-header {
    padding: 28px 0 28px !important;
  }
  .zn-cart-header .zn-container {
    padding-top: 50px !important;
  }
  .zn-cart-header__title {
    font-size: clamp(26px, 7vw, 36px);
  }

  .woocommerce-cart .woocommerce {
    padding: 32px 16px 56px !important;
  }

  /* ── Mobile cart: card-based layout ── */
  .woocommerce-cart .shop_table {
    display:       block !important;
    border:        none !important;
    border-radius: 0 !important;
    overflow:      visible !important;
  }
  .woocommerce-cart .shop_table thead {
    display: none !important;
  }
  .woocommerce-cart .shop_table tbody {
    display: block !important;
  }

  /* Each product = a card */
  .woocommerce-cart .shop_table tbody tr.cart_item {
    display:       block !important;
    background:    var(--zn-light) !important;
    border:        1px solid var(--zn-border) !important;
    border-radius: 14px !important;
    padding:       20px !important;
    margin-bottom: 16px !important;
    position:      relative;
  }

  /* Remove lines between cells WITHIN the same product */
  .woocommerce-cart .shop_table tbody tr.cart_item td {
    display:       flex !important;
    align-items:   center !important;
    justify-content: space-between !important;
    padding:       10px 0 !important;
    border-bottom: none !important;
    background:    transparent !important;
    font-size:     14px !important;
  }

  /* No separators between rows within a card */
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-name,
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-price,
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-quantity {
    border-bottom:  none !important;
    padding-bottom: 10px !important;
    margin-bottom:  0 !important;
  }

  /* Mobile data-title labels */
  .woocommerce-cart .shop_table tbody tr.cart_item td::before {
    font-family:    'Montserrat', sans-serif !important;
    font-size:      12px !important;
    font-weight:    700 !important;
    color:          var(--zn-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
  }

  /* Thumbnail — left side */
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-thumbnail {
    justify-content: flex-start !important;
    padding-bottom:  16px !important;
    border-bottom:   none !important;
  }
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-thumbnail::before {
    display: none !important;
  }
  .woocommerce-cart .shop_table .product-thumbnail img {
    width:  80px !important;
    height: 80px !important;
  }

  /* Remove button — same row as image, far right */
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-remove {
    position:  absolute !important;
    top:       20px !important;
    right:     20px !important;
    padding:   0 !important;
    border:    none !important;
    width:     auto !important;
  }
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-remove::before {
    display: none !important;
  }

  /* Subtotal — bold, no bottom border */
  .woocommerce-cart .shop_table tbody tr.cart_item td.product-subtotal {
    padding-top:  14px !important;
    border-bottom: none !important;
    font-weight:  700 !important;
    font-size:    15px !important;
  }

  /* ── Actions row (coupon + update cart) ── */
  .woocommerce-cart .shop_table .actions {
    display:        flex !important;
    flex-direction: column !important;
    gap:            14px !important;
    padding:        24px 0 0 !important;
    background:     transparent !important;
    border:         none !important;
    border-top:     none !important;
  }
  .woocommerce-cart .shop_table .actions td {
    display: block !important;
    padding: 0 !important;
    border:  none !important;
  }

  .woocommerce-cart .coupon {
    display:        flex !important;
    flex-direction: row !important;
    gap:            10px !important;
    width:          100% !important;
  }
  .woocommerce-cart .coupon input[type="text"] {
    flex:      1 !important;
    width:     auto !important;
    max-width: none !important;
  }
  .woocommerce-cart .coupon .button {
    flex-shrink: 0 !important;
    width:       auto !important;
  }

  .woocommerce-cart .actions button[name="update_cart"],
  .woocommerce-cart .actions input[name="update_cart"] {
    float:       none !important;
    width:       100% !important;
    text-align:  center !important;
    padding:     12px 20px !important;
    border-radius: 10px !important;
  }

  /* ── Cart totals — full width, spacious ── */
  .cart_totals,
  .woocommerce-cart .cart_totals {
    float:   none !important;
    width:   100% !important;
    margin:  0 !important;
    padding: 28px 24px !important;
  }
  .cart_totals .shop_table,
  .woocommerce-cart .cart_totals .shop_table,
  .woocommerce-cart .cart_totals table {
    width:   100% !important;
    display: table !important;
  }
  .woocommerce-cart .cart_totals .shop_table tbody {
    display: table-row-group !important;
    width:   100% !important;
  }
  .woocommerce-cart .cart_totals .shop_table tr {
    display: table-row !important;
    width:   100% !important;
  }
  .cart_totals .shop_table th,
  .woocommerce-cart .cart_totals .shop_table th {
    width:      40% !important;
    text-align: left !important;
    display:    table-cell !important;
  }
  .cart_totals .shop_table td,
  .woocommerce-cart .cart_totals .shop_table td {
    width:      60% !important;
    text-align: right !important;
    display:    table-cell !important;
  }

  /* Cross-sells full width */
  .woocommerce-cart .cross-sells {
    float:      none !important;
    width:      100% !important;
    margin-top: 32px !important;
  }
}

@media (max-width: 480px) {
  .zn-cart-header {
    padding: 20px 0 22px !important;
  }
  .zn-cart-header .zn-container {
    padding-top: 40px !important;
  }
  .zn-cart-header__crumbs { margin-bottom: 10px !important; }
  .zn-cart-header__title { font-size: clamp(24px, 8vw, 32px); }

  .woocommerce-cart .woocommerce {
    padding: 24px 12px 40px !important;
  }

  /* Cards tighter */
  .woocommerce-cart .shop_table tbody tr.cart_item {
    padding: 16px !important;
    margin-bottom: 12px !important;
    border-radius: 12px !important;
  }

  .cart_totals,
  .woocommerce-cart .cart_totals {
    padding:       22px 18px !important;
    border-radius: 12px !important;
  }

  .wc-proceed-to-checkout .checkout-button {
    font-size: 13px !important;
    padding:   14px 24px !important;
  }

  /* Coupon stacks on very small screens */
  .woocommerce-cart .coupon {
    flex-direction: column !important;
  }
  .woocommerce-cart .coupon input[type="text"] {
    width: 100% !important;
  }
  .woocommerce-cart .coupon .button {
    width:      100% !important;
    text-align: center !important;
  }
}

/* Hide "Change address" button in cart */
.woocommerce-cart .shipping-calculator-button,
.woocommerce-cart .shipping-calculator-form,
.cart_totals .shipping-calculator-button {
  display: none !important;
}

/* ══════════════════════════════════════════════════════════
   CART v1.5 — custom two-column layout (zn-cartx)
   Item cards left, sticky summary + coupon right.
   ══════════════════════════════════════════════════════════ */

.zn-cartx {
  display:               grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap:                   0 40px;
  align-items:           start;
  max-width:             1180px;
  margin:                0 auto;
  padding:               40px 24px 24px;
}

/* ── Items card ── */
.zn-cartx__card {
  background:    var(--zn-light);
  border:        1px solid var(--zn-border);
  border-radius: 16px;
  overflow:      hidden;
}

.zn-cartx__head {
  padding:       18px 24px;
  border-bottom: 1px solid var(--zn-border);
  background:    var(--zn-light-card);
}

.zn-cartx__heading {
  font-family: var(--zn-font-heading);
  font-size:   15px;
  font-weight: 700;
  color:       var(--zn-dark);
  margin:      0;
}

.zn-cartx__item {
  display:               grid;
  grid-template-columns: 72px minmax(0, 1fr) 110px 100px 32px;
  gap:                   18px;
  align-items:           center;
  padding:               18px 24px;
  border-bottom:         1px solid var(--zn-border);
}

.zn-cartx__item:last-child {
  border-bottom: none;
}

.zn-cartx__thumb img {
  display:       block;
  width:         72px;
  height:        72px;
  object-fit:    cover;
  border-radius: 10px;
  border:        1px solid var(--zn-border);
  background:    var(--zn-light-alt);
}

.zn-cartx__name,
.zn-cartx__name a {
  font-family:     var(--zn-font-heading);
  font-size:       14.5px;
  font-weight:     700;
  color:           var(--zn-dark) !important;
  text-decoration: none !important;
  line-height:     1.35;
}

.zn-cartx__name a:hover {
  color: var(--zn-primary) !important;
}

.zn-cartx__name .variation {
  font-family: var(--zn-font-body);
  font-size:   12.5px;
  font-weight: 400;
  color:       var(--zn-text-muted);
  margin:      4px 0 0;
}

.zn-cartx__unit {
  font-size:  12.5px;
  color:      var(--zn-text-muted);
  margin-top: 3px;
}

.zn-cartx__unit .amount {
  color: var(--zn-text-muted);
}

/* Quantity input */
.zn-cartx__qty .quantity {
  display: flex;
  justify-content: center;
}

.zn-cartx__qty .qty {
  width:         64px;
  height:        40px;
  text-align:    center;
  border:        1px solid var(--zn-border);
  border-radius: 8px;
  font-family:   var(--zn-font-heading);
  font-size:     14px;
  font-weight:   600;
  color:         var(--zn-dark);
  background:    var(--zn-light);
}

.zn-cartx__qty .qty:focus {
  outline:      none;
  border-color: var(--zn-primary);
  box-shadow:   0 0 0 3px var(--zn-primary-bg);
}

.zn-cartx__line {
  font-family: var(--zn-font-heading);
  font-size:   15px;
  font-weight: 700;
  color:       var(--zn-dark);
  text-align:  right;
}

.zn-cartx__line .amount {
  color: inherit;
}

.zn-cartx__remove .remove {
  display:         inline-flex;
  align-items:     center;
  justify-content: center;
  width:           30px;
  height:          30px;
  border-radius:   8px;
  background:      transparent !important;
  color:           var(--zn-text-light) !important;
  transition:      background 0.15s ease, color 0.15s ease;
}

.zn-cartx__remove .remove svg {
  width:  14px;
  height: 14px;
}

.zn-cartx__remove .remove:hover {
  background: rgba(192, 57, 43, 0.08) !important;
  color:      #c0392b !important;
}

/* Actions row */
.zn-cartx__actions {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  gap:             14px;
  padding:         16px 24px;
  border-top:      1px solid var(--zn-border);
  background:      var(--zn-light-card);
}

.zn-cartx__continue {
  font-family:     var(--zn-font-heading);
  font-size:       13px;
  font-weight:     700;
  color:           var(--zn-primary) !important;
  text-decoration: none !important;
}

.zn-cartx__continue:hover {
  color: var(--zn-primary-dark) !important;
}

.zn-cartx__update {
  padding:       10px 20px;
  background:    var(--zn-light) !important;
  border:        1px solid var(--zn-border) !important;
  border-radius: 8px !important;
  font-family:   var(--zn-font-heading) !important;
  font-size:     12.5px !important;
  font-weight:   700 !important;
  color:         var(--zn-text) !important;
  cursor:        pointer;
  transition:    border-color 0.15s ease, color 0.15s ease;
}

.zn-cartx__update:hover:not(:disabled) {
  border-color: var(--zn-primary) !important;
  color:        var(--zn-primary) !important;
}

.zn-cartx__update:disabled {
  opacity: 0.45;
}

/* ── Right column ── */
.zn-cartx__side {
  position: sticky;
  top:      92px;
}

.zn-cartx__coupon {
  background:    var(--zn-light);
  border:        1px solid var(--zn-border);
  border-radius: 16px;
  padding:       18px 20px;
  margin-bottom: 18px;
}

.zn-cartx__coupon-label {
  display:       block;
  font-family:   var(--zn-font-heading);
  font-size:     12px;
  font-weight:   700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color:         var(--zn-text-muted);
  margin-bottom: 10px;
}

.zn-cartx__coupon-row {
  display: flex;
  gap:     8px;
}

.zn-cartx__coupon-row .input-text {
  flex:          1;
  min-width:     0;
  height:        42px;
  padding:       0 14px;
  border:        1px solid var(--zn-border);
  border-radius: 8px;
  font-size:     13.5px;
}

.zn-cartx__coupon-row .input-text:focus {
  outline:      none;
  border-color: var(--zn-primary);
  box-shadow:   0 0 0 3px var(--zn-primary-bg);
}

.zn-cartx__coupon-row button {
  height:        42px;
  padding:       0 18px;
  background:    var(--zn-primary-bg) !important;
  border:        1px solid var(--zn-primary-bdr) !important;
  border-radius: 8px !important;
  font-family:   var(--zn-font-heading) !important;
  font-size:     12.5px !important;
  font-weight:   700 !important;
  color:         var(--zn-primary) !important;
  cursor:        pointer;
  transition:    background 0.15s ease, color 0.15s ease;
}

.zn-cartx__coupon-row button:hover {
  background: var(--zn-primary) !important;
  color:      #fff !important;
}

/* Summary card (native cart totals renders inside) */
.zn-cartx .cart-collaterals {
  width: 100%;
}

.zn-cartx .cart-collaterals .cart_totals {
  float: none !important;
  width: 100% !important;
}

/* Cross-sells full width below the grid */
.zn-cartx__cross-sells {
  max-width: 1180px;
  margin:    0 auto;
  padding:   0 24px 60px;
}

.zn-cartx__cross-sells:empty {
  display: none;
}

/* ── Responsive ── */
@media (max-width: 1000px) {
  .zn-cartx {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .zn-cartx__side {
    position: static;
  }
}

@media (max-width: 640px) {
  .zn-cartx__item {
    grid-template-columns: 64px minmax(0, 1fr) 32px;
    grid-template-rows:    auto auto;
    row-gap:               10px;
  }

  .zn-cartx__thumb {
    grid-row: 1 / span 2;
  }

  .zn-cartx__thumb img {
    width:  64px;
    height: 64px;
  }

  .zn-cartx__remove {
    grid-column: 3;
    grid-row:    1;
  }

  .zn-cartx__qty {
    grid-column:     2;
    grid-row:        2;
    justify-self:    start;
  }

  .zn-cartx__qty .quantity {
    justify-content: flex-start;
  }

  .zn-cartx__line {
    grid-column: 2 / span 2;
    grid-row:    3;
    text-align:  left;
  }

  .zn-cartx__actions {
    flex-direction: column;
    align-items:    stretch;
    text-align:     center;
  }
}