/**
 * Button "Hover color" front-end rules.
 *
 * The render hook (inc/button-hover.php) adds `data-btn-hover` ("dark" when the
 * hover text is the navy arrow color, "light" when white) plus the CSS vars
 * `--btn-hover-bg` / `--btn-hover-fg` on the button's anchor. These rules win
 * over the theme's default hover via higher specificity + !important.
 */
a.wp-block-button__link[data-btn-hover]:hover,
a.wp-block-button__link[data-btn-hover]:focus,
a.wp-block-button__link[data-btn-hover]:focus-visible,
a.wp-block-button__link[data-btn-hover]:active {
	background-color: var(--btn-hover-bg) !important;
	color: var(--btn-hover-fg) !important;
}

/* Arrow: the theme crossfades a navy (::before) and white (::after) arrow.
   Show the navy arrow when hover text is dark, the white arrow when light. */
a.wp-block-button__link[data-btn-hover="dark"]:hover::before,
a.wp-block-button__link[data-btn-hover="dark"]:focus::before,
a.wp-block-button__link[data-btn-hover="dark"]:focus-visible::before,
a.wp-block-button__link[data-btn-hover="dark"]:active::before {
	opacity: 1;
}
a.wp-block-button__link[data-btn-hover="dark"]:hover::after,
a.wp-block-button__link[data-btn-hover="dark"]:focus::after,
a.wp-block-button__link[data-btn-hover="dark"]:focus-visible::after,
a.wp-block-button__link[data-btn-hover="dark"]:active::after {
	opacity: 0;
}
a.wp-block-button__link[data-btn-hover="light"]:hover::before,
a.wp-block-button__link[data-btn-hover="light"]:focus::before,
a.wp-block-button__link[data-btn-hover="light"]:focus-visible::before,
a.wp-block-button__link[data-btn-hover="light"]:active::before {
	opacity: 0;
}
a.wp-block-button__link[data-btn-hover="light"]:hover::after,
a.wp-block-button__link[data-btn-hover="light"]:focus::after,
a.wp-block-button__link[data-btn-hover="light"]:focus-visible::after,
a.wp-block-button__link[data-btn-hover="light"]:active::after {
	opacity: 1;
}