/* Velvinci Wishlist — approved design (11-wishlist, 30 Sep 2026). Scoped under .vw. Plugin: TI WooCommerce Wishlist (templates in woocommerce/ti-wishlist*.php). */
.vw{--ink:#111111;--charcoal:#211A14;--stone:#6B6259;--label:#8C8984;--mist:#EEE9E2;--ivory:#FAF7F2;--white:#FFFFFF;--cognac:#9A6B4F;--gold:#C9A96A;--ok:#2F7D57;--serif:"Cormorant Garamond",Garamond,Georgia,serif;--sans:"Inter","Helvetica Neue",Arial,sans-serif}
/* shield from Kadence and WooCommerce global link, button and list styles */
.vw a,.vw a:hover,.vw a:focus{color:inherit;text-decoration:none}
.vw :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.vw li{margin:0}
.vw button{font-family:var(--sans);box-shadow:none;text-shadow:none;min-height:0;margin:0}
.vw form{margin:0}
.vw{container:vw / inline-size;background:var(--white);color:var(--charcoal);font-family:var(--sans);font-size:15.5px;line-height:1.6;position:relative;text-align:left}
.vw *{box-sizing:border-box}
.vw [hidden]{display:none!important}
.vw h1,.vw h2,.vw h3{text-transform:none;letter-spacing:normal;margin:0}
.vw p{margin:0}
.vw ul{margin:0;padding:0;list-style:none}
.vw .wrap{max-width:1290px;margin-inline:auto;padding-inline:clamp(16px,4cqw,48px)}
.vw .eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cognac)}
.vw .crumbs{font-size:12.5px;color:var(--label);padding-block:18px}
.vw .crumbs span{color:var(--charcoal);font-weight:500}
.vw .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}
.vw .btn:hover{background:#3A3A3A}
.vw .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.vw .btn.line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.vw .btn.line:hover{background:var(--ink);color:#fff}
.vw .btn[disabled]{background:#E5E1DA;color:var(--stone);cursor:default}
.vw .tlink{background:none;border:0;padding:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink);border-bottom:1px solid currentColor;cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.vw .tlink svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7}
.vw .tlink:hover{color:var(--cognac)}

/* head */
.vw .head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 40px;flex-wrap:wrap;padding-block:16px 36px;border-bottom:1px solid var(--mist)}
.vw .head-copy{display:grid;gap:10px}
.vw .head h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,5cqw,4rem);line-height:1.02;color:var(--ink)}
.vw .head h1 em{font-style:italic;color:var(--cognac)}
.vw .head p{color:var(--stone);font-size:16px;max-width:52ch}
.vw .head-act{display:flex;align-items:center;gap:20px 28px;flex-wrap:wrap}
.vw .sum{display:grid;gap:2px;text-align:right}
.vw .sum small{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--label);font-weight:600}
.vw .sum strong{font-family:var(--serif);font-weight:500;font-size:30px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}

/* grid */
.vw .list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px;padding-block:40px 72px}
.vw .card{display:grid;gap:14px;align-content:start;position:relative;transition:opacity .3s,transform .3s}
.vw .card.out{opacity:0;transform:scale(.97)}
.vw .pic{position:relative;aspect-ratio:4/5;background:var(--ivory);border-radius:2px;overflow:hidden;display:flex;align-items:center;justify-content:center;max-width:100%}
.vw .pic svg.bag{width:62%;height:auto}
.vw .heart{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 10px rgba(17,17,17,.08);transition:transform .2s}
.vw .heart:hover{transform:scale(1.06)}
.vw .heart svg{width:19px;height:19px;fill:var(--ink);stroke:var(--ink);stroke-width:1.5}
.vw .stock{position:absolute;left:12px;bottom:12px;background:#fff;border-radius:2px;padding:5px 10px;font-size:11.5px;font-weight:500;color:var(--charcoal);display:flex;align-items:center;gap:7px}
.vw .stock i{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.vw .stock.low i{background:var(--cognac)}
.vw .stock.no i{background:var(--label)}
.vw .info{display:grid;gap:4px}
.vw .info small{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--label);font-weight:600}
.vw .info h3{font-family:var(--serif);font-weight:600;font-size:24px;line-height:1.15;color:var(--ink)}
.vw .price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vw .price b{font-weight:500;font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums}
.vw .price span{font-size:12.5px;color:var(--stone)}
.vw .card-act{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
.vw .card-act .btn{width:100%}
.vw .card-act .btn.done{background:var(--ok)}
.vw .saved{font-size:12px;color:var(--label)}

/* promise strip */
.vw .promise{background:var(--ivory)}
.vw .promise ul{display:grid;grid-template-columns:repeat(4,1fr);padding-block:32px}
.vw .promise li{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;padding-inline:20px;border-left:1px solid var(--mist)}
.vw .promise li:first-child{border-left:0;padding-left:0}
.vw .promise svg{width:22px;height:22px;fill:none;stroke:var(--cognac);stroke-width:1.4;margin-top:2px}
.vw .promise b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.vw .promise span{font-size:13px;color:var(--stone)}

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

/* toast + phone bar */
.vw .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)}
.vw .toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.vw .toast a{color:var(--gold);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.vw .bar{display:none}

/* ============================ PHONE ============================ */
@container vw (max-width:1000px){
  .vw .list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vw .promise ul{grid-template-columns:1fr 1fr;row-gap:20px}
  .vw .promise li:nth-child(3){border-left:0;padding-left:0}
}
@container vw (max-width:760px){
  .vw .crumbs{display:none}
  .vw .head{padding-block:28px 24px;align-items:flex-start}
  .vw .head h1{font-size:2.6rem}
  .vw .head p{font-size:15px}
  .vw .head-act{width:100%;justify-content:space-between}
  .vw .head-act .btn{display:none}
  .vw .sum{text-align:left}
  .vw .sum strong{font-size:26px}
  .vw .list{grid-template-columns:1fr;gap:0;padding-block:8px 32px}
  .vw .card{grid-template-columns:128px minmax(0,1fr);gap:0 16px;padding-block:20px;border-bottom:1px solid var(--mist)}
  .vw .pic{grid-row:span 2;aspect-ratio:4/5}
  .vw .heart{top:6px;right:6px;width:36px;height:36px}
  .vw .heart svg{width:16px;height:16px}
  .vw .stock{position:static;background:none;padding:0;font-size:12px;margin-top:2px}
  .vw .pic .stock{display:none}
  .vw .card .m-stock{display:flex!important}
  .vw .info h3{font-size:21px}
  .vw .card-act{grid-template-columns:1fr;gap:10px;align-self:end;margin-top:12px}
  .vw .card-act .btn{padding:12px 16px;font-size:12px;min-height:44px}
  .vw .saved{display:none}
  .vw .promise ul{grid-template-columns:1fr;row-gap:16px;padding-block:28px}
  .vw .promise li,.vw .promise li:nth-child(3){border-left:0;padding-left:0;padding-inline:0}
  .vw .empty{padding-block:48px 64px}
  .vw .empty .ctas{width:100%}
  .vw .empty .ctas .btn{width:100%;min-height:54px}
  .vw .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)}
  .vw .bar div{display:grid;line-height:1.25}
  .vw .bar small{font-size:11px;color:var(--stone)}
  .vw .bar b{font-weight:600;font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums}
  .vw .bar .btn{padding:14px 20px;min-height:48px}
  .vw .toast{bottom:84px}
}
@media (prefers-reduced-motion:reduce){.vw *{transition:none!important}}

/* website additions */
.vw .crumbs a:hover{color:var(--ink)}
.vw .btn,.vw .btn:focus{letter-spacing:.12em;text-transform:uppercase;border-radius:2px;border:0;color:#fff}
.vw .btn:hover{color:#fff}
.vw .btn.line,.vw .btn.line:focus{color:var(--ink)}
.vw .btn.line:hover{color:#fff}
.vw .btn[disabled],.vw .btn[disabled]:hover{background:#E5E1DA;color:var(--stone)}
.vw .tlink,.vw .tlink:hover,.vw .tlink:focus{background:none;border-radius:0;padding:0 0 2px;min-height:0}
.vw .heart,.vw .heart:hover,.vw .heart:focus{padding:0;background:#fff;border:0;border-radius:50%;box-shadow:0 2px 10px rgba(17,17,17,.08)}
.vw .pic > a{display:block;width:100%;height:100%}
.vw .pic img{width:100%;height:100%;object-fit:cover;display:block;margin:0}
.vw .info h3 a:hover{color:var(--cognac)}
.vw .price b del{color:var(--label);font-weight:400;margin-right:6px}
.vw .price b ins{text-decoration:none}
.vw .m-stock{display:none}
.vw .card-act .btn.line{width:100%}
.vw .empty .help a:hover{color:var(--cognac)}
.vw .woocommerce-message,.vw .woocommerce-info,.vw .woocommerce-error{margin:16px 0 0;padding:14px 18px;border:1px solid var(--mist);border-radius:2px;background:var(--ivory);color:var(--charcoal);font-size:14px;list-style:none}
.vw .woocommerce-message::before,.vw .woocommerce-info::before,.vw .woocommerce-error::before{display:none}
.vw .tinv-lists-nav{display:flex;gap:16px;justify-content:center;padding-bottom:40px;font-size:14px}
.vw .social-buttons{display:none} /* plugin share block: no social accounts yet; we use "Copy share link" */
.vw .blockUI.blockOverlay{background:#fff!important;opacity:.6!important}
