/*
Theme Name: CandiesWholesaler
Theme URI: https://candieswholesaler.com
Author: candieswholesaler.com
Description: Custom WooCommerce block theme for candieswholesaler.com — a US + Canada wholesale & bulk candy store specializing in imported European candy. Candy-appropriate, B2B-credible. Built from zero (FSE, theme.json v3).
Version: 0.4.21
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 8.1
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: candieswholesaler
*/

/* -------------------------------------------------------------------------
 * Supplementary CSS (tokens come from theme.json -> CSS custom properties).
 * Keep this lean; candy color + motion must stay cheap for Core Web Vitals.
 * ---------------------------------------------------------------------- */

:root {
	--r-sm: 8px;
	--r-md: 14px;
	--r-lg: 22px;
	--r-pill: 999px;
}

/* Accessibility: visible focus ring (brand-secondary). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 3px solid var(--wp--preset--color--brand-secondary);
	outline-offset: 2px;
	border-radius: var(--r-sm);
}

/* Skip link */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 10000;
	background: var(--wp--preset--color--ink);
	color: #fff;
	padding: 10px 16px;
	border-radius: 0 0 var(--r-sm) 0;
}
.skip-link:focus { left: 0; }

/* Min tap target */
.wp-block-button__link,
.cw-btn,
.menu-item > a { min-height: 44px; display: inline-flex; align-items: center; }

/* Gummy buttons: pill, layered candy shadow, springy hover. */
.wp-block-button__link,
.cw-btn {
	box-shadow: 0 4px 0 color-mix(in srgb, var(--wp--preset--color--brand-primary) 60%, #000 40%), 0 6px 14px rgba(34, 28, 36, .18);
	transition: transform 140ms cubic-bezier(.34, 1.56, .64, 1), box-shadow 140ms ease-out, background-color 140ms ease-out;
}
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
.cw-btn:hover,
.cw-btn:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 6px 0 color-mix(in srgb, var(--wp--preset--color--brand-primary) 60%, #000 40%), 0 10px 22px rgba(34, 28, 36, .24);
}
.wp-block-button__link:active,
.cw-btn:active {
	transform: translateY(2px);
	box-shadow: 0 2px 0 color-mix(in srgb, var(--wp--preset--color--brand-primary) 60%, #000 40%), 0 3px 8px rgba(34, 28, 36, .2);
}

/* Button block style variations */
.wp-block-button.is-style-secondary .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border: 2px solid var(--wp--preset--color--brand-secondary-dark);
	box-shadow: 0 4px 0 color-mix(in srgb, var(--wp--preset--color--brand-secondary-dark) 55%, #000 45%), 0 6px 14px rgba(34, 28, 36, .12);
}
.wp-block-button.is-style-secondary .wp-block-button__link:hover {
	background: var(--wp--preset--color--brand-secondary-dark);
	color: #fff;
}

/* Hero (RD-003): vibrant candy photo beside the value prop. */
.cw-hero .cw-hero-img img {
	border-radius: var(--r-lg);
	box-shadow: var(--wp--preset--shadow--card-hover);
	width: 100%;
	height: auto;
	display: block;
}
.cw-hero h1 { letter-spacing: -0.01em; }
@media (max-width: 781px) {
	.cw-hero .wp-block-column { flex-basis: 100% !important; }
	.cw-hero .cw-hero-img { margin-bottom: var(--wp--preset--spacing--50); }
}

/* Breadcrumb alignment (Alignment, UI/UX Playbook p.16–19): the Shop archive and
   the PDP render their H1 / gallery flush-left at wideSize (1200), but the shared
   breadcrumbs part is a constrained group pinned to contentSize (720) — so the trail
   sits ~240px right of the heading below it. Widen the breadcrumb group on just those
   two templates so it shares the same left edge. (Taxonomy/type pages use a centred
   cream hero and prose pages stay at 720, so both already align — leave them.) */
.post-type-archive-product main > .wp-block-template-part:has(> .cw-breadcrumbs),
.single-product main > .wp-block-template-part:has(> .cw-breadcrumbs),
.post-type-archive-product .cw-breadcrumbs > *,
.single-product .cw-breadcrumbs > * {
	max-width: var(--wp--style--global--wide-size);
}

/* Section background presets (Group block styles) */
.wp-block-group.is-style-section-cream { background: var(--wp--preset--color--brand-cream); }
.wp-block-group.is-style-section-mint  { background: var(--wp--preset--color--brand-secondary-dark); color: #fff; }
.wp-block-group.is-style-section-mint :where(h1,h2,h3,p,a) { color: #fff; }
.wp-block-group.is-style-section-holiday { background: var(--wp--preset--color--brand-plum); color: #fff; }

/* B2B value strip */
.cw-b2b-strip { background: var(--wp--preset--color--brand-secondary-dark); color: #fff; }
.cw-b2b-strip :where(p, strong, span) { color: #fff; }

/* B2B advantage bar (RD-004): 3 icon columns on a surface band. */
.cw-advantage-bar {
	border-top: 1px solid var(--wp--preset--color--border);
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.cw-advantage-bar .cw-adv-icon { margin-bottom: var(--wp--preset--spacing--30); }
.cw-advantage-bar .cw-adv-icon img { width: 72px; height: 72px; object-fit: contain; }
.cw-advantage-bar p strong {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--body);
}
.cw-advantage-bar p { color: var(--wp--preset--color--ink-soft); }
/* Keep a 2-up grid on small screens instead of a single tall stack. */
@media (max-width: 781px) {
	.cw-advantage-bar .wp-block-columns { flex-wrap: wrap !important; }
	.cw-advantage-bar .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
		flex-basis: calc(50% - var(--wp--preset--spacing--50) / 2) !important;
		flex-grow: 0;
	}
}

/* Product card hover lift */
.wc-block-grid__product,
.woocommerce ul.products li.product,
.cw-product-card {
	border-radius: var(--r-md);
	transition: transform 180ms ease-out, box-shadow 180ms ease-out;
	background: var(--wp--preset--color--surface);
}
.wc-block-grid__product:hover,
.woocommerce ul.products li.product:hover,
.cw-product-card:hover {
	transform: translateY(-2px) scale(1.01);
	box-shadow: var(--wp--preset--shadow--card-hover);
}

/* Chips / ribbons */
.cw-chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 7px 15px; border-radius: var(--r-pill);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600; line-height: 1.2;
	color: var(--wp--preset--color--ink);
	background: #fff;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--ink) 18%, transparent);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	text-decoration: none;
	transition: transform 140ms ease-out, box-shadow 140ms ease-out, border-color 140ms ease-out, color 140ms ease-out;
}
.cw-chip:hover, .cw-chip:focus-visible {
	transform: translateY(-1px);
	color: var(--wp--preset--color--brand-primary, #C5197D);
	border-color: var(--wp--preset--color--brand-primary, #C5197D);
	box-shadow: 0 3px 8px rgba(0, 0, 0, .09);
}
.cw-origin-ribbon {
	display: inline-block; padding: 2px 10px; border-radius: var(--r-pill);
	background: var(--wp--preset--color--brand-plum); color: #fff;
	font-size: var(--wp--preset--font-size--small);
}

/* Shop by Country flag cards (RD-005). */
.cw-country-cards .cw-country-card {
	display: flex; flex-direction: column; align-items: center; gap: 10px;
	width: 132px; padding: 18px 14px 16px;
	background: #fff; border-radius: var(--r-lg, 16px);
	border: 1px solid var(--wp--preset--color--border);
	box-shadow: 0 2px 6px rgba(34, 28, 36, .07);
	text-decoration: none; color: var(--wp--preset--color--ink);
	transition: transform 160ms cubic-bezier(.34, 1.56, .64, 1), box-shadow 160ms ease-out, border-color 160ms ease-out;
}
.cw-country-cards .cw-country-flag {
	display: block; width: 64px; height: 44px;
	border-radius: 6px; overflow: hidden;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .22), inset 0 0 0 1px rgba(0, 0, 0, .08);
}
.cw-country-cards .cw-country-flag svg { display: block; width: 100%; height: 100%; object-fit: cover; }
.cw-country-cards .cw-country-name {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600; line-height: 1.2; text-align: center;
}
.cw-country-cards .cw-country-card:hover,
.cw-country-cards .cw-country-card:focus-visible {
	transform: translateY(-3px);
	border-color: var(--wp--preset--color--brand-primary, #C5197D);
	box-shadow: 0 8px 18px rgba(34, 28, 36, .16);
}
.cw-country-cards .cw-country-card:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-primary, #C5197D);
	outline-offset: 2px;
}

/* Bestsellers product cards (RD-007). */
.cw-bestsellers-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--wp--preset--spacing--40);
	margin-top: var(--wp--preset--spacing--40);
}
.cw-product-card {
	display: flex; flex-direction: column;
	background: #fff; border-radius: var(--r-lg, 16px);
	border: 1px solid var(--wp--preset--color--border);
	box-shadow: 0 2px 6px rgba(34, 28, 36, .07);
	overflow: hidden;
	transition: transform 160ms cubic-bezier(.34, 1.56, .64, 1), box-shadow 160ms ease-out;
}
.cw-product-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(34, 28, 36, .16); }
.cw-product-card__media { display: block; aspect-ratio: 1 / 1; background: var(--wp--preset--color--brand-cream); }
.cw-product-card__media .cw-product-card__img,
.cw-product-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cw-product-card__body { display: flex; flex-direction: column; gap: 8px; padding: 16px 16px 18px; flex: 1 1 auto; }
.cw-product-card__title {
	margin: 0; font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--body); font-weight: 700; line-height: 1.25;
}
.cw-product-card__title a { color: var(--wp--preset--color--ink); text-decoration: none; }
.cw-product-card__title a:hover { color: var(--wp--preset--color--brand-primary); }
.cw-product-card__price { margin-top: auto; font-weight: 700; color: var(--wp--preset--color--ink); }
.cw-login-pricing {
	margin-top: auto; align-self: flex-start;
	display: inline-block; font-weight: 600; font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--brand-primary);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--brand-primary) 40%, transparent);
	border-radius: var(--r-pill); padding: 6px 14px;
	text-decoration: none; transition: background-color 140ms ease-out, color 140ms ease-out;
}
.cw-login-pricing:hover, .cw-login-pricing:focus-visible {
	background: var(--wp--preset--color--brand-primary); color: #fff;
}
@media (max-width: 781px) { .cw-bestsellers-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .cw-bestsellers-grid { grid-template-columns: 1fr; } }

/* Apply-for-pricing link (guests, wholesale-only categories) */
.cw-apply-pricing {
	display: inline-block; font-weight: 600;
	color: var(--wp--preset--color--brand-primary);
}

/* Forms (application / quote) */
.cw-wholesale-form input,
.cw-wholesale-form select,
.cw-quote-form input,
.cw-quote-form textarea {
	width: 100%; max-width: 420px; padding: 10px 12px;
	border: 1px solid var(--wp--preset--color--border); border-radius: var(--r-sm);
	font: inherit;
}
.cw-btn {
	background: var(--wp--preset--color--brand-primary); color: #fff;
	border: 0; border-radius: var(--r-pill); padding: 12px 22px;
	font-weight: 600; cursor: pointer;
}
.cw-btn:hover { background: var(--wp--preset--color--brand-primary-dark); }
.cw-notice { padding: 12px 16px; border-radius: var(--r-sm); background: var(--wp--preset--color--brand-cream); border: 1px solid var(--wp--preset--color--border); }
.cw-notice--success { background: #e9f7ee; border-color: var(--wp--preset--color--success); }

/* Brand lockup (header): small candy tile + Poppins wordmark */
.cw-brand .wp-block-site-logo img,
.cw-brand .custom-logo,
.custom-logo { height: 44px; width: auto; border-radius: 10px; }
.cw-brand .wp-block-site-title { margin: 0; }
.cw-brand .wp-block-site-title a {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700; font-size: var(--wp--preset--font-size--h3);
	color: var(--wp--preset--color--ink); text-decoration: none; letter-spacing: -0.01em;
}

/* Sticky header (RD-010). The header template-part renders a wrapping
   <header class="wp-block-template-part"> around .cw-header; position:sticky must
   sit on that wrapper (the inner element's parent box is only header-height tall,
   so sticking the inner alone lets it scroll away). */
.wp-block-template-part:has(> .cw-header--sticky) {
	position: sticky; top: 0; z-index: 100;
}
.cw-header--sticky {
	box-shadow: 0 1px 0 var(--wp--preset--color--border);
	transition: box-shadow 180ms ease-out;
}
.cw-header--sticky.cw-header--scrolled {
	box-shadow: 0 4px 18px rgba(34, 28, 36, .12);
	backdrop-filter: saturate(1.1);
}
.cw-header .wp-block-navigation a:where(:hover, :focus-visible) {
	color: var(--wp--preset--color--brand-primary);
}
.cw-header .wp-block-navigation .current-menu-item > a,
.cw-header .wp-block-navigation [aria-current] {
	color: var(--wp--preset--color--brand-primary); font-weight: 600;
}
.cw-header-actions .wp-block-loginout a { text-decoration: none; font-weight: 600; }
.cw-header-actions .wp-block-woocommerce-customer-account {
	display: inline-flex; align-items: center; gap: 6px;
	color: var(--wp--preset--color--ink); font-weight: 600;
	font-size: var(--wp--preset--font-size--small); text-decoration: none; white-space: nowrap;
}
.cw-header-actions .wp-block-woocommerce-customer-account:where(:hover, :focus-visible) { color: var(--wp--preset--color--brand-primary); }
.cw-header-actions .wp-block-woocommerce-customer-account svg { width: 24px; height: 24px; fill: currentColor; }
.cw-header-actions .wc-block-mini-cart__button { color: var(--wp--preset--color--ink); }
.cw-header-actions .wc-block-mini-cart__badge {
	background: var(--wp--preset--color--brand-primary); color: #fff;
}
.cw-header .wp-block-search { width: auto; }
.cw-header .wp-block-search .wp-block-search__inside-wrapper { width: clamp(150px, 18vw, 240px); }
.cw-header .wp-block-search__input { border-radius: var(--r-pill); }
.cw-header .wp-block-search__button {
	border-radius: var(--r-pill); background: var(--wp--preset--color--brand-primary); color: #fff;
}
/* Keep brand / nav / actions on one row at desktop; let the nav flex-shrink first. */
@media (min-width: 782px) {
	.cw-header > .alignwide { flex-wrap: nowrap; }
	.cw-header > .alignwide > .wp-block-navigation { flex: 1 1 auto; min-width: 0; }
	.cw-header > .alignwide > .wp-block-navigation .wp-block-navigation__container {
		gap: 0 var(--wp--preset--spacing--40);
	}
	.cw-header > .alignwide > .cw-brand,
	.cw-header > .alignwide > .cw-header-actions,
	.cw-header > .alignwide > .wp-block-woocommerce-customer-account { flex: 0 0 auto; }
}
/* Mobile nav overlay: breathing room so links aren't flush to the edge. */
.cw-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}
.cw-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--40);
}

/* Candy card (group style) */
.wp-block-group.is-style-cw-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--r-md);
	padding: var(--wp--preset--spacing--50);
	box-shadow: var(--wp--preset--shadow--card);
	transition: transform 180ms ease-out, box-shadow 180ms ease-out;
	height: 100%;
}
.wp-block-group.is-style-cw-card:hover { transform: translateY(-2px); box-shadow: var(--wp--preset--shadow--card-hover); }

/* Category card (color-filled) */
/* Glossy candy color tiles (RD-006). Inline style sets the real taxonomy
   color; the ::before glaze layers a glassy sheen on top without clobbering it. */
.cw-cat-card {
	position: relative; overflow: hidden;
	width: 100%; box-sizing: border-box;
	border-radius: var(--r-lg);
	padding: var(--wp--preset--spacing--50);
	min-height: 140px;
	display: flex; flex-direction: column; justify-content: flex-end;
	color: var(--wp--preset--color--ink);
	box-shadow: 0 6px 16px rgba(34, 28, 36, .14), inset 0 1px 0 rgba(255, 255, 255, .35);
	transition: transform 200ms cubic-bezier(.34, 1.56, .64, 1), box-shadow 200ms ease-out;
	text-decoration: none;
}
.cw-cat-card::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit;
	background: linear-gradient(160deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .12) 34%, rgba(255, 255, 255, 0) 56%);
	pointer-events: none;
}
.cw-cat-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(34, 28, 36, .22), inset 0 1px 0 rgba(255, 255, 255, .45);
}
.cw-cat-card .cw-cat-label,
.cw-cat-card .cw-cat-count { position: relative; z-index: 1; }
.cw-cat-card .cw-cat-label { display: block; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: var(--wp--preset--font-size--h3); line-height: 1.1; }
.cw-cat-card .cw-cat-count { display: block; margin-top: 2px; font-size: var(--wp--preset--font-size--small); opacity: .85; }
/* dark-text vs light-text per contrast rule */
.cw-cat-card.cw-on-dark, .cw-cat-card.cw-on-dark * { color: #fff; }

/* Prose width for category copy */
.cw-prose { max-width: 68ch; }

/* GEO/AEO answer-first callout (US-087): concise, citable lead answer above the intro. */
.cw-answer {
	max-width: 68ch;
	margin: 0 auto var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--cream, #fff8ef);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--brand-plum, #6d2e6b) 18%, transparent);
	border-inline-start: 4px solid var(--wp--preset--color--brand-plum, #6d2e6b);
	border-radius: 12px;
	text-align: start;
}
.cw-answer__label {
	margin: 0 0 .25rem;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--small);
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--wp--preset--color--brand-plum, #6d2e6b);
}
.cw-answer p:last-child { margin-bottom: 0; }

/* Citable comparison tables (US-087): LLMs cite well-structured HTML tables in the prose. */
.cw-prose table {
	width: 100%;
	border-collapse: collapse;
	margin: var(--wp--preset--spacing--40) 0;
	font-size: var(--wp--preset--font-size--small);
}
.cw-prose th,
.cw-prose td {
	border: 1px solid color-mix(in srgb, currentColor 14%, transparent);
	padding: .6rem .8rem;
	text-align: start;
	vertical-align: top;
}
.cw-prose thead th {
	background: var(--wp--preset--color--cream, #fff8ef);
	font-family: var(--wp--preset--font-family--display);
}
.cw-prose tbody tr:nth-child(even) td {
	background: color-mix(in srgb, var(--wp--preset--color--cream, #fff8ef) 50%, transparent);
}

/* Blog/guide template (US-041): byline row + related-guides grid */
.cw-byline { gap: .5rem; align-items: baseline; margin-top: .5rem; }
.cw-byline p { margin: 0; }
.cw-guide-grid { gap: var(--wp--preset--spacing--40); }
.cw-guide-grid .wp-block-post-title { margin: 0 0 .35rem; line-height: 1.2; }
.cw-guide-grid .wp-block-post-excerpt { margin: 0; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-soft, #5b5b5b); }
.cw-guide-grid .wp-block-post-excerpt__more-link { display: inline-block; margin-top: .35rem; font-weight: 600; }
/* Guide prose vertical rhythm */
.cw-prose.wp-block-group > * { margin-block: var(--wp--preset--spacing--30); }
.cw-prose h2 { margin-top: var(--wp--preset--spacing--50); }

/* PDP spec table (US-039): only-known-rows product specifications */
.cw-spec-table {
	width: 100%;
	border-collapse: collapse;
	margin: var(--wp--preset--spacing--40) 0;
	font-size: var(--wp--preset--font-size--small);
}
.cw-spec-table th,
.cw-spec-table td {
	border: 1px solid var(--wp--preset--color--border);
	padding: .6rem .8rem;
	text-align: start;
	vertical-align: top;
}
.cw-spec-table th {
	width: 38%;
	background: var(--wp--preset--color--brand-cream);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
}

/* PDP detail tabs (RD-012). Progressive enhancement: stacked headed sections by
   default; the .cw-tabs__list is revealed by JS into a WAI-ARIA tablist. */
.cw-tabs { margin: var(--wp--preset--spacing--40) 0; }
.cw-tabs__list {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	border-bottom: 1px solid var(--wp--preset--color--border);
	margin-bottom: var(--wp--preset--spacing--40);
}
.cw-tabs__tab {
	appearance: none;
	background: transparent;
	border: 0;
	border-bottom: 3px solid transparent;
	margin-bottom: -1px;
	padding: .6rem .9rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 600;
	color: var(--wp--preset--color--ink-soft);
	cursor: pointer;
	transition: color 140ms ease-out, border-color 140ms ease-out;
}
.cw-tabs__tab:hover { color: var(--wp--preset--color--ink); }
.cw-tabs__tab[aria-selected="true"] {
	color: var(--wp--preset--color--brand-primary);
	border-bottom-color: var(--wp--preset--color--brand-primary);
}
.cw-tabs__tab:focus-visible {
	outline: 3px solid var(--wp--preset--color--brand-secondary);
	outline-offset: 2px;
}
.cw-tabs__panel { color: var(--wp--preset--color--ink); }
.cw-tabs__panel > * + * { margin-top: var(--wp--preset--spacing--30); }
/* When JS upgrades the tablist, the per-panel heading is redundant with the tab label. */
.cw-tabs__list:not([hidden]) ~ .cw-tabs__panel .cw-tabs__panel-title {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}

/* Related-products carousel (RD-012): horizontal scroll-snap, CSS-only. Targets the
   product-collection's post-template list (legacy related-products block is deprecated). */
.cw-related-carousel { margin-top: var(--wp--preset--spacing--70); }
.cw-related-carousel .cw-related-track {
	display: flex !important;
	grid-template-columns: none !important;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0 0 var(--wp--preset--spacing--20);
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}
.cw-related-carousel .cw-related-track > li {
	flex: 0 0 clamp(180px, 44%, 248px);
	scroll-snap-align: start;
	margin: 0;
}
.cw-related-carousel .cw-related-track > li img { width: 100%; height: auto; border-radius: 14px; }

/* Deep footer (RD-009). */
.cw-footer .cw-footer-brand {
	font-family: var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--brand-cream); margin: 0 0 8px;
}
.cw-footer .cw-footer-top { text-align: left; }
.cw-footer .cw-footer-brand, .cw-footer .cw-footer-tagline { margin-left: 0 !important; margin-right: auto !important; }
.cw-footer .cw-footer-tagline { max-width: 60ch; color: color-mix(in srgb, var(--wp--preset--color--brand-cream) 82%, transparent); }
.cw-footer .cw-footer-h {
	text-transform: uppercase; letter-spacing: .06em; font-weight: 700;
	color: var(--wp--preset--color--brand-accent);
	margin: 0 0 12px; padding-bottom: 8px;
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--brand-cream) 22%, transparent);
}
.cw-footer .cw-footer-links { list-style: none; margin: 0; padding: 0; }
.cw-footer .cw-footer-links li { margin: 0 0 8px; }
.cw-footer .cw-footer-links a {
	color: color-mix(in srgb, var(--wp--preset--color--brand-cream) 88%, transparent);
	text-decoration: none; transition: color 140ms ease-out;
}
.cw-footer .cw-footer-links a:hover,
.cw-footer .cw-footer-links a:focus-visible { color: #fff; text-decoration: underline; }
.cw-footer .cw-footer-note { color: color-mix(in srgb, var(--wp--preset--color--brand-cream) 70%, transparent); margin-top: 4px; }
.cw-footer .cw-footer-trust {
	margin-top: var(--wp--preset--spacing--60);
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--brand-cream) 18%, transparent);
	gap: 10px 22px;
}
.cw-footer .cw-footer-trust p {
	margin: 0; position: relative; padding-left: 22px;
	color: color-mix(in srgb, var(--wp--preset--color--brand-cream) 80%, transparent);
}
.cw-footer .cw-footer-trust p::before {
	content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
	width: 12px; height: 12px; border-radius: 50%;
	background: var(--wp--preset--color--brand-secondary);
}
.cw-footer .cw-footer-copy {
	margin-top: var(--wp--preset--spacing--40);
	color: color-mix(in srgb, var(--wp--preset--color--brand-cream) 64%, transparent);
}

/* -------------------------------------------------------------------------
 * RD-011 — B2B category / listing template (filters · sort · gated cards).
 * ---------------------------------------------------------------------- */
.cw-listing-bar {
	margin-bottom: var(--wp--preset--spacing--40);
	padding-bottom: var(--wp--preset--spacing--30);
	border-bottom: 1px solid var(--wp--preset--color--border);
	gap: 12px 20px;
}
.cw-listing-bar .woocommerce-result-count,
.cw-listing-bar .wc-block-product-results-count {
	margin: 0;
	color: var(--wp--preset--color--ink-soft);
	font-size: var(--wp--preset--font-size--small);
}
.cw-listing-bar .orderby,
.cw-listing-bar select {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--r-pill);
	padding: 8px 14px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
}

/* Filters sidebar */
.cw-listing-filters .cw-filters-title { margin: 0 0 var(--wp--preset--spacing--30); }
.cw-listing-filters .wp-block-woocommerce-active-filters,
.cw-listing-filters .wp-block-woocommerce-price-filter,
.cw-listing-filters .wp-block-woocommerce-attribute-filter {
	margin-bottom: var(--wp--preset--spacing--40);
	padding-bottom: var(--wp--preset--spacing--40);
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.cw-listing-filters h3 {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	margin: 0 0 12px;
}
.cw-listing-filters .wc-block-components-checkbox__label,
.cw-listing-filters label { font-size: var(--wp--preset--font-size--small); }
.cw-listing-filters .wc-block-components-filter-submit-button,
.cw-listing-filters .wc-block-components-price-slider__button {
	border-radius: var(--r-pill);
	background: var(--wp--preset--color--brand-primary);
	color: #fff;
	border: 0;
}
.cw-listing-filters .wc-block-active-filters__list .wc-block-active-filters__list-item-remove,
.cw-listing-filters .wc-block-components-chip {
	border-radius: var(--r-pill);
}

/* B2B product card */
.cw-b2b-grid { gap: var(--wp--preset--spacing--40); }
.cw-b2b-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 16px;
	height: 100%;
	transition: box-shadow 160ms ease-out, transform 160ms ease-out;
}
.cw-b2b-card:hover {
	box-shadow: 0 8px 24px rgba(34,28,36,.10);
	transform: translateY(-2px);
}
.cw-b2b-card .wp-block-post-featured-image { margin: 0; }
.cw-b2b-card .wp-block-post-featured-image img { width: 100%; height: auto; }
.cw-b2b-card .wp-block-post-title {
	margin: 0;
	font-weight: 600;
	line-height: 1.25;
}
.cw-b2b-card .wp-block-post-title a { text-decoration: none; }
.cw-b2b-card .wp-block-post-title a:where(:hover, :focus-visible) {
	color: var(--wp--preset--color--brand-primary);
}

/* Card meta: SKU / MOQ / price */
.cw-card-meta { margin-top: auto; display: flex; flex-direction: column; gap: 6px; }
.cw-card-specs {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	margin: 0;
	font-size: var(--wp--preset--font-size--eyebrow, .72rem);
	color: var(--wp--preset--color--ink-soft);
	text-transform: uppercase;
	letter-spacing: .04em;
}
.cw-card-price { font-weight: 700; }
.cw-card-price .price,
.cw-card-price ins { color: var(--wp--preset--color--ink); }
.cw-login-pricing {
	display: inline-block;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--brand-primary);
	text-decoration: none;
}
.cw-login-pricing:where(:hover, :focus-visible) { text-decoration: underline; }
.cw-card-btn .wp-block-button__link,
.cw-b2b-card .wc-block-components-product-button .wp-block-button__link {
	width: 100%;
	border-radius: var(--r-pill);
}

/* Responsive: stack filters above the grid on small screens */
@media (max-width: 781px) {
	.cw-listing-cols { flex-wrap: wrap; }
	.cw-listing-cols > .cw-listing-filters,
	.cw-listing-cols > .cw-listing-main { flex-basis: 100% !important; }
	.cw-b2b-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 480px) {
	.cw-b2b-grid { grid-template-columns: 1fr !important; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
	* { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}