/*
 * FluentCart skin -- the Gombeke dark system applied to FluentCart's storefront,
 * cart, checkout, receipt, and customer-profile output. Scoped to body.gmb-store
 * so it never touches marketing pages. Tokens only; no layout fights, no forced
 * override walls. FluentCart's exact class names vary by version, so selectors are broad
 * and commented; tighten them against the live plugin on deploy (see build-log
 * deploy checklist). Every rule targets a real, documented surface OR a generic
 * form/table element inside the store scope.
 */

/* Page ground + base text */
body.gmb-store { background: var(--gmb-ground); color: var(--gmb-ink); }
body.gmb-store h1, body.gmb-store h2, body.gmb-store h3, body.gmb-store h4 { color: var(--gmb-ink); letter-spacing: -0.02em; }
/* Store links go amber -- but NOT theme buttons (a.gmb-btn), or a primary
   button would get amber text on its amber fill (invisible). */
body.gmb-store a:not(.gmb-btn) { color: var(--gmb-signal); }
body.gmb-store a:not(.gmb-btn):hover { color: var(--gmb-signal-hi); }

/* FluentCart wrappers inherit the chassis */
body.gmb-store [class*="fluent-cart"],
body.gmb-store [class*="fluent_cart"],
body.gmb-store [class*="fct-"],
body.gmb-store .fluent-cart { color: inherit; }

/* Panels: only the OUTERMOST summary / receipt card gets the panel box. Do NOT
   match on a broad `summary` substring -- FluentCart nests ~11 fct_summary_*
   elements (fct_checkout_summary > fct_summary > fct_summary_box >
   fct_summary_items > ...), so a wildcard border + padding compounds into a
   thin telescoping column (verified against the live checkout DOM 2026-07-18).
   FluentCart uses UNDERSCORE class names (fct_...), not hyphens. */
body.gmb-store .fct_checkout_summary,
body.gmb-store .fct_card,
body.gmb-store [class*="receipt_card"],
body.gmb-store [class*="order_receipt"] {
	background: var(--gmb-panel);
	border: 1px solid var(--gmb-line);
	border-radius: var(--gmb-r);
	box-shadow: var(--gmb-bevel);
	padding: var(--gmb-space-5);
}
/* Nested summary rows carry no box of their own -- FluentCart lays them out. */
body.gmb-store .fct_checkout_summary [class*="fct_summary"] {
	background: transparent;
	border: 0;
	padding: 0;
	box-shadow: none;
}
/* Inside the dark summary card, stock FluentCart paints a WHITE inner section
   (.fct_checkout_form_section -- only the summary-side one; the left-column
   sections are transparent) and near-black text tuned for that white. Strip
   the white and move every summary text onto the ink scale, or the card shows
   light-on-white ghost text (live DOM, 2026-07-18). */
body.gmb-store .fct_checkout_summary .fct_checkout_form_section { background: transparent; }
body.gmb-store .fct_checkout_summary,
body.gmb-store .fct_checkout_summary .fct_toggle_content { color: var(--gmb-ink); }
body.gmb-store .fct_checkout_summary .fct_item_title,
body.gmb-store .fct_checkout_summary .fct_summary_value,
body.gmb-store .fct_checkout_summary .fct_summary_items_total { color: var(--gmb-ink); }
body.gmb-store .fct_checkout_summary .fct_summary_label,
body.gmb-store .fct_checkout_summary .fct_item_variation,
body.gmb-store .fct_checkout_summary .fct_item_meta,
body.gmb-store .fct_checkout_summary .fct_item_variant_title,
body.gmb-store .fct_checkout_summary .fct_item_payment_info,
body.gmb-store .fct_checkout_summary .fct_item_payment_info span,
body.gmb-store .fct_checkout_summary .trial-days,
body.gmb-store .fct_checkout_summary .fct_coupon { color: var(--gmb-ink-soft); }
/* "Have a Coupon?" -- a light-gray pill in stock FluentCart; dark inset here. */
body.gmb-store .fct_checkout_summary .fct_coupon_toggle a {
	background: var(--gmb-panel-inset);
	color: var(--gmb-signal);
	border: 1px solid var(--gmb-line);
	border-radius: var(--gmb-r-sm);
}

/* Form controls */
body.gmb-store input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
body.gmb-store select,
body.gmb-store textarea {
	width: 100%;
	background: var(--gmb-panel-inset);
	color: var(--gmb-ink);
	border: 1px solid var(--gmb-line-hi);
	border-radius: var(--gmb-r-sm);
	padding: 0.7rem 0.85rem;
	font: inherit;
	transition: border-color var(--gmb-dur-state) ease, box-shadow var(--gmb-dur-state) ease;
}
body.gmb-store input:focus,
body.gmb-store select:focus,
body.gmb-store textarea:focus {
	outline: none;
	border-color: var(--gmb-signal);
	box-shadow: 0 0 0 3px var(--gmb-signal-a24);
}
body.gmb-store ::placeholder { color: var(--gmb-ink-mute); }
body.gmb-store label { display: block; color: var(--gmb-ink-soft); font-size: var(--gmb-text-sm); margin-bottom: var(--gmb-space-2); }

/* Primary / pay buttons */
body.gmb-store button[type="submit"],
body.gmb-store .fct-btn-primary,
body.gmb-store .fct-place-order,
body.gmb-store [class*="pay-button"],
body.gmb-store [class*="place-order"],
body.gmb-store [class*="add-to-cart"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--gmb-space-2);
	background: var(--gmb-signal);
	color: var(--gmb-ground-deep);
	border: 0;
	border-radius: var(--gmb-r-pill);
	padding: 0.85rem 1.6rem;
	font-family: var(--gmb-font-sans);
	font-weight: 600;
	cursor: pointer;
	box-shadow: inset 0 1px 0 var(--gmb-signal-hi), 0 8px 24px -14px var(--gmb-signal-a40);
	transition: background var(--gmb-dur-state) ease, box-shadow var(--gmb-dur-state) ease, transform var(--gmb-dur-state) var(--gmb-ease-out-quart);
}
body.gmb-store button[type="submit"]:hover,
body.gmb-store .fct-btn-primary:hover,
body.gmb-store .fct-place-order:hover,
body.gmb-store [class*="pay-button"]:hover,
body.gmb-store [class*="place-order"]:hover {
	background: var(--gmb-signal-hi);
	box-shadow: var(--gmb-glow-signal);
}
body.gmb-store button[type="submit"]:active { transform: translateY(1px) scale(0.99); }

/* Secondary buttons */
body.gmb-store .fct-btn:not(.fct-btn-primary),
body.gmb-store button.fct-btn-secondary {
	background: transparent;
	color: var(--gmb-ink);
	border: 1px solid var(--gmb-line-hi);
	border-radius: var(--gmb-r-pill);
	padding: 0.75rem 1.4rem;
	cursor: pointer;
}
body.gmb-store .fct-btn:not(.fct-btn-primary):hover { border-color: var(--gmb-signal-a40); color: var(--gmb-signal-hi); }

/* Tables (order summary, cart lines) rendered as a spec plate */
body.gmb-store table { width: 100%; border-collapse: collapse; }
body.gmb-store th,
body.gmb-store td { padding: 0.65rem 0; border-bottom: 1px solid var(--gmb-line); text-align: left; color: var(--gmb-ink-soft); }
body.gmb-store th {
	color: var(--gmb-ink-mute);
	font-family: var(--gmb-font-mono);
	font-size: var(--gmb-text-2xs);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 500;
}
body.gmb-store tfoot td,
body.gmb-store [class*="total"] { color: var(--gmb-ink); font-weight: 700; }
body.gmb-store [class*="total"] [class*="amount"],
body.gmb-store .fct-order-total { color: var(--gmb-signal); }

/* Product grid from the products block/shortcode -> bay-like cards. Card
   chrome goes on the CARD ROOT ONLY: .fct-product-card-title, -image-wrap,
   -prices and the view button's fct-single-product-card-view-button class all
   contain "product-card", so a [class*=] wildcard boxes every child -- the
   same telescoping failure as the checkout summary (live /shop/ DOM
   2026-07-18). Children are reset below; the view button is restyled after. */
body.gmb-store .fct-product-card,
body.gmb-store [class*="product-item"],
body.gmb-store .fct-product {
	background: var(--gmb-panel);
	border: 1px solid var(--gmb-line);
	border-radius: var(--gmb-r);
	box-shadow: var(--gmb-bevel);
	padding: var(--gmb-space-5);
	transition: transform var(--gmb-dur-state) var(--gmb-ease-out-quart), box-shadow var(--gmb-dur-state) ease, border-color var(--gmb-dur-state) ease;
}
body.gmb-store .fct-product-card:hover,
body.gmb-store .fct-product:hover {
	transform: translateY(-4px);
	border-color: var(--gmb-signal-a40);
	box-shadow: var(--gmb-bevel), var(--gmb-glow-signal);
}
body.gmb-store .fct-product-card [class*="product-card"]:not([class*="view-button"]) {
	background: transparent;
	border: 0;
	padding: 0;
	box-shadow: none;
}
body.gmb-store .fct-product-view-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	color: var(--gmb-ink);
	border: 1px solid var(--gmb-line-hi);
	border-radius: var(--gmb-r-pill);
	padding: 0.65rem 1.2rem;
	cursor: pointer;
}
body.gmb-store .fct-product-view-button:hover { border-color: var(--gmb-signal-a40); color: var(--gmb-signal-hi); }
body.gmb-store [class*="price"] { color: var(--gmb-signal); font-weight: 700; }

/* Shop grid + filter rail (the wp:fluent-cart/products block; this surface
   uses HYPHENATED fct-shop-* / fct-product-* classes, unlike the checkout's
   underscores). FluentCart's near-black filter and title text is tuned for a
   white theme and vanishes on the dark ground -- move it onto the ink scale
   (live /shop/ DOM 2026-07-18). */
body.gmb-store .fct-products-wrapper { color: var(--gmb-ink-soft); }
body.gmb-store .fct-products-wrapper .item-heading,
body.gmb-store .fct-product-card-title,
body.gmb-store .fct-product-card-title a { color: var(--gmb-ink); }
body.gmb-store .fct-products-wrapper .fct-shop-filter-toggle-button span,
body.gmb-store .fct-products-wrapper .fct-shop-checkbox span,
body.gmb-store .fct-products-wrapper .fct-shop-currency-sign,
body.gmb-store .fct-products-wrapper .fct-shop-price-range-container { color: var(--gmb-ink-soft); }

/* Notices */
body.gmb-store [class*="notice"],
body.gmb-store [class*="alert"] { border-radius: var(--gmb-r-sm); padding: var(--gmb-space-4); border: 1px solid var(--gmb-line-hi); background: var(--gmb-panel-inset); color: var(--gmb-ink-soft); }
