/* ============================================================
   JagMag Checkout — Monochrome "frosted-glass" override
   Recreates the checkout.zip reference (charcoal / white glass)
   on top of the existing warm checkout. Loaded AFTER
   jagmag-checkout.css (dependency) so these rules win the cascade.
   CSS-ONLY — no markup/JS changes; scoped to .jlc-co so the rest
   of the (warm) site is untouched. Reversible: dequeue the file.
   (added 2026-06-21)
   ============================================================ */
.jlc-co{
	--jcm-ink:#1c1c1e; --jcm-ink2:#1a1a1c;
	--jcm-mute:#48494e; --jcm-mute2:#6f7178; --jcm-mute3:#8a8c93; --jcm-faint:#9a9ca3;
	--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-form:linear-gradient(160deg,rgba(255,255,255,.62),rgba(255,255,255,.36));
	--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-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 .jlc-co__layout{ grid-template-columns:1fr !important; flex-wrap:wrap !important; }
	body .jlc-co__layout > *,
	body .jlc-co__form,
	body .jlc-co__sidebar{ flex:1 1 100% !important; width:auto !important; max-width:100% !important; min-width:0 !important; }
	body .jlc-co__sidebar{ position:static !important; }
}

/* ---- page header ---- */
body .jlc-co .jlc-co__title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; letter-spacing:-.02em !important; }
body .jlc-co .jlc-co__sub{ color:var(--jcm-mute2) !important; }

/* ---- form glass panel ---- */
body .jlc-co .jlc-co__form{
	background:var(--jcm-glass-form) !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;
}
body .jlc-co .jlc-co__section{ background:transparent !important; border:0 !important; }
body .jlc-co .jlc-co__section + .jlc-co__section{ border-top:1px solid var(--jcm-line) !important; }

/* section header: charcoal number badge + clean-sans title */
body .jlc-co .jlc-co__section-num{ background:var(--jcm-charcoal) !important; border-radius:8px !important; }
body .jlc-co .jlc-co__section-num-digit{ color:#f3f3f4 !important; }
body .jlc-co .jlc-co__section-title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; }
body .jlc-co .jlc-co__section-help{ color:var(--jcm-mute3) !important; }
body .jlc-co .jlc-co__account-note{ color:var(--jcm-mute2) !important; }
@media (hover:hover){ body .jlc-co .jlc-co__section-edit:hover{ color:var(--jcm-ink) !important; } }
body .jlc-co .jlc-co__section-edit{ color:var(--jcm-mute) !important; }
body .jlc-co .jlc-co__section-summary{ color:var(--jcm-mute2) !important; }

/* ---- inputs ---- */
body .jlc-co .jlc-co__form input:not([type="radio"]):not([type="checkbox"]),
body .jlc-co .jlc-co__form select,
body .jlc-co .jlc-co__form textarea{
	background:var(--jcm-glass-input) !important;
	border:1px solid var(--jcm-line2) !important;
	border-radius:12px !important;
	color:var(--jcm-ink) !important;
	box-shadow:inset 0 1px 2px rgba(40,40,50,.05) !important;
}
body .jlc-co .jlc-co__form input:not([type="radio"]):not([type="checkbox"]):focus,
body .jlc-co .jlc-co__form select:focus,
body .jlc-co .jlc-co__form textarea: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 .jlc-co .jlc-co__form label{ color:var(--jcm-mute) !important; }

/* ---- payment method rows: single glass card on the row; inner label plain ---- */
/* (style ONLY .wc_payment_method, not bare li, so we don't double-card the inner */
/*  <label> or accidentally style shipping-method <li>s) */
body .jlc-co .jlc-co__payment .wc_payment_method{
	background:rgba(255,255,255,.58) !important;
	border:1px solid var(--jcm-line2) !important;
	border-radius:13px !important;
	box-shadow:0 4px 12px rgba(40,40,50,.06) !important;
	transition:all 180ms cubic-bezier(.22,.9,.32,1) !important;
	list-style:none !important;
}
body .jlc-co .jlc-co__payment .wc_payment_method > label{
	background:transparent !important; border:0 !important; box-shadow:none !important; border-radius:0 !important;
}
body .jlc-co .jlc-co__payment .wc_payment_method:has(.input-radio:checked),
body .jlc-co .jlc-co__payment .wc_payment_method:has(input:checked){
	background:rgba(255,255,255,.96) !important;
	border:1.5px solid rgba(28,28,30,.55) !important;
	box-shadow:0 8px 20px rgba(40,40,50,.12),inset 0 1px 0 rgba(255,255,255,1) !important;
}
body .jlc-co .jlc-co__payment .input-radio{ accent-color:#1c1c1e !important; }
body .jlc-co .jlc-pm__title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; }
body .jlc-co .jlc-pm__sub{ color:var(--jcm-mute3) !important; }
body .jlc-co .jlc-co__payment-trust{ color:var(--jcm-faint) !important; }

/* ---- buttons ---- */
body .jlc-co .jlc-co__btn--primary{
	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 .jlc-co .jlc-co__btn--primary: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 .jlc-co .jlc-co__btn--primary: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 .jlc-co .jlc-co__btn--ghost{
	background:var(--jcm-glass-btn) !important;
	border:1px solid var(--jcm-line3) !important;
	border-radius:13px !important;
	color:var(--jcm-ink) !important;
	-webkit-backdrop-filter:none !important; backdrop-filter:none !important;
	box-shadow:none !important;
}
@media (hover:hover){ body .jlc-co .jlc-co__btn--ghost:hover{ background:rgba(255,255,255,.95) !important; border-color:rgba(28,28,30,.22) !important; color:var(--jcm-ink) !important; } }

/* ---- order summary sidebar ---- */
body .jlc-co .jlc-co__sidebar-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 .jlc-co .jlc-co__sidebar-title{ font-family:var(--jcm-sans) !important; font-style:normal !important; color:var(--jcm-ink2) !important; }
body .jlc-co .jlc-co__sidebar-item-media,
body .jlc-co .jlc-co__sidebar-item-img{ border-radius:11px !important; }
body .jlc-co .jlc-co__sidebar-item-qty{ background:var(--jcm-charcoal) !important; color:#f3f3f4 !important; }
body .jlc-co .jlc-co__sidebar-item-name{ color:var(--jcm-ink) !important; }
body .jlc-co .jlc-co__sidebar-item-price{ color:var(--jcm-ink2) !important; }
body .jlc-co .jlc-co__sidebar-totals-row{ color:var(--jcm-mute) !important; }
body .jlc-co .jlc-co__sidebar-totals-free{ color:var(--jcm-ink2) !important; background:rgba(28,28,30,.05) !important; border:1px solid var(--jcm-line2) !important; }
body .jlc-co .jlc-co__sidebar-totals-row--total{ color:var(--jcm-ink2) !important; }
body .jlc-co .jlc-co__sidebar-trust{ color:var(--jcm-faint) !important; }

/* sidebar toggle (mobile collapsible summary header) */
body .jlc-co .jlc-co__sidebar-toggle{ background:var(--jcm-glass-summary) !important; border:1px solid rgba(255,255,255,.85) !important; border-radius:14px !important; }
body .jlc-co .jlc-co__sidebar-toggle-label{ color:var(--jcm-mute) !important; }
body .jlc-co .jlc-co__sidebar-toggle-total{ color:var(--jcm-ink2) !important; }
body .jlc-co .jlc-co__sidebar-toggle-meta{ color:var(--jcm-mute3) !important; }

/* ---- WooCommerce default Place Order button (#place_order) -> charcoal ---- */
body .jlc-co #place_order,
body .jlc-co #place_order.button.alt{
	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 .jlc-co #place_order: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 .jlc-co #place_order: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; }

/* ---- checkout links -> ink (sign-in, privacy, terms) ---- */
body .jlc-co .jlc-co__section-help a,
body .jlc-co .jlc-co__account-note a,
body .jlc-co .woocommerce-privacy-policy-link,
body .jlc-co .woocommerce-terms-and-conditions-link{ color:var(--jcm-ink) !important; text-decoration-color:rgba(28,28,30,.4) !important; }
/* any remaining text link (incl. reCAPTCHA legal microcopy) -> ink; leave button-styled links */
body .jlc-co a:not([class*="btn"]):not(.jlc-co__btn){ color:var(--jcm-ink) !important; }
/* trust-line bullets / dots -> neutral */
body .jlc-co .jlc-co__payment-trust,
body .jlc-co .jlc-co__payment-trust *,
body .jlc-co .jlc-co__payment-trust *::before,
body .jlc-co .jlc-co__payment-trust::before{ color:var(--jcm-faint) !important; }

/* ---- WC payment description box -> neutral ---- */
body .jlc-co .payment_box{ background:rgba(255,255,255,.5) !important; border:1px solid var(--jcm-line2) !important; }
body .jlc-co .payment_box::before{ border-bottom-color:rgba(255,255,255,.5) !important; }

/* ---- kill ALL gold on prices (inner bdi / currency symbol) ---- */
body .jlc-co .woocommerce-Price-amount,
body .jlc-co .woocommerce-Price-amount bdi,
body .jlc-co .woocommerce-Price-currencySymbol{ color:var(--jcm-ink2) !important; }