/* Shared colours for the theme surfaces measured in the launch audit.
 * Keep lavender decorative; use dark purple for text on white/light panels. */
#content #vsc-welcome-video-desc a,
#content #how-it-works-desc a,
#content .vscds-p1-core-card p > a,
#content .vscds-home-equipment li > a,
#content .vscds-product-details dd > a {
	color: #5f3b8c;
	text-decoration: underline;
	text-underline-offset: .16em;
}

#content #vsc-welcome-video-desc a:is(:hover, :focus-visible),
#content #how-it-works-desc a:is(:hover, :focus-visible),
#content .vscds-p1-core-card p > a:is(:hover, :focus-visible),
#content .vscds-home-equipment li > a:is(:hover, :focus-visible),
#content .vscds-product-details dd > a:is(:hover, :focus-visible) {
	color: #21152f;
}

#content .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background-color: #5f3b8c;
	color: #fff;
}

#content .wp-block-button:not(.is-style-outline) > .wp-block-button__link:is(:hover, :focus-visible) {
	background-color: #21152f;
	color: #fff;
}

.single-product.vscds-product-page div.product .summary .price {
	color: #5f3b8c;
}

.site-footer #footer-widgets,
.site-footer .site-info {
	background-color: #5f3b8c;
	color: #fff;
}

.site-footer #footer-widgets .widget-title,
.site-footer #footer-widgets .textwidget {
	color: #fff;
}

.site-footer #footer-widgets a,
.site-footer .site-info a {
	color: #fdb923;
	text-decoration: underline;
	text-underline-offset: .18em;
}

.site-footer #footer-widgets a:is(:hover, :focus-visible),
.site-footer .site-info a:is(:hover, :focus-visible) {
	color: #fff;
}

/* Related, upsell and shop-card prices: WooCommerce's default #958e09 is 3.41:1 on white. */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins,
.wc-block-grid__product-price,
.wc-block-components-product-price {
	color: #5f3b8c;
}

/* Outline buttons and default buttons use the darker brand purple so white or purple text passes AA. */
#content .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color) {
	background-color: #fff;
	color: #5f3b8c;
	border-color: currentColor;
}

#content .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color):is(:hover, :focus-visible) {
	background-color: #5f3b8c;
	color: #fff;
}

/* Links on the navy review panel: the site link colour is for light surfaces. */
.vscds-p0-visual-template .vscds-launch-review a {
	color: #fdc341;
	text-decoration: underline;
	text-underline-offset: .16em;
}

.vscds-p0-visual-template .vscds-launch-review a:is(:hover, :focus-visible) {
	color: #fff;
}

/* Cart upsell footnote: #8b8294 is 3.67:1 on white. */
.vscds-premium-care__product .vscds-premium-care__insurance-eligible--quiet {
	color: #5f5568;
}

/* Contain wide editorial comparisons without clipping their columns. */
.vscds-table-scroll {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	margin-block: 1rem;
}

.vscds-table-scroll > table {
	margin-bottom: 0;
}

/* Shared keyboard focus treatment for site content and commerce controls. */
:where(
	#page,
	.site-content,
	.woocommerce,
	.wp-site-blocks,
	.site-footer,
	.fluentform
) :where(
	a[href],
	button,
	input:not([type="hidden"]),
	select,
	textarea,
	[role="button"],
	[role="link"],
	[tabindex]:not([tabindex="-1"])
):focus-visible {
	outline: 3px solid #7551a8 !important;
	outline-offset: 3px !important;
	box-shadow: 0 0 0 2px #fff !important;
}

/* Keep focus visible against the primary purple treatment. */
:where(
	#page,
	.site-content,
	.woocommerce,
	.wp-site-blocks,
	.site-footer,
	.fluentform
) :where(
	.vscds-action--primary,
	.vscds-care-button,
	.wp-element-button,
	.button.alt
):focus-visible {
	outline-color: #f3bd45 !important;
}

@media (forced-colors: active) {
	:where(a[href], button, input, select, textarea, [role="button"], [role="link"]):focus-visible {
		outline-color: Highlight !important;
		box-shadow: none !important;
	}
}

/* WCAG 2.4.11: keep keyboard focus and anchor targets clear of the sticky header.
   frontend-accessibility.js keeps --vscds-header-height in step with the real header. */
:root {
	scroll-padding-top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--vscds-header-height, 80px) + .75rem);
}

/* The scroll padding above now clears the header, so earlier per-target offsets would double it. */
html body .vscds-launch-page h2[id],
html body .vscds-expert-pages .vscds-expert-network :is(h2, h3, [id]),
html body.single-product.vscds-product-page form.cart,
html body.admin-bar.single-product.vscds-product-page form.cart {
	scroll-margin-top: .5rem;
}

/* Variable products: WooCommerce keeps Add to cart operable (it explains which option is missing),
   so its "not ready" look still needs 4.5:1 text contrast. */
.woocommerce div.product form.cart .single_add_to_cart_button.disabled,
.woocommerce div.product form.cart .single_add_to_cart_button.wc-variation-selection-needed {
	background-color: #755c98 !important;
	border-color: #755c98 !important;
	color: #fff !important;
	opacity: 1 !important;
	cursor: not-allowed;
}

/* Complianz preferences: "Always active" label was 3.7:1. */
.cmplz-cookiebanner .cmplz-always-active {
	color: #1b6b1b !important;
}