/* =====================================================================
   D'Key Civic v8.5.79 — Authoritative Theme Cascade Repair
   Loaded LAST after all legacy and recognition styles.
   Goal: every text-bearing component remains readable in both themes.
   ===================================================================== */

:root{
  --cx-page:#f7f2e9;
  --cx-page-top:#fffaf3;
  --cx-surface:#ffffff;
  --cx-surface-2:#f4ecdf;
  --cx-surface-3:#eadcc6;
  --cx-text:#19150f;
  --cx-muted:#554c40;
  --cx-heading:#17130e;
  --cx-border:#cdbda6;
  --cx-link:#6b4b08;
  --cx-gold:#c79b33;
  --cx-on-gold:#171108;
  --cx-focus:#7b5810;
}

html[data-theme="dark"],
html.dark,
body.dark{
  --cx-page:#0f1115;
  --cx-page-top:#171a20;
  --cx-surface:#1b1e24;
  --cx-surface-2:#242830;
  --cx-surface-3:#303641;
  --cx-text:#f8f4ec;
  --cx-muted:#d2cbc0;
  --cx-heading:#fff8ea;
  --cx-border:#555b67;
  --cx-link:#f3d88f;
  --cx-gold:#dfb957;
  --cx-on-gold:#151007;
  --cx-focus:#f3d88f;
}

html[data-theme="light"]{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}

body{
  background:radial-gradient(circle at top left,var(--cx-page-top),var(--cx-page))!important;
  color:var(--cx-text)!important;
}

/* ---------------------------------------------------------------------
   1. Undo broad legacy dark-mode rules on layout wrappers.
   Genuine surfaces are restored explicitly below.
   --------------------------------------------------------------------- */
body.dark #main,
body.dark main,
body.dark #main section,
body.dark main section,
body.dark #main article:not([class]),
body.dark main article:not([class]),
body.dark #main aside:not([class]),
body.dark main aside:not([class]),
html[data-theme="dark"] body #main,
html[data-theme="dark"] body main,
html[data-theme="dark"] body #main section,
html[data-theme="dark"] body main section{
  background-color:transparent!important;
  color:var(--cx-text)!important;
}
.section{background:transparent!important;color:var(--cx-text)!important}

/* ---------------------------------------------------------------------
   2. Genuine light-era surfaces. These are the components that must
   switch surface AND text together, preventing white-on-white/dark-on-dark.
   --------------------------------------------------------------------- */
body #main :where(
  .home-easter-feature__card,.home-impact-snapshot__card,.home-proof-card,
  .hero-card,.about-panel,.metric,.card,.why-card,.form-card,.team-card,
  .partner-card,.story-card,.impact-card,.resource-card,.intro,.intro-box,
  .help-box,.space-box,.skill-box,.partner-box,.programme,.summer-card,
  .trust-side-card,.trust-action-panel,.highlight,.callout,.cta-box,
  .event-box,.featured-event,.faq-item,.side-panel,.doc-card,.section-card,
  .signal-card,.stat,.support-note,.feedback-learning-card,.feedback-form-panel,
  .civic-premium-card,.civic-status-panel,.civic-status-item,.photo-card,
  .album-card,.gallery-caption,.source-card,.opportunity-card,.toolkit-card,
  .spotlight-card,.funding-card,.network-card,.civic-cal,.civic-cal-panel,
  .civic-cal-panel-inner,.recognition-civic-band,.recognition-civic-card,
  .recognition-civic-timeline,.recognition-planning,.recognition-copybox
),
body main :where(
  .home-easter-feature__card,.home-impact-snapshot__card,.home-proof-card,
  .hero-card,.about-panel,.metric,.card,.why-card,.form-card,.team-card,
  .partner-card,.story-card,.impact-card,.resource-card,.intro,.intro-box,
  .help-box,.space-box,.skill-box,.partner-box,.programme,.summer-card,
  .trust-side-card,.trust-action-panel,.highlight,.callout,.cta-box,
  .event-box,.featured-event,.faq-item,.side-panel,.doc-card,.section-card,
  .signal-card,.stat,.support-note,.feedback-learning-card,.feedback-form-panel,
  .civic-premium-card,.civic-status-panel,.civic-status-item,.photo-card,
  .album-card,.gallery-caption,.source-card,.opportunity-card,.toolkit-card,
  .spotlight-card,.funding-card,.network-card,.civic-cal,.civic-cal-panel,
  .civic-cal-panel-inner,.recognition-civic-band,.recognition-civic-card,
  .recognition-civic-timeline,.recognition-planning,.recognition-copybox
){
  background-color:var(--cx-surface)!important;
  color:var(--cx-text)!important;
  border-color:var(--cx-border)!important;
}

/* Soft callouts get a distinct but readable surface. */
body #main :where(.highlight,.callout,.cta-box,.support-note,.civic-capacity-note),
body main :where(.highlight,.callout,.cta-box,.support-note,.civic-capacity-note){
  background:var(--cx-surface-2)!important;
  color:var(--cx-text)!important;
  border-color:var(--cx-border)!important;
}

/* Force readable copy inside themed surfaces — loaded last and scoped to #main. */
body #main :where(
  .home-easter-feature__card,.home-impact-snapshot__card,.home-proof-card,
  .hero-card,.about-panel,.metric,.card,.why-card,.form-card,.team-card,
  .partner-card,.story-card,.impact-card,.resource-card,.intro,.intro-box,
  .help-box,.space-box,.skill-box,.partner-box,.programme,.summer-card,
  .trust-side-card,.trust-action-panel,.highlight,.callout,.cta-box,
  .event-box,.featured-event,.faq-item,.side-panel,.doc-card,.section-card,
  .signal-card,.stat,.support-note,.feedback-learning-card,.feedback-form-panel,
  .civic-premium-card,.civic-status-panel,.civic-status-item,.photo-card,
  .album-card,.gallery-caption,.source-card,.opportunity-card,.toolkit-card,
  .spotlight-card,.funding-card,.network-card,.recognition-civic-band,
  .recognition-civic-card,.recognition-civic-timeline,.recognition-planning,
  .recognition-copybox
) :where(h1,h2,h3,h4,h5,h6,strong){color:var(--cx-heading)!important}

body #main :where(
  .home-easter-feature__card,.home-impact-snapshot__card,.home-proof-card,
  .hero-card,.about-panel,.metric,.card,.why-card,.form-card,.team-card,
  .partner-card,.story-card,.impact-card,.resource-card,.intro,.intro-box,
  .help-box,.space-box,.skill-box,.partner-box,.programme,.summer-card,
  .trust-side-card,.trust-action-panel,.highlight,.callout,.cta-box,
  .event-box,.featured-event,.faq-item,.side-panel,.doc-card,.section-card,
  .signal-card,.stat,.support-note,.feedback-learning-card,.feedback-form-panel,
  .civic-premium-card,.civic-status-panel,.civic-status-item,.photo-card,
  .album-card,.gallery-caption,.source-card,.opportunity-card,.toolkit-card,
  .spotlight-card,.funding-card,.network-card,.recognition-civic-band,
  .recognition-civic-card,.recognition-civic-timeline,.recognition-planning,
  .recognition-copybox
) :where(p,li,dd,dt,label,small,.meta,.tiny,.note,.address,.time,.coming-soon){
  color:var(--cx-muted)!important;
}

body #main :where(p,li,dd,dt) a:not(.btn):not(.btn-primary):not(.btn-secondary):not(.nav-cta),
body main :where(p,li,dd,dt) a:not(.btn):not(.btn-primary):not(.btn-secondary):not(.nav-cta){
  color:var(--cx-link)!important;
  text-decoration-color:currentColor!important;
}

/* ---------------------------------------------------------------------
   3. Homepage dark editorial hero — always dark, always light copy.
   The campaign/event card nested inside remains deliberately light.
   --------------------------------------------------------------------- */
body #main .home-hero-panel,
body main .home-hero-panel{
  background:
    radial-gradient(circle at top left,rgba(194,155,64,.27),transparent 32%),
    linear-gradient(135deg,#17120c,#352819)!important;
  color:#fff8ea!important;
  border-color:rgba(229,201,130,.38)!important;
}
body #main .home-hero-panel .home-hero-copy :where(.home-kicker,.home-title,.home-lede,.home-note,h1,h2,h3,p,li,small,strong),
body #main .home-hero-panel .home-trust-note,
body #main .home-hero-panel .home-trust-note :where(span,strong,p,a),
body main .home-hero-panel .home-hero-copy :where(.home-kicker,.home-title,.home-lede,.home-note,h1,h2,h3,p,li,small,strong){
  color:#fff8ea!important;
}
body #main .home-hero-panel .home-title span{color:#f0cf79!important}
body #main .home-hero-panel .home-kicker,
body #main .home-hero-panel .home-trust-badge,
body #main .home-hero-panel .home-trust-note a{color:#f2d58b!important}
body #main .home-hero-panel .home-lede{color:#eee3d1!important}
body #main .home-hero-panel .home-note{color:#d7ccbb!important}
body #main .home-hero-panel .home-trust-note{background:rgba(255,255,255,.075)!important;border-color:rgba(229,201,130,.28)!important}

/* Keep the delivered-event card deliberately light in BOTH themes. */
body #main .home-hero-panel .home-campaign-card,
body main .home-hero-panel .home-campaign-card{
  background:#fff!important;
  color:#21190f!important;
  border-color:#d6c49d!important;
}
body #main .home-hero-panel .home-campaign-card :where(h1,h2,h3,h4,strong){color:#20180e!important}
body #main .home-hero-panel .home-campaign-card :where(p,li,small,.home-campaign-meta){color:#5b5142!important}
body #main .home-hero-panel .home-campaign-status{color:#fff!important}

/* ---------------------------------------------------------------------
   4. Buttons. Gold uses dark ink; secondary adapts to theme.
   --------------------------------------------------------------------- */
body :where(.btn-primary,.btn-gold,.nav-cta,.asknello-btn,.asknello-send,.summer-link){
  background:linear-gradient(135deg,var(--cx-gold),#a97b1e)!important;
  color:var(--cx-on-gold)!important;
  border-color:transparent!important;
  text-shadow:none!important;
}
body :where(.btn-secondary,.btn-soft,.trust-btn.light,.ghost){
  background:var(--cx-surface)!important;
  color:var(--cx-text)!important;
  border:1px solid var(--cx-border)!important;
}
/* Secondary buttons inside the dark hero use dark translucent styling instead. */
body #main .home-hero-panel .home-hero-copy .btn-secondary{
  background:rgba(255,255,255,.10)!important;
  color:#fff8ea!important;
  border-color:rgba(240,212,141,.35)!important;
}
/* Campaign-card buttons must remain readable on white. */
body #main .home-campaign-card .btn-secondary{
  background:#fff!important;
  color:#4b3713!important;
  border-color:#d7c6a4!important;
}

/* ---------------------------------------------------------------------
   5. Forms, tables, badges, Ask Nello.
   --------------------------------------------------------------------- */
body :where(input,textarea,select){
  background:var(--cx-surface)!important;
  color:var(--cx-text)!important;
  border-color:var(--cx-border)!important;
  caret-color:var(--cx-text)!important;
}
body :where(input,textarea)::placeholder{color:var(--cx-muted)!important;opacity:.86!important}
body select option{background:var(--cx-surface)!important;color:var(--cx-text)!important}

body table{background:var(--cx-surface)!important;color:var(--cx-text)!important;border-color:var(--cx-border)!important}
body :where(th,td){color:var(--cx-text)!important;border-color:var(--cx-border)!important}
body th{background:var(--cx-surface-3)!important}

.asknello-panel,.asknello-card,.asknello-welcome{
  background:var(--cx-surface)!important;color:var(--cx-text)!important;border-color:var(--cx-border)!important
}
.asknello-head,.asknello-chip,.asknello-close{background:var(--cx-surface-2)!important;color:var(--cx-text)!important;border-color:var(--cx-border)!important}
.asknello-title span,.asknello-note,.asknello-welcome p,.asknello-subnote,.asknello-signoff,.asknello-card p{color:var(--cx-muted)!important}
.asknello-card a{color:var(--cx-link)!important}

/* Status components preserve meaning without sacrificing contrast. */
body.dark :where(.badge,.pill,.status,.tag,.summer-status span,.civic-status-badge),
html[data-theme="dark"] body :where(.badge,.pill,.status,.tag,.summer-status span,.civic-status-badge){
  background:var(--cx-surface-3)!important;
  color:var(--cx-text)!important;
  border-color:var(--cx-border)!important;
}

/* ---------------------------------------------------------------------
   6. Recognition/media layer loads before this file, so these rules win.
   --------------------------------------------------------------------- */
body.dark :where(.recognition-civic-band,.recognition-civic-card,.recognition-civic-timeline,.recognition-planning,.recognition-copybox),
html[data-theme="dark"] body :where(.recognition-civic-band,.recognition-civic-card,.recognition-civic-timeline,.recognition-planning,.recognition-copybox){
  background:var(--cx-surface)!important;color:var(--cx-text)!important;border-color:var(--cx-border)!important
}
body.dark :where(.recognition-civic-card,.recognition-civic-band,.recognition-civic-event,.recognition-planning,.recognition-copybox) :where(p,li,blockquote),
html[data-theme="dark"] body :where(.recognition-civic-card,.recognition-civic-band,.recognition-civic-event,.recognition-planning,.recognition-copybox) :where(p,li,blockquote){color:var(--cx-muted)!important}
body.dark .recognition-downloads a,
html[data-theme="dark"] body .recognition-downloads a{background:var(--cx-surface-2)!important;color:var(--cx-link)!important;border-color:var(--cx-border)!important}

/* ---------------------------------------------------------------------
   7. Header/footer controls and keyboard focus.
   --------------------------------------------------------------------- */
body :where(.theme-toggle,.nav-toggle){color:var(--cx-text)!important}
body :where(a,button,input,textarea,select,summary):focus-visible{
  outline:3px solid var(--cx-focus)!important;
  outline-offset:3px!important;
}

@media (forced-colors:active){
  *{forced-color-adjust:auto}
  .theme-toggle,.nav-cta,.btn-primary,.btn-secondary{border:1px solid ButtonText!important}
}

/* ---------------------------------------------------------------------
   8. Additional legacy surfaces found in the full-site hard-coded colour scan.
   --------------------------------------------------------------------- */
body #main :where(
  .civic-date-box,.trust-card,.note-list,.civic-confirm-card,.civic-team-card,
  .civic-detail-list,.assist-card,.team-intro-panel,.team-note-panel,
  .team-assurance-row,.price-card,.fd-note,.summer-callout,.feedback-proof-page,
  .civic-route-strip a,.civic-card-link,.support-field,.recognition-downloads a
){
  background:var(--cx-surface)!important;
  color:var(--cx-text)!important;
  border-color:var(--cx-border)!important;
}
body #main :where(
  .civic-date-box,.trust-card,.note-list,.civic-confirm-card,.civic-team-card,
  .civic-detail-list,.assist-card,.team-intro-panel,.team-note-panel,
  .team-assurance-row,.price-card,.fd-note,.summer-callout,.feedback-proof-page
) :where(h1,h2,h3,h4,h5,h6,strong){color:var(--cx-heading)!important}
body #main :where(
  .civic-date-box,.trust-card,.note-list,.civic-confirm-card,.civic-team-card,
  .civic-detail-list,.assist-card,.team-intro-panel,.team-note-panel,
  .team-assurance-row,.price-card,.fd-note,.summer-callout,.feedback-proof-page
) :where(p,li,dd,dt,label,small,.meta,.tiny,.note){color:var(--cx-muted)!important}

/* Intentionally dark feature panels keep a controlled dark palette in BOTH themes. */
body #main :where(.trust-hero-card,.event-strip__card,.civic-unified-hero,.recognition-home-strip__inner,.recognition-civic-hero__panel,.dark-panel,.media-hero,.winter-hero){
  background:linear-gradient(135deg,#141820,#252018)!important;
  color:#fff8ea!important;
  border-color:rgba(240,212,141,.34)!important;
}
body #main :where(.trust-hero-card,.event-strip__card,.civic-unified-hero,.recognition-home-strip__inner,.recognition-civic-hero__panel,.dark-panel,.media-hero,.winter-hero) :where(h1,h2,h3,h4,h5,h6,strong){color:#fff8ea!important}
body #main :where(.trust-hero-card,.event-strip__card,.civic-unified-hero,.recognition-home-strip__inner,.recognition-civic-hero__panel,.dark-panel,.media-hero,.winter-hero) :where(p,li,small,.meta,.tiny,.note){color:#ded6c8!important}
body #main :where(.trust-hero-card,.event-strip__card,.civic-unified-hero,.recognition-home-strip__inner,.recognition-civic-hero__panel,.dark-panel,.media-hero,.winter-hero) a:not(.btn-primary):not(.btn-secondary){color:#f3d88f!important}

/* Small labels/pills: pair their background and foreground rather than inheriting. */
body #main :where(.event-pill,.team-role,.card-pill,.hero-card-pill,.trust-eyebrow,.civic-tag-row,.civic-unified-kicker){
  background:var(--cx-surface-2)!important;
  color:var(--cx-link)!important;
  border-color:var(--cx-border)!important;
}
html[data-theme="dark"] body #main :where(.event-pill,.team-role,.card-pill,.hero-card-pill,.trust-eyebrow,.civic-tag-row,.civic-unified-kicker),
body.dark #main :where(.event-pill,.team-role,.card-pill,.hero-card-pill,.trust-eyebrow,.civic-tag-row,.civic-unified-kicker){
  background:var(--cx-surface-3)!important;
  color:var(--cx-link)!important;
}
