body {
  font-family: 'Nunito', sans-serif;
  transition: background-color 0.3s ease, color 0.3s ease;
  background-color: #f3f4f6;
  color: #1f2937;
}

/* Dark mode overrides */
.dark-mode { background-color: #121212; color: #e5e5e5; }
.dark-mode .bg-white { background-color: #1f1f1f !important; }
.dark-mode select,
.dark-mode input,
.dark-mode button.time-range {
  background-color: #2a2a2a !important; border-color: #444 !important; color: #e5e5e5 !important;
}
.dark-mode button.time-range:hover { background-color: #375a9e !important; }
.dark-mode #plots h2 { color: #e5e5e5; }
/* Plotly container background helper */
.dark-mode .plot-container-bg { background-color: #2a2a2a !important; }

/* Footer */
.site-footer { background: #f7f7f7; padding: 24px 0; margin-top: 24px; text-align: center; border-top: 1px solid #e0e0e0; }
.footer-logos { display: flex; justify-content: center; align-items: center; gap: 32px; margin-bottom: 12px; }
.footer-logos img { max-height: 40px; width: auto; }
.site-footer p { margin: 0; color: #777; font-size: 14px; }

.dark-mode .site-footer { background: #34495e; border-top-color: #2c3e50; }
.dark-mode .site-footer p { color: #ddd; }

/* Corner button */
.corner-button {
  right: 20px;
  padding: 10px 20px;
  background-color: #007bff;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  font-family: sans-serif;
  font-weight: bold;
  transition: background-color 0.2s ease;
  z-index: 1000;
}
.corner-button:hover { background-color: #0056b3; }