/* Velvinci Cart — approved design (13-cart, 30 Sep 2026). Scoped under .vb (#vv-cart). WooCommerce classic cart markup styled to match. */
.vb{--ink:#111111;--charcoal:#211A14;--stone:#6B6259;--label:#8C8984;--mist:#EEE9E2;--line:#E3DDD4;--ivory:#FAF7F2;--white:#FFFFFF;--cognac:#9A6B4F;--gold:#C9A96A;--ok:#2F7D57;--err:#A23B2A;--serif:"Cormorant Garamond",Garamond,Georgia,serif;--sans:"Inter","Helvetica Neue",Arial,sans-serif}
/* shield from Kadence / WooCommerce global link, button, list and form styles */
.vb a,.vb a:hover,.vb a:focus{color:inherit;text-decoration:none}
.vb :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.vb li{margin:0}
.vb button{font-family:var(--sans);box-shadow:none;text-shadow:none;margin:0}
.vb form{margin:0}
.vb{container:vb / inline-size;background:var(--white);color:var(--charcoal);font-family:var(--sans);font-size:15px;line-height:1.55;position:relative;text-align:left}
.vb *{box-sizing:border-box}
.vb [hidden]{display:none!important}
.vb h1,.vb h2,.vb h3{text-transform:none;letter-spacing:normal;margin:0;font-weight:500}
.vb p{margin:0}
.vb ul{margin:0;padding:0;list-style:none}
.vb .wrap{max-width:1290px;margin-inline:auto;padding-inline:clamp(16px,4cqw,48px)}
.vb .eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cognac)}
.vb .crumbs{font-size:12.5px;color:var(--label);padding-block:18px}
.vb .crumbs span{color:var(--charcoal);font-weight:500}
.vb .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:2px;padding:16px 28px;font-size:13px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1.6;background:var(--ink);color:#fff;cursor:pointer;transition:background .25s}
.vb .btn:hover{background:#3A3A3A}
.vb .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.vb .btn.line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.vb .btn.line:hover{background:var(--ink);color:#fff}
.vb .tlink{background:none;border:0;padding:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--stone);border-bottom:1px solid currentColor;cursor:pointer}
.vb .tlink:hover{color:var(--ink)}

/* head */
.vb .head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;padding-block:16px 32px}
.vb .head-copy{display:grid;gap:10px}
.vb .head h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,5cqw,4rem);line-height:1.02;color:var(--ink)}
.vb .head h1 em{font-style:italic;color:var(--cognac)}
.vb .head p{color:var(--stone);font-size:16px}
.vb .ribbon{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;padding:14px 20px;background:var(--ivory);border-radius:2px;font-size:13.5px;color:var(--charcoal);margin-bottom:8px}
.vb .ribbon span{display:inline-flex;gap:8px;align-items:center}
.vb .ribbon svg{width:17px;height:17px;fill:none;stroke:var(--cognac);stroke-width:1.5;flex:none}

/* layout */
.vb .grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(32px,5cqw,72px);align-items:start;padding-block:24px 80px}

/* rows */
.vb .rows{border-top:1px solid var(--ink)}
.vb .row{display:grid;grid-template-columns:132px minmax(0,1fr) auto;gap:24px;padding:28px 0;border-bottom:1px solid var(--mist);transition:opacity .3s}
.vb .row.out{opacity:0}
.vb .pic{width:132px;aspect-ratio:4/5;background:var(--ivory);border-radius:2px;display:flex;align-items:center;justify-content:center;max-width:100%}
.vb .pic svg{width:70%}
.vb .info{display:grid;gap:4px;align-content:start}
.vb .info small{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--label);font-weight:600}
.vb .info h3{font-family:var(--serif);font-weight:600;font-size:26px;line-height:1.1;color:var(--ink)}
.vb .info .each{font-size:14px;color:var(--stone)}
.vb .stock{font-size:12.5px;color:var(--ok);display:inline-flex;gap:7px;align-items:center;margin-top:2px}
.vb .stock i{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.vb .acts{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:14px}
.vb .qty{display:inline-grid;grid-template-columns:40px 44px 40px;height:44px;border:1px solid var(--line);border-radius:2px;align-items:center}
.vb .qty button{height:100%;border:0;background:none;cursor:pointer;font-size:18px;color:var(--ink)}
.vb .qty button:disabled{color:#CFC8BE;cursor:default}
.vb .qty input{width:100%;height:100%;border:0;border-inline:1px solid var(--mist);text-align:center;font-size:15px;font-variant-numeric:tabular-nums;background:#fff;-moz-appearance:textfield}
.vb .line{font-family:var(--serif);font-weight:500;font-size:24px;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}

/* from wishlist + cross-sells */
.vb .more{margin-top:44px;display:grid;gap:18px}
.vb .more-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.vb .more-h h2{font-family:var(--serif);font-size:26px;color:var(--ink)}
.vb .mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.vb .mcard{display:grid;gap:10px;align-content:start}
.vb .mcard .pic{width:100%}
.vb .mcard b{font-family:var(--serif);font-weight:600;font-size:19px;line-height:1.15;color:var(--ink)}
.vb .mcard span{font-size:13.5px;color:var(--stone)}
.vb .mcard .tlink{justify-self:start;color:var(--ink)}

/* summary */
.vb .sum{position:sticky;top:96px;background:var(--ivory);border-radius:2px;padding:32px;display:grid;gap:20px}
.vb .sum h2{font-family:var(--serif);font-size:28px;color:var(--ink)}
.vb .code{display:grid;grid-template-columns:1fr auto;gap:8px}
.vb .code input{height:48px;border:1px solid var(--line);border-radius:2px;background:#fff;padding:0 14px;font-size:15px;outline:none;min-width:0}
.vb .code input:focus{border-color:var(--ink)}
.vb .code button{height:48px;padding:0 20px;border:0;border-radius:2px;background:var(--ink);color:#fff;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.vb .code-msg{font-size:13px;margin-top:-10px}
.vb .code-msg.ok{color:var(--ok)}
.vb .code-msg.no{color:var(--err)}
.vb .totals{display:grid;gap:10px;font-size:14.5px;margin:0;border-top:1px solid var(--line);padding-top:18px}
.vb .totals div{display:flex;justify-content:space-between;gap:16px}
.vb .totals dt{color:var(--stone)}
.vb .totals dd{margin:0;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right}
.vb .totals .free{font-weight:600}
.vb .totals .disc dd{color:var(--ok)}
.vb .grand{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:18px}
.vb .grand > span{font-size:15px;color:var(--ink);font-weight:500}
.vb .grand strong{font-family:var(--serif);font-weight:500;font-size:34px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.vb .grand strong small{font-family:var(--sans);font-size:12px;color:var(--label);font-weight:500;margin-right:6px}
.vb .taxnote{font-size:12.5px;color:var(--label);margin-top:-8px}
.vb .eta{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--charcoal);background:#fff;padding:12px 14px;border-radius:2px}
.vb .eta svg{width:18px;height:18px;fill:none;stroke:var(--cognac);stroke-width:1.5;flex:none}
.vb .go{width:100%;height:60px;border:0;border-radius:2px;background:var(--ink);color:#fff;font-size:14px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:background .25s}
.vb .go:hover{background:#3A3A3A}
.vb .go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}
.vb .xbtns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vb .xbtn{height:44px;border-radius:2px;border:0;background:var(--ink);color:#fff;font-weight:600;font-size:14px;cursor:pointer}
.vb .xbtn.gp{background:#fff;color:#111;box-shadow:inset 0 0 0 1px var(--line)}
.vb .badges{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.vb .badges i{font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.06em;border:1px solid var(--line);background:#fff;border-radius:2px;padding:4px 7px;color:var(--charcoal)}
.vb .promise{display:grid;gap:10px;border-top:1px solid var(--line);padding-top:18px}
.vb .promise li{display:grid;grid-template-columns:20px 1fr;gap:10px;font-size:13px;color:var(--stone)}
.vb .promise li b{color:var(--ink);font-weight:600}
.vb .promise svg{width:18px;height:18px;fill:none;stroke:var(--cognac);stroke-width:1.4}

/* empty */
.vb .empty{display:grid;justify-items:center;text-align:center;gap:18px;padding-block:56px 96px;max-width:560px;margin-inline:auto}
.vb .empty .ring{width:112px;height:112px;border-radius:50%;background:var(--ivory);display:flex;align-items:center;justify-content:center;position:relative}
.vb .empty .ring::before{content:"";position:absolute;inset:8px;border:1px dashed rgba(154,107,79,.45);border-radius:50%}
.vb .empty .ring svg{width:40px;height:40px;fill:none;stroke:var(--cognac);stroke-width:1.3}
.vb .empty h2{font-family:var(--serif);font-size:clamp(2.2rem,4cqw,3rem);line-height:1.05;color:var(--ink)}
.vb .empty p{color:var(--stone);max-width:44ch}
.vb .empty .ctas{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.vb .empty .ctas .btn{min-width:200px}

/* toast + phone bar */
.vb .toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:14px 20px;border-radius:2px;font-size:14px;display:flex;gap:16px;align-items:center;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:60;max-width:calc(100% - 32px)}
.vb .toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.vb .toast button{background:none;border:0;color:var(--gold);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;padding:0}
.vb .bar{display:none}

/* ============================ PHONE ============================ */
@container vb (max-width:1000px){
  .vb .grid{grid-template-columns:1fr}
  .vb .sum{position:static}
}
@container vb (max-width:760px){
  .vb .crumbs{display:none}
  .vb .head{padding-block:28px 20px}
  .vb .head h1{font-size:2.6rem}
  .vb .head p{font-size:15px}
  .vb .ribbon{padding:12px 14px;font-size:12.5px;gap:6px 16px}
  .vb .grid{padding-block:8px 48px;gap:32px}
  .vb .row{grid-template-columns:104px minmax(0,1fr);gap:16px;padding:20px 0}
  .vb .pic{width:104px}
  .vb .row .line{grid-column:2;grid-row:1;justify-self:end;align-self:start;font-size:20px}
  .vb .row .info{grid-column:2;grid-row:1;padding-right:84px}
  .vb .info h3{font-size:21px}
  .vb .acts{gap:14px;margin-top:10px}
  .vb .mini{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vb .mini .mcard:nth-child(3){display:none}
  .vb .sum{padding:24px 18px;margin-inline:-4px}
  .vb .bar{display:flex;position:sticky;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--mist);padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));gap:14px;align-items:center;justify-content:space-between;box-shadow:0 -8px 24px rgba(17,17,17,.06);transition:transform .25s}
  .vb .bar.away{transform:translateY(110%)}
  .vb .bar div{display:grid;line-height:1.25}
  .vb .bar small{font-size:11px;color:var(--stone)}
  .vb .bar b{font-weight:600;font-size:17px;color:var(--ink);font-variant-numeric:tabular-nums}
  .vb .bar .btn{padding:14px 22px;min-height:48px}
  .vb .toast{bottom:84px}
  .vb .empty .ctas{width:100%}
  .vb .empty .ctas .btn{width:100%;min-height:54px}
}
@media (prefers-reduced-motion:reduce){.vb *{transition:none!important}}

/* website additions */
.vb .crumbs a:hover{color:var(--ink)}
.vb .woocommerce{margin:0}
.vb .pic{overflow:hidden}
.vb .pic img{width:100%;height:100%;object-fit:cover;display:block;margin:0}
.vb .info h3 a:hover,.vb .mcard b a:hover{color:var(--cognac)}
.vb .stock.low{color:var(--cognac)}.vb .stock.low i{background:var(--cognac)}
.vb .stock.no{color:var(--label)}.vb .stock.no i{background:var(--label)}
.vb .each .woocommerce-Price-amount{color:inherit}
.vb .mcard span del{color:var(--label);margin-right:4px}
.vb .mcard span ins{text-decoration:none}
.vb .vb-actions{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.vb .col{min-width:0}
.vb .xwrap{margin-top:10px}
.vb .xwrap:empty{display:none}
.vb .vk-rm{font-size:12px;color:var(--label);border-bottom:1px solid currentColor;margin-left:6px;letter-spacing:0;text-transform:none}
.vb .vk-rm:hover{color:var(--ink)}
.vb .row.processing,.vb .cart_totals.processing{opacity:.6}
.vb .blockUI.blockOverlay{background:#fff!important;opacity:.6!important}
/* WooCommerce notices become the black message at the bottom (moved there by vv-cart.js) */
.vb .woocommerce-notices-wrapper{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.vb .woocommerce-notices-wrapper .woocommerce-error{position:static;width:auto;height:auto;clip:auto}
.vb .toast a,.vb .toast .restore-item{color:var(--gold);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.vb .toast.err{background:var(--err)}
/* the id wins over Kadence / WooCommerce cart styles */
#vv-cart .qty input{height:100%;border:0;border-inline:1px solid var(--mist);border-radius:0;box-shadow:none;padding:0;margin:0;text-align:center;font-size:15px;color:var(--ink);background:#fff;width:100%}
#vv-cart .qty input::-webkit-outer-spin-button,#vv-cart .qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
#vv-cart .qty button{background:none;color:var(--ink);padding:0;border-radius:0;min-height:0}
#vv-cart .qty button:disabled{color:#CFC8BE}
#vv-cart .tlink,#vv-cart .tlink:hover{background:none;padding:0 0 1px;border-radius:0;min-height:0;box-shadow:none}
#vv-cart .code input{height:48px;border:1px solid var(--line);border-radius:2px;box-shadow:none;background:#fff;padding:0 14px;font-size:15px;margin:0}
#vv-cart .code input:focus{border-color:var(--ink)}
#vv-cart .code button{height:48px;padding:0 20px;border-radius:2px;background:var(--ink);color:#fff}
#vv-cart .code button:hover{background:#3A3A3A}
#vv-cart .go,#vv-cart .go:hover,#vv-cart .go:focus{color:#fff}
#vv-cart .go:hover{background:#3A3A3A}
#vv-cart .btn,#vv-cart .btn:focus{color:#fff}
#vv-cart .btn.line,#vv-cart .btn.line:focus{color:var(--ink)}
#vv-cart .btn.line:hover{color:#fff}
#vv-cart .cart_totals h2{font-family:var(--serif);font-weight:500;font-size:28px;color:var(--ink);margin:0}
#vv-cart .cart_totals{width:auto;float:none}
/* fixes after the owner's review (30 Sep): WooCommerce's red round "remove" button, bold labels,
   the total's price size and the Checkout button layout */
#vv-cart .product-remove a.remove{display:inline-block!important;width:auto!important;height:auto!important;border-radius:0!important;background:none!important;color:var(--stone)!important;font-size:12px!important;font-weight:600!important;letter-spacing:.12em;text-transform:uppercase;line-height:1.4!important;text-align:left;border-bottom:1px solid currentColor;padding:0 0 1px}
#vv-cart .product-remove a.remove:hover{color:var(--ink)!important;background:none!important}
#vv-cart .totals dt{font-weight:400;color:var(--stone)}
#vv-cart .totals dd{font-weight:400}
#vv-cart .totals dd.free{font-weight:600}
#vv-cart .grand strong .woocommerce-Price-amount,#vv-cart .grand strong bdi{font-size:inherit;font-family:inherit;font-weight:inherit;color:inherit}
#vv-cart .wc-proceed-to-checkout{padding:0;margin:0;display:grid;gap:10px}
#vv-cart .wc-proceed-to-checkout a.checkout-button.go{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:60px;padding:0 20px;margin:0;font-size:14px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;line-height:1.2;background:var(--ink);color:#fff;border-radius:2px}
#vv-cart .wc-proceed-to-checkout a.checkout-button.go:hover{background:#3A3A3A;color:#fff}
#vv-cart .wc-proceed-to-checkout a.checkout-button.go svg{width:16px;height:16px;flex:none}
/* payment look (owner's choice 30 Sep): Apple Pay / Google Pay buttons + real logos in one row */
#vv-cart .xbtns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#vv-cart a.xbtn{display:flex;align-items:center;justify-content:center;height:44px;border-radius:2px;background:var(--ink);color:#fff;font-weight:600;font-size:14px;letter-spacing:.01em;text-transform:none}
#vv-cart a.xbtn:hover{background:#3A3A3A;color:#fff}
#vv-cart a.xbtn.gp{background:#fff;color:#111;box-shadow:inset 0 0 0 1px var(--line)}
#vv-cart a.xbtn.gp:hover{box-shadow:inset 0 0 0 1px var(--ink);background:#fff;color:#111}
#vv-cart .badges{display:flex;flex-wrap:nowrap;justify-content:center;gap:6px}
#vv-cart .badges img{display:block;height:26px;width:auto;margin:0;border-radius:3px}
