/**
 * `.has-brand-sunrise-buttons` — add to a core/post-terms block rendered as
 * Fuse buttons (Additional CSS class(es)) to style each button with a brand
 * sky gradient and a brand border.
 *
 * Both colors read the --Brand-* scale the theme sets on .brand-cars-com /
 * .brand-dealer-inspire, so this is purple on Cars and blue on Dealer
 * Inspire. Fallbacks are the Cars purple values.
 *
 * `.has-disabled-buttons` is visual only: it turns off pointer events so the
 * buttons look like buttons but do not click or hover.
 *
 * Keep identical with the Astro mirror (backend/src/styles/brand-sunrise-buttons.css).
 */

/* [variant]:not([disabled]) raises specificity above Fuse's own
 * [variant][inverse] rules, which otherwise keep the white border/dark text. */
.has-brand-sunrise-buttons > fuse-button[variant]:not([disabled]) {
	--button-background: linear-gradient(
		2deg,
		var(--Brand-10, var(--Purple-10, #f5eefc)) 1.41%,
		var(--White, #fff) 67.44%
	);
	--button-background-hover: var(--button-background);
	--button-background-active: var(--button-background);
	--button-border-color: var(--Brand-60, var(--Purple-60, #9653e5));
	--button-border-color-hover: var(--button-border-color);
	--button-border-color-active: var(--button-border-color);
}

.has-disabled-buttons {
	pointer-events: none;
}
