/* ============================================================
   Sitewide dark mode
   Loaded unconditionally (every page), unlike landing.css which only
   loads on the front page / search / 404. Those pages' dark-mode rules
   are scoped to .fgo-landing / .fgo-fullpage, which simply don't exist
   anywhere else, so ordinary pages, GeneratePress's own header/footer/nav,
   and the plugin's archive/single templates never picked up dark mode
   before this file existed. This is the fix: base site chrome here, plus
   the plugin's own classes.
   ============================================================ */

html[data-fgo-theme="dark"] body {
  background: #0d1410 !important;
  color: #eef2ea !important;
}

/* ---------- GeneratePress structural chrome ----------
 * Targets GP's long-stable class names directly (not assumed from
 * landing.css's scoped tokens, which don't reach here). !important is
 * deliberate: we're overriding a theme's own explicit background/color
 * declarations for a user-triggered global mode switch.
 */
html[data-fgo-theme="dark"] .site,
html[data-fgo-theme="dark"] #page,
html[data-fgo-theme="dark"] .site-content,
html[data-fgo-theme="dark"] #content,
html[data-fgo-theme="dark"] .site-header,
html[data-fgo-theme="dark"] .site-footer,
html[data-fgo-theme="dark"] .inside-header,
html[data-fgo-theme="dark"] .inside-navigation,
html[data-fgo-theme="dark"] .main-navigation,
html[data-fgo-theme="dark"] .inside-article,
html[data-fgo-theme="dark"] .widget-area,
html[data-fgo-theme="dark"] .widget,
html[data-fgo-theme="dark"] .comment-respond {
  background: #0d1410 !important;
  color: #eef2ea !important;
  border-color: #223026 !important;
}

html[data-fgo-theme="dark"] .main-navigation a,
html[data-fgo-theme="dark"] .site-header a,
html[data-fgo-theme="dark"] .site-footer a,
html[data-fgo-theme="dark"] .entry-content a,
html[data-fgo-theme="dark"] .widget a,
html[data-fgo-theme="dark"] p a {
  color: #35c26a !important;
}

html[data-fgo-theme="dark"] input,
html[data-fgo-theme="dark"] textarea,
html[data-fgo-theme="dark"] select {
  background: #141d17 !important;
  color: #eef2ea !important;
  border-color: #223026 !important;
}

html[data-fgo-theme="dark"] table,
html[data-fgo-theme="dark"] th,
html[data-fgo-theme="dark"] td {
  border-color: #223026 !important;
}

html[data-fgo-theme="dark"] hr { border-color: #223026 !important; }

/* ---------- Plugin: archive / single (assets/css/fgo-public.css) ----------
 * That stylesheet has no dark-mode awareness at all, every color in it is
 * a literal hex value, not a CSS custom property, so there's nothing for
 * a page-level theme switch to hook into without this. Each rule below
 * maps directly to its light counterpart there.
 */
html[data-fgo-theme="dark"] .fgo-archive-wrap,
html[data-fgo-theme="dark"] .fgo-single-wrap {
  color: #eef2ea;
}

html[data-fgo-theme="dark"] .fgo-filters,
html[data-fgo-theme="dark"] .fgo-card,
html[data-fgo-theme="dark"] .fgo-single-facts {
  background: #141d17 !important;
  border-color: #223026 !important;
}

html[data-fgo-theme="dark"] .fgo-archive-header h1,
html[data-fgo-theme="dark"] .fgo-filter-group legend,
html[data-fgo-theme="dark"] .fgo-card-title a,
html[data-fgo-theme="dark"] .fgo-single-title,
html[data-fgo-theme="dark"] .fgo-single-facts span,
html[data-fgo-theme="dark"] .fgo-pagination .page-numbers,
html[data-fgo-theme="dark"] .fgo-share-btn {
  color: #eef2ea !important;
}

html[data-fgo-theme="dark"] .fgo-archive-sub,
html[data-fgo-theme="dark"] .fgo-back-to-search,
html[data-fgo-theme="dark"] .fgo-card-funder,
html[data-fgo-theme="dark"] .fgo-single-funder,
html[data-fgo-theme="dark"] .fgo-back-link,
html[data-fgo-theme="dark"] .fgo-share-label,
html[data-fgo-theme="dark"] .fgo-count,
html[data-fgo-theme="dark"] .fgo-card-meta-row,
html[data-fgo-theme="dark"] .fgo-single-facts strong,
html[data-fgo-theme="dark"] .fgo-results-meta {
  color: #93a498 !important;
}

html[data-fgo-theme="dark"] .fgo-card-excerpt,
html[data-fgo-theme="dark"] .fgo-single-content,
html[data-fgo-theme="dark"] .fgo-filter-option {
  color: #c9d4cb !important;
}

html[data-fgo-theme="dark"] .fgo-badge {
  background: #1c3b26 !important;
  color: #8fe0ac !important;
}
html[data-fgo-theme="dark"] .fgo-badge-source {
  background: #eef2ea !important;
  color: #16231a !important;
}

html[data-fgo-theme="dark"] .fgo-btn-ghost,
html[data-fgo-theme="dark"] .fgo-share-btn {
  background: #141d17 !important;
}
html[data-fgo-theme="dark"] .fgo-btn-ghost:hover,
html[data-fgo-theme="dark"] .fgo-share-btn:hover {
  background: #1c281f !important;
}

html[data-fgo-theme="dark"] .fgo-empty {
  color: #93a498 !important;
  border-color: #223026 !important;
}

html[data-fgo-theme="dark"] .fgo-pagination .page-numbers.current {
  background: #35c26a !important;
  color: #06170c !important;
  border-color: #35c26a !important;
}

/* ---------- Plugin: dashboard / submission / BYOK shortcodes ----------
 * These render with inline styles (see includes/dashboard.php,
 * submissions.php, byok.php), by design, so they look right under any
 * theme without needing an external stylesheet. External !important does
 * still beat a plain inline style (only inline !important would resist
 * it), so the wrapper text below picks up dark mode correctly. What it
 * can't reach: a handful of specific inline-styled elements that set
 * their own literal background color directly (the save-confirmation /
 * error notice boxes, and the status pills on My Submissions) — those
 * don't have individual classes to hook into, so they keep their light
 * colors for now. Noting that as a known gap rather than pretending
 * everything in these forms is fully dark-aware.
 */
html[data-fgo-theme="dark"] .fgo-dashboard,
html[data-fgo-theme="dark"] .fgo-shortcode-ui {
  color: #eef2ea !important;
}
html[data-fgo-theme="dark"] .fgo-dashboard a,
html[data-fgo-theme="dark"] .fgo-shortcode-ui a {
  color: #35c26a !important;
}
html[data-fgo-theme="dark"] .fgo-dashboard th,
html[data-fgo-theme="dark"] .fgo-dashboard td,
html[data-fgo-theme="dark"] .fgo-shortcode-ui th,
html[data-fgo-theme="dark"] .fgo-shortcode-ui td {
  border-color: #223026 !important;
}
/* Previously a known gap: these notice boxes set their own background
 * inline with nothing to hook into. They carry a class now
 * (includes/submissions.php, includes/byok.php), so this can win —
 * external !important beats a plain inline style, only inline !important
 * would resist it, and these don't use that. */
html[data-fgo-theme="dark"] .fgo-notice-error {
  background: #3a1f1c !important;
  border-color: #6b3430 !important;
  color: #f2c9c4 !important;
}
html[data-fgo-theme="dark"] .fgo-notice-success {
  background: #16301f !important;
  border-color: #1f9d57 !important;
  color: #b7ecc9 !important;
}
html[data-fgo-theme="dark"] .fgo-shortcode-ui div[style*="border:1px solid #dbe6dc"] {
  border-color: #223026 !important;
  background: #141d17 !important;
}
html[data-fgo-theme="dark"] .fgo-shortcode-ui input,
html[data-fgo-theme="dark"] .fgo-shortcode-ui textarea,
html[data-fgo-theme="dark"] .fgo-shortcode-ui select {
  background: #0d1410 !important;
}

/* ---------- Plugin: the [funded_grad_outreach] login gate ----------
 * Two-column card (see funded-grad-outreach.php), also inline-styled.
 * Left column text/button covered by the .fgo-shortcode-ui-style rules
 * above once it carries that class; the illustration panel's own light
 * background is deliberate either way (it's an image panel, not text),
 * left as-is.
 */
html[data-fgo-theme="dark"] .fgo-login-gate {
  background: #141d17 !important;
  border-color: #223026 !important;
  color: #eef2ea !important;
}
html[data-fgo-theme="dark"] .fgo-login-gate > div:first-child {
  background: #141d17 !important;
}
