/* Generated at build time from config/site.yml's `colors:` section --
   edit the config and rebuild, don't edit this file by hand. */
:root,
:root[data-theme="light"] {
  --bg: #f2f2f2;
  --card-bg: #ffffff;
  --text: #333333;
  --meta-text: #767676;
  --accent: #ff6600;
  --nav-bg: #e4e4e4;
  --nav-text: #333333;
  --border: #dddddd;
  --nav-border: #767676;
  --pill-bg: #cccccc;
  --search-bg: #ffffff;
  --hover-invert: #767676;
  --badge-hover-text: #ffffff;
}

/* WARNING: the dark values appear twice below and must stay identical.
   CSS can't share a declaration block across an @media boundary, so
   "follow the system" and "explicitly switched" can't be written
   together. (A single declaration would be possible via light-dark(),
   but that needs Safari 17.5+ / Chrome 123+, and colors would fall
   apart completely in older browsers.) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #444444;
    --card-bg: #3a3a3a;
    --text: #999999;
    --meta-text: #8c8c8c;
    --accent: #ff6600;
    --nav-bg: #3a3a3a;
    --nav-text: #999999;
    --border: #2a2a2a;
    --nav-border: #8c8c8c;
    --pill-bg: #545454;
    --search-bg: #eeeeee;
    --hover-invert: #ffffff;
    --badge-hover-text: var(--accent);
  }
}

:root[data-theme="dark"] {
  --bg: #444444;
  --card-bg: #3a3a3a;
  --text: #999999;
  --meta-text: #8c8c8c;
  --accent: #ff6600;
  --nav-bg: #3a3a3a;
  --nav-text: #999999;
  --border: #2a2a2a;
  --nav-border: #8c8c8c;
  --pill-bg: #545454;
  --search-bg: #eeeeee;
  --hover-invert: #ffffff;
  --badge-hover-text: var(--accent);
}