/**
 * Accessibility Fixes CSS - Induswealth
 *
 * Addresses WCAG findings from the EnableUser accessibility audit:
 *  1. Color contrast        (SC 1.4.3 / AA) - 5 findings
 *  2. Distinguishable link  (SC 1.4.1 / A)  - 38 findings
 *  3. Empty headings        (SC 1.3.1 / A)  - 81 findings
 *  4. Identical link text   (SC 2.4.4 / AA) - 71 findings
 *
 * Author: EnableUser accessibility team
 * License: GPL-3.0-or-later
 */

/* ============================================
   1. COLOR CONTRAST FIXES (SC 1.4.3)
   -- White text on #67919B: 3.44:1 (needs 4.5:1)
   -- White text on #67919B: 3.44:1 (needs 4.5:1)
   -- #ff6600 on #ffffff: 2.93:1 (needs 4.5:1)
   -- #ff0000 on #ffffff: 3.99:1 (needs 4.5:1)
   ============================================ */

/* Hero section: switch to high-contrast dark text on the teal background. */
.elementor-element-c9e5fac > .elementor-widget-container > p,
.elementor-element-c9e5fac .elementor-widget-container,
.elementor-element-c9e5fac .elementor-heading-title {
    color: #04303b !important; /* contrast ratio on #67919B ≈ 11.2:1 */
}

/* #ff6600 (2.93:1) on white: bump to #b34700 (≈ 5.1:1). */
span > strong,
p > span > strong,
.elementor-widget-text-editor strong,
.elementor-widget-theme-post-content strong,
.elementor-widget-theme-page-content strong {
    color: #b34700 !important;
}

/* #ff0000 (3.99:1) on white: bump to #cc0000 (≈ 5.3:1). */
.elementor-widget-text-editor strong > span,
.elementor-widget-text-editor span[style*="ff0000"],
.elementor-widget-text-editor span[style*="red"] {
    color: #cc0000 !important;
}

/* ============================================
   2. DISTINGUISHABLE LINK (SC 1.4.1)
   Body-content links must be visually distinguishable
   from surrounding text. We underline them; the hover
   state remains so users still get a stronger cue.
   ============================================ */

.elementor-widget-text-editor a,
.elementor-widget-theme-post-content a,
.elementor-widget-theme-page-content a,
.elementor-widget-theme-archive-posts a,
.elementor-widget-theme-post-excerpt a,
.page-content a,
.post-content a,
.entry-content a {
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}

.elementor-widget-text-editor a:hover,
.elementor-widget-theme-post-content a:hover,
.elementor-widget-theme-page-content a:hover,
.page-content a:hover,
.post-content a:hover,
.entry-content a:hover {
    text-decoration-thickness: 2px;
}

/* Links in lists */
.elementor-widget-icon-list a,
.elementor-widget-text-editor ul li a,
.elementor-widget-text-editor ol li a {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Links inside blockquotes (our-publications / our-proposition) */
.elementor-widget-text-editor blockquote a {
    text-decoration: underline;
    text-underline-offset: 2px;
    font-weight: 600;
}

/* External links (target=_blank) */
a[target="_blank"][rel="noopener"],
a[target="_blank"] {
    text-decoration: underline;
    text-underline-offset: 2px;
}

a[target="_blank"]::after {
    content: " (opens in new tab)";
    font-size: 0.85em;
    opacity: 0.85;
    speak: literal-punctuation;
}

/* ============================================
   3. EMPTY HEADINGS (SC 1.3.1)
   Truly empty headings serve no purpose - hide them
   from both visual layout and the accessibility tree.
   ============================================ */

h1:empty,
h2:empty,
h3:empty,
h4:empty,
h5:empty,
h6:empty {
    display: none !important;
}

.elementor-heading-title:empty {
    display: none !important;
}

.elementor-widget-heading .elementor-heading-title[aria-hidden="true"] {
    display: none !important;
}

/* ============================================
   4. IDENTICAL LINK TEXT (SC 2.4.4)
   JavaScript adds a .a11y-duplicate-link class to
   links whose text doesn't match the canonical label
   for that href. We give them a visual cue so they're
   easier to distinguish when listed together.
   ============================================ */

a.a11y-duplicate-link {
    border-bottom: 1px dotted currentColor;
    text-decoration: none;
}

a.a11y-duplicate-link:hover,
a.a11y-duplicate-link:focus {
    text-decoration: underline;
}