/* Native color-scheme follows the OS unless the reader chooses an override. */
:root {
  color-scheme: light dark;
  --contrast: light-dark(#222222, #e8eaed);
  --contrast-2: light-dark(#575760, #b7bcc6);
  --contrast-3: light-dark(#b2b2be, #757d8c);
  --base: light-dark(#f0f0f0, #242830);
  --base-3: light-dark(#ffffff, #181b20);
  --accent: light-dark(#206fb4, #8fc4f5);
  --theme-text: light-dark(#3a3a3a, #d8dce3);
  --theme-muted: light-dark(#595959, #acb3bf);
  --theme-link: light-dark(#1e73be, #8fc4f5);
  --theme-link-hover: light-dark(#000000, #c5e2ff);
  --theme-surface: light-dark(#fafafa, #20242b);
  --theme-border: light-dark(#eaeaea, #3d444f);
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

body { background-color: var(--base-3); color: var(--theme-text); }
a { color: var(--theme-link); }
a:hover, a:focus, a:active { color: var(--theme-link-hover); }
.site-header { background-color: var(--base-3); color: var(--theme-text); }
.site-header a { color: var(--theme-text); }
.main-title a, .main-title a:hover { color: var(--contrast); }
.site-description { color: var(--theme-muted); }
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
  color: light-dark(#012b4f, #c5e2ff);
}
.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
.main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a {
  color: light-dark(#378dd9, #c5e2ff);
}
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .page-header,
.one-container .container,
.separate-containers .paging-navigation,
.inside-page-header,
.footer-widgets { background-color: var(--base-3); }
.entry-meta, .entry-meta a { color: var(--theme-muted); }
.entry-meta a:hover { color: var(--theme-link); }
.sidebar .widget .widget-title, .footer-widgets .widget-title { color: var(--contrast); }
#right-sidebar aside { background: var(--theme-surface); border-color: var(--theme-border); }
#block-5 .widget_text { background: var(--theme-surface); }
.blog .content-area .inside-article,
.archive .content-area .inside-article { border-bottom-color: var(--theme-border); }
.site-info a:hover { color: #c5e2ff; }

/* Keep article structure and native controls legible in either scheme. */
pre { background: light-dark(rgba(0, 0, 0, .05), rgba(255, 255, 255, .06)); }
blockquote { border-left-color: var(--theme-border); }
table, td, th { border-color: var(--theme-border); }
hr { background-color: var(--theme-border); }
input[type="text"], input[type="email"], input[type="url"],
input[type="password"], input[type="search"], input[type="tel"],
input[type="number"], textarea, select {
  color: var(--theme-text);
  background-color: var(--theme-surface);
  border-color: light-dark(#cccccc, #596272);
}
input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus,
input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus,
input[type="number"]:focus, textarea:focus, select:focus {
  color: var(--theme-text);
  background-color: var(--base-3);
  border-color: var(--accent);
}
.site-block-social-links.is-style-logos-only .site-social-link-github { color: var(--contrast); }

/* Outside the collapsible menu: always available on phones and desktops. */
.inside-header { position: relative; padding-right: 100px; }
.site-header .theme-toggle {
  position: absolute;
  right: 40px;
  top: 48px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--theme-border);
  border-radius: 50%;
  background: var(--base-3);
  color: var(--contrast-2);
}
.site-header .theme-toggle:hover,
.site-header .theme-toggle:focus { background: var(--base); color: var(--contrast); }
.site-header .theme-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.theme-toggle[hidden], .theme-toggle svg[hidden] { display: none; }
@media (max-width: 768px) {
  .inside-header { padding-right: 70px; padding-left: 70px; }
  .site-header .theme-toggle { right: 15px; top: 36px; }
}