/**
 * Interface colors and target sizes, from the Deque audit.
 *
 * None of these is a brand color. Every value here belongs to the theme's
 * furniture - a search field's border, a submenu arrow, an accordion's plus
 * sign - and each was measured on the live sites before it was changed.
 */

/*
 * Submenu arrows in the Resource Center menu, 16x25 (Deque 2837281, 2837282).
 * WCAG 2.5.8 asks for 24x24 unless the control has space around it, and these
 * sit directly beside their link. Grown by padding so nothing reflows: the
 * arrow keeps its place, the target around it gets bigger. The theme zeroes
 * their padding from a class of its own, so these selectors pair two of the
 * element's classes to outrank it rather than reach for !important.
 */
.awb-menu__open-nav-submenu_click.awb-menu__open-nav-submenu_main,
.awb-menu__open-nav-submenu_mobile.awb-menu__open-nav-submenu_click,
.awb-menu__open-nav-submenu-hover.awb-menu__open-nav-submenu_main {
	min-width: 24px;
	min-height: 24px;
	padding-left: 4px;
	padding-right: 4px;
}

/*
 * The same arrows turned #9ea0a4 on hover and focus - 2.62:1, under the 3:1
 * WCAG 1.4.11 asks of a control's graphics (2837335). Holding the red keeps
 * them at 4.38:1 in every state and introduces no new color.
 */
[class*="awb-menu__open-nav-submenu"]:hover,
[class*="awb-menu__open-nav-submenu"]:focus,
[class*="awb-menu__open-nav-submenu"]:hover::before,
[class*="awb-menu__open-nav-submenu"]:focus::before {
	color: #ed1c24;
}

/*
 * The site search: field border 1.30:1 (2842985), placeholder 2.61:1 (2842986)
 * and the magnifier itself 2.62:1 (2842987). #767676 is the lightest gray that
 * clears 4.5:1 on white, so it covers the text cases and the graphic ones.
 *
 * The border and text come from Avada's own variables, as the Gravity Forms
 * fields do, so the values are fed in the same way rather than fought with
 * specificity; the scoping means no other form is touched. The magnifier is
 * the exception: its color sits in a style attribute, and an inline style is
 * the one thing a stylesheet cannot outrank without !important.
 */
.fusion-search-form,
.searchform,
.fusion-live-search {
	--form_border_color: #767676;
	--form_text_color: #333;
}

.fusion-search-form input[type="search"],
.fusion-search-form input[type="text"],
.fusion-live-search .fusion-search-input,
.searchform .s,
input.fusion-live-search-input {
	border-color: #767676;
}

.fusion-search-form input::placeholder,
.fusion-live-search .fusion-search-input::placeholder,
input.fusion-live-search-input::placeholder,
.searchform .s::placeholder {
	color: #767676;
	opacity: 1;
}

.fusion-search-submit.searchsubmit,
.fusion-search-form .fusion-search-button .fusion-search-submit {
	color: #767676 !important;
}

/*
 * The live-search spinner, drawn as a ring of borders at #e2e2e2 on white -
 * 1.30:1, so the one thing telling a member the search is working was close to
 * invisible (2842984).
 */
/*
 * The theme draws the spinner's moving arc from a 35%-alpha variant of its own
 * text variable, from a selector of the same weight as anything written here -
 * so the variable is what gets set, exactly as the field colors above are.
 */
.fusion-search-form,
.searchform,
.fusion-live-search {
	--form_text_color-35a: rgba(0, 0, 0, 0.55);
}

.fusion-search-form-clean .fusion-live-search .fusion-slider-loading.fusion-slider-loading {
	border-color: rgba(0, 0, 0, 0.2);
	border-top-color: #767676;
}

/*
 * The current page in the menu was marked by color alone (2842994). It is
 * already bold and already carries aria-current, so an underline is the
 * smallest addition that makes the state visible without color.
 */
li.current-menu-item > a .menu-text,
li.current_page_item > a .menu-text,
li.current-menu-item > a.awb-menu__main-a .menu-text,
li.current_page_item > a.awb-menu__main-a .menu-text {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/*
 * Accordion plus and minus signs on How It Works: white on the #f2f3f5 panel,
 * 1.11:1, so the icon that says whether a section is open or closed was all
 * but invisible (2836182). #212934 is the theme's own heading color and reads
 * 13.6:1 there. Scoped to icons with no background of their own, so the
 * accordions that draw a colored box behind the icon keep their white glyph.
 */
/*
 * Only the "unboxed" toggles: those draw the glyph straight onto the panel
 * with no box behind it, which is the case that fails. Where the theme draws a
 * colored box, the white glyph is correct and is left alone. The selector
 * matches the theme's own weight plus one class, because the color arrives
 * through --awb-icon-color rather than as a value.
 */
.fusion-accordian .fusion-toggle-icon-unboxed .panel-title a .fa-fusion-box,
.fusion-accordian .fusion-toggle-icon-unboxed .panel-title .fa-fusion-box {
	color: #212934;
}

/*
 * The slideshow's pause control (see assets/slider-a11y.js).
 *
 * Sits just above the slider, where a keyboard user reaches it before the
 * moving content rather than after it. Dark on white at 12.6:1, 32px square so
 * it clears the 24px target minimum with room to spare, and it never moves
 * with the slides.
 */
.rr-slider-pause {
	display: block;
	margin: 0 0 -40px auto;
	position: relative;
	z-index: 20;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1px solid #767676;
	border-radius: 4px;
	background: rgba(255, 255, 255, 0.92);
	color: #212934;
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
}

.rr-slider-pause:hover {
	background: #fff;
	border-color: #212934;
}

@media (max-width: 640px) {
	.rr-slider-pause {
		margin-bottom: -36px;
	}
}

/*
 * Headings that were bold paragraphs.
 *
 * On How It Works the five numbered steps looked like headings and were marked
 * up as bold text, so a screen reader could not navigate between them (Deque
 * 2836176). They are headings now, and these rules hold their previous
 * appearance: the same size and weight as the text around them, no heading
 * margins. The change is structural, not visual.
 */
h2.rr-step-heading,
h3.rr-step-heading,
h4.rr-step-heading,
h5.rr-step-heading,
.fusion-body h2.rr-step-heading,
.fusion-body h3.rr-step-heading,
.fusion-body h4.rr-step-heading,
.fusion-body h5.rr-step-heading {
	/*
	 * !important because the theme sizes headings from its own typography
	 * variables, which no amount of ordinary specificity here will outrank -
	 * and the whole point of these rules is that the text carries on looking
	 * exactly as it did when it was a bold paragraph.
	 */
	font-size: 1em !important;
	font-weight: 700 !important;
	line-height: inherit !important;
	color: inherit !important;
	margin: 0 0 0.2em !important;
	padding: 0 !important;
	text-transform: none !important;
	letter-spacing: inherit !important;
}