/* ============================================================
 * SAMM Wealth Accessibility Fixes  —  a11y-fixes.css
 * Remediation for the WCAG 2.1 AA audit (2026-06-24).
 *
 * The brand greens below all FAIL minimum contrast on light
 * backgrounds. They are replaced with an accessible green that
 * still reads as the SAMM brand colour:
 *
 *   Accessible green  #157a3c
 *     vs #ffffff  -> 5.41:1  (passes AA 4.5:1 normal & 3:1 large)
 *     vs #f9f9f9  -> 5.10:1  (passes)
 *   Works both as text colour AND as a button background with
 *   white text (contrast is symmetric).
 *
 * Failing originals replaced:
 *   #40bf8a  (2.32:1)   inline heading spans
 *   #29a370  (2.94-3.19) headings / "Read Article" buttons
 *   #3bad5f  (2.72:1)   contact / phone / accessibility link
 *   #2aa572  (3.12:1)   "Schedule a Discovery Call" button bg
 *   #2ead5f  (2.89:1)   .samm-download-link button bg
 * ============================================================ */

:root {
	--samm-a11y-green: #157a3c;
}

/* ---- 1.4.3 Contrast: inline green heading text ------------- */
/* Catches any element whose inline style uses the failing green
 * hex values, regardless of spacing/casing in the attribute.    */
[style*="40bf8a"],
[style*="40BF8A"],
[style*="29a370"],
[style*="29A370"],
[style*="3bad5f"],
[style*="3BAD5F"] {
	color: var(--samm-a11y-green) !important;
}

/* ---- 1.4.3 Contrast: green headings styled via Elementor ---- */
/* These get their green from per-widget Elementor CSS, not an
 * inline style, so they are targeted by their element id.       */
.elementor-element-74ef725 > h2,   /* FOUNDER & CEO            */
.elementor-element-bef732d > h2,   /* Investor Education       */
.elementor-element-b2f7c63 > h2,   /* Contact Us               */
.elementor-element-6393b04 > h2,   /* CONTACT@SAMMWEALTH.COM   */
.elementor-element-b482c77 > h2 {  /* +91 7400467601           */
	color: var(--samm-a11y-green) !important;
}

/* Accessibility link rendered green on near-white footer */
h2 > a[href*="/accessibility"] {
	color: var(--samm-a11y-green) !important;
}

/* ---- 1.4.3 Contrast: "Read Article" (green text) buttons ---- */
.jltma-creative-button--default,
.jltma-creative-button--default span,
.jltma-creative-button--default .jltma-creative-button-icon-right {
	color: var(--samm-a11y-green) !important;
}

/* ---- 1.4.3 Contrast: white-on-green CTA buttons ------------- */
/* "Schedule a Discovery Call" + any creative button that uses a
 * green fill with white text: darken the fill, keep text white. */
.jltma-button.jltma-creative-button[href$="#doc"],
a.jltma-button.jltma-creative-button[href*="#doc"] {
	background-color: var(--samm-a11y-green) !important;
}
.jltma-button.jltma-creative-button[href$="#doc"] span {
	color: #ffffff !important;
}

/* ---- 1.4.3 Contrast: "View / Download ... PDF" buttons ------ */
.samm-download-link {
	background-color: var(--samm-a11y-green) !important;
	color: #ffffff !important;
}

/* ---- 1.4.1 Use of colour: links must be distinguishable ----- */
/* In-content links (post content, comments, category pages) get
 * an underline so they are not identified by colour alone.       */
.entry-content a,
.elementor-widget-theme-post-content a,
.comment-content a,
a[rel="category tag"],
a[href*="gravatar.com"] {
	text-decoration: underline !important;
}

/* ============================================================
 * 2026-07-07 audit follow-up (homepage only)
 *
 * The 2026-06-24 fix set every brand green to #157a3c. That value
 * passes on WHITE (~5.4:1) but FAILS on the site's dark-navy
 * surfaces (footer #132439, header pill #142e52). So we add a
 * lighter brand green for text that sits on those dark surfaces:
 *
 *   --samm-a11y-green-dark  #2ec27e
 *     vs #132439 (footer)  -> 6.82:1  (passes AA large 3:1 & normal)
 *     vs #142e52 (pill)    -> 5.92:1  (passes AA normal 4.5:1)
 *
 * All rules below are scoped to `body.home` per the audit's
 * affected page (https://sammwealth.com/).
 * ============================================================ */

:root {
	--samm-a11y-green-dark: #2ec27e;
}

/* ---- 1.4.3 Contrast: green text on DARK backgrounds ---------- */
/* Footer "SAMM Wealth" heading — green "Wealth" span on #132439. */
body.home .elementor-element-eaf31c7 > h2 > span {
	color: var(--samm-a11y-green-dark) !important;
}

/* Header "Schedule a Call" pill — green text on #142e52 navy was
 * hard to read, so use WHITE text on the navy pill (13.4:1).      */
body.home a[href="tel:7400467601"],
body.home a[href="tel:7400467601"] span,
body.home a[href="tel:7400467601"] i,
body.home a[href="tel:7400467601"] svg,
body.home a[href="tel:7400467601"] svg * {
	color: #ffffff !important;
	fill: #ffffff !important;
}

/* ---- 1.4.3 "Understand Advisory Process" hero CTA ----------- */
/* Green glass button over a photographic hero: green text is not
 * reliably legible. Use white text on a mostly-opaque navy scrim
 * so contrast is guaranteed over any part of the photo.          */
body.home a[href$="#hiw"].jltma-button {
	background-color: rgba(6, 38, 66, 0.9) !important;
}
body.home a[href$="#hiw"],
body.home a[href$="#hiw"] span,
body.home a[href$="#hiw"] i,
body.home a[href$="#hiw"] svg,
body.home a[href$="#hiw"] svg *,
body.home a[href$="#hiw"] .jltma-creative-button-icon-right {
	color: #ffffff !important;
	fill: #ffffff !important;
}

/* ---- 1.4.3 Fee-only advisory heading (grey on white) -------- */
/* #627884 is ~4.4:1 on white — just under AA. Darken to #556069. */
body.home .elementor-element-9ae6068 > h2 {
	color: #556069 !important;
}

/* ---- 1.4.3 White headings on the blue gradient cards -------- */
/* The overlay gradient faded to a light blue (#9dbce7) at 100%,
 * where the white card text drops to ~2:1. Darken the light end
 * to #1e6fa8 so white text stays >=5.3:1 across the whole card.
 * Scoped to the one column (e647e1f) that carries this gradient. */
body.home .elementor-element-e647e1f > .elementor-element-populated > .elementor-background-overlay {
	background-image: linear-gradient(153deg, #005286 24%, #1e6fa8 100%) !important;
}

/* ---- 3.3.2 / 1.3.1 Visible labels for the contact form ------ */
/* Injected by a11y-fixes.js above each Contact Form 7 field.     */
body.home .samm-a11y-field-label {
	display: block;
	margin: 0 0 6px;
	font-size: 15px;
	line-height: 1.3;
	font-weight: 500;
	color: inherit;
}

/* ---- Screen-reader-only utility (used by a11y-fixes.js) ------ */
/* Visually hidden but announced: " (PDF, opens in new tab)" etc. */
.samm-a11y-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;
}
