/* Dark mode: avoid same/similar text and background (e.g. white-on-light or dark-on-dark).
   Include on landing pages that use .cta/.btn with background: var(--text-color); color: #fff
   or .btn.primary with hardcoded #fff/#111, so dark mode gets readable contrast. */
body.dark-mode .btn:not(.btn-google-signin):not(.secondary) {
  background: var(--bg-color) !important;
  color: var(--text-color) !important;
  border-color: var(--border-color);
}
body.dark-mode .btn:not(.btn-google-signin):not(.secondary):hover {
  background: var(--text-secondary-color) !important;
  color: var(--bg-color) !important;
}
body.dark-mode .cta:not(.secondary) {
  background: var(--bg-color) !important;
  color: var(--text-color) !important;
  border: 1px solid var(--border-color);
}
body.dark-mode .cta:not(.secondary):hover {
  background: var(--text-secondary-color) !important;
  color: var(--bg-color) !important;
}
body.dark-mode .seg button.active {
  background: var(--text-color) !important;
  color: var(--bg-color) !important;
}
/* .btn.primary with hardcoded #fff/#111: in dark mode use contrasting colors */
body.dark-mode .btn.primary {
  background: var(--primary-color) !important;
  color: var(--bg-color) !important;
  border-color: var(--primary-color);
}
body.dark-mode .wrap .btn.primary,
body.dark-mode .cta-box .btn {
  color: var(--bg-color) !important;
}