/**
 * Jagmag Lights — Canonical design tokens.
 *
 * Single source of truth for brand colour, line, surface, radius, shadow,
 * and spacing tokens. Loaded BEFORE all other stylesheets so consumers can
 * reference the variables and so feature-specific overrides cascade later.
 *
 * Naming convention (canonical): --jl2-<group>-<name>[-<modifier>]
 *   --jl2-color-*    brand colours
 *   --jl2-radius-*   corner radii
 *   --jl2-shadow-*   elevation shadows
 *   --jl2-space-*    spacing scale (xs, sm, md, lg, xl, 2xl)
 *
 * 2026-05-13 typography reset:
 *   - Background pivots from cream wash to warm-white (#FAF8F2 family)
 *   - Bright candy gold (#8f6b3d) → muted brass (#8F6B3D), used sparingly
 *   - Sriracha is the heading/display font; Open Sans is the body/UI font
 *   - Drop shadows desaturated to hairline-level only (heavy shadows removed at card level)
 *   - Cream legacy values aliased to the new warm-white so older modules keep
 *     working while consumers migrate.
 *
 * Legacy prefixes (--jla-, --jlc-, --jlco-) remain aliased; consumers should
 * migrate to --jl2-* over time.
 */

@layer reset, tokens, theme, components, pages, utilities, overrides;

@layer tokens {
:root {
	/* === Canonical: brand surfaces === */
	--jl2-color-cream:        var(--wp--preset--color--cream, #faf8f2);  /* warm-white page background */
	--jl-page-bg:             var(--jl2-color-cream);  /* SINGLE unified whole-page background — every page uses this */
	--jl2-color-cream-2:      var(--wp--preset--color--cream-2, #f3efe5);  /* slightly deeper warm-white (cards / surfaces) */

	/* Brass (was bright gold) — used sparingly, only for accent + small marks */
	--jl2-color-gold:         var(--wp--preset--color--gold, #8f6b3d);  /* muted brass — replaces candy gold */
	--jl2-color-gold-deep:    #6e4d11;
	--jl2-color-gold-hover:   #7a5a30;
	--jl2-color-gold-soft:    rgba(143, 107, 61, 0.16);
	--jl2-color-gold-bright:  #e4b858;  /* WCAG AA-safe on dark surfaces (footer, charcoal cards) */

	/* Ink — deeper, warmer near-black */
	--jl2-color-ink:          var(--wp--preset--color--ink, #14140f);
	--jl2-color-ink-2:        #2a2823;

	/* RGB components of the 3 canonical colors + surfaces — for rgba(...) at opacity.
	   These ARE the canonical ink/gold/cream/cream-2/white (not new colors); the
	   design system's "3 colors used at varying opacity" is expressed through these. */
	--jl2-color-ink-rgb:      20, 20, 15;
	--jl2-color-gold-rgb:     143, 107, 61;
	--jl2-color-mehndi-rgb:  77, 107, 31;
	--jl2-color-cream-rgb:    250, 248, 242;
	--jl2-color-cream-2-rgb:  243, 239, 229;
	--jl2-color-white-rgb:    255, 255, 255;

	/* === Canonical spacing / radius / border / shadow scales ===
	   Space + shadow reference the theme.json presets (editable in Gutenberg →
	   Global Styles + per-block spacing/shadow controls) with static fallbacks.
	   Components use ONLY these — no ad-hoc px/rem for gap, padding, margin,
	   radius, border, or shadow. */
	--jl2-space-s:    var(--wp--preset--spacing--s, clamp(0.75rem, 0.5rem + 1.2vw, 1rem));
	--jl2-space-l:    var(--wp--preset--spacing--l, clamp(2rem, 1rem + 5vw, 4rem));
	--jl2-space-xl:   var(--wp--preset--spacing--xl, clamp(3rem, 1.5rem + 7.5vw, 6.5rem));

	--jl2-radius-sm:   12px;
	--jl2-radius-md:   20px;
	--jl2-radius-lg:   30px;   /* the ONE card/panel surface radius */
	--jl2-radius-pill: 999px;  /* buttons, pills */

	--jl2-border-hairline: 1px solid rgba(var(--jl2-color-gold-rgb), 0.14);  /* the ONE surface border */

	--jl2-shadow-sm: var(--wp--preset--shadow--sm, 0 8px 20px rgba(var(--jl2-color-ink-rgb), 0.05));
	--jl2-shadow-md: var(--wp--preset--shadow--md, 0 18px 40px rgba(var(--jl2-color-ink-rgb), 0.06), inset 0 1px 0 rgba(var(--jl2-color-white-rgb), 0.78));
	--jl2-shadow-lg: var(--wp--preset--shadow--lg, 0 28px 60px rgba(var(--jl2-color-ink-rgb), 0.08), inset 0 1px 0 rgba(var(--jl2-color-white-rgb), 0.72));

	/* ============================================================
	 * BUTTON CONTROL PANEL — the ONE place to restyle every button.
	 * Edit a value here and EVERY button on the site updates: the
	 * canonical component (shared/buttons/buttons.css) and the global
	 * button map both read only these tokens. No hunting individual
	 * buttons, no per-surface literals.
	 * ============================================================ */
	/* Shape & size — shared by all variants */
	--jl2-btn-min-h:          52px;
	--jl2-btn-pad-x:          1.6rem;
	--jl2-btn-radius:         var(--jl2-radius-pill);
	--jl2-btn-font:           var(--jl2-font-sans);
	--jl2-btn-size:           0.82rem;
	--jl2-btn-weight:         700;
	--jl2-btn-tracking:       0.02em;
	--jl2-btn-transition:     transform 200ms ease, background 200ms ease, box-shadow 200ms ease, color 200ms ease;
	--jl2-btn-hover-lift:     -2px;
	--jl2-btn-backdrop:       blur(14px) saturate(160%); /* liquid-glass frost (shared primary family) */
	/* Primary — SMOKY LIGHT GLASS (soft neumorphic pill, 2026-09-02) */
	--jl2-btn-primary-bg:     linear-gradient(180deg, rgba(255,255,255,.48) 0%, rgba(255,255,255,.18) 50%, rgba(255,255,255,.34) 100%); /* transparent white glass */
	--jl2-btn-primary-fg:     var(--jl2-color-ink);
	--jl2-btn-primary-border: rgba(255,255,255,.75); /* soft light rim */
	--jl2-btn-primary-shadow: 0 8px 22px rgba(20,18,12,.12), 0 2px 5px rgba(20,18,12,.07), inset 0 1px 1.5px rgba(255,255,255,.98), inset 0 -6px 12px rgba(120,108,92,.10), inset 0 0 0 1px rgba(255,255,255,.55); /* glass: soft drop + bright gloss + specular ring */
	/* NOTE: no --secondary/--ghost tokens — secondary was MERGED into primary
	   (2026-09-03). Every ghost/secondary class renders via the primary tokens. */
	/* Gold — brass accent CTA */
	/* Secondary — liquid glass (translucent, glossy, specular highlights, frosted). */
	--jl2-btn-secondary-bg:       linear-gradient(180deg, rgba(var(--jl2-color-mehndi-rgb),.12) 0%, rgba(var(--jl2-color-mehndi-rgb),.04) 52%, rgba(var(--jl2-color-mehndi-rgb),.08) 100%);
	--jl2-btn-secondary-fg:       var(--jl2-color-mehndi-deep);
	--jl2-btn-secondary-border:   rgba(255,255,255,.60);
	--jl2-btn-secondary-shadow:   0 8px 22px rgba(20,18,12,.10), 0 2px 5px rgba(20,18,12,.05), inset 0 1px 1.5px rgba(255,255,255,.98), inset 0 -6px 12px rgba(var(--jl2-color-mehndi-rgb),.07), inset 0 0 0 1px rgba(255,255,255,.50);
	--jl2-btn-secondary-backdrop: blur(14px) saturate(160%);

	/* WhatsApp — mehndi green */
	/* Text link */

	/* Motion easing (transactional funnel micro-interactions). The former
	 * --jcm-*/glass/charcoal/amber transactional palette was retired 2026-08-27:
	 * cart / checkout / account now use the core ink / gold / cream system. */

	/* Mute neutrals — warm grey, for secondary text + UI chrome */
	--jl2-color-mute:         #6b6660;
	--jl2-color-mute-soft:    #58544e;
	--jl2-color-danger:      var(--wp--preset--color--danger, #b3261e);  /* delete / remove / destructive actions */
	--jl2-color-danger-soft: rgba(179, 38, 30, 0.08);

	/* Olive retained for legacy/product copy that still references it */
	--jl2-color-olive:        #4a5841;
	--jl2-color-olive-deep:   #3a4732;
  /* Mehndi (henna-leaf) green — brand accent, added 2026-08-17. */
  --jl2-color-mehndi:       #4d6b1f;
  --jl2-color-mehndi-deep:  #3d551a;
  --jl2-color-mehndi-bg:    rgba(77, 107, 31, 0.10);
  --jl2-color-mehndi-wash:  #eef3e2;
  --jl2-color-mehndi-line:  rgba(77, 107, 31, 0.22);

	/* === Canonical: lines (hairline + cool, not gold) === */
	--jl2-color-line:         rgba(20, 20, 15, 0.10);
	--jl2-color-line-soft:    rgba(20, 20, 15, 0.05);
	--jl2-color-line-strong:  rgba(20, 20, 15, 0.20);

	/* === Canonical: radius === */
	--jl2-radius-card:        2px;    /* tighter, more editorial */
	--jl2-radius-pill:        999px;

	/* === Canonical: shadow (almost-none by default; cards have NONE) === */
	--jl2-shadow-soft:        0 8px 24px rgba(20, 20, 15, 0.06);

	/* === Canonical: spacing scale === */
	--jl2-space-xl:  2.4rem;

	/* === Canonical: typography === */
	--jl2-font-display: var(--wp--preset--font-family--display, "Sriracha", "Segoe UI", sans-serif);
	--jl2-font-sans: var(--wp--preset--font-family--sans, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);

	--jl2-fw-regular:  400;

	--jl2-lh-tight:   1.05;

	--jl2-ls-normal:    0;

	/* === Canonical: motion === */

	/* === Legacy aliases — DEPRECATED, migrate consumers to --jl2-* ===
	 * These keep the older account / commerce / orders modules building until
	 * they're rewritten. Values intentionally point to the NEW palette so the
	 * brand stays consistent everywhere. */

	/* --jla-* (account portal) */
	--jla-cream:        var(--jl2-color-cream);
	--jla-gold:         var(--jl2-color-gold);
	--jla-gold-deep:    var(--jl2-color-gold-deep);
	--jla-gold-hover:   var(--jl2-color-gold-hover);
	--jla-ink:          var(--jl2-color-ink);
	--jla-ink-2:        var(--jl2-color-ink-2);
	--jla-mute:         var(--jl2-color-mute);

	/* --jlc-* family (cart) */

	/* --jlco-* family (checkout) */

	/* Run-1c hex-consolidation tokens (2026-07-24) — cover the top-frequency
	 * hex values found in-tree so future edits use a token, not a literal. */
	--jl2-color-white:       var(--wp--preset--color--white, #fff);
	--jl2-color-ink-4:       #1c1c1e;
	--jl2-color-gray-cool-1: #f3f3f4;
	--jl2-color-gray-cool-2: #48494e;
	--jl2-color-gray-cool-3: #36383d;
	--jl2-color-gray-cool-4: #1b1c1f;
	--jl2-color-gray-cool-5: #6f7178;
	/* Muted secondary-text tiers — darkened 2026-08-27 to meet WCAG AA (4.5:1)
	 * on cream/white; were #a6a8ae/#8a8c93/#9a9ca3 (2.2–3.4:1, failed). Text-only. */
	--jl2-color-brand-orange: #f5a623;
	--jl2-color-brown-deep:  #8f6616;
	--jl2-color-gold-soft-1: #b98523;
	--jl2-color-gold-hi:     #ffc145;
}
}

/* Base typography — applied site-wide so any orphan element inherits the
 * new face. Existing module CSS continues to override where needed. */
body {
	font-family: var(--jl2-font-sans);
	font-weight: var(--jl2-fw-regular);
	color: var(--jl2-color-ink);
	background: var(--jl-page-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4 {
	font-family: var(--jl2-font-display);
	font-weight: var(--jl2-fw-regular);
	font-style: normal;
	letter-spacing: var(--jl2-ls-normal);
	line-height: var(--jl2-lh-tight);
}

em, .jl-em-display {
	font-family: var(--jl2-font-display);
	font-style: italic;
	font-weight: var(--jl2-fw-regular);
}

/* ============================================================
   LIGHT-GLASS — PILOT: homepage CTAs (added 2026-06-21)
   Skin-only, scoped to body.home; NO width/size/layout changes, so the
   responsive rules in homepage.css remain authoritative. Reversible:
   delete from this banner to end-of-file to fully restore.
   ============================================================ */
@layer tokens {
:root {
	--jlg-ease: cubic-bezier(.22,.9,.32,1);
	--jlg-glass-ghost: linear-gradient(150deg, rgba(255,253,249,.55), rgba(250,248,242,.30));
	--jlg-glass-border: rgba(143,107,61,.30);
	--jlg-ink-surface: linear-gradient(150deg, #2f2c25 0%, #14140f 100%);
	--jlg-lit-border: rgba(232,184,75,.55);
	--jlg-lit-bg: radial-gradient(78% 88% at 50% 44%, rgba(253,246,230,.88) 0%, rgba(245,217,138,.55) 46%, rgba(232,184,75,.22) 100%);
	--jlg-lit-shadow: inset 0 0 16px rgba(245,217,138,.45), inset 0 1px 0 rgba(255,253,247,.9), 0 0 18px rgba(143,107,61,.22), 0 8px 20px rgba(40,36,28,.10);
}
}

/* ============================================================
   LIGHT-GLASS — Header icon shells (added 2026-06-21)
   Warm amber backlight on hover/focus for the search / account / cart
   icon buttons (desktop + mobile). Shell-only: cart badge, JS hooks,
   hamburger toggle, logo and nav links are left untouched.
   !important + `body ` prefix to win over header.css (loads later).
   Reversible: delete from this banner to end-of-file.
   ============================================================ */
@layer tokens {
:root {
	--jlg-icon-lit-bg: radial-gradient(82% 90% at 50% 42%, rgba(253,246,230,.96) 0%, rgba(245,217,138,.62) 50%, rgba(232,184,75,.28) 100%);
	--jlg-icon-lit-border: rgba(232,184,75,.70);
	--jlg-icon-lit-shadow: 0 6px 16px rgba(143,107,61,.22), 0 0 16px rgba(143,107,61,.30), inset 0 0 12px rgba(245,217,138,.55);
}
}

@media (hover: hover) {
	body .jleh-desktop-bar .jleh-action:hover,
	body .jleh-mobile-right .jleh-mobile-action:hover {
		background: var(--jlg-icon-lit-bg);
		border-color: var(--jlg-icon-lit-border);
		box-shadow: var(--jlg-icon-lit-shadow);
		opacity: 1;
	}
}

body .jleh-desktop-bar .jleh-action:focus-visible,
body .jleh-mobile-right .jleh-mobile-action:focus-visible {
	background: var(--jlg-icon-lit-bg);
	border-color: var(--jlg-icon-lit-border);
	box-shadow: var(--jlg-icon-lit-shadow), 0 0 0 3px rgba(232,184,75,.5);
	opacity: 1;
	outline: none;
}

/* ============================================================
   LIGHT-GLASS — Product page CTAs (added 2026-06-21)
   ADDITIVE glow only on the two Add-to-Cart controls (their solid
   dark fill + shape are kept) plus a warm focus ring on the qty
   field. Does NOT touch the buybar data-no-optimize <style>/<script>,
   the countdown, fills, layout, or any JS. Reversible: delete block.
   ============================================================ */
@media (hover: hover) {
	body .single_add_to_cart_button:hover:not(:disabled) {
		box-shadow: 0 6px 18px rgba(20,18,12,.30), 0 0 16px rgba(143,107,61,.36), 0 0 34px rgba(143,107,61,.20);
	}
}

body .single_add_to_cart_button:focus-visible {
	box-shadow: 0 6px 18px rgba(20,18,12,.30), 0 0 0 3px rgba(232,184,75,.55);
	outline: none;
}

body .quantity input.qty:focus {
	border-color: var(--jl2-color-gold);
	box-shadow: 0 0 0 3px rgba(232,184,75,.30);
	outline: none;
}

/* ============================================================
   LIGHT-GLASS — Cart & Checkout (added 2026-06-21)
   Cart + custom multi-step checkout. Primary CTAs keep their fill +
   shape, gain amber glow + lift on hover. Secondary/ghost buttons
   become frosted glass with amber backlight. Qty + remove get warm
   states. CSS-only; no form/JS/markup changes; the owner-approved
   login button is left untouched. Reversible: delete to end-of-file.
   ============================================================ */
@media (hover: hover) {
	body .jl-cartpage__cta:hover,
	body .jlc-co__btn--primary:hover {
		transform: translateY(-1px);
		box-shadow: 0 8px 20px rgba(20,18,12,.28), 0 0 16px rgba(143,107,61,.34), 0 0 32px rgba(143,107,61,.18);
		filter: brightness(1.04);
	}
}
body .jl-cartpage__cta:focus-visible,
body .jlc-co__btn--primary:focus-visible {
	box-shadow: 0 8px 20px rgba(20,18,12,.28), 0 0 0 3px rgba(232,184,75,.55);
	outline: none;
}

@media (hover: hover) {
	
	body .jlc-co__section-edit:hover { color: var(--jl2-color-gold-deep) !important; }
}

body input.qty:focus {
	border-color: var(--jl2-color-gold) !important;
	box-shadow: 0 0 0 3px rgba(232,184,75,.30) !important;
	outline: none !important;
}

/* ============================================================
   LIGHT-GLASS — Remaining surfaces (added 2026-06-21)
   Landing/contact/category/empty-cart CTAs, login/register,
   pagination, chips, FAQ + accordions, footer, chat contact cells,
   header nav + search dialog + hamburger, product decision CTAs,
   account nav. ALL ADDITIVE (glow / glass-skin / warm hover) — no
   layout/JS/markup changes; owner-approved login keeps its structure
   (glow only). Reversible: delete from this banner to end-of-file.
   ============================================================ */

/* Primary pill CTAs — landing pages, contact, category hero, empty-cart, login/register */
@media (hover:hover){
	body .woocommerce-button.button:hover {
		transform: translateY(-1px);
		box-shadow: 0 8px 20px rgba(20,18,12,.26), 0 0 16px rgba(143,107,61,.32), 0 0 30px rgba(143,107,61,.16) !important;
		filter: brightness(1.04);
	}
}
body .woocommerce-button.button:focus-visible {
	box-shadow: 0 0 0 3px rgba(232,184,75,.55) !important;
	outline: none !important;
}

/* Secondary / ghost pill CTAs -> frosted glass + amber backlight */

@media (hover:hover){
	
	body .jl-cartempty__categories a:hover {
		border-color: var(--jlg-lit-border);
		background: rgba(245,217,138,.30);
		color: #3a2a10;
	}
}

/* Pagination + blog read-more -> glass amber hover (active page untouched) */
@media (hover:hover){
	body a.page-numbers:hover {
		border-color: var(--jlg-lit-border);
		background: var(--jlg-lit-bg);
		color: #3a2a10;
		box-shadow: var(--jlg-lit-shadow);
	}
}

/* FAQ / accordion toggles + account nav -> warm hover
 * (Footer .jl-social-icon:hover + .jl-footer-menu__toggle:hover moved to
 * footer/footer.css Phase 25 — one canonical file for footer styling.) */
@media (hover:hover){
	body summary.jl-faq-question:hover,
	body .woocommerce-MyAccount-navigation a:hover {
		color: var(--jl2-color-gold-deep) !important;
	}
}

/* Chat bubble contact cells / social / email -> amber backlight to match system */
@media (hover:hover){
	body .pl-cell:hover,
	body .pl-soc a:hover,
	body .pl-email:hover {
		border-color: var(--jlg-lit-border);
		box-shadow: 0 0 14px rgba(143,107,61,.28), inset 0 0 10px rgba(245,217,138,.40);
	}
}

/* Hamburger toggle -> warm hover backlight (bars colour stays JS-controlled) */
@media (hover:hover){
	body .jleh-mobile-toggle:hover {
		background: var(--jlg-icon-lit-bg);
		border-color: var(--jlg-icon-lit-border);
		box-shadow: var(--jlg-icon-lit-shadow);
	}
}

/* ============================================================
   LIGHT-GLASS — Resting surfaces (added 2026-06-21)
   Makes the glass look VISIBLE AT REST + on mobile/touch (not only
   on hover): rounds buttons, gives secondaries a frosted-glass
   surface, primaries dimensional ink depth, and frosts the header
   icons. Skin-only (radius / background / border / shadow); NO
   width/height/padding/layout/JS. NO resting background is forced
   on the stateful add-to-cart buttons, so their is-added /
   is-loading / disabled states survive. Pairs with the hover blocks
   above (hover still wins via higher specificity). Reversible:
   delete from this banner to end-of-file.
   ============================================================ */
@layer tokens {
:root{
	--jlg-glass: linear-gradient(168deg, rgba(255,255,255,.72) 0%, rgba(245,243,240,.5) 100%); /* header/icon frosted-glass surface (independent of buttons) */
	--jlg-blur: var(--jl2-btn-backdrop);
	--jlg-glass-shadow: 0 5px 16px rgba(40,36,28,.10), inset 0 1px 0 rgba(255,255,255,.92);
}
}

/* Round all button families — visible at rest on every viewport */
body .single_add_to_cart_button,
body .jl-cartpage__cta,
body .jlc-co__btn--primary,
body .woocommerce-button.button,
body a.page-numbers,
body span.page-numbers {
	border-radius: var(--jl2-btn-radius) !important;
}

/* Primary / conversion — dimensional ink depth at rest (fill + states kept) */
body .single_add_to_cart_button,
body .jl-cartpage__cta,
body .jlc-co__btn--primary,
body .woocommerce-button.button,
body .jm-product-card__cart,
body .jlc2-cta,
body .jlc2-stickybar__cta,
body #place_order,
body .jla-btn--primary,
body .jl-cta--primary,
body a.page-numbers {
	box-shadow: var(--jl2-btn-primary-shadow) !important;
	background: var(--jl2-btn-primary-bg) !important;
	color: var(--jl2-btn-primary-fg) !important;
	border: 1px solid var(--jl2-btn-primary-border) !important;
	-webkit-backdrop-filter: var(--jl2-btn-backdrop);
	backdrop-filter: var(--jl2-btn-backdrop);
	transition: transform .26s var(--jlg-ease), box-shadow .26s var(--jlg-ease), filter .26s var(--jlg-ease) !important;
}
body .single_add_to_cart_button:active,
body .jl-cartpage__cta:active,
body .jlc-co__btn--primary:active,
body .woocommerce-button.button:active,
body .jm-product-card__cart:active,
body .jlc2-cta:active,
body .jlc2-stickybar__cta:active,
body #place_order:active,
body .jla-btn--primary:active { transform: scale(.98); }

/* Secondary — green-tinted glass. Carved out of the primary group above so
   contact / WhatsApp / call and every secondary CTA share one green glass look. */
body .jl-cta--secondary,
body .jlc-co__btn--ghost,
body .jl-cartdrawer__btn--ghost {
	box-shadow: var(--jl2-btn-secondary-shadow) !important;
	background: var(--jl2-btn-secondary-bg) !important;
	color: var(--jl2-btn-secondary-fg) !important;
	border: 1px solid var(--jl2-btn-secondary-border) !important;
	-webkit-backdrop-filter: var(--jl2-btn-secondary-backdrop);
	backdrop-filter: var(--jl2-btn-secondary-backdrop);
}

/* Header icon shells — frosted glass at rest (rounder, warmer) */
body .jleh-desktop-bar .jleh-action,
body .jleh-mobile-right .jleh-mobile-action {
	border-radius: 13px;
	background: var(--jlg-glass);
	border: 1px solid var(--jlg-glass-border);
	box-shadow: var(--jlg-glass-shadow);
	-webkit-backdrop-filter: var(--jlg-blur);
	backdrop-filter: var(--jlg-blur);
}

/* Qty fields — gently rounded to match */
body input.qty { border-radius: 12px !important; }

/* ============================================================
   LIGHT-GLASS — Completion pass (added 2026-06-21)
   Final boxed CTAs that still lacked the resting glass: product
   decision-support CTAs + blog read-more get the frosted-glass
   surface at rest (hover glow already defined above); hamburger
   rounded to match the header icons. Skin-only; reversible.
   ============================================================ */

body .jleh-mobile-toggle { border-radius: 13px; }

/* SMOKY GLASS (2026-09-02): moved off the #jl-liquid clear-lens refraction to a faint frost —
   the smoky off-white body + neumorphic shadow now carry the look, not backdrop distortion. */
@supports (backdrop-filter: blur(2px)) {
	body .single_add_to_cart_button,
body .jl-cartpage__cta,
body .jlc-co__btn--primary,
body .woocommerce-button.button,
body .jm-product-card__cart,
body .jlc2-cta,
body .jlc2-stickybar__cta,
body #place_order,
body .jla-btn--primary,
body .jl-cta--primary,
body .jpdp-uxstrip__cta,
body .is-style-jl-primary > .wp-block-button__link {
		-webkit-backdrop-filter: var(--jl2-btn-backdrop) !important;
		backdrop-filter: var(--jl2-btn-backdrop) !important;
	}
}