/**
 * Microcurves Accessibility Fixes — stylesheet  (v1.1.0)
 * Remediates colour-contrast, non-text-control-contrast, distinguishable-link,
 * focus-visibility and required-field indication findings.
 *
 * v1.1 change log:
 *  - FOOTER FIX: v1.0 forced brand teal onto the dark footer (#313b48),
 *    creating ~195 new contrast failures. Teal recolouring is now scoped to
 *    LIGHT contexts only; footer links use a light on-dark teal (#7fd4dc).
 *  - Breadcrumb grey (#a1a1a1, class-based) and current-menu / nav links and
 *    the .email accent are now targeted directly.
 *  - Added .mctf-marquee scroller styles (replacement for <marquee>).
 *
 * All rules use !important deliberately: they must override theme / page-builder
 * inline colours. Colours meet WCAG 2.1 SC 1.4.3 (>= 4.5:1) — ratios noted inline.
 */

:root {
	--mctf-teal: #037a83;        /* light-bg link teal — 5.1:1 on #fff, 4.52:1 on #f1f1f1 */
	--mctf-teal-dark: #026e75;
	--mctf-teal-light: #7fd4dc;  /* footer link teal — 6.68:1 on #313b48 */
	--mctf-grey: #6e6e6e;        /* was #a1a1a1 — 4.89:1 on #fafafa */
	--mctf-orange: #b8460a;      /* was #d35400 — 5.36:1 on #fff */
	--mctf-focus: #b8460a;
}

/* ==========================================================================
   1. COLOUR CONTRAST  (SC 1.4.3)
   ========================================================================== */

/* 1a. Light-context links that used the brand teal (phone, e-mail, file links,
   "Read and Download" links, in-content links, table links, main navigation
   and the current page item). These sit on white / #f1f1f1 backgrounds.
   NOTE: footer is re-coloured separately in 1b and wins via later + specific
   selectors, so these do NOT affect the dark footer. */
a[href^="tel:"],
a[href^="mailto:"],
a[href^="tel:"] i,
a[href^="mailto:"] i,
.textwidget a,
.contact-info a,
.contact-info a i,
.entry-content a,
.post-content a,
td a,
td a i,
.main-navigation a,
#site-navigation a,
.menu > li > a,
a[aria-current="page"] {
	color: var(--mctf-teal) !important;
}

/* Font Awesome brand-teal icons used as decorative colour throughout. */
.fa.fa-phone,
.fa.fa-envelope,
.fa.fa-file,
.fa.fa-map-marker,
.fa.fa-angle-down,
.fa.fa-angle-up {
	color: inherit !important;
}

/* 1b. FOOTER — dark background (#313b48). Links here must be LIGHT.
   Placed AFTER 1a and with equal-or-higher specificity so it overrides the
   generic teal for any link inside the footer (including .textwidget /
   .contact-info widgets that live in the footer). */
.site-footer a,
.site-footer a i,
footer a,
footer a i,
footer .textwidget a,
footer .contact-info a,
footer .contact-info a i,
.site-footer .textwidget a,
[class*="footer"] a,
[class*="footer"] a i {
	color: var(--mctf-teal-light) !important;
}

/* 1c. Breadcrumb trail grey (#a1a1a1 -> #6e6e6e). Class-based, not inline. */
.trail-items span,
.trail-item span,
.trail-home span,
.trail-end span,
[class*="trail"] span,
.breadcrumb span,
.breadcrumbs span,
.breadcrumb a,
.breadcrumbs a {
	color: var(--mctf-grey) !important;
}

/* 1d. Accent orange e-mail text / links. */
.email,
[style*="color:#d35400"],
[style*="color: #d35400"],
a[style*="d35400"] {
	color: var(--mctf-orange) !important;
}

/* 1g. Two footer exceptions where the background is NOT the dark slate, so the
   light footer teal (1b) would fail:
   - SEBI quick-link buttons sit on an ORANGE gradient -> use dark text
     (#1a1a1a on orange = 6.0:1). Higher specificity than 1b's "footer a".
   - The copyright bar sits on WHITE -> use dark teal (#037a83 = 5.1:1). */
.wp-block-button__link.has-background,
.wp-block-button__link.has-background strong,
.wp-block-button__link.has-background * {
	color: #1a1a1a !important;
}

div[color="white"] > a,
div[color="white"] a {
	color: var(--mctf-teal) !important;
}

/* 1h. Default WordPress comment-form helper text / labels (grey too light). */
.comment-form label,
.comment-form #email-notes,
.comment-form .required-field-message,
#email-notes,
.required-field-message {
	color: #4a4a4a !important;
}

/* 1e. Buttons / badges that put WHITE text on the light teal background
   (#ffffff on #05abb7 == 2.7:1). Darken the background so white passes. */
button,
.wp-block-file a[download] button,
.document-icon-row button,
input[type="submit"],
input[type="button"],
.evf-submit-button,
.everest-forms .evf-submit,
a[style*="05abb7"],
[style*="background:#05abb7"],
[style*="background-color:#05abb7"],
[style*="background: #05abb7"],
[style*="background-color: #05abb7"] {
	background-color: var(--mctf-teal) !important;
	color: #ffffff !important;
	border-color: var(--mctf-teal-dark) !important;
}

/* 1f. Muted grey helper text set via inline style. */
[style*="color:#a1a1a1"],
[style*="color: #a1a1a1"],
small.text-muted {
	color: var(--mctf-grey) !important;
}

/* ==========================================================================
   2. NON-TEXT CONTROL CONTRAST  (SC 1.4.11)
   ========================================================================== */

input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.input-text,
.everest-forms input,
.everest-forms select,
.everest-forms textarea {
	border: 1px solid #6e6e6e !important;
}

input[type="checkbox"],
input[type="radio"] {
	outline: 1px solid #6e6e6e;
	outline-offset: 0;
}

/* ==========================================================================
   3. DISTINGUISHABLE LINKS  (SC 1.4.1)
   Underline links inside body content (excludes chrome / icon / image links).
   ========================================================================== */

.textwidget a:not(.wp-block-file a):not([role="button"]),
.entry-content a,
.post-content a,
p a[href^="http"],
td a[href^="http"] {
	text-decoration: underline !important;
}

.textwidget a:has(> img),
.contact-info a,
a.custom-logo-link,
.logo-image a {
	text-decoration: none !important;
}

/* ==========================================================================
   4. VISIBLE FOCUS  (SC 2.4.7)
   ========================================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.mctf-toggle:focus-visible,
summary:focus-visible {
	outline: 3px solid var(--mctf-focus) !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 2px #ffffff !important;
}

a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
	outline: 3px solid var(--mctf-focus);
	outline-offset: 2px;
}

/* ==========================================================================
   5. SKIP LINK  (SC 2.4.1)
   ========================================================================== */

.mctf-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	padding: 12px 20px;
	background: #ffffff;
	color: #037a83;
	font-weight: 700;
	text-decoration: underline;
	border: 2px solid #037a83;
}

.mctf-skip-link:focus {
	left: 8px;
	top: 8px;
}

/* ==========================================================================
   6. REQUIRED-FIELD INDICATION  (SC 3.3.2)
   ========================================================================== */

.mctf-required-star {
	color: #b8460a;
	font-weight: 700;
	margin-left: 2px;
}

.mctf-required-hint {
	display: block;
	font-size: 0.85em;
	color: #6e6e6e;
	margin-bottom: 8px;
}

/* ==========================================================================
   7. MOVING-CONTENT CONTROLS + MARQUEE REPLACEMENT  (SC 2.2.2)
   The <marquee> element is replaced by JS with .mctf-marquee (a div-based
   scroller) so the deprecated auto-moving element no longer exists. Motion is
   CSS-driven and pausable, and stops entirely under reduced-motion.
   ========================================================================== */

.mctf-motion-toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 6px 8px;
	padding: 6px 12px;
	background: #037a83;
	color: #ffffff;
	border: 2px solid #026e75;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
}

.mctf-motion-toggle:hover {
	background: #026e75;
}

/* Marquee replacement: a clipping viewport with an animated inner track. */
.mctf-marquee {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	position: relative;
	width: 100%;
	box-sizing: border-box;
}

.mctf-marquee__track {
	display: inline-block;
	white-space: nowrap;
	will-change: transform;
	padding-left: 100%;
	/* Fallback duration only — the script overrides this with a value computed
	   from the text width so the scroll speed is a constant, readable pace. */
	animation: mctf-marquee-scroll 40s linear infinite;
}

@keyframes mctf-marquee-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-100%); }
}

/* Pause on hover/focus (supports SC 2.2.2). */
.mctf-marquee:hover .mctf-marquee__track,
.mctf-marquee:focus-within .mctf-marquee__track,
.mctf-marquee.is-paused .mctf-marquee__track {
	animation-play-state: paused;
}

/* Respect the OS-level reduced-motion preference — no movement at all. */
@media (prefers-reduced-motion: reduce) {
	.mctf-marquee__track {
		animation: none !important;
		padding-left: 0;
	}
	.swiper-wrapper {
		transition-duration: 0s !important;
	}
}

/* Utility: visually hidden but available to assistive tech. */
.mctf-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
