/* Dual Theme Support - keep layout identical, change only palette */

/* Base surface and text colors when dark */
body.theme-dark,
html[data-theme="dark"] body {
  background-color: #0f1419; /* neutral dark */
  color: #e6e8eb; /* high-contrast text */
}

/* Page surfaces: use same paddings/margins as light; only recolor */
body.theme-dark .page,
body.theme-dark .page__content,
body.theme-dark .page__inner-wrap,
html[data-theme="dark"] .page,
html[data-theme="dark"] .page__content,
html[data-theme="dark"] .page__inner-wrap {
  background-color: #161b22;
  color: #e6e8eb;
}

/* Masthead/nav */
body.theme-dark .masthead,
html[data-theme="dark"] .masthead {
  background-color: #161b22;
  border-bottom-color: #30363d;
}

body.theme-dark .greedy-nav,
html[data-theme="dark"] .greedy-nav {
  background: transparent;
}

body.theme-dark .greedy-nav a,
html[data-theme="dark"] .greedy-nav a {
  color: #e6e8eb;
  text-shadow: none;
}
body.theme-dark .greedy-nav a:hover,
html[data-theme="dark"] .greedy-nav a:hover { color: #fff; }

/* Links */
body.theme-dark a,
html[data-theme="dark"] a { color: #58a6ff; }
body.theme-dark a:hover,
html[data-theme="dark"] a:hover { color: #79c0ff; }

/* Widgets/sidebars */
body.theme-dark .sidebar,
html[data-theme="dark"] .sidebar { background-color: #161b22; }

/* Headings */
body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark h5,
body.theme-dark h6,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6 { color: #e6e8eb; }

/* Tables and borders */
html[data-theme="dark"] table,
body.theme-dark table { color: #e6e8eb; }
html[data-theme="dark"] hr,
body.theme-dark hr { border-color: #30363d; }

/* Code blocks */
html[data-theme="dark"] pre,
body.theme-dark pre,
html[data-theme="dark"] code,
body.theme-dark code { background: #0b1021; color: #e6e8eb; }

/* Hero overlays: keep behavior but slightly darken for readability */
body.theme-dark .page__hero--overlay::before,
html[data-theme="dark"] .page__hero--overlay::before {
  background-color: rgba(0,0,0,0.35);
}

/* Footer */
html[data-theme="dark"] .page__footer,
body.theme-dark .page__footer {
  background: #0f1419;
  border-top-color: #30363d;
  color: #c9d1d9;
}