/**
 * chippr-2026 — the plugin surfaces' colours, restated from the palette.
 *
 * Ultimate Member and WooCommerce style their own markup. Where their colours fail contrast on this
 * site's surfaces, the value is restated here — and ONLY from a `var(--wp--preset--color--…)` preset,
 * never a literal: `check-theme.js --colors` fails a hex in any file under site/theme/.
 *
 * Measured with axe-core on the T041 staging clone and on the live site (2026-09-14):
 *
 *   Ultimate Member submit button     white on UM's light blue   2.87:1  →  white on Teal 700   7.84:1
 *   UM "Keep me signed in", "Forgot"  UM's mid grey on Cloud     3.27:1  →  Steel on Cloud      5.1:1
 *   WooCommerce inactive product tab  Woo's slate grey on Cloud  4.28:1  →  Gunmetal on Cloud  12.5:1
 *
 * (The plugins' own colours are named, not quoted: `--colors` reads comments too, and a hex in a
 * comment is indistinguishable from one in a rule.)
 *
 * `html body` raises specificity above the plugins' own selectors, and the sheet is enqueued at
 * priority 100 so it also prints after them.
 */

html body .um .um-button,
html body .um input[type="submit"].um-button,
html body .um a.um-button {
	background: var(--wp--preset--color--teal-700);
	color: var(--wp--preset--color--white);
}

html body .um .um-button:hover,
html body .um input[type="submit"].um-button:hover,
html body .um a.um-button:hover {
	background: var(--wp--preset--color--gunmetal);
	color: var(--wp--preset--color--white);
}

/* Ultimate Member prints per-form rules (`.um-<form id>.um …`) after its stylesheet, so specificity
   alone loses to it on the login form; these two declarations carry !important, and nothing else
   in this file does. */
html body div.um.um .um-link-alt,
html body div.um.um .um-field-checkbox-option {
	color: var(--wp--preset--color--steel) !important;
}

/* The block product page (`wp-block-woocommerce-product-details`, style "minimal") dims an inactive
   tab to opacity .65 on its <li> — Gunmetal text at .65 on Cloud is the 4.28:1 axe measured. The
   selector matches WooCommerce's own (`.is-style-minimal` included) so equal specificity plus a later
   print wins; the active tab keeps the style's own marker. */
html body .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li,
html body .wp-block-woocommerce-product-details ul.tabs.wc-tabs li,
html body .woocommerce div.product .woocommerce-tabs ul.tabs li {
	opacity: 1;
}

html body .wp-block-woocommerce-product-details ul.tabs.wc-tabs li a,
html body .woocommerce div.product .woocommerce-tabs ul.tabs li a {
	color: var(--wp--preset--color--gunmetal);
}

/* Printful's size-guide table carries an inline `min-width: 360px`; inside a 390px viewport's
   padding that makes the description panel a scrolling region with nothing focusable in it
   (axe `scrollable-region-focusable`). The table fits once the minimum is released. */
html body .woocommerce-Tabs-panel table#size-guide {
	min-width: 0 !important;
	width: 100%;
}