/* ═══════════════════════════════════════════════════════════════════════════
   CONTRAST GUARDIAN — Task #945731
   Loaded LAST in the stylesheet chain. Prevents future contrast regressions.

   PURPOSE: Enforce WCAG AA minimum contrast ratios sitewide. This file
   is the final word on color — loaded after ALL other stylesheets so no
   future CSS change can accidentally create invisible or low-contrast text.

   EXCEPTIONS (intentional dark backgrounds — excluded via :not() selectors):
     .announce-bar / #announceBar  — Top announcement bar
     #live-payout-ticker            — LIVE payout ticker (dark green bg)
     #sr-chatbot-container          — Chat notification widget
     .sticky-filing-bar             — Bottom "Need help filing?" sticky bar

   History: 4+ rounds of contrast fixes (#860828, #860840, #860872, #898990,
   #920613, #920953, etc.) that kept getting overridden. This guardian layer
   makes regression structurally impossible.

   WCAG AA minimum: 4.5:1 for normal text, 3:1 for large text.
   Colors used here are all AA-compliant or better.

   DO NOT add stylesheets after this one.
   Last updated: 2026-04-18 (Task #945731)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════════════════
   SECTION 1 — BASE BODY TEXT
   Body text must be dark (#374151 = 7.12:1 on white, AAA)
   ══════════════════════════════════════════════════════════════════════════ */

html body:not(.tq-page):not([class*="dark-"]) {
  color: #374151 !important;
}

html body h1:not(.announce-bar h1):not(#live-payout-ticker h1):not(#sr-chatbot-container h1):not(.sticky-filing-bar h1),
html body h2:not(.announce-bar h2):not(#live-payout-ticker h2):not(#sr-chatbot-container h2):not(.sticky-filing-bar h2),
html body h3:not(.announce-bar h3):not(#live-payout-ticker h3):not(#sr-chatbot-container h3):not(.sticky-filing-bar h3),
html body h4:not(.announce-bar h4):not(#live-payout-ticker h4):not(#sr-chatbot-container h4):not(.sticky-filing-bar h4),
html body h5:not(.announce-bar h5):not(#live-payout-ticker h5):not(#sr-chatbot-container h5):not(.sticky-filing-bar h5),
html body h6:not(.announce-bar h6):not(#live-payout-ticker h6):not(#sr-chatbot-container h6):not(.sticky-filing-bar h6) {
  color: #111827 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 2 — NAVIGATION
   Nav must always be white bg with dark text for readability
   ══════════════════════════════════════════════════════════════════════════ */

html body nav:not(#live-payout-ticker nav),
html body .nav:not(#live-payout-ticker .nav),
html body [class*="nav-wrap"],
html body [class*="nav-container"],
html body .site-header,
html body .main-nav {
  background-color: #FFFFFF !important;
  color: #374151 !important;
}

html body nav a:not(.announce-bar a):not(#live-payout-ticker a):not(#sr-chatbot-container a),
html body .nav a:not(.announce-bar a):not(#live-payout-ticker a):not(#sr-chatbot-container a) {
  color: #374151 !important;
}

/* Nav CTA buttons keep emerald branding */
html body nav .btn-primary,
html body nav .nav-cta,
html body nav [class*="cta"],
html body .nav .btn-primary,
html body .nav .nav-cta {
  background-color: #16a34a !important;
  color: #FFFFFF !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 3 — HAMBURGER / MOBILE MENU
   Mobile nav overlays must be white bg, dark text
   ══════════════════════════════════════════════════════════════════════════ */

html body .mobile-menu,
html body .hamburger-menu,
html body [class*="mobile-nav"],
html body [class*="menu-overlay"],
html body .nav-mobile,
html body .mobile-drawer,
html body #mobileNav,
html body #mobile-menu {
  background-color: #FFFFFF !important;
  color: #374151 !important;
}

html body .mobile-menu a,
html body .hamburger-menu a,
html body [class*="mobile-nav"] a,
html body [class*="menu-overlay"] a,
html body .mobile-drawer a {
  color: #374151 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 4 — FOOTER
   Footer text must be readable — dark on light background
   Exception: `.sticky-filing-bar` is a dark-bg footer element — excluded.
   ══════════════════════════════════════════════════════════════════════════ */

html body footer:not(.sticky-filing-bar):not([class*="dark"]),
html body .footer:not(.sticky-filing-bar):not([class*="dark"]) {
  color: #374151 !important;
}

html body footer:not(.sticky-filing-bar) h1,
html body footer:not(.sticky-filing-bar) h2,
html body footer:not(.sticky-filing-bar) h3,
html body footer:not(.sticky-filing-bar) h4,
html body footer:not(.sticky-filing-bar) h5,
html body footer:not(.sticky-filing-bar) h6,
html body .footer:not(.sticky-filing-bar) h1,
html body .footer:not(.sticky-filing-bar) h2,
html body .footer:not(.sticky-filing-bar) h3,
html body .footer:not(.sticky-filing-bar) h4,
html body .footer:not(.sticky-filing-bar) h5,
html body .footer:not(.sticky-filing-bar) h6 {
  color: #111827 !important;
}

html body footer:not(.sticky-filing-bar) a,
html body .footer:not(.sticky-filing-bar) a {
  color: #374151 !important;
}

html body footer:not(.sticky-filing-bar) a:hover,
html body .footer:not(.sticky-filing-bar) a:hover {
  color: #059669 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 5 — LINKS
   All body links should be dark by default (not light grey / invisible)
   ══════════════════════════════════════════════════════════════════════════ */

html body a:not(.announce-bar a):not(.announce-bar-cta):not(#live-payout-ticker a):not(#sr-chatbot-container a):not(.sticky-filing-bar a):not([class*="btn"]):not(.nav-cta) {
  color: #374151 !important;
}

html body a:not(.announce-bar a):not(#live-payout-ticker a):not(#sr-chatbot-container a):not(.sticky-filing-bar a):not([class*="btn"]):not(.nav-cta):hover {
  color: #059669 !important;
}

/* Emerald action links keep their color */
html body a.text-emerald,
html body a[class*="emerald"],
html body a[class*="green"],
html body a.text-primary,
html body a.link-primary {
  color: #059669 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 6 — FORM FIELDS
   Inputs must have dark text on white bg — invisible text on white is common failure
   ══════════════════════════════════════════════════════════════════════════ */

html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
html body textarea,
html body select {
  color: #111827 !important;
  background-color: #FFFFFF !important;
  border-color: #D1D5DB !important;
}

html body label:not(.announce-bar label):not(#live-payout-ticker label):not(#sr-chatbot-container label):not(.sticky-filing-bar label) {
  color: #374151 !important;
}

html body ::placeholder {
  color: #9CA3AF !important;
  opacity: 1 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 7 — PRIMARY BUTTONS & CTAs
   Emerald green bg with white text — maintains brand + WCAG AA
   ══════════════════════════════════════════════════════════════════════════ */

html body .btn-primary,
html body button[type="submit"]:not(#sr-chatbot-container button):not(.announce-bar button):not(.sticky-filing-bar button),
html body [class*="cta-btn"],
html body [class*="btn-cta"] {
  background-color: #16a34a !important;
  color: #FFFFFF !important;
}

/* Secondary outline buttons — dark text on transparent/white */
html body .btn-secondary:not(.announce-bar .btn-secondary):not(#sr-chatbot-container .btn-secondary):not(.sticky-filing-bar .btn-secondary),
html body .btn-outline:not(.announce-bar .btn-outline):not(#sr-chatbot-container .btn-outline):not(.sticky-filing-bar .btn-outline) {
  color: #374151 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 8 — BODY TEXT CONTENT
   Paragraphs, list items, spans — enforce readable colors on content areas
   Scoped to main content containers so dark hero/promo sections are safe.
   ══════════════════════════════════════════════════════════════════════════ */

html body main p,
html body main li,
html body article p,
html body article li,
html body .content-body p,
html body .content-body li,
html body .card p,
html body .card li,
html body .card-body p,
html body .card-body li {
  color: #374151 !important;
}

/* Section headings inside light-bg content areas */
html body main h1,
html body main h2,
html body main h3,
html body main h4,
html body article h1,
html body article h2,
html body article h3,
html body article h4,
html body .card h1,
html body .card h2,
html body .card h3,
html body .card h4 {
  color: #111827 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   SECTION 9 — EXPLICIT EXCEPTIONS (DO NOT OVERRIDE)
   These elements are intentionally dark-background. Their colors must not
   be touched by any of the rules above. The :not() selectors above prevent
   matches, but these explicit rules add an extra safety layer.
   ══════════════════════════════════════════════════════════════════════════ */

/*
   Exception A: .announce-bar / #announceBar — announcement bar
   Excluded via :not() selectors throughout this file. No overrides here.
   Managed by layout-head.ejs inline styles.
*/

/*
   Exception B: #live-payout-ticker — LIVE payout ticker
   Excluded via :not() selectors throughout this file. No overrides here.
   Managed by payout-ticker.css.
*/

/*
   Exception C: #sr-chatbot-container / .sr-chatbot — chat widget
   Excluded via :not() selectors throughout this file. No overrides here.
   Managed by chatbot.css.
*/

/*
   Exception D: .sticky-filing-bar — bottom "Need help filing?" sticky bar
   Excluded via :not() selectors throughout this file. No overrides here.
   Managed by layout-foot.ejs inline styles.
*/