/**
 * Klaviyo reviews widget — Scott's styling, captured from tonerdev (I13).
 *
 * PROVENANCE. Written by Scott on tonerdev on 2026-10-02, after the last
 * deploy, as Site Editor → Additional CSS: `styles.css` of the
 * `wp-global-styles-tonercable-2026` post. Moved here verbatim so it survives
 * a deploy and reaches every environment. Selectors and values are his;
 * only whitespace changed, plus ONE token swap (below). Nothing restyled.
 * DECISIONS.md, 2026-10-05.
 *
 * Paired with two rules he commented out in
 * plugins/ftm-klaviyo-extended/inc/frontend.php (`.kl_reviews__histogram__row`
 * and `.kl_reviews__histogram__bar--foreground`), so the row rules below are
 * not fighting the plugin's.
 *
 * TOKEN SWAP — the only one: `#0A205B` → `--wp--custom--color--base--black`,
 * which is `#0A205B` in theme.json. Every px value stayed px: the spacing and
 * font-size presets are rem, which equal these px only at a 16px root.
 *
 * ⚠ LOAD ORDER IS LOAD-BEARING. Enqueued so it prints in <head> BEFORE the
 * plugin's inline `\3c style id="ftm-klv-star-color">` (wp_head, priority 10) —
 * the same side of it that global-styles CSS printed on tonerdev. Two of
 * these declarations tie the plugin's on selector and `!important`, and the
 * plugin's later copy wins: the h2 `margin-bottom: 37px` (plugin: 15px) and,
 * under 600px, `.kl_reviews__histogram`'s `width: 344px` and `margin: 0 auto`
 * (plugin: 100% and 0). They are dead on tonerdev today and are kept dead
 * here, so the page renders as Scott left it. Moving this file after the
 * plugin's style would bring them to life and change the layout.
 *
 * Loads on product pages and product archives only — see
 * ftm_enqueue_klaviyo_reviews_styles() in includes/enqueue.php.
 */

.kl_reviews__summary.kl_reviews__summary.kl_reviews__summary h2 {
	border-bottom: none !important;
	margin-bottom: 37px;
}

/* Scott wrote this selector twice; kept as two rules, as he left it. */
/* stylelint-disable-next-line no-duplicate-selectors */
.kl_reviews__summary.kl_reviews__summary.kl_reviews__summary h2 {
	font-family: "Rethink Sans", sans-serif !important;
	font-weight: 700 !important;
	line-height: 32px !important;
	letter-spacing: -0.54px !important;
	text-transform: capitalize;
	margin-bottom: 37px !important;
}

.kl_reviews__summary__rating--1-1 {
	display: flex !important;
	flex-direction: row !important;
	align-items: center;
	gap: 35px !important;
}

.kl_reviews__summary__grid--2-1:not(.kl_preview *) .kl_reviews__summary__average_and_stars {
	margin-bottom: 24px !important;
	gap: 20px !important;
}

.kl_reviews__summary__average_and_stars {
	flex: 0 0 auto;
	align-self: center;
}

.kl_reviews__summary__stars__count {
	font-size: 14px !important;
}

.kl_reviews__histogram {
	flex: 1;
}

.kl_reviews__histogram__row {
	margin-bottom: 8px !important;
	width: 344px !important;
}

.kl_reviews__histogram__rating {
	font-size: 12px !important;
}

.kl_reviews__reviews_list.kl_reviews__reviews_list.kl_reviews__reviews_list .kl_reviews__list__tab--active::after {
	display: none !important;
}

.kl_reviews__reviews_list.kl_reviews__reviews_list.kl_reviews__reviews_list .kl_reviews__filters__pill select {
	color: var(--wp--custom--color--base--black, #0a205b) !important;
}

@media (max-width: 600px) {
	.kl_reviews__summary__rating--1-1 {
		flex-direction: column !important;
		align-items: center !important;
		gap: 0 !important;
	}

	.kl_reviews__summary__average_and_stars {
		align-items: center;
		text-align: center;
	}

	.kl_reviews__histogram {
		flex: 0 0 auto;
		width: 344px !important;
		max-width: 100%;
		margin: 0 auto !important;
	}

	.kl_reviews__histogram__row {
		width: 100% !important;
	}
}