/* ============================================================
   HAUTE OPTIQUE — Cart page (.ho-cart)
   Styles the custom cart template (woocommerce/cart/cart.php), which renders
   when the Cart page uses the standard [woocommerce_cart] (not XStore's widget).
   Self-contained: defines its own tokens under body.woocommerce-cart so it works
   even though the child main.css isn't enqueued. Enqueued directly in inc/cart.php.
   ============================================================ */

body.woocommerce-cart{
  --color-text-primary:#1A1A1A;
  --color-text-muted:#6B6B6B;
  --color-border:#E8E8E8;
  --color-bg:#FFFFFF;
  --color-surface:#F7F6F2;
  --color-surface-alt:#F2F2F2;
  --color-surface-dark:#1A1A1A;
  --color-accent:#2D6A5A;
  --color-badge-hot:#E8453C;
  --radius-md:12px;
  --radius-pill:999px;
  --shadow-card:0 2px 16px rgba(0,0,0,.08);
  --font-body:'Inter',-apple-system,sans-serif;
  --transition-fast:150ms ease;
  --transition-base:250ms ease;
}

.ho-cart{
  --hoc-ink:var(--color-text-primary);--hoc-soft:var(--color-text-muted);--hoc-line:var(--color-border);
  --hoc-card:var(--color-bg);--hoc-tint:var(--color-surface-alt);--hoc-ok:var(--color-accent);
  font-family:var(--font-body);max-width:1320px;margin:0 auto;padding:8px 0 24px;color:var(--hoc-ink);box-sizing:border-box}
.ho-cart *,.ho-cart *::before,.ho-cart *::after{box-sizing:border-box}
.ho-cart a{text-decoration:none;color:inherit}

/* ---- fixes / overrides ---- */
/* hide XStore's cart→checkout step nav on the cart page */
body.woocommerce-cart .cart-checkout-nav{display:none!important}
/* kill XStore's default border/box around the totals so it flows inside our card */
.ho-cart .cart-collaterals,
.ho-cart .cart-collaterals .cart_totals,
.ho-cart .cart_totals,
.ho-cart .ho-summary{border:0!important;background:none!important;padding:0!important;border-radius:0!important;box-shadow:none!important;margin:0!important}
.ho-cart .ho-ship-free{color:var(--hoc-ok);font-weight:600}
/* remove native number-input spinner arrows on the qty field (keep only our -/+) */
.ho-cart .ho-qty .quantity input,
.ho-cart .ho-qty input[type=number]{-moz-appearance:textfield!important;-webkit-appearance:none!important;appearance:none!important}
.ho-cart .ho-qty input::-webkit-outer-spin-button,
.ho-cart .ho-qty input::-webkit-inner-spin-button{-webkit-appearance:none!important;appearance:none!important;margin:0!important;display:none!important}

/* head */
.ho-cart-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.ho-cart-head h1{font-family:var(--font-body);font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin:0;color:var(--hoc-ink)}
.ho-cart-count{font-size:14px;color:var(--hoc-soft);font-weight:500}

/* grid */
.ho-cart-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:40px;align-items:start}
.ho-cart-col{min-width:0}

/* items card */
.ho-cart-card{background:var(--hoc-card);border:1px solid var(--hoc-line);border-radius:var(--radius-md);box-shadow:var(--shadow-card);overflow:hidden}
.ho-cart-card-hd{padding:20px 22px 14px;border-bottom:1px solid var(--hoc-line);display:flex;align-items:center;justify-content:space-between}
.ho-cart-card-hd h2{font-size:16px;font-weight:600;margin:0;color:var(--hoc-ink)}
.ho-clear{font-size:12.5px;font-weight:600;color:var(--color-badge-hot)!important;cursor:pointer;display:inline-flex;align-items:center;gap:5px;border-radius:var(--radius-pill);padding:5px 10px;transition:opacity var(--transition-fast)}
.ho-clear svg{color:var(--color-badge-hot)!important}
.ho-clear:hover{background:none;color:var(--color-badge-hot)!important;opacity:.75}

/* line item */
.ho-line{display:flex;gap:18px;padding:22px;border-bottom:1px solid var(--hoc-line);align-items:flex-start}
.ho-line:last-child{border-bottom:none}
.ho-line-img{flex:none;width:104px;height:104px;border-radius:10px;background:var(--hoc-tint);overflow:hidden;display:grid;place-items:center;border:1px solid var(--color-surface)}
.ho-line-img a,.ho-line-img img{display:block;width:100%;height:100%;object-fit:cover}
.ho-line-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ho-line-cat{font-size:10.5px;color:var(--hoc-soft);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.ho-line-name{font-size:15.5px;font-weight:600;color:var(--hoc-ink);line-height:1.3}
a.ho-line-name:hover{color:#000;text-decoration:underline}
.ho-line-meta{font-size:12.5px;color:var(--hoc-soft);line-height:1.5;margin-top:2px}
.ho-line-meta p,.ho-line-meta dl{margin:0}
/* stock pill — matches the product page badge (grey pill + coloured dot) */
.ho-line-stock{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:#f2f2f2;color:#1a1a1a;font-size:12.5px;font-weight:500;line-height:1;padding:6px 14px;border-radius:999px;margin-top:6px;width:auto}
.ho-line-stock::before{content:"";width:9px;height:9px;border-radius:50%;background:#22c55e;flex:none}
.ho-line-stock.ho-low::before{background:#f5a623}
.ho-line-actions{margin-top:12px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}

/* qty stepper wrapping WC quantity input */
.ho-qty{display:inline-flex;align-items:center;border:1.5px solid var(--hoc-line);border-radius:var(--radius-pill);background:var(--hoc-card);overflow:hidden}
.ho-qty-btn{width:34px;height:34px;border:none;background:none;color:var(--hoc-ink);font-size:17px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background var(--transition-fast)}
.ho-qty-btn:hover{background:var(--hoc-tint)}
.ho-qty .quantity{margin:0!important;display:flex;align-items:center;background:none;border:none;padding:0}
.ho-qty .quantity label{display:none}
.ho-qty .quantity input.qty,.ho-qty .quantity input[type=number]{width:38px;min-width:38px;height:34px;padding:0;margin:0;border:none;background:none;text-align:center;font-family:var(--font-body);font-size:14px;font-weight:600;color:var(--hoc-ink);outline:none;box-shadow:none;-moz-appearance:textfield;appearance:none}
.ho-qty .quantity input.qty::-webkit-outer-spin-button,.ho-qty .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ho-qty .quantity .ho-qty-fixed{padding:0 12px;font-weight:600}

.ho-remove{background:none;border:none;font-size:12px;font-weight:600;color:var(--color-badge-hot)!important;cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:4px 6px;border-radius:var(--radius-pill);transition:opacity var(--transition-fast)}
.ho-remove svg{color:var(--color-badge-hot)!important}
.ho-remove:hover{color:var(--color-badge-hot)!important;background:none;opacity:.75}

.ho-line-right{flex:none;display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:2px}
.ho-line-price{font-size:16px;font-weight:600;color:var(--hoc-ink);white-space:nowrap}
.ho-line-unit{font-size:11.5px;color:var(--hoc-soft);font-weight:500}

.ho-cart-formfoot{padding:14px 22px;display:flex;justify-content:flex-end}
.ho-update-cart{background:none;border:1px solid var(--hoc-line);color:var(--hoc-soft);border-radius:var(--radius-pill);padding:9px 18px;font-family:var(--font-body);font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color var(--transition-fast),color var(--transition-fast)}
.ho-update-cart:hover{border-color:var(--hoc-ink);color:var(--hoc-ink)}
.ho-continue{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:13.5px;font-weight:600;color:var(--hoc-ink)}
.ho-continue:hover{gap:11px;transition:gap var(--transition-fast)}

/* sidebar summary */
.ho-sidebar{position:sticky;top:24px}
.ho-scard{background:var(--hoc-card);border:1px solid var(--hoc-line);border-radius:var(--radius-md);box-shadow:var(--shadow-card);overflow:hidden}
.ho-scard-hd{padding:20px 22px 14px;border-bottom:1px solid var(--hoc-line);display:flex;align-items:center;justify-content:space-between}
.ho-scard-title{font-size:17px;font-weight:600;color:var(--hoc-ink)}
.ho-sbadge{font-size:12px;font-weight:600;color:var(--hoc-soft);background:var(--hoc-tint);padding:3px 10px;border-radius:var(--radius-pill)}
.ho-coupon{padding:18px 22px;border-bottom:1px solid var(--hoc-line)}
.ho-coupon-label{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--hoc-soft);margin-bottom:10px}
.ho-coupon-form{margin:0}
.ho-coupon-row{display:flex;gap:8px}
.ho-coupon-input{flex:1;min-width:0;padding:11px 16px;border:1px solid var(--hoc-line);border-radius:var(--radius-pill);font-family:var(--font-body);font-size:13.5px;color:var(--hoc-ink);outline:none;background:var(--hoc-card);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}
.ho-coupon-input:focus{border-color:var(--hoc-ink);box-shadow:0 0 0 3px rgba(0,0,0,.08)}
.ho-coupon-btn{flex:none;background:var(--color-surface-dark);color:#fff;border:1px solid var(--color-surface-dark);border-radius:var(--radius-pill);padding:11px 20px;font-family:var(--font-body);font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background var(--transition-fast)}
.ho-coupon-btn:hover{background:#000}

/* totals table */
.ho-summary{padding:0}
.ho-cart .ho-totals{width:100%;border-collapse:collapse;margin:0}
.ho-cart .ho-totals tr{border:none}
.ho-cart .ho-totals th,.ho-cart .ho-totals td{border:none;padding:8px 22px;background:none;font-family:var(--font-body);vertical-align:top}
.ho-cart .ho-totals tr:first-child th,.ho-cart .ho-totals tr:first-child td{padding-top:20px}
.ho-cart .ho-totals th{font-weight:400;font-size:13.5px;color:var(--hoc-soft);text-align:left}
.ho-cart .ho-totals td{font-weight:500;font-size:13.5px;color:var(--hoc-ink);text-align:right}
.ho-cart .ho-disc td{color:var(--hoc-ok);font-weight:600}
.ho-cart .ho-totals .shipping ul#shipping_method,.ho-cart .ho-totals .woocommerce-shipping-methods{list-style:none;margin:0;padding:0;text-align:right}
.ho-cart .ho-totals .shipping li{margin:0 0 5px;display:flex;gap:6px;justify-content:flex-end;align-items:center}
.ho-cart .ho-totals .shipping label{font-size:13px;color:var(--hoc-ink)}
.ho-cart .ho-totals .woocommerce-shipping-destination{font-size:11.5px;color:var(--hoc-soft);margin-top:6px}
.ho-cart .ho-totals .shipping-calculator-button{font-size:12px;font-weight:600;color:var(--hoc-ink);text-decoration:underline}
.ho-cart .ho-grand th,.ho-cart .ho-grand td{font-size:19px;font-weight:600;color:var(--hoc-ink);padding-top:16px;border-top:1px solid var(--hoc-line)}
.ho-taxnote{font-size:11px;color:var(--hoc-soft);padding:6px 22px 0}

/* CTA */
.ho-cta{padding:18px 22px 22px}
.ho-cart .wc-proceed-to-checkout{margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ho-cart a.checkout-button{display:flex!important;align-items:center;justify-content:center;gap:10px;width:100%;background:var(--color-surface-dark)!important;color:#fff!important;border:none!important;border-radius:var(--radius-pill)!important;padding:18px 24px!important;font-family:var(--font-body)!important;font-size:16px!important;font-weight:600!important;text-transform:none!important;line-height:1.4;box-shadow:0 4px 20px rgba(0,0,0,.18);transition:background var(--transition-base),box-shadow var(--transition-base)}
.ho-cart a.checkout-button:hover{background:#000!important;box-shadow:0 6px 26px rgba(0,0,0,.26)}
.ho-cart a.return-shop{display:flex!important;align-items:center;justify-content:center;width:100%;background:none!important;color:var(--hoc-ink)!important;border:1px solid var(--hoc-line)!important;border-radius:var(--radius-pill)!important;padding:14px 24px!important;font-family:var(--font-body)!important;font-size:14px!important;font-weight:600!important;text-transform:none!important;transition:border-color var(--transition-fast)}
.ho-cart a.return-shop:hover{border-color:var(--hoc-ink)!important}
.ho-reassure{display:flex;align-items:center;gap:8px;justify-content:center;font-size:12px;color:var(--hoc-soft);margin-top:16px}
.ho-cart .ho-pay-methods{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:12px}
.ho-cart .ho-pay-methods span{font-size:9.5px;font-weight:700;letter-spacing:.04em;color:var(--hoc-soft);border:1px solid var(--hoc-line);border-radius:6px;padding:3px 8px;text-transform:uppercase;white-space:nowrap}

/* reassurance */
.ho-trust{margin-top:36px}
.ho-trust-track{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.ho-trust-dots{display:none}
.ho-trust-item{background:var(--color-surface-alt);border:0;border-radius:10px;padding:14px 16px;display:flex;gap:14px;align-items:center;box-sizing:border-box}
.ho-trust-ic{flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#444}
.ho-trust-ic svg{width:30px;height:30px}
.ho-trust-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.ho-trust-tx b{font-size:13px;font-weight:700;color:#1a1a1a;line-height:1.3}
.ho-trust-tx span{font-size:12px;font-weight:400;color:#666;line-height:1.4}

/* empty */
.ho-cart--empty{padding-top:24px}
.ho-empty{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:56px 24px;text-align:center;max-width:560px;margin:0 auto}
.ho-empty-ic{width:74px;height:74px;border-radius:50%;background:var(--color-surface-alt);color:var(--color-text-muted);display:grid;place-items:center;margin:0 auto 18px}
.ho-empty h2{font-size:20px;font-weight:600;margin:0 0 8px;color:var(--color-text-primary)}
.ho-empty p{font-size:14px;color:var(--color-text-muted);margin:0 auto 24px;line-height:1.6;max-width:420px}
.ho-empty-btn,.ho-empty-btn:link,.ho-empty-btn:visited{display:inline-flex;align-items:center;gap:9px;background:var(--color-surface-dark);color:#fff!important;border:0;border-radius:var(--radius-pill);padding:15px 30px;font-family:var(--font-body);font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;box-shadow:0 4px 18px rgba(0,0,0,.16);transition:background var(--transition-base)}
.ho-empty-btn svg{color:#fff!important}
.ho-empty-btn svg path{stroke:#fff!important}
.ho-empty-btn:hover{background:#000;color:#fff!important}

/* responsive */
@media(max-width:1040px){
  .ho-cart-grid{grid-template-columns:1fr;gap:24px}
  .ho-sidebar{position:static}
}
@media(max-width:640px){
  .ho-cart{padding:4px 0 24px}
  .ho-cart-head h1{font-size:22px}
  .ho-cart-card-hd{padding:16px 16px 12px}
  .ho-line{gap:12px;padding:16px;align-items:flex-start}
  .ho-line-img{width:74px;height:74px}
  .ho-line-name{font-size:14.5px}
  .ho-line-main{gap:3px}
  .ho-line-stock{margin-top:5px}
  .ho-line-actions{margin-top:10px;gap:12px}
  .ho-qty-btn{width:32px;height:32px}
  .ho-line-price{font-size:14.5px}
  .ho-scard-hd{padding:16px 16px 12px}
  .ho-coupon{padding:16px}
  .ho-cart .ho-totals th,.ho-cart .ho-totals td{padding-left:16px;padding-right:16px}
  .ho-taxnote{padding-left:16px;padding-right:16px}
  .ho-cta{padding:16px}
  .ho-trust{overflow:hidden;margin-top:24px}
  .ho-trust-track{display:flex;grid-template-columns:none;gap:12px;will-change:transform}
  .ho-trust-item{flex:0 0 calc(50% - 6px);padding:12px 13px;gap:11px}
  .ho-trust-ic svg{width:26px;height:26px}
  .ho-trust-tx b{font-size:12px}
  .ho-trust-tx span{font-size:11px}
  .ho-trust-dots{display:flex;justify-content:center;gap:6px;margin-top:14px}
  .ho-trust-dots i{width:6px;height:6px;border-radius:50%;background:var(--color-border);transition:background .3s,width .3s}
  .ho-trust-dots i.on{background:var(--color-surface-dark);width:16px;border-radius:99px}
}
