/* Theme controls and overrides apply at every screen size. */
:root {
  color-scheme: light;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
}

.theme-toggle:hover {
  background: var(--beige);
}

.theme-toggle:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

.theme-toggle svg {
  width: 22px;
  height: 22px;
}

.theme-toggle .theme-icon-sun,
:root[data-theme="dark"] .theme-icon-moon {
  display: none;
}

:root[data-theme="dark"] .theme-icon-sun {
  display: block;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #111c17;
  --off-white: #16231c;
  --beige: #24372c;
  --ink: #edf3ee;
  --ink-soft: #b8c8bd;
  --line: rgba(218, 234, 221, 0.18);
  --gold: #d2b87c;
  --gold-light: #e4cc97;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.24);
}

[data-theme="dark"] .site-header {
  background: rgba(17, 28, 23, 0.97);
}

[data-theme="dark"] .mobile-nav,
[data-theme="dark"] .lang-switch,
[data-theme="dark"] .operations,
[data-theme="dark"] .news,
[data-theme="dark"] .news-card,
[data-theme="dark"] .leader-card {
  background: var(--paper);
}

[data-theme="dark"] .section-head h2,
[data-theme="dark"] .about-copy h2,
[data-theme="dark"] .about-copy .highlight,
[data-theme="dark"] .brand-text strong,
[data-theme="dark"] .dropdown a:hover,
[data-theme="dark"] .mobile-top-link,
[data-theme="dark"] .mobile-sub a:hover,
[data-theme="dark"] .leader-card h3,
[data-theme="dark"] .news-content h3 {
  color: var(--ink);
}

[data-theme="dark"] .news-link {
  color: var(--gold-light);
}

[data-theme="dark"] .hamburger span {
  background: var(--ink);
}

[data-theme="dark"] .lang-switch button.active {
  background: var(--gold);
  color: var(--forest-deep);
}

[data-theme="dark"] .caption-tag {
  background: rgba(17, 28, 23, 0.94);
  color: var(--ink);
}
