/* CashShield DM-1 — midnight surface tokens + light-fill ink lock
   Principle: text/icon follows the surface, not page theme alone.
   Dark surface → --on-dark* · Light/white fill → --on-light* · Emphasis → #52 --on-emphasis*
   Cloud theme is intentionally untouched (all rules scoped to midnight). */

body[data-theme="midnight"] {
  --on-dark: #f3f6ff;
  --on-dark-muted: rgba(243, 246, 255, .78);
  --on-light: #101a37;
  --on-light-muted: #3d4d73;
  --placeholder-on-dark: rgba(243, 246, 255, .55);
  --border-on-dark: rgba(243, 246, 255, .28);
}

/* ——— Shared light / white fills: force dark ink ———
   Pale/white backgrounds keep cloud fills under midnight; --ink/--muted alone would paint white-on-white. */

body[data-theme="midnight"] .google-button,
body[data-theme="midnight"] .demo-option,
body[data-theme="midnight"] .score-pill,
body[data-theme="midnight"] .welcome-dialog .welcome-note,
body[data-theme="midnight"] .auth-setup-note,
body[data-theme="midnight"] .new-account-fields,
body[data-theme="midnight"] .profile-form,
body[data-theme="midnight"] .household-card,
body[data-theme="midnight"] .household-invite-dialog,
body[data-theme="midnight"] .household-invite-banner,
body[data-theme="midnight"] .developer-preview-actions,
body[data-theme="midnight"] .usage-status-card,
body[data-theme="midnight"] .receipt-upgrade,
body[data-theme="midnight"] .receipt-usage,
body[data-theme="midnight"] .premium-status,
body[data-theme="midnight"] #billingCard.premium-active {
  color: var(--on-light);
}

/* White-fill secondary CTAs only — do not blanket .secondary (transparent
   secondaries on midnight --card must keep light ink, e.g. filter footer). */
body[data-theme="midnight"] #emailCreate,
body[data-theme="midnight"] .auth-actions .secondary,
body[data-theme="midnight"] #signOutButton,
body[data-theme="midnight"] .invite-form .secondary,
body[data-theme="midnight"] .pending-invite-actions .secondary,
body[data-theme="midnight"] .household-invite-actions .secondary,
body[data-theme="midnight"] .profile-actions .secondary,
body[data-theme="midnight"] #billingCard.premium-active .secondary,
body[data-theme="midnight"] .dialog-actions .secondary,
body[data-theme="midnight"] .developer-preview-buttons .secondary,
body[data-theme="midnight"] #closeBuildInfo {
  color: var(--on-light);
}

/* Muted copy on light fills */
body[data-theme="midnight"] .demo-option span,
body[data-theme="midnight"] .profile-form-head small,
body[data-theme="midnight"] .household-card > div:first-child small,
body[data-theme="midnight"] .household-card > div:first-child span,
body[data-theme="midnight"] .member-row span,
body[data-theme="midnight"] .developer-preview-actions p,
body[data-theme="midnight"] .usage-status-card p,
body[data-theme="midnight"] .new-account-fields label small,
body[data-theme="midnight"] #billingCard.premium-active .section-kicker,
body[data-theme="midnight"] #billingCard.premium-active #billingSummary,
body[data-theme="midnight"] #billingCard.premium-active #billingFeedback,
body[data-theme="midnight"] #billingCard.premium-active p {
  color: var(--on-light-muted);
}

/* Shield Score chip: full on-light for label + value (High bug 5) */
body[data-theme="midnight"] .score-pill small,
body[data-theme="midnight"] .score-pill strong {
  color: var(--on-light);
}

/* Titles / primary labels on light fills */
body[data-theme="midnight"] .demo-option strong,
body[data-theme="midnight"] .profile-form-head strong,
body[data-theme="midnight"] .household-card > div:first-child strong,
body[data-theme="midnight"] .developer-preview-actions strong,
body[data-theme="midnight"] .usage-status-card h3,
body[data-theme="midnight"] .premium-status small,
body[data-theme="midnight"] .premium-status strong,
body[data-theme="midnight"] #billingCard.premium-active #billingTitle,
body[data-theme="midnight"] #billingCard.premium-active h3 {
  color: var(--on-light);
}

/* Accent glyphs on light chips — brand blue, not midnight ink */
body[data-theme="midnight"] .score-pill > span,
body[data-theme="midnight"] .google-button span {
  color: #285cf4;
}

/* Pale Premium card: keep white CTA borders readable on cream fill */
body[data-theme="midnight"] #billingCard.premium-active .secondary {
  border-color: rgba(16, 26, 55, .22);
}

/* Emphasis / gradient surfaces: preserve light text (#52 --on-emphasis* unchanged) */
body[data-theme="midnight"] .primary-option {
  color: #fff;
}

body[data-theme="midnight"] .primary-option span {
  color: #e9edff;
}

body[data-theme="midnight"] .primary,
body[data-theme="midnight"] button.primary {
  color: #fff;
}

/* Dashboard HOUSEHOLD CASH total tile — cashshield-v15 hardcodes a light
   lavender→white fill (cloud hierarchy). Under midnight that leaves #52
   mint/white ink on a white surface. Promote to CA-primary emphasis
   gradient so label/amount/forecast use --on-emphasis* (cloud untouched).
   Scope to current/default trust only; sync-trust-v27 owns stale/error fills. */
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]),
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"],
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]),
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] {
  background: linear-gradient(135deg, var(--green), #704ee7);
  border-color: rgba(255, 255, 255, .2);
  color: var(--on-emphasis, #fff);
  --forecast-value-color: var(--on-emphasis-muted, rgba(255, 255, 255, .88));
}

body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]) > small,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"] > small,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]) > small,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] > small,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]) .tile-cash-caption,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"] .tile-cash-caption,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]) .tile-cash-caption,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] .tile-cash-caption {
  color: var(--on-emphasis-muted, rgba(255, 255, 255, .88));
}

body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]) > strong,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"] > strong,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]) > strong,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] > strong,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]) .household-cash-current,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"] .household-cash-current,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]) .household-cash-current,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] .household-cash-current {
  color: var(--on-emphasis, #fff);
}

body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]) .forecast-value,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"] .forecast-value,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]) .forecast-value,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] .forecast-value,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative):not([data-trust]) .household-cash-forecast,
body[data-theme="midnight"] .account-forecast-tile.total:not(.negative)[data-trust="current"] .household-cash-forecast,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative):not([data-trust]) .household-cash-forecast,
body[data-theme="midnight"] .account-forecast-tile.household-cash-tile:not(.negative)[data-trust="current"] .household-cash-forecast {
  color: var(--on-emphasis-muted, rgba(255, 255, 255, .88));
}

/* ——— DM-2: dark-control leftovers (High #2–5) ———
   Buttons without explicit color can keep UA dark buttontext on --card.
   Kickers stay cloud brand blue (#1f4ed2) unless remapped for midnight. */

/* #2 Recurring inactive chips + .small-add (active All purple stays) */
body[data-theme="midnight"] .filter:not(.active),
body[data-theme="midnight"] .small-add {
  color: var(--on-dark-muted);
  border-color: var(--border-on-dark);
  background: rgba(243, 246, 255, .06);
}

body[data-theme="midnight"] .filter:not(.active):hover,
body[data-theme="midnight"] .small-add:hover {
  color: var(--on-dark);
  border-color: rgba(243, 246, 255, .4);
}

/* #3 Page eyebrow + section kickers on dark surfaces (not deep blue-on-navy) */
body[data-theme="midnight"] .eyebrow,
body[data-theme="midnight"] .section-kicker {
  color: var(--on-dark-muted);
}

/* DM-1 light-fill islands: keep kickers on light ink */
body[data-theme="midnight"] .usage-status-card .section-kicker,
body[data-theme="midnight"] #billingCard.premium-active .section-kicker,
body[data-theme="midnight"] .profile-form .section-kicker,
body[data-theme="midnight"] .household-card .section-kicker,
body[data-theme="midnight"] .welcome-dialog .section-kicker,
body[data-theme="midnight"] .auth-setup-note .section-kicker,
body[data-theme="midnight"] .premium-status .section-kicker,
body[data-theme="midnight"] .receipt-upgrade .section-kicker,
body[data-theme="midnight"] .receipt-usage .section-kicker,
body[data-theme="midnight"] .new-account-fields .section-kicker,
body[data-theme="midnight"] .demo-option .section-kicker,
body[data-theme="midnight"] .score-pill .section-kicker {
  color: var(--on-light-muted);
}

/* #4 Keep as buffer: white field stays; value + caret use on-light
   (household-cash used var(--ink), which is light under midnight → white-on-white).
   Do not touch STS math or gradient label text. */
body[data-theme="midnight"] .dashboard-buffer-row #bufferAmount {
  color: var(--on-light);
  caret-color: var(--on-light);
  background: #fff;
}

/* #5 Calendar month chevrons */
body[data-theme="midnight"] .month-switch button {
  color: var(--on-dark);
  border-color: var(--border-on-dark);
  background: rgba(243, 246, 255, .08);
  box-shadow: none;
}

/* Auth "Secure cloud sync" close control: UA buttontext stays dark on #12172a.
   Keep layout; restore a visible 44x44 target with a white X and light border. */
body[data-theme="midnight"] #authDialog #closeAuth {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 44px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  line-height: 1;
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  border: 1px solid rgba(243, 246, 255, .48);
  background: #1a2140;
  box-shadow: none;
}

body[data-theme="midnight"] #authDialog #closeAuth:hover,
body[data-theme="midnight"] #authDialog #closeAuth:focus-visible {
  color: #fff;
  border-color: rgba(243, 246, 255, .72);
  background: #232b52;
}

body[data-theme="midnight"] .month-switch button:hover {
  border-color: rgba(243, 246, 255, .42);
  background: rgba(243, 246, 255, .12);
}