/* ── DARK MODE — additional component overrides ──── */
/* Dashboard is dark-first (no overrides needed). */
/* Landing page still uses light/dark toggle. */

[data-theme="dark"] #navbar {
  background: rgba(10,10,16,0.92);
  border-bottom-color: rgba(255,255,255,0.06);
}

[data-theme="dark"] .feature-card,
[data-theme="dark"] .feat-card {
  background: #13131F;
  border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .feature-card:hover,
[data-theme="dark"] .feat-card:hover {
  background: #1A1A28;
}

[data-theme="dark"] .testimonial-card,
[data-theme="dark"] .testi-card {
  background: #13131F;
  border-color: rgba(255,255,255,0.07);
}

[data-theme="dark"] .pricing-card {
  background: #13131F;
  border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .pricing-card.popular {
  background: var(--ink);
  border-color: var(--ink);
}

[data-theme="dark"] .problem-card {
  background: rgba(220,38,38,0.08);
  border-color: rgba(220,38,38,0.15);
}

[data-theme="dark"] .auth-drawer {
  background: #13131F;
}

[data-theme="dark"] .alert-green { background: var(--profit-bg); border-color: var(--profit-border); }
[data-theme="dark"] .alert-red { background: var(--loss-bg); border-color: var(--loss-border); }
[data-theme="dark"] .alert-gold { background: var(--caution-bg); border-color: var(--caution-border); }

/* Mirror Moment card stays dark in both modes */
.mirror-hero,
.mirror-preview,
.mirror-card {
  background: var(--ink) !important;
}

/* Pricing featured card stays dark in both modes */
.price-card.featured,
.pricing-card.popular {
  background: var(--ink) !important;
  border-color: var(--ink) !important;
}

/* Journal selects / dropdowns in dark mode */
[data-theme="dark"] select,
[data-theme="dark"] .sel,
[data-theme="dark"] .j-mapping-select,
[data-theme="dark"] .j-filter-select,
[data-theme="dark"] .j-col-type-select,
[data-theme="dark"] .j-field select {
  background-color: var(--surface-2);
  color: var(--text-primary);
  border-color: var(--border);
}
[data-theme="dark"] select option,
[data-theme="dark"] .sel option,
[data-theme="dark"] .j-mapping-select option,
[data-theme="dark"] .j-filter-select option,
[data-theme="dark"] .j-col-type-select option,
[data-theme="dark"] .j-field select option {
  background-color: var(--surface-2);
  color: var(--text-primary);
}