/* Force darker card surfaces and text in dark mode */
.dark .frontpage .homepage-layout,
.dark .charts,
.dark .records,
.dark .about,
.dark .reports {
  --homepage-card-surface: #1e1e1e;          /* change this */
  --homepage-card-border: rgba(255,255,255,0.12);
  --homepage-card-shadow: 0 4px 12px rgba(0,0,0,0.35);
}

.dark #almanac-modal .modal-content,
.dark #almanac-modal {
  background: #1e1e1e !important;
  --almanac-subcard-surface: #1e1e1e;
}

/* Body / page background */
[data-bs-theme="dark"] body,
.dark body {
  background-color: #121212 !important;
  color: #e5e7eb;
}

/* Muted text */
.dark .frontpage .homepage-card--observations .station-observations tbody tr td:first-child,
.dark .records .records-section-card__period-header-cell,
.dark .snapshot-metric-label {
  color: #94a3b8 !important;
}

/* Chart buttons */
.dark .charts .wx-buttons button,
.dark .charts .wx-buttons .btn {
  background: #0f172a !important;
  border-color: rgba(255,255,255,0.2) !important;
  color: #f1f5f9 !important;
}

/* Example: change the blue accent used in selects etc. */
.dark .snapshot-period-select {
  background-color: #1e40af !important;
}