/**
 * Joe's Heating — WCAG 2.1 AA Accessibility Color Overrides
 * Generated: 2026-06-05
 * Load this file after all other theme/Elementor CSS.
 * TODO: Add to WordPress via wp_enqueue_style() in functions.php or
 *       via Elementor > Custom CSS (Site Settings).
 */

/* =========================================================
 * 1. PROMO BAR & SOCIAL ICONS: Light text on dark blue
 *    Fixes #333333 on #002d56 (1.10:1 → 13.91:1)
 * ========================================================= */
.elementor-element-838d5a,
.elementor-element-838d5a *,
.elementor-element-838d5a p,
.elementor-element-838d5a span,
.elementor-element-838d5a h1,
.elementor-element-838d5a h2,
.elementor-element-838d5a h3,
.elementor-element-838d5a h4,
.elementor-element-838d5a h5,
.elementor-element-838d5a h6 {
  color: #ffffff !important;
}

a.elementor-icon.elementor-social-icon {
  color: #ffffff !important;
}

/* =========================================================
 * 2. MAP CARD: Light text on dark blue
 *    Fixes #333333 on #0d2444 (1.23:1 → 15.52:1)
 * ========================================================= */
div.joes-map-card,
div.joes-map-card *,
div.joes-map-card p,
div.joes-map-card span,
div.joes-map-card h1,
div.joes-map-card h2,
div.joes-map-card h3,
div.joes-map-card h4,
div.joes-map-card h5,
div.joes-map-card h6 {
  color: #ffffff !important;
}

/* =========================================================
 * 3. PULSE INDICATOR: Darken background
 *    Fixes #ffffff on #ff8a87 (2.27:1 → ~6.5:1 with #c62828)
 * ========================================================= */
span.jmc-pulse {
  background-color: #c62828 !important;
}

/* =========================================================
 * 4. POST META DATES / AVATARS: Darken gray text
 *    Fixes #adadad on #ffffff (2.24:1 → 7.00:1 with #595959)
 * ========================================================= */
.elementor-post__meta-data,
.elementor-post-date,
.elementor-post-avatar,
.elementor-post__meta-data * {
  color: #595959 !important;
}

/* =========================================================
 * 5. RED SECTION BODY TEXT: Use white text on red
 *    Fixes #333333 on #e8112d (2.74:1 → 4.62:1)
 * ========================================================= */
.elementor-element-06d4a30,
.elementor-element-06d4a30 *,
.elementor-element-06d4a30 p,
.elementor-element-06d4a30 span,
.elementor-element-06d4a30 h1,
.elementor-element-06d4a30 h2,
.elementor-element-06d4a30 h3,
.elementor-element-06d4a30 h4,
.elementor-element-06d4a30 h5,
.elementor-element-06d4a30 h6,
.elementor-element-d80fafc,
.elementor-element-d80fafc *,
.elementor-element-d80fafc p,
.elementor-element-d80fafc span {
  color: #ffffff !important;
}

/* =========================================================
 * 6. HORIZONTAL DIVIDERS: Darken gray
 *    Fixes #808080 on #ffffff (3.95:1 → 7.00:1 with #595959)
 * ========================================================= */
hr[class*="e-divider-base"],
hr[class*="e-53b8ee6"],
hr[class*="e-434f265"] {
  color: #595959 !important;
  border-color: #595959 !important;
  background-color: #595959 !important;
}

/* =========================================================
 * 7. HERO HEADINGS ON BRIGHT RED: Darken red background
 *    Fixes #ffffff on #ff0000 (4.00:1 → 6.57:1 with #b71c1c)
 *    Target: "Contact Your Local HVAC Experts", "Expert Heating Services..."
 * ========================================================= */
[class*="e-2408b12"],
[class*="e-811a10e"],
.elementor .e-d49e6ff-0de166d {
  /* If the red is a background on the container, override the container */
}

/* Container-level fix for hero sections using #ff0000 backgrounds */
section[style*="background-color: #ff0000"],
div[style*="background-color: #ff0000"],
section[style*="background-color:#ff0000"],
div[style*="background-color:#ff0000"],
.elementor-element[style*="background-color: rgb(255, 0, 0)"],
.elementor-element[style*="background-color:rgb(255,0,0)"] {
  background-color: #b71c1c !important;
}

/* =========================================================
 * 8. RED CALL-TO-ACTION BUTTONS: Darken red text
 *    Fixes #ff0000 on #ffffff (4.00:1 → 6.57:1 with #b71c1c)
 *    Original: "Call (905) 434-6788" button
 * ========================================================= */
a.e-button-base[class*="e-940ad56"],
.elementor .e-a092a3e-cde3a2c,
.elementor .e-a092a3e-cde3a2c:hover {
  color: #b71c1c !important;
  fill: #b71c1c !important;
}

/* Also fix any other #ff0000-colored buttons */
a[style*="color: #ff0000"],
span[style*="color: #ff0000"],
a[style*="color:#ff0000"],
span[style*="color:#ff0000"] {
  color: #b71c1c !important;
}

/* =========================================================
 * 9. POST EXCERPTS: Darken gray text (from prior audit)
 *    Fixes #777777 on #ffffff (4.48:1 → 7.00:1 with #595959)
 *    Not currently rendered; included for future-proofing
 * ========================================================= */
.elementor-post__excerpt,
.elementor-post__excerpt p,
.elementor-post__excerpt * {
  color: #595959 !important;
}

/* =========================================================
 * GLOBAL: Prevent future contrast regressions on dark backgrounds
 * ========================================================= */

/* Any container with dark blue background must use light text */
[style*="background-color: #002d56"] *,
[style*="background-color:#002d56"] *,
[style*="background-color: rgb(0, 45, 86)"] *,
.bg-navy *,
.bg-dark-blue * {
  color: #ffffff !important;
}
