/**
 * Accessibility layer for the Maxxam theme.
 *
 * Hand-authored, loaded after the compiled main bundle (main.min.css) so it can
 * correct WCAG 2.1 AA / Section 508 issues without rebuilding the MDB/Bootstrap
 * bundle. Mirror of src/css/custom/_accessibility.scss.
 *
 * Covers: screen-reader-only text, skip link, visible keyboard focus,
 * AA-compliant link contrast, reduced-motion handling and the GSAP reveal
 * fallback, plus the carousel pause/play control.
 */

/* -------------------------------------------------------------------------
 * 1. Screen-reader-only text + skip link
 * ---------------------------------------------------------------------- */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	position: absolute !important;
	word-wrap: normal !important;
	white-space: nowrap;
}

/* When a screen-reader element receives focus (e.g. the skip link) it must
   become visible for sighted keyboard users. */
.screen-reader-text:focus,
.skip-link:focus {
	background-color: #ffffff;
	color: #002d4d;
	clip: auto !important;
	-webkit-clip-path: none;
	clip-path: none;
	display: inline-block;
	height: auto;
	width: auto;
	left: 1rem;
	top: 1rem;
	padding: 0.75rem 1.25rem;
	font-size: 1rem;
	font-weight: 700;
	line-height: normal;
	text-decoration: none;
	z-index: 100000;
	border-radius: 0;
	box-shadow: 0 0 0 3px #ffffff, 0 0 0 6px #002d4d;
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
}

/* The fixed navbar would otherwise cover the focused main region after a skip. */
#main {
	scroll-margin-top: 130px;
}

#main:focus {
	outline: none;
}

/* -------------------------------------------------------------------------
 * 2. Visible keyboard focus (WCAG 2.4.7)
 *    A white + dark double-ring stays visible on both light and dark
 *    backgrounds used throughout the theme.
 * ---------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
.nav-link:focus-visible,
.dropdown-item:focus-visible,
.page-link:focus-visible,
.swiper-button-next:focus-visible,
.swiper-button-prev:focus-visible,
.swiper-pagination-bullet:focus-visible {
	outline: 3px solid #002d4d !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 3px #ffffff !important;
	border-radius: 1px;
}

/* The theme sets `.btn { box-shadow: none !important; }`, which removes the
   default focus ring. Restore a high-contrast ring for buttons specifically. */
.btn:focus-visible {
	outline: 3px solid #ffffff !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 3px #002d4d, 0 0 0 6px #ffffff !important;
}

/* Fallback for browsers without :focus-visible support. */
.no-focus-visible a:focus,
.no-focus-visible button:focus,
.no-focus-visible input:focus,
.no-focus-visible select:focus,
.no-focus-visible textarea:focus {
	outline: 3px solid #002d4d;
	outline-offset: 2px;
}

/* -------------------------------------------------------------------------
 * 3. Link contrast & distinguishability (WCAG 1.4.3 / 1.4.1)
 *    The theme link colour (#45afe3) only reaches ~2.6:1 on white, so darken
 *    text links inside content areas and underline them so they are not
 *    distinguished by colour alone.
 * ---------------------------------------------------------------------- */
.entry-content a:not(.btn):not([class*="text-light"]),
.block-postcontent a:not(.btn),
.block-contentlist .content a:not(.btn),
.block-imagecontent .content a:not(.btn),
.card-text a:not(.btn),
.page-content a:not(.btn) {
	color: #235a91;
	text-decoration: underline;
}

.entry-content a:not(.btn):hover,
.block-postcontent a:not(.btn):hover,
.card-text a:not(.btn):hover,
.page-content a:not(.btn):hover {
	color: #14375c;
}

/* Phone / utility links rendered with .text-primary on light backgrounds. */
a.text-primary:not(.btn) {
	color: #235a91 !important;
}

/* -------------------------------------------------------------------------
 * 4. Carousel pause / play control (WCAG 2.2.2)
 * ---------------------------------------------------------------------- */
.carousel-motion-toggle {
	position: absolute;
	bottom: 1rem;
	right: 1rem;
	z-index: 20;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.9rem;
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #002d4d;
	background: #ffffff;
	border: 2px solid #002d4d;
	border-radius: 0;
	cursor: pointer;
	line-height: 1;
}

.carousel-motion-toggle:hover {
	background: #002d4d;
	color: #ffffff;
}

/* -------------------------------------------------------------------------
 * 5. Inline SVG icons (replaces the Font Awesome web-font kit)
 *    Match Font Awesome's baseline alignment and size helpers so existing
 *    markup keeps the same visual rhythm.
 * ---------------------------------------------------------------------- */
.icon {
	display: inline-block;
	vertical-align: -0.125em;
	overflow: visible;
}

.fa-lg {
	font-size: 1.333em;
	line-height: 0.75em;
}

/* -------------------------------------------------------------------------
 * 6. Reduced motion (WCAG 2.3.3 / 2.2.2)
 * ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	/* GSAP hides .gs_reveal elements via inline opacity/visibility/transform and
	   only reveals them on scroll. Force them visible so content is never lost
	   for users who prefer reduced motion. Inline styles set by GSAP are not
	   !important, so these declarations win. */
	.gs_reveal {
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
	}
}