/* ============================================================
   JagMag Cart — Monochrome "frosted-glass" override
   Recreates the cart page.zip reference (charcoal / white glass)
   on top of the existing warm cart. Loaded AFTER jagmag-cart.css
   (enqueued with a dependency) so these rules win the cascade.
   CSS-ONLY — no markup/JS changes; scoped to .jl-cartpage so the
   rest of the (warm) site is untouched. Reversible: dequeue the
   file. (added 2026-06-21)
   ============================================================ */
.jl-cartpage{
	--jcm-ink:#1c1c1e; --jcm-ink2:#1a1a1c;
	--jcm-mute:#48494e; --jcm-mute2:#6f7178; --jcm-mute3:#8a8c93; --jcm-faint:#9a9ca3; --jcm-faint2:#a6a8ae;
	--jcm-line:rgba(28,28,30,.07); --jcm-line2:rgba(28,28,30,.1); --jcm-line3:rgba(28,28,30,.12);
	--jcm-charcoal:linear-gradient(150deg,#36383d,#1b1c1f);
	--jcm-glass-items:linear-gradient(160deg,rgba(255,255,255,.6),rgba(255,255,255,.34));
	--jcm-glass-summary:linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.5));
	--jcm-glass-btn:rgba(255,255,255,.72);
	--jcm-glass-input:rgba(255,255,255,.66);
	--jcm-warm-border:rgba(255,206,138,.85); --jcm-warm-ring:rgba(255,194,108,.32);
	--jcm-ease:cubic-bezier(.22,.9,.32,1);
	--jcm-sans:var(--jl2-font-sans,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
}

/* ---- page background: keep the theme's warm bg (no cool wash) ---- */
/* (intentionally no background override — the white glass cards read fine on the cream page) */

/* ---- mobile: stack the two columns + prevent horizontal overflow ---- */
@media (max-width: 781px){
	body .jl-cartpage__layout{ grid-template-columns:1fr !important; flex-wrap:wrap !important; }
	body .jl-cartpage__layout > *,
	body .jl-cartpage__main,
	body .jl-cartpage__summary{ flex:1 1 100% !important; width:auto !important; max-width:100% !important; min-width:0 !important; }
	body .jl-cartpage__items{ padding-left:14px !important; padding-right:14px !important; }
	body .jl-cartpage__summary{ position:static !important; }
}

/* ---- page header ---- */
body .jl-cartpage .jl-cartpage__eyebrow{ color:var(--jcm-faint) !important; }
body .jl-cartpage .jl-cartpage__title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; letter-spacing:-.02em !important; }

/* ---- items glass panel ---- */
body .jl-cartpage .jl-cartpage__items{
	background:var(--jcm-glass-items) !important;
	border:1px solid rgba(255,255,255,.78) !important;
	border-radius:22px !important;
	-webkit-backdrop-filter:blur(22px) saturate(160%) !important; backdrop-filter:blur(22px) saturate(160%) !important;
	box-shadow:0 1px 2px rgba(40,40,50,.04),inset 0 1px 0 rgba(255,255,255,.85),0 20px 50px rgba(40,40,50,.07) !important;
	padding:6px 26px !important;
}
body .jl-cartpage .jl-cartpage__form{ background:transparent !important; border:0 !important; box-shadow:none !important; }
body .jl-cartpage .jl-cartpage__items-head{ border-bottom:0 !important; }

/* ---- item cards -> borderless rows with cool hairline dividers ---- */
body .jl-cartpage .jl-cartcard{
	background:transparent !important;
	border:0 !important;
	border-top:1px solid var(--jcm-line) !important;
	border-radius:0 !important;
	padding:20px 0 !important;
	margin:0 !important;
}
body .jl-cartpage .jl-cartpage__form > .jl-cartcard:first-of-type,
body .jl-cartpage .jl-cartcard:first-child{ border-top:0 !important; }
body .jl-cartpage .jl-cartcard__media,
body .jl-cartpage .jl-cartcard__image{ border-radius:14px !important; }
body .jl-cartpage .jl-cartcard__name{ font-family:var(--jcm-sans) !important; font-style:normal !important; font-weight:500 !important; color:var(--jcm-ink) !important; }
body .jl-cartpage .jl-cartcard__sku{ color:var(--jcm-mute3) !important; }
body .jl-cartpage .jl-cartcard__cell-label{ color:var(--jcm-mute3) !important; }
body .jl-cartpage .jl-cartcard__cell-value{ color:var(--jcm-ink2) !important; }
body .jl-cartpage .jl-cartcard__cell-value--strong{ color:var(--jcm-ink2) !important; }

/* remove ✕ */
body .jl-cartpage a.jl-cartcard__remove{ color:var(--jcm-faint2) !important; background:transparent !important; }
@media (hover:hover){ body .jl-cartpage a.jl-cartcard__remove:hover{ color:var(--jcm-ink) !important; background:rgba(28,28,30,.05) !important; } }

/* qty input -> glass pill (monochrome) */
body .jl-cartpage .jl-cartcard__cell--qty input.qty,
body .jl-cartpage div.quantity input.qty{
	color:var(--jcm-ink) !important;
	background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(255,255,255,.6)) !important;
	border:1px solid var(--jcm-line3) !important;
	border-radius:11px !important;
	box-shadow:0 4px 12px rgba(40,40,50,.08),inset 0 1px 0 rgba(255,255,255,.95) !important;
}
body .jl-cartpage div.quantity input.qty:focus{
	border-color:var(--jcm-warm-border) !important;
	box-shadow:0 0 0 3px var(--jcm-warm-ring) !important;
	outline:none !important;
}

/* ---- coupon ---- */
body .jl-cartpage .jl-cart-coupon{
	background:var(--jcm-glass-items) !important;
	border:1px solid rgba(255,255,255,.78) !important;
	border-radius:18px !important;
}
body .jl-cartpage .jl-cart-coupon__label{ color:var(--jcm-mute) !important; }
body .jl-cartpage .jl-cart-coupon__input{
	background:var(--jcm-glass-input) !important;
	border:1px solid var(--jcm-line2) !important;
	border-radius:11px !important;
	color:var(--jcm-ink) !important;
	box-shadow:inset 0 1px 2px rgba(40,40,50,.05) !important;
}
body .jl-cartpage .jl-cart-coupon__input:focus{ border-color:var(--jcm-warm-border) !important; box-shadow:inset 0 1px 2px rgba(40,40,50,.05),0 0 0 3px var(--jcm-warm-ring) !important; outline:none !important; }
body .jl-cartpage .jl-cart-coupon__btn,
body .jl-cartpage .jl-cartpage__refresh-btn{
	background:var(--jcm-glass-btn) !important;
	border:1px solid var(--jcm-line3) !important;
	border-radius:11px !important;
	color:var(--jcm-ink) !important;
	-webkit-backdrop-filter:none !important; backdrop-filter:none !important;
	box-shadow:none !important;
}
@media (hover:hover){
	body .jl-cartpage .jl-cart-coupon__btn:hover,
	body .jl-cartpage .jl-cartpage__refresh-btn:hover{ background:rgba(255,255,255,.95) !important; border-color:rgba(28,28,30,.22) !important; color:var(--jcm-ink) !important; }
}

/* ---- order summary card ---- */
body .jl-cartpage .jl-cartpage__summary-inner{
	background:var(--jcm-glass-summary) !important;
	border:1px solid rgba(255,255,255,.85) !important;
	border-radius:22px !important;
	-webkit-backdrop-filter:blur(22px) saturate(160%) !important; backdrop-filter:blur(22px) saturate(160%) !important;
	box-shadow:0 1px 2px rgba(40,40,50,.04),inset 0 1px 0 rgba(255,255,255,.92),0 22px 56px rgba(40,40,50,.1) !important;
}
body .jl-cartpage .jl-cartpage__summary-title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; }
body .jl-cartpage .jl-cartpage__totals-row{ color:var(--jcm-mute) !important; }
body .jl-cartpage .jl-cartpage__totals-row .amount,
body .jl-cartpage .jl-cartpage__totals-row .woocommerce-Price-amount{ color:var(--jcm-ink2) !important; }
body .jl-cartpage .jl-cartpage__totals-free{
	color:var(--jcm-ink2) !important;
	background:rgba(28,28,30,.05) !important;
	border:1px solid var(--jcm-line2) !important;
}
body .jl-cartpage .jl-cartpage__totals-row--total,
body .jl-cartpage .jl-cartpage__totals-row--total .amount,
body .jl-cartpage .jl-cartpage__totals-row--total .woocommerce-Price-amount{ color:var(--jcm-ink2) !important; }

/* kill ALL gold on prices (the gold lives on the inner bdi / currency symbol) */
body .jl-cartpage .woocommerce-Price-amount,
body .jl-cartpage .woocommerce-Price-amount bdi,
body .jl-cartpage .woocommerce-Price-currencySymbol,
body .jl-cartpage .jl-cartcard__cell-value--strong .woocommerce-Price-amount,
body .jl-cartpage .jl-cartcard__cell-value--strong bdi{ color:var(--jcm-ink2) !important; }

/* top inline trust indicators (Secure checkout · Breakage · Installation) -> mono */
body .jl-cartpage p.jl-cartpage__trust,
body .jl-cartpage p.jl-cartpage__trust *{ color:var(--jcm-mute2) !important; }
body .jl-cartpage p.jl-cartpage__trust svg{ stroke:var(--jcm-mute2) !important; fill:none !important; color:var(--jcm-mute2) !important; }

/* checkout CTA -> charcoal pill */
body .jl-cartpage .jl-cartpage__cta{
	background:var(--jcm-charcoal) !important;
	border:1px solid rgba(0,0,0,.45) !important;
	border-radius:13px !important;
	color:#f3f3f4 !important;
	box-shadow:0 8px 22px rgba(20,21,24,.3),inset 0 1px 0 rgba(255,255,255,.1) !important;
}
@media (hover:hover){
	body .jl-cartpage .jl-cartpage__cta:hover{
		transform:translateY(-2px);
		filter:brightness(1.08);
		box-shadow:0 16px 34px rgba(20,21,24,.4),inset 0 1px 0 rgba(255,255,255,.14) !important;
	}
}
body .jl-cartpage .jl-cartpage__cta:focus-visible{ outline:none; box-shadow:0 8px 22px rgba(20,21,24,.3),inset 0 1px 0 rgba(255,255,255,.1),0 0 0 3px var(--jcm-warm-ring) !important; }
body .jl-cartpage .jl-cartpage__cta-sub{ color:var(--jcm-faint) !important; }
body .jl-cartpage .jl-cartpage__pay-eyebrow{ color:var(--jcm-faint) !important; }

/* ---- trust cards -> monochrome glass ---- */
body .jl-cartpage .jl-cartpage__trust-card{
	background:var(--jcm-glass-summary) !important;
	border:1px solid rgba(255,255,255,.8) !important;
	border-radius:18px !important;
	box-shadow:0 1px 2px rgba(40,40,50,.04),inset 0 1px 0 rgba(255,255,255,.9),0 12px 30px rgba(40,40,50,.06) !important;
}
body .jl-cartpage .jl-cartpage__trust-card svg{ color:var(--jcm-mute2) !important; stroke:var(--jcm-mute2) !important; }
body .jl-cartpage .jl-cartpage__trust-card *{ color:var(--jcm-mute) !important; }
body .jl-cartpage .jl-cartpage__trust-eyebrow{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; }
body .jl-cartpage .jl-cartpage__trust-card h3{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; }
body .jl-cartpage .jl-cartpage__trust-icon{ background:rgba(28,28,30,.05) !important; }
body .jl-cartpage .jl-cartpage__trust-icon svg{ color:var(--jcm-mute2) !important; stroke:var(--jcm-mute2) !important; }

/* ---- footer links ---- */
body .jl-cartpage .jl-cartpage__footer-btn{ color:var(--jcm-mute) !important; }
@media (hover:hover){ body .jl-cartpage .jl-cartpage__footer-btn:hover{ color:var(--jcm-ink) !important; } }

/* ---- footer links (Continue shopping / expert) ---- */
body .jl-cartpage a[href*="shop"],
body .jl-cartpage a[href*="wa.me"],
body .jl-cartpage .jl-cartpage__footer a{ color:var(--jcm-mute) !important; }
@media (hover:hover){
	body .jl-cartpage .jl-cartpage__footer a:hover{ color:var(--jcm-ink) !important; }
}

/* ---- empty-cart state (keep it monochrome too) ---- */
/* hide WooCommerce's default blue "cart is empty" notice — the custom hero below replaces it */
body div.cart-empty.woocommerce-info{ display:none !important; }
body .jl-cartpage .jl-cartempty__eyebrow{ color:var(--jcm-faint) !important; }
body .jl-cartpage .jl-cartempty__title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; letter-spacing:-.02em !important; }
body .jl-cartpage .jl-cartempty__lede{ color:var(--jcm-mute) !important; }
body .jl-cartpage .jl-cartempty__cta:not(.jl-cartempty__cta--ghost){
	background:var(--jcm-charcoal) !important;
	border:1px solid rgba(0,0,0,.45) !important;
	color:#f3f3f4 !important;
	box-shadow:0 8px 22px rgba(20,21,24,.3),inset 0 1px 0 rgba(255,255,255,.1) !important;
}
body .jl-cartpage .jl-cartempty__cta--ghost{
	background:var(--jcm-glass-btn) !important;
	border:1px solid var(--jcm-line3) !important;
	color:var(--jcm-ink) !important;
	-webkit-backdrop-filter:none !important; backdrop-filter:none !important;
	box-shadow:none !important;
}
@media (hover:hover){
	body .jl-cartpage .jl-cartempty__cta:not(.jl-cartempty__cta--ghost):hover{ transform:translateY(-2px); filter:brightness(1.08); box-shadow:0 16px 34px rgba(20,21,24,.4),inset 0 1px 0 rgba(255,255,255,.14) !important; }
	body .jl-cartpage .jl-cartempty__cta--ghost:hover{ background:rgba(255,255,255,.9) !important; border-color:rgba(28,28,30,.22) !important; color:var(--jcm-ink) !important; }
	body .jl-cartpage .jl-cartempty__categories a:hover{ border-color:rgba(28,28,30,.22) !important; background:rgba(255,255,255,.7) !important; color:var(--jcm-ink) !important; }
}
body .jl-cartpage .jl-cartempty__categories a{ color:var(--jcm-mute) !important; }
