/* DaveSave CSS
Green colors
  rgb(25,150,25) DaveSave Logo green
  rgb(25,107,36) DaveSave Text green (from Word)
  rgb(0,100,0)   darkgreen (HTML)
Blue colors
  rgb(1,3,99)    DaveSave Logo blue
  rgb(35,77,133) Header 2 text
  rgb(0,0,139)   darkblue (HTML) */

:root {
  color-scheme: light dark;               /* Tell the browser we support both light and dark color schemes. This helps it choose appropriate defaults for built-in UI elements like form controls, scrollbars, etc. */
  --ColorDarkGreen:  rgb(25, 107, 36); /* DaveSave Text  rgb(25, 107, 36) = #196B24 */
  --ColorLogo: rgb(25, 150, 25);    /* DaveSave Logo  rgb(25, 150, 25) = #199619 */
  --ColorHeader2: rgb(35, 77, 133);
}

/* IDs (start with # vs. classes that start with .) */
#email-link {text-decoration: none; color: inherit; cursor: pointer;}

/* Styles that apply in both light and dark mode */
body {line-height: 1.5; font-size: 16px; font-family: Segoe UI Emoji, Helvetica, Tahoma, system-ui, sans-serif; transition: background-color 0.3s ease, color 0.3s ease;}
.TopMenuBaseStyle {font-size: 18px; font-weight: bold; color:darkgreen;}
.TopMenuBaseStyle a:any-link {text-decoration: none; color: inherit;}
.TopMenuHighlightedItem {color: white; background-color: darkgreen; padding: 2px 6px; border-radius: 4px;}
.TopMenuBaseStyle img, .TopMenuBaseStyle a, .TopMenuBaseStyle span {vertical-align: middle;}

/* ---------- Light Mode Overrides ---------- */
@media (prefers-color-scheme: light) {
  body {color: black; background-color: whitesmoke;}
  h1 {color: darkgreen;}
  h2 {color: darkblue;}
  h3 {color: navy; font-style: normal;}
}

/* ---------- Dark Mode Overrides ---------- */
@media (prefers-color-scheme: dark) {
  body {color: gainsboro; background-color: black;}
  h1 {color: darkgreen;}
  h2 {color: rgb(35, 77, 133);}
  h3 {color: dodgerblue; font-style:normal;}
}