/* =============================================================================
   ADDITIONAL CSS (Customizer)
   =============================================================================
   This file is intentionally minimal. Almost all site styles live in
   site-chrome.css (child theme), which has proper specificity to override
   Elementor defaults without needing !important hammers.

   Use this file ONLY for:
   - Quick emergency fixes that need to ship before the next code deploy
   - One-off overrides for specific pages built in Elementor
   - Testing new styles before moving them to site-chrome.css

   DO NOT add rules here that duplicate site-chrome.css. If you need to override
   something, edit site-chrome.css directly.
   ============================================================================= */

/* (add rules below as needed) */

/* Fix: FAQ and county accordion buttons turning pink on focus/hover.
   Root cause: global [type=button]:focus, button:focus rule from the
   Solace/Bootstrap base CSS sets background-color:#cc3366 (pink).
   The site-chrome.css fix cannot override it because site-chrome.css
   is bundled before the base CSS in the WPO minifier output.
   Using !important here to ensure the correct colors are used. */
.hb-faq-q:focus,
.hb-faq-q:hover,
.hb-faq-q:active {
  background: var(--white) !important;
  color: var(--navy) !important;
}

.sa-toggle:focus,
.sa-toggle:hover,
.sa-toggle:active {
  background: none !important;
  color: inherit !important;
}

/* Fix: Mobile menu accordion toggle and back-to-top button showing pink.
 *    Same root cause as above: global button:focus rule from Solace/Bootstrap
 *    base CSS sets border-color and color to #cc3366 (pink). */
.mobile-menu-toggle:focus,
.mobile-menu-toggle:hover,
.mobile-menu-toggle:active {
	  background: none !important;
	  color: var(--navy) !important;
	  border-color: transparent !important;
}

.nav-hamburger:focus,
.nav-hamburger:hover,
.nav-hamburger:active {
	  background: none !important;
	  border-color: transparent !important;
}

.back-to-top,
.back-to-top:focus,
.back-to-top:hover,
.back-to-top:active {
	  background: var(--navy) !important;
	  color: var(--white) !important;
	  border-color: transparent !important;
}

/* Fix: btn-secondary text color - force white so it's visible on dark background */
.btn-secondary,
.btn-secondary:visited,
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
	color: #ffffff !important;
}

/* Fix: CMI FAQ accordion buttons turning pink on focus/active.
   Same root cause as hb-faq-q above: global button:focus rule from
   Solace/Bootstrap base CSS sets background-color:#cc3366 (pink).
   The normal state should be transparent bg with navy text;
   the open/active state should keep the same transparent bg with gold-dark text. */
.cmi-faq-q:focus,
.cmi-faq-q:active {
  background: none !important;
  color: var(--navy) !important;
  border-color: transparent !important;
}