/* SMJ Marketplace — cart UI. Reuses existing --smj-* theme tokens. */

/* Add to Cart buttons */
.smj-atc {
	display: inline-block;
	background: var(--smj-primary, #1e6eff);
	color: #fff;
	border: 0;
	border-radius: var(--smj-radius-sm, 8px);
	padding: 9px 16px;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	text-decoration: none;
	line-height: 1.2;
	transition: filter .15s ease, background .15s ease;
}

.smj-atc:hover {
	filter: brightness(.95);
}

/* v6.20.93 — REQUIRED, not cosmetic. The card Add-to-Cart button is injected
   into .smj-card__body (class-ui-render.php:863), but the rule that lifts
   elements above the invisible full-card permalink overlay only covers
   `.smj-card__fav, .smj-card__footer .smj-btn` (smj-marketplace-ui.css:242).
   .smj-atc--card matched neither, so .smj-card__permalink (inset:0; z-index:1)
   sat on top of it and every click navigated to the product page instead of
   adding to the cart. */
.smj-card .smj-atc--card {
	position: relative;
	z-index: 2;
}

.smj-atc.is-added {
	background: var(--smj-success, #2e7d32);
}

/* v6.20.92 — Persistent in-cart state on cards. Distinct from the transient
   "Added ✓" flash: this stays for the whole session so a shopper can scan the
   grid and see what is already in their bag. Outlined rather than solid so it
   reads as a status, not a primary action, and clicking it goes to the cart. */
.smj-atc[data-incart] {
	background: transparent !important;
	color: var(--smj-success, #2e7d32) !important;
	border: 1.5px solid var(--smj-success, #2e7d32) !important;
	box-shadow: none !important;
}
.smj-atc[data-incart]:hover {
	background: rgba(46, 125, 50, .07) !important;
	filter: none;
}
.smj-atc[data-incart] svg {
	stroke: var(--smj-success, #2e7d32);
}

.smj-atc[disabled] {
	opacity: .55;
	cursor: not-allowed;
}

.smj-atc--card {
	margin-top: 8px;
	width: 100%;
	text-align: center;
}

/* Buy box (single page) */
.smj-buybox {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin: 14px 0;
}

.smj-buybox__qty {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--smj-border, #e2e8f0);
	border-radius: var(--smj-radius-sm, 8px);
	overflow: hidden;
}

.smj-buybox__qty button {
	background: var(--smj-light-section, #f5f7fa);
	border: 0;
	width: 36px;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	color: var(--smj-text, #111827);
}

.smj-buybox__qty button:hover {
	background: var(--smj-border, #e2e8f0);
}

.smj-buybox__qty .smj-qty-input {
	width: 48px;
	border: 0;
	border-left: 1px solid var(--smj-border, #e2e8f0);
	border-right: 1px solid var(--smj-border, #e2e8f0);
	text-align: center;
	font-size: 15px;
	-moz-appearance: textfield;
}

.smj-buybox__qty .smj-qty-input::-webkit-outer-spin-button,
.smj-buybox__qty .smj-qty-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.smj-buybox__view {
	font-size: 13px;
	color: var(--smj-primary, #1e6eff);
	text-decoration: none;
}

.smj-buybox__view:hover {
	text-decoration: underline;
}

/* Mini cart */
.smj-mini-cart {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	text-decoration: none;
	color: var(--smj-text, #111827);
	font-weight: 600;
}

.smj-mini-cart__count {
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--smj-primary, #1e6eff);
	color: #fff;
	font-size: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform .2s ease;
}

.smj-mini-cart__count.is-bumped {
	transform: scale(1.35);
}

/* Cart page */
.smj-cart__table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 18px;
}

.smj-cart__table th,
.smj-cart__table td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--smj-border, #e2e8f0);
	text-align: left;
	vertical-align: middle;
}

.smj-cart__table th {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--smj-text-muted, #64748b);
}

.smj-cart__prod {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	color: var(--smj-text, #111827);
	font-weight: 600;
}

.smj-cart__thumb {
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: var(--smj-radius-sm, 8px);
}

.smj-cart__remove {
	background: none;
	border: 0;
	font-size: 22px;
	line-height: 1;
	color: var(--smj-text-muted, #94a3b8);
	cursor: pointer;
}

.smj-cart__remove:hover {
	color: #dc2626;
}

.smj-cart__foot {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 20px;
	flex-wrap: wrap;
}

.smj-cart__totals {
	display: flex;
	align-items: baseline;
	gap: 10px;
	font-size: 16px;
}

.smj-cart__subtotal {
	font-weight: 700;
	font-size: 20px;
	color: var(--smj-primary, #1e6eff);
}

.smj-cart__checkout {
	padding: 11px 22px;
	font-size: 15px;
}

.smj-cart-empty {
	text-align: center;
	padding: 40px 16px;
	color: var(--smj-text-muted, #64748b);
}

.smj-cart-empty .smj-atc {
	margin-top: 12px;
}

/* Responsive: stack cart rows on small screens */
@media (max-width: 600px) {
	.smj-cart__table thead {
		display: none;
	}
	.smj-cart__table,
	.smj-cart__table tbody,
	.smj-cart__row,
	.smj-cart__table td {
		display: block;
		width: 100%;
	}
	.smj-cart__row {
		border: 1px solid var(--smj-border, #e2e8f0);
		border-radius: var(--smj-radius-sm, 8px);
		margin-bottom: 12px;
		padding: 6px 10px;
	}
	.smj-cart__table td {
		border: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 12px;
		padding: 7px 0;
	}
	.smj-cart__table td::before {
		content: attr(data-label);
		font-size: 12px;
		text-transform: uppercase;
		letter-spacing: .04em;
		color: var(--smj-text-muted, #64748b);
	}
	.smj-cart__col-prod::before {
		display: none;
	}
	.smj-cart__col-rm {
		justify-content: flex-end;
	}
}

/* Coupons + totals (Phase 4) */
.smj-cart__foot {
	flex-direction: column;
	align-items: stretch;
	max-width: 360px;
	margin-left: auto;
}
.smj-cart__coupon {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 14px;
}
.smj-coupon-input {
	flex: 1;
	min-width: 120px;
	padding: 8px 10px;
	border: 1px solid var(--smj-border, #e2e8f0);
	border-radius: var(--smj-radius-sm, 8px);
}
.smj-atc--ghost {
	background: transparent;
	color: var(--smj-primary, #1e6eff);
	border: 1px solid var(--smj-primary, #1e6eff);
}
.smj-coupon-remove {
	background: none;
	border: 0;
	color: #dc2626;
	cursor: pointer;
	font-size: 13px;
	text-decoration: underline;
}
/* v6.20.110 — coupon apply feedback. Empty by default (no box), becomes a
   subtle banner only when a message is present. */
.smj-coupon-msg { flex-basis: 100%; font-size: 13px; font-weight: 600; margin-top: 8px; }
.smj-coupon-msg:empty { display: none; }
.smj-coupon-msg.is-ok,
.smj-coupon-msg.is-err {
  display: flex; align-items: center; gap: 7px;
  padding: 9px 12px; border-radius: 9px; line-height: 1.3;
}
.smj-coupon-msg.is-ok {
  color: #166534; background: #dcfce7; border: 1px solid #bbf7d0;
}
.smj-coupon-msg.is-ok::before {
  content: ""; flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%;
  background: #16a34a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat;
}
.smj-coupon-msg.is-err {
  color: #b91c1c; background: #fee2e2; border: 1px solid #fecaca;
}
.smj-coupon-msg.is-err::before {
  content: "!"; flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%;
  background: #dc2626; color: #fff; font-weight: 800; font-size: 11px;
  display: flex; align-items: center; justify-content: center;
}
.smj-cart__trow {
	display: flex;
	justify-content: space-between;
	padding: 6px 0;
	font-size: 15px;
}
.smj-cart__trow--total {
	border-top: 1px solid var(--smj-border, #e2e8f0);
	margin-top: 4px;
	padding-top: 10px;
	font-weight: 700;
	font-size: 18px;
}
.smj-cart__total { color: var(--smj-primary, #1e6eff); }
.smj-checkout__total--grand {
	border-top: 1px solid var(--smj-border, #e2e8f0);
	padding-top: 10px;
	margin-top: 4px;
}
.smj-checkout__total--grand strong { font-size: 20px; color: var(--smj-primary, #1e6eff); }

/* ════════════════════════════════════════════════════════════════════════
 * v6.20.89 — Cart v2 layout.
 * The [smj_cart] shortcode has emitted the "--v2" markup (media row, aside
 * summary, coupon, totals) for a while, but every v2 class below was
 * UNSTYLED — only the legacy table classes were covered, so the page
 * rendered as bare stacked divs. This section is the missing skin.
 * Tokens mirror the single-product page (--smj-card-bg/border/radius,
 * --smj-text*, --smj-primary) so the design language matches site-wide.
 * ════════════════════════════════════════════════════════════════════════ */
.smj-cart--v2{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.smj-cart--v2 .smj-cart__items{background:var(--smj-card-bg,#fff);border:1px solid var(--smj-border,#e8ebee);
  border-radius:var(--smj-radius,12px);padding:6px 18px 4px}
.smj-cart__hd{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:14px 0 12px;border-bottom:1px solid var(--smj-border,#eef1f4)}
.smj-cart__title{margin:0;font-size:19px;font-weight:800;color:var(--smj-text,#111827)}
.smj-cart__count{font-size:13px;color:var(--smj-text-muted,#94a3b8);font-weight:600}
.smj-cart--v2 .smj-cart__row{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:14px;
  align-items:start;padding:16px 0;border-bottom:1px solid var(--smj-border,#eef1f4)}
.smj-cart--v2 .smj-cart__row:last-child{border-bottom:0}
.smj-cart__media{display:block;width:88px;height:104px;border-radius:10px;overflow:hidden;
  background:var(--smj-light-section,#f5f7fa);flex:0 0 auto}
.smj-cart--v2 .smj-cart__thumb{width:100%;height:100%;object-fit:cover;display:block}
.smj-cart__thumb--ph{display:flex;align-items:center;justify-content:center;font-size:26px}
.smj-cart__info{display:flex;flex-direction:column;gap:5px;min-width:0}
.smj-cart__name{font-weight:700;font-size:14.5px;line-height:1.35;color:var(--smj-text,#111827);
  text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.smj-cart__name:hover{color:var(--smj-primary,#1e6eff)}
.smj-cart__variant{font-size:12.5px;color:var(--smj-text-muted,#64748b)}
.smj-cart__unit{font-size:13.5px;font-weight:700;color:var(--smj-text,#111827)}
.smj-cart__ctrl{display:flex;align-items:center;gap:14px;margin-top:6px;flex-wrap:wrap}
.smj-cart__qty{transform:scale(.92);transform-origin:left center}
.smj-cart--v2 .smj-cart__remove{display:inline-flex;align-items:center;gap:5px;background:none;border:0;
  padding:4px 0;font-size:13px;font-weight:600;color:var(--smj-text-muted,#64748b);cursor:pointer}
.smj-cart--v2 .smj-cart__remove:hover{color:#dc2626}
.smj-cart__lineblock{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:84px}
.smj-cart__linelbl{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--smj-text-muted,#94a3b8)}
.smj-cart__line{font-size:15.5px;font-weight:800;color:var(--smj-text,#111827);font-variant-numeric:tabular-nums}
/* Aside / summary */
.smj-cart__aside{position:sticky;top:calc(var(--smj-hf-header-height,72px) + 16px)}
.smj-cart__summary{background:var(--smj-card-bg,#fff);border:1px solid var(--smj-border,#e8ebee);
  border-radius:var(--smj-radius,12px);padding:18px;box-shadow:0 2px 10px rgba(15,23,42,.04)}
.smj-cart__sumtitle{margin:0 0 14px;font-size:15px;font-weight:800;text-transform:uppercase;
  letter-spacing:.03em;color:var(--smj-text,#111827)}
.smj-cart--v2 .smj-cart__coupon{margin-bottom:14px;display:flex;flex-wrap:wrap;gap:6px}
.smj-cart__couponrow{display:flex;gap:8px;width:100%}
.smj-cart--v2 .smj-coupon-input{flex:1 1 auto;min-width:0;padding:9px 11px;font-size:13.5px;
  border:1px solid var(--smj-border,#e2e8f0);border-radius:var(--smj-radius-sm,8px)}
.smj-cart--v2 .smj-coupon-input:focus{outline:none;border-color:var(--smj-primary,#1e6eff);
  box-shadow:0 0 0 3px rgba(30,110,255,.12)}
.smj-cart--v2 .smj-cart__totals{display:flex;flex-direction:column;gap:9px;padding-top:12px;
  border-top:1px solid var(--smj-border,#eef1f4)}
.smj-cart--v2 .smj-cart__trow{display:flex;justify-content:space-between;font-size:13.5px;
  color:var(--smj-text-muted,#475569);padding:0;border:0;margin:0}
.smj-cart--v2 .smj-cart__trow span:last-child{font-variant-numeric:tabular-nums;font-weight:600;
  color:var(--smj-text,#111827)}
/* v6.20.139 — the legacy v1 rule `.smj-cart__subtotal{font-weight:700;
   font-size:20px;color:var(--smj-primary)}` (line ~219) still matches, because
   v2 markup reuses that class name. The v2 rule above never sets font-size or
   overrides the colour, so the SUBTOTAL figure alone rendered at 20px in
   primary blue while its "Subtotal" label sat at 13.5px — the size/colour
   mismatch visible in the summary. Realigned with the other rows here; the
   Grand Total keeps its own larger treatment via the --total rule below. */
.smj-cart--v2 .smj-cart__trow span.smj-cart__subtotal{
  font-size:inherit;font-weight:600;color:var(--smj-cart-sum-value,var(--smj-text,#111827))}
.smj-cart__trow--discount span:last-child{color:#166534!important}
.smj-cart--v2 .smj-cart__trow--total{padding-top:10px;margin-top:2px;border-top:1px dashed var(--smj-border,#e2e8f0);
  font-size:15px;font-weight:800;color:var(--smj-text,#111827)}
.smj-cart--v2 .smj-cart__trow--total span:last-child{font-size:19px;color:var(--smj-primary,#1e6eff)}
.smj-cart__taxnote{font-size:11.5px;color:var(--smj-text-muted,#94a3b8);margin-top:2px}
.smj-cart--v2 .smj-cart__checkout{display:block;width:100%;text-align:center;margin-top:14px;
  padding:13px;font-size:15px;border-radius:10px;box-sizing:border-box}
.smj-cart__continue{display:block;text-align:center;margin-top:10px;font-size:13px;font-weight:600;
  color:var(--smj-text-muted,#64748b);text-decoration:none}
.smj-cart__continue:hover{color:var(--smj-primary,#1e6eff)}
.smj-cart-empty{text-align:center;padding:56px 16px}
.smj-cart-empty__ico{display:block;font-size:44px;margin-bottom:8px}
/* Row-busy state while the qty/remove AJAX runs */
.smj-cart__row.is-busy{opacity:.45;pointer-events:none;transition:opacity .15s}
@media (max-width:900px){
  .smj-cart--v2{grid-template-columns:1fr}
  .smj-cart__aside{position:static}
}
@media (max-width:520px){
  .smj-cart--v2 .smj-cart__row{grid-template-columns:72px minmax(0,1fr)}
  .smj-cart__media{width:72px;height:86px}
  .smj-cart__lineblock{grid-column:2;flex-direction:row;align-items:baseline;gap:8px;
    justify-content:flex-start;min-width:0}
}

/* ════════════════════════════════════════════════════════════════════════
 * v6.20.94 — Theme Control (Cart tab) variable bindings.
 * Reads the --smj-cart-* variables emitted by SMJ_TC_Commerce under
 * body.smj-pg-cart. Every value falls back to the existing token, so an
 * unset control changes nothing. Scoped to the cart page only.
 * ════════════════════════════════════════════════════════════════════════ */
/* v6.20.139 — !important on the typography bindings.
   ROOT CAUSE of "setting changes nothing": these were un-flagged, and this
   site's theme styles its content wrapper with !important (the same reason
   product titles came out blue in v6.20.137). An !important declaration beats
   ANY specificity, so Heading Size/Weight, Base Font Size, Line Height and
   Body Weight were all silently overridden by the theme. Every fallback is
   the pre-existing value, so a BLANK control still renders as before. */
body.smj-pg-cart{
  background: var(--smj-cart-page-bg, transparent);
  color: var(--smj-cart-text, inherit);
  font-family: var(--smj-cart-font, inherit) !important;
  font-size: var(--smj-cart-font-size, inherit) !important;
  line-height: var(--smj-cart-line-height, inherit) !important;
  /* v6.20.138 — Body Weight. Inherited (not !important) so elements with a
     deliberate weight (.smj-cart__name 700, .smj-cart__line 800) keep it;
     this governs general body copy only. */
  font-weight: var(--smj-cart-body-weight, inherit) !important;
}
body.smj-pg-cart .smj-cart--v2{ gap: var(--smj-cart-gap, 24px); }
body.smj-pg-cart .smj-cart--v2 .smj-cart__items,
body.smj-pg-cart .smj-cart__summary{
  background: var(--smj-cart-card-bg, var(--smj-card-bg,#fff));
  border-color: var(--smj-cart-card-border, var(--smj-border,#e8ebee));
  border-radius: var(--smj-cart-card-radius, var(--smj-radius,12px));
  box-shadow: var(--smj-cart-card-shadow, 0 2px 10px rgba(15,23,42,.04));
}
/* v6.20.136 AUDIT FIX — "Card Padding" sits under "Cards & Sections" and the
   Cards binding above styles BOTH cards, but the padding line targeted only
   .smj-cart__summary, so the control had no effect on the items card. Added
   here with the items card's exact base padding as the fallback, so leaving
   the control blank renders identically to before. */
body.smj-pg-cart .smj-cart__summary{ padding: var(--smj-cart-card-pad, 18px); }
body.smj-pg-cart .smj-cart--v2 .smj-cart__items{ padding: var(--smj-cart-card-pad, 6px 18px 4px); }
/* v6.20.136 AUDIT FIX — these were one rule with `font-size:
   var(--smj-cart-heading-size, inherit)`. The panel promises "leave blank to
   inherit the site theme", but this block is later and more specific than the
   base rules, so a BLANK control resolved to `inherit` and silently destroyed
   the designed sizes (.smj-cart__title 19px, .smj-cart__sumtitle 15px),
   collapsing both headings to the body size. Split so each keeps its own base
   value as the fallback: blank now genuinely changes nothing. */
body.smj-pg-cart .smj-cart__title,
body.smj-pg-cart .smj-cart__sumtitle{
  color: var(--smj-cart-heading, var(--smj-text,#111827)) !important;
  font-weight: var(--smj-cart-heading-weight, 800) !important;
}
body.smj-pg-cart .smj-cart__title{ font-size: var(--smj-cart-heading-size, 19px) !important; }
body.smj-pg-cart .smj-cart__sumtitle{ font-size: var(--smj-cart-heading-size, 15px) !important; }
body.smj-pg-cart .smj-cart__count,
body.smj-pg-cart .smj-cart__variant,
body.smj-pg-cart .smj-cart__taxnote{ color: var(--smj-cart-muted, var(--smj-text-muted,#94a3b8)); }

/* ════════════════════════════════════════════════════════════════════════
 * v6.20.137 — "Text Color" now actually governs product details.
 *
 * TWO defects fixed here, both root-cause:
 *
 * 1. THEME LEAK (the blue titles). `.smj-cart__name` is an <a>, styled
 *    `.smj-cart__name{color:var(--smj-text,#111827)}` = specificity (0,1,0).
 *    The cart shortcode renders inside the theme's content wrapper, and
 *    virtually every theme ships `.entry-content a{color:<link blue>}` =
 *    (0,1,1) — which OUTRANKS the plugin rule. So product titles took the
 *    theme's link colour no matter what Theme Control said.
 *
 * 2. DEAD BINDING. --smj-cart-text was applied only as `body{color:…}`,
 *    i.e. an INHERITED value. Every element above declares its own `color`,
 *    so inheritance never reached them and the control could not affect
 *    product titles, prices or line totals at all.
 *
 * Fix: bind the variable directly to those elements, scoped under
 * body.smj-pg-cart (0,2,0) and marked !important so no theme content rule
 * can outrank it. Each fallback is the element's EXISTING designed value,
 * so leaving the control blank restores the intended dark text rather than
 * changing the design. Hover states are deliberately left alone.
 * ════════════════════════════════════════════════════════════════════════ */
body.smj-pg-cart .smj-cart__name,
body.smj-pg-cart .smj-cart__line,
body.smj-pg-cart .smj-cart__subtotal{
  color: var(--smj-cart-text, var(--smj-text,#111827)) !important;
}
/* Muted supporting text follows the Muted control, not the body text one. */
body.smj-pg-cart .smj-cart__linelbl{
  color: var(--smj-cart-muted, var(--smj-text-muted,#94a3b8)) !important;
}
/* Remove button is a control, not body copy — keep it muted, but stop the
   theme recolouring it. Its :hover red is untouched. */
body.smj-pg-cart .smj-cart--v2 .smj-cart__remove{
  color: var(--smj-cart-muted, var(--smj-text-muted,#64748b)) !important;
}
/* The !important above would otherwise beat the un-flagged :hover rules
   earlier in this file (an !important declaration wins regardless of state),
   silently killing both hover affordances. Re-declared here at matching
   importance and higher specificity so hover behaves exactly as before. */
body.smj-pg-cart .smj-cart__name:hover{
  color: var(--smj-cart-link-hover, var(--smj-primary,#1e6eff)) !important;
}
body.smj-pg-cart .smj-cart--v2 .smj-cart__remove:hover{ color:#dc2626 !important; }
body.smj-pg-cart .smj-cart--v2 .smj-cart__checkout{
  background: var(--smj-cart-btn-bg, var(--smj-primary));
  color: var(--smj-cart-btn-text, #fff);
  border-radius: var(--smj-cart-btn-radius, 10px);
  padding: var(--smj-cart-btn-pad-y, 13px);
  font-size: var(--smj-cart-btn-size, 15px);
}
body.smj-pg-cart .smj-cart--v2 .smj-cart__checkout:hover{
  background: var(--smj-cart-btn-hover-bg, var(--smj-primary-dk, var(--smj-primary)));
  color: var(--smj-cart-btn-hover-text, #fff);
}
body.smj-pg-cart .smj-cart--v2 .smj-coupon-input{
  background: var(--smj-cart-input-bg, #fff);
  color: var(--smj-cart-input-text, inherit);
  border-color: var(--smj-cart-input-border, var(--smj-border,#e2e8f0));
  border-radius: var(--smj-cart-input-radius, var(--smj-radius-sm,8px));
}
body.smj-pg-cart .smj-cart--v2 .smj-coupon-input:focus{
  border-color: var(--smj-cart-input-focus, var(--smj-primary));
  box-shadow: 0 0 0 3px rgba(var(--smj-cart-input-focus-rgb, 30,110,255), .12);
}
body.smj-pg-cart .smj-cart--v2 .smj-coupon-input::placeholder{ color: var(--smj-cart-placeholder, #9aa4b2); }
body.smj-pg-cart .smj-coupon-apply{
  background: var(--smj-cart-coupon-btn-bg, var(--smj-primary));
  color: var(--smj-cart-coupon-btn-text, #fff);
}
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow span:first-child{ color: var(--smj-cart-sum-label, var(--smj-text-muted,#475569)); }
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow span:last-child{ color: var(--smj-cart-sum-value, var(--smj-text,#111827)); }
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow--total span:last-child{ color: var(--smj-cart-sum-total, var(--smj-primary)); }
body.smj-pg-cart .smj-cart__trow--discount span:last-child{ color: var(--smj-cart-discount-color, #166534) !important; }

/* ════════════════════════════════════════════════════════════════════════
 * v6.20.96 — Login-required modal (guest Add to Cart).
 * Portalled to <body>, so no card overflow/transform can clip it. Uses theme
 * tokens to match the site; falls back to sane literals off-theme.
 * ════════════════════════════════════════════════════════════════════════ */
.smj-loginpop{position:fixed;inset:0;z-index:100050;display:flex;align-items:center;justify-content:center;
  padding:16px;opacity:0;transition:opacity .2s ease}
.smj-loginpop.is-in{opacity:1}
.smj-loginpop__backdrop{position:absolute;inset:0;background:rgba(15,23,42,.5)}
.smj-loginpop__card{position:relative;width:100%;max-width:360px;background:var(--smj-card-bg,#fff);
  border-radius:16px;padding:28px 24px 24px;text-align:center;
  box-shadow:0 20px 55px rgba(15,23,42,.3);transform:translateY(10px) scale(.98);transition:transform .2s ease}
.smj-loginpop.is-in .smj-loginpop__card{transform:none}
.smj-loginpop__x{position:absolute;top:10px;right:12px;width:26px;height:26px;border:0;background:transparent;
  font-size:22px;line-height:1;color:var(--smj-text-muted,#94a3b8);cursor:pointer;border-radius:7px}
.smj-loginpop__x:hover{background:var(--smj-bg,#f4f6f8);color:var(--smj-text,#111827)}
.smj-loginpop__ico{font-size:34px;display:block;margin-bottom:6px}
.smj-loginpop__title{margin:0 0 6px;font-size:18px;font-weight:800;color:var(--smj-text,#111827)}
.smj-loginpop__msg{margin:0 0 18px;font-size:14px;line-height:1.5;color:var(--smj-text-muted,#64748b)}
.smj-loginpop__actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.smj-loginpop__btn{flex:1 1 130px;display:inline-block;background:var(--smj-primary,#1e6eff);color:#fff;
  border-radius:10px;padding:12px 16px;font-weight:700;font-size:14px;text-decoration:none;text-align:center}
.smj-loginpop__btn:hover{filter:brightness(.95)}
.smj-loginpop__btn--ghost{background:transparent;color:var(--smj-primary,#1e6eff);
  border:1.5px solid var(--smj-primary,#1e6eff)}
.smj-loginpop__btn--ghost:hover{background:rgba(30,110,255,.06);filter:none}
@media (prefers-reduced-motion:reduce){.smj-loginpop,.smj-loginpop__card{transition:none}}
@media (max-width:380px){.smj-loginpop__actions{flex-direction:column}}

/* v6.20.99 — audit bindings: every Cart-tab control now has a live target. */
/* v6.20.136 AUDIT FIX — layout var read FIRST so "Full width" wins over the
   Container Width slider instead of being silently overwritten by it. */
body.smj-pg-cart .smj-cart--v2{max-width:var(--smj-cart-layout-w,var(--smj-cart-container-w,none));margin-inline:auto}
body.smj-pg-cart .smj-cart__linelbl{color:var(--smj-cart-label-color,var(--smj-text-muted,#94a3b8))}
body.smj-pg-cart .smj-cart--v2 .smj-coupon-input{background:var(--smj-cart-coupon-bg,var(--smj-cart-input-bg,#fff));border-color:var(--smj-cart-coupon-border,var(--smj-cart-input-border,var(--smj-border,#e2e8f0)))}
body.smj-pg-cart .smj-cart__summary{background:var(--smj-cart-sum-bg,var(--smj-cart-card-bg,var(--smj-card-bg,#fff)));border-color:var(--smj-cart-sum-border,var(--smj-cart-card-border,var(--smj-border,#e8ebee)))}

/* ════════════════════════════════════════════════════════════════════════
 * v6.20.140 — Order Summary rows: label left, value right.
 *
 * Symptom: "Subtotal₹8,322", "Estimated shippingFree", "Total₹8,322" —
 * label and value touching instead of sitting at opposite edges.
 *
 * Not a missing rule. `.smj-cart--v2 .smj-cart__trow` already declares
 * display:flex + justify-content:space-between, and it IS matching (the
 * dashed rule above the Total row comes from the sibling --total selector,
 * which needs the same ancestor). The failure is geometric: space-between
 * distributes across the row's own line box, so if the row is shrink-to-fit
 * rather than full width, "opposite ends" collapse onto the text itself.
 *
 * A column flex parent stretches its children by default, and the plugin
 * never sets align-items/width/align-self here — so the collapse is coming
 * from outside the plugin. That matches the two defects already confirmed
 * on this site: the theme's blue links (v6.20.137) and its typography
 * overrides (v6.20.139), both of which beat plugin rules via !important.
 *
 * Rather than chase the specific external declaration, this pins the row's
 * geometry so no outside rule can collapse it. Values are the ones the
 * design already intended — nothing here changes the visual design.
 * ════════════════════════════════════════════════════════════════════════ */
body.smj-pg-cart .smj-cart--v2 .smj-cart__totals{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;   /* children must span the card */
  width:100% !important;
}
/* :not([style*="display:none"]) is load-bearing, not decoration. The Discount
   row carries an inline style="display:none" when no coupon is applied, and a
   CSS !important declaration OUTRANKS an inline style — so a blanket
   `display:flex !important` here would permanently reveal an empty Discount
   row. Excluding hidden rows keeps that server-side toggle authoritative,
   and smj-cart.js flips the same inline style on coupon apply/remove. */
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow:not([style*="display:none"]):not([style*="display: none"]){
  display:flex !important;
  flex-direction:row !important;
  justify-content:space-between !important;
  align-items:baseline !important;
  align-self:stretch !important;    /* defeats a parent align-items override */
  width:100% !important;            /* defeats a shrink-to-fit width */
  gap:8px !important;               /* label and value can never touch */
}
/* Backstop: an auto left margin consumes all free space, so the value is
   pushed to the right edge even if justify-content itself is overridden. */
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow > span:last-child{
  margin-left:auto !important;
  text-align:right !important;
}
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow > span:first-child{
  margin-right:0 !important;
  text-align:left !important;
}

/* ════════════════════════════════════════════════════════════════════════
 * v6.20.141 — Body Weight now reaches the text it is supposed to control.
 *
 * v6.20.138 bound --smj-cart-body-weight only to `body.smj-pg-cart`, i.e. as
 * an INHERITED value. But every piece of cart body copy declares its own
 * font-weight (.smj-cart__name 700, .smj-cart__line 800, summary values 600,
 * total row 800), and a declared value always beats an inherited one — so
 * setting Body Weight to 300 changed nothing visible. That was my call and it
 * was wrong: the control is labelled "Body Weight", so it should govern body
 * copy, not just whatever happens to have no weight of its own.
 *
 * Bound directly here. Each fallback is the element's EXISTING weight, so a
 * blank control renders exactly as before and the designed hierarchy is
 * preserved until the admin chooses otherwise.
 *
 * Deliberately EXCLUDED, because they have their own controls:
 *   .smj-cart__title / .smj-cart__sumtitle  -> Heading Weight
 *   .smj-cart__checkout / .smj-coupon-apply -> Buttons group
 * ════════════════════════════════════════════════════════════════════════ */
body.smj-pg-cart .smj-cart__name{      font-weight: var(--smj-cart-body-weight, 700) !important; }
body.smj-pg-cart .smj-cart__unit{      font-weight: var(--smj-cart-body-weight, 700) !important; }
body.smj-pg-cart .smj-cart__line{      font-weight: var(--smj-cart-body-weight, 800) !important; }
body.smj-pg-cart .smj-cart__count{     font-weight: var(--smj-cart-body-weight, 600) !important; }
body.smj-pg-cart .smj-cart__continue{  font-weight: var(--smj-cart-body-weight, 600) !important; }
body.smj-pg-cart .smj-cart__linelbl{   font-weight: var(--smj-cart-body-weight, 600) !important; }

/* Summary rows: label, value, and the emphasised Total row. Specificity is
   raised to (0,3,2)/(0,4,2) so these beat the base v2 rules above. */
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow > span{
  font-weight: var(--smj-cart-body-weight, 400) !important;
}
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow > span:last-child{
  font-weight: var(--smj-cart-body-weight, 600) !important;
}
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow--total,
body.smj-pg-cart .smj-cart--v2 .smj-cart__trow--total > span{
  font-weight: var(--smj-cart-body-weight, 800) !important;
}