/* =========================================================
ANVIL0 — Cart page visual layer ("Sand & Ink" redesign, wave 4)
Loaded ONLY by cart.html, AFTER css/styles.css and the page's own
inline <style> block (cart-item/promo-row rules). Same pattern as
css/home-v2.css, css/shop-v2.css and css/product-v2.css: everything
here is scoped under body.cart-v2, so it cannot leak to any other
page. Reuses the exact same design tokens/fonts so all four pages
read as one system.

Nothing here changes markup, ids, or JS-driven behavior — quantity
steppers, remove links, the promo code field and Proceed to Checkout
all keep working exactly as before; this file only restyles the
existing DOM.
========================================================= */

body.cart-v2{
--hv-ink: #0e0d0c;
--hv-panel: #191715;
--hv-panel-2: #14120f;
--hv-line: #232019;
--hv-line-soft: #2b261d;
--hv-line-btn: #3a352c;
--hv-sand: #c9b494;
--hv-sand-hi: #d8c5a8;
--hv-sand-dark: #17130d;
--hv-paper: #ece7dd;
--hv-text-2: #d6cec1;
--hv-text-3: #b8ad9c;
--hv-text-4: #8d8272;

--hv-display: 'Archivo', 'Arial Narrow', sans-serif;
--hv-body: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--hv-mono: 'JetBrains Mono', 'Courier New', monospace;

/* Legacy variable bridge — recolors any leftover inline
style="...var(--accent...)" (e.g. the shared footer's Privacy Policy
link, and any other var(--accent)-styled inline links on this page)
without touching markup. */
--accent: var(--hv-sand);

background: var(--hv-ink);
background-image: none;
}
body.cart-v2 #main-content,
body.cart-v2 .site-footer{
background: var(--hv-ink);
font-family: var(--hv-body);
color: var(--hv-paper);
}

/* ---------------------------------------------------------------
Announcement bar / header / buttons — identical treatment to the
other redesigned pages, so the chrome reads as one system.
--------------------------------------------------------------- */
body.cart-v2 .announce{
background: var(--hv-panel);
border-bottom: 1px solid var(--hv-line);
color: var(--hv-text-3);
font-family: var(--hv-mono);
letter-spacing: 0.14em;
}
body.cart-v2 .announce b{ color: var(--hv-sand); font-weight: 500; }

body.cart-v2 .site-header{
background: rgba(14,13,12,0.94);
border-bottom: 1px solid var(--hv-line);
}
body.cart-v2 .logo-word{
font-family: var(--hv-display);
font-weight: 800;
letter-spacing: 0.14em;
color: var(--hv-paper);
}
body.cart-v2 .logo-word b{ color: var(--hv-sand); }
body.cart-v2 .logo small{
font-family: var(--hv-mono);
color: var(--hv-text-4);
}
body.cart-v2 .main-nav a{
font-family: var(--hv-body);
font-weight: 500;
letter-spacing: 0.04em;
text-transform: none;
color: var(--hv-text-3);
}
body.cart-v2 .main-nav a:hover,
body.cart-v2 .main-nav a.active{
color: var(--hv-paper);
border-color: var(--hv-sand);
}
body.cart-v2 .main-nav a .tag{
font-family: var(--hv-mono);
background: var(--hv-line);
color: var(--hv-text-4);
}
body.cart-v2 .nav-icon-btn{
color: var(--hv-text-3);
font-family: var(--hv-mono);
}
body.cart-v2 .nav-icon-btn:hover{ color: var(--hv-paper); }
body.cart-v2 .cart-count{
background: var(--hv-sand);
color: var(--hv-sand-dark);
}
body.cart-v2 .lang-switch-menu{
background: var(--hv-panel);
border: 1px solid var(--hv-line);
}
body.cart-v2 .lang-switch-item:hover,
body.cart-v2 .lang-switch-item.active{ background: var(--hv-line); color: var(--hv-paper); }

body.cart-v2 .btn{
font-family: var(--hv-body);
border-radius: 999px;
letter-spacing: 0.02em;
text-transform: none;
transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
body.cart-v2 .btn-primary{
background: var(--hv-sand);
color: var(--hv-sand-dark);
border: none;
font-weight: 600;
}
body.cart-v2 .btn-primary:hover{ background: var(--hv-sand-hi); }
body.cart-v2 .btn-outline{
background: transparent;
border: 1px solid var(--hv-line-btn);
color: var(--hv-text-2);
}
body.cart-v2 .btn-outline:hover{ border-color: #554d40; color: var(--hv-paper); }
body.cart-v2 .btn-ghost{
border: 1px solid var(--hv-line-btn);
color: var(--hv-text-3);
background: transparent;
}
body.cart-v2 .btn-ghost:hover{ border-color: var(--hv-sand); color: var(--hv-sand); }
body.cart-v2 .btn-sm{ padding: 8px 14px; font-size: 12px; }

/* ---------------------------------------------------------------
Breadcrumb + page heading
--------------------------------------------------------------- */
body.cart-v2 .breadcrumb{
font-family: var(--hv-mono);
color: var(--hv-text-4);
border-bottom: 1px solid var(--hv-line);
}
body.cart-v2 .breadcrumb a{ color: var(--hv-text-4); }
body.cart-v2 .breadcrumb a:hover{ color: var(--hv-sand); }
body.cart-v2 .breadcrumb span{ color: var(--hv-text-3); }
body.cart-v2 h1{
font-family: var(--hv-display);
font-weight: 700;
letter-spacing: -0.01em;
color: var(--hv-paper);
text-transform: none;
}
body.cart-v2 .container > p{ font-family: var(--hv-body); color: var(--hv-text-3); }

/* ---------------------------------------------------------------
Cart items
--------------------------------------------------------------- */
body.cart-v2 .cart-item{ border-bottom: 1px solid var(--hv-line); }
body.cart-v2 .cart-item-media{
background: var(--hv-panel);
background-image: none;
border: 1px solid var(--hv-line);
border-radius: 12px;
}
body.cart-v2 .cart-item h4,
body.cart-v2 .cart-item .heading-caption{
font-family: var(--hv-body);
font-weight: 600;
color: var(--hv-paper);
}
body.cart-v2 .cart-item-meta{ font-family: var(--hv-mono); color: var(--hv-text-4); }
body.cart-v2 .cart-remove{ font-family: var(--hv-mono); color: var(--hv-text-4); }
body.cart-v2 .cart-remove:hover{ color: #d97757; }
body.cart-v2 .qty-stepper{
display: flex;
align-items: center;
width: 130px;
border: 1px solid var(--hv-line-btn);
border-radius: 999px;
background: var(--hv-panel);
overflow: hidden;
}
body.cart-v2 .qty-stepper button{
background: transparent;
border: none;
width: 38px;
height: 44px;
font-size: 16px;
color: var(--hv-text-2);
}
body.cart-v2 .qty-stepper button:hover{ color: var(--hv-paper); }
body.cart-v2 .qty-stepper input{
background: transparent;
border: none;
width: 54px;
text-align: center;
color: var(--hv-paper);
font-family: var(--hv-mono);
font-size: 14px;
}
body.cart-v2 .cart-item .price{ font-family: var(--hv-mono); color: var(--hv-sand); }

body.cart-v2 #cart-empty-state{ border: 1px dashed var(--hv-line-btn); border-radius: 16px; }
body.cart-v2 #cart-empty-state svg{ stroke: var(--hv-line-btn); }
body.cart-v2 #cart-empty-state h2{ font-family: var(--hv-display); color: var(--hv-paper); }

/* Cross-sell ad-block below the cart items — same "spec plate"
content as the shop/checkout rails, restyled to a plain rounded
panel matching the rest of the system. */
body.cart-v2 .ad-block{
background: var(--hv-panel);
border: 1px solid var(--hv-line);
border-radius: 16px;
clip-path: none;
}
body.cart-v2 .ad-block .eyebrow{
font-family: var(--hv-mono);
color: var(--hv-text-3);
letter-spacing: 0.14em;
}
body.cart-v2 .ad-block .eyebrow::before{ background: var(--hv-sand); }
body.cart-v2 .ad-block .heading-caption{
font-family: var(--hv-display);
color: var(--hv-paper);
text-transform: none;
font-weight: 600;
}
body.cart-v2 .ad-block p{ font-family: var(--hv-body); color: var(--hv-text-3); }

/* ---------------------------------------------------------------
Order summary sidebar
--------------------------------------------------------------- */
body.cart-v2 aside .panel{
background: var(--hv-panel);
border: 1px solid var(--hv-line);
border-radius: 16px;
}
body.cart-v2 aside .panel h2{
font-family: var(--hv-display);
color: var(--hv-paper);
font-weight: 700;
text-transform: none;
}
body.cart-v2 .summary-row{ font-family: var(--hv-body); color: var(--hv-text-3); }
body.cart-v2 .summary-row.total{
color: var(--hv-paper);
font-family: var(--hv-mono);
border-top: 1px solid var(--hv-line);
}
body.cart-v2 .promo-row input{
background: var(--hv-ink);
border: 1px solid var(--hv-line-btn);
color: var(--hv-paper);
border-radius: 10px;
font-family: var(--hv-body);
}
body.cart-v2 .promo-row input:focus{ outline: none; border-color: var(--hv-sand); }
body.cart-v2 #promo-msg{ font-family: var(--hv-mono); color: var(--hv-text-4); }
body.cart-v2 .trust-item svg{ stroke: var(--hv-sand); }
body.cart-v2 .trust-item span{ font-family: var(--hv-body); color: var(--hv-text-3); }

/* ---------------------------------------------------------------
Footer — identical treatment to the other redesigned pages. This
page's footer markup is the minimal variant (copyright + privacy
link only, no link columns), so only .site-footer/.footer-bottom
apply here.
--------------------------------------------------------------- */
body.cart-v2 .site-footer{ border-top: 1px solid var(--hv-line); background: var(--hv-ink); }
body.cart-v2 .site-footer .footer-bottom p{
font-family: var(--hv-mono);
font-size: 10px;
letter-spacing: 0.1em;
color: var(--hv-text-4);
}
body.cart-v2 .site-footer .footer-bottom a{ color: var(--hv-text-3); }
body.cart-v2 .site-footer .footer-bottom a:hover{ color: var(--hv-sand); }

