/* ==========================================================================
   NADIEU · HARMONY  (loads last)
   1. One button language: black pill, Inter, small caps-style label, gold on hover
      -> product-card "add to cart", pop-up "add to cart", pop-up heart.
   2. Pop-up (quick view) layout fix: no sideways overflow, button always visible.
   3. Payment logos (Visa / Mastercard / Amex / PayPal) in matching white chips.
   ========================================================================== */

/* ---------- 1. buttons ---------- */
.ng-card .ng-addbtn,
.qv-actions .ng-submit{
	display:flex;align-items:center;justify-content:center;gap:8px;
	width:100%;min-height:46px;margin:0;padding:6px 12px;
	border:0!important;border-radius:999px!important;
	background:var(--ink)!important;color:#fff!important;
	font:600 11.5px/1.15 var(--sans);letter-spacing:.05em;text-transform:uppercase;text-align:center;
	white-space:normal;box-shadow:none!important;overflow:hidden;
	transition:background .3s,color .3s,transform .3s;
}
.ng-card .ng-addbtn{margin-top:10px}
.ng-card .ng-addbtn span,.qv-actions .ng-submit span{display:block;min-width:0;text-wrap:balance}
.ng-card .ng-addbtn svg,.qv-actions .ng-submit svg{flex:none;width:17px;height:17px}
.ng-card .ng-addbtn:hover,.qv-actions .ng-submit:hover{background:var(--gold-d)!important;color:#fff!important;transform:translateY(-1px)}
.ng-card .ng-addbtn:active,.qv-actions .ng-submit:active{transform:none}
.ng-card .ng-addbtn.off{background:var(--sand)!important;color:var(--taupe)!important;cursor:default;transform:none}

/* narrow phones (2 cards per row): drop the little cart icon so the whole label fits on one line */
@media(max-width:480px){
	.ng-card .body{padding:12px 10px 14px}
	.ng-card .ng-addbtn{font-size:10.5px;letter-spacing:.03em;padding:6px 6px}
	.ng-card .ng-addbtn svg{display:none}
}
@media(min-width:860px){
	.ng-card .ng-addbtn,.qv-actions .ng-submit{font-size:13px;letter-spacing:.06em;min-height:50px}
}

/* ---------- 2. pop-up ---------- */
.qv-box{overflow-x:hidden}
.qv-grid{grid-template-columns:minmax(0,1fr)}          /* 1fr alone let the thumbnail strip stretch the box */
.qv-gal,.qv-info{min-width:0;max-width:100%}
.qv-thumbs{max-width:100%;box-sizing:border-box}
.qv-main{max-height:52vh}
.qv-info{padding:18px 20px 24px;gap:12px}
.qv-info h2{padding-right:0;font-size:clamp(22px,5.4vw,30px)}
.qv-info .ng-price{display:flex;align-items:baseline;gap:10px}
.qv-actions{display:flex;align-items:center;gap:10px;margin-top:8px}
.qv-actions .ng-submit{flex:1 1 auto;width:auto;min-height:52px}
.qv-heart{flex:none;width:52px;height:52px;border-radius:50%;border:1.5px solid var(--ink);background:#fff;color:var(--ink);display:grid;place-items:center;padding:0}
.qv-heart:hover{background:var(--ink);color:#fff}
.qv-full{align-self:center;margin-top:8px;font:600 14px/1.2 var(--sans);letter-spacing:.02em}
.qv-x{top:12px;right:12px;width:40px;height:40px;display:grid;place-items:center;padding:0 0 3px;z-index:5}
@media(min-width:760px){
	.qv-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
	.qv-main{max-height:none}
	.qv-info{padding:36px 32px 32px}
	.qv-full{align-self:flex-start}
}

/* ---------- 3. payment logos ---------- */
.ng-marks{display:inline-flex;flex-wrap:wrap;gap:8px;align-items:center}
.mk{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;
	width:52px;height:32px;min-width:0;padding:5px 7px;border-radius:7px;
	border:1px solid var(--hair);background:#fff;overflow:hidden}
.mk img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.mk.pp{width:62px;padding:3px 5px}
.mk.amex{background:#fff;border-color:var(--hair)}          /* neutralise old blue chip */
.ng-foot .pays .mk{border-color:transparent}
.ng-foot .pays{gap:8px}
.lx3-assure .ng-marks{transform:none;margin-left:auto;gap:6px}
.lx3-assure .mk{width:42px;height:26px;padding:4px 5px}
.lx3-assure .mk.pp{width:50px}
.ng-pay .ng-marks{gap:6px}

/* ---------- 4. cart: free-shipping progress + secure strip ---------- */
.ng-fs{margin:0 0 12px}
.ng-fs p{margin:0 0 7px;font:600 13px/1.3 var(--sans);color:var(--ink);text-align:center}
.ng-fs i{display:block;height:7px;border-radius:99px;background:var(--hair);overflow:hidden}
.ng-fs b{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--gold-l),var(--gold));transition:width .5s cubic-bezier(.2,.8,.2,1)}
.ng-fs.ok p{color:#2f7a4d}
.ng-fs.ok b{background:#2f7a4d}
.ng-dtrust{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--hair);font:500 12.5px/1.2 var(--sans);color:var(--taupe)}
.ng-dtrust>span{display:inline-flex;align-items:center;gap:6px}
.ng-dtrust svg{width:15px;height:15px;color:var(--gold-d)}
.ng-dtrust .ng-marks{justify-content:center}
.ng-dtrust .mk{width:42px;height:26px;padding:4px 5px}
.ng-dtrust .mk.pp{width:50px}

/* ---------- 5. WhatsApp help button ---------- */
.ng-wa-float{position:fixed;z-index:60;right:14px;bottom:calc(84px + env(safe-area-inset-bottom,0px));width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;box-shadow:0 10px 24px -8px rgba(0,0,0,.45);transition:transform .25s}
.ng-wa-float:hover{transform:scale(1.07)}
.ng-wa-float svg{width:28px;height:28px}
@media(min-width:900px){.ng-wa-float{bottom:24px}}

/* ---------- 6. 404 page ---------- */
.ng-404{text-align:center;padding:36px 0 48px}
.ng-404 .num{font:700 clamp(72px,22vw,140px)/1 var(--serif);color:var(--gold);letter-spacing:.02em}
.nf-search{position:relative;display:flex;align-items:center;max-width:460px;margin:20px auto 16px}
.nf-search svg{position:absolute;left:16px;width:20px;height:20px;color:var(--taupe);pointer-events:none}
.nf-search input{width:100%;min-height:52px;padding:0 18px 0 46px;border:1.5px solid var(--hair);border-radius:999px;background:#fff;font:400 16px var(--sans);color:var(--ink)}
.nf-search input:focus{outline:0;border-color:var(--gold)}
.nf-h{margin:34px 0 14px;font:600 22px/1.2 var(--serif)}
.nf-cats{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.nf-cats a{padding:10px 18px;border:1.5px solid var(--ink);border-radius:999px;font:500 14px/1 var(--sans);color:var(--ink);transition:background .25s,color .25s}
.nf-cats a:hover{background:var(--ink);color:#fff}
.nf-grid{text-align:left;margin-top:6px}
.ng-404{padding-left:16px;padding-right:16px}
.ng-drawer .ng-submit{background:var(--ink)!important;color:#fff!important;box-shadow:none!important}
.ng-drawer .ng-submit:hover{background:var(--gold-d)!important}