/* Site-wide dark mode for pages that extend base.html. Shares the dashboard's theme key. */
html[data-dashboard-theme="dark"] {
  background: #fff;
  filter: invert(1) hue-rotate(180deg) brightness(.94) contrast(.96);
  color-scheme: dark;
}

/* Re-invert media so photos, logos and embedded documents keep their real colours. */
html[data-dashboard-theme="dark"] img,
html[data-dashboard-theme="dark"] video,
html[data-dashboard-theme="dark"] iframe,
html[data-dashboard-theme="dark"] canvas,
html[data-dashboard-theme="dark"] embed,
html[data-dashboard-theme="dark"] object,
html[data-dashboard-theme="dark"] [style*="background-image"],
html[data-dashboard-theme="dark"] .eo-theme-keep {
  filter: invert(1) hue-rotate(180deg) brightness(1.06) contrast(1.04);
}

.eo-theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid #d9e4f1; background: #fff; color: #17233d; cursor: pointer;
  transition: background .2s, border-color .2s;
}
.eo-theme-toggle:hover { background: #f1f6fd; border-color: #2874ed; }
.eo-theme-float { position: fixed; left: 16px; bottom: 16px; z-index: 2000; box-shadow: 0 6px 18px rgba(10,31,92,.18); }
.eo-theme-toggle .eo-sun { display: none; }
html[data-dashboard-theme="dark"] .eo-theme-toggle .eo-moon { display: none; }
html[data-dashboard-theme="dark"] .eo-theme-toggle .eo-sun { display: inline; }