/* =========================================================================
   EnableUser Accessibility Fixes  -  a11y-fixes.css
   -------------------------------------------------------------------------
   Only structural / non-colour-value fixes live here. All colour-contrast
   recolouring is done at runtime in a11y-fixes.js so that ONLY the exact
   pixels that fail WCAG are touched (nothing else in the design changes).
   ========================================================================= */

/* -------------------------------------------------------------------------
   WCAG 1.4.3 Contrast - colour boxes / buttons
   Essential Addons flip-boxes and Elementor buttons set their brand colour
   with the `background` shorthand + a 0.5s transition. That transition sits
   above !important in the cascade, so a runtime darken would be ignored.
   Disabling the transition on these widgets lets the JS apply a WCAG-passing
   (slightly darker, same-hue) background. The flip animation itself lives on
   a different element and is unaffected.
   ------------------------------------------------------------------------- */
.eael-elements-flip-box-front-container,
.eael-elements-flip-box-back-container,
.eael-elements-flip-box-rear-container,
.flipbox-button,
.elementor-button {
	transition: none !important;
}

/* -------------------------------------------------------------------------
   WCAG 1.4.1 Use of Color  (link-in-text-block)
   Body-copy links inside Elementor text widgets / post content must be
   distinguishable from surrounding text by more than colour alone.
   We add an underline ONLY to in-content text links (not buttons, not
   nav, not icon links) so link recognition no longer relies on colour.
   ------------------------------------------------------------------------- */
.elementor-widget-text-editor .elementor-widget-container a:not(.elementor-button):not([role="button"]):not(.wp-block-button__link),
.entry-content p a:not(.elementor-button):not([role="button"]),
.entry-content li a:not(.elementor-button):not([role="button"]),
.sp-pcp-post-content p a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Keep buttons / call-to-action widgets visually unchanged (no underline). */
.elementor-button,
.elementor-button:hover,
a.elementor-button .elementor-button-text {
	text-decoration: none;
}

/* -------------------------------------------------------------------------
   Hero rotating headline clipping fix
   The homepage hero uses an Elementor Image Carousel (swiper-fade) whose
   caption text is 45px but inherits a 24.75px line-height, while the swiper
   wrapper is `overflow:hidden` and locked to that 24.75px line box - so the
   tall letters get cut in half. We give the caption a proper line-height and
   let the carousel size to its content so the full text shows. Layout and
   text are unchanged; the heading is simply no longer cropped.
   ------------------------------------------------------------------------- */
.elementor-image-carousel-caption {
	line-height: 1.3 !important;
}
.elementor-image-carousel-wrapper.swiper {
	overflow: visible !important;
}
.elementor-image-carousel-wrapper .swiper-wrapper,
.elementor-image-carousel-wrapper .swiper-slide {
	height: auto !important;
	min-height: 1.3em;
}

/* -------------------------------------------------------------------------
   Safety net: a visible keyboard focus indicator. This does not alter the
   default (mouse) appearance of any element - it only shows an outline when
   an element is focused via the keyboard, improving 2.4.7 robustness.
   ------------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.elementor-button:focus-visible {
	outline: 2px solid #005fcc !important;
	outline-offset: 2px !important;
}

/* Skip-link: give it a high-contrast colour (it is clipped off-screen until
   focused; this keeps it accessible to contrast checkers and on focus). */
.skip-link,
a.skip-link.screen-reader-text {
	color: #ffffff !important;
	background-color: #001127 !important;
}
.skip-link:focus,
a.skip-link.screen-reader-text:focus {
	background-color: #001127 !important;
	color: #ffffff !important;
	padding: 8px 16px !important;
	z-index: 100000 !important;
}

/* Visually-hidden helper (used by the JS for any text it needs to expose
   to assistive tech without changing the visual design). */
.eua11y-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
