/* ── LIGHT THEME (dark is default; toggled via html[data-theme="light"]) ── */
:root[data-theme="light"] {
  --black:    #F4F2ED;
  --surface:  #EBE8E1;
  --surface2: #E1DDD4;
  --border:   #D2CDC2;
  --border2:  #BAB4A8;
  --text:     #1B1A17;
  --muted:    #4F4C45;
  --dim:      #75716A;
  --body:     #34322D;
  --nav-bg:   rgba(244,242,237,0.9);
  --menu-bg:  rgba(244,242,237,0.98);
  --map-filter: grayscale(0.6) contrast(0.95);
  --hero-overlay: rgba(244,242,237,0.86);
}

/* ── THEME TOGGLE ── */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; margin-left: 28px; flex-shrink: 0;
  background: transparent; color: var(--muted);
  border: 1px solid var(--border2); cursor: pointer;
  transition: color 0.2s, border-color 0.2s;
}
.theme-toggle:hover { color: var(--text); border-color: var(--text); }
.theme-toggle svg { width: 16px; height: 16px; }
.theme-toggle .icon-moon { display: none; }
:root[data-theme="light"] .theme-toggle .icon-sun { display: none; }
:root[data-theme="light"] .theme-toggle .icon-moon { display: block; }
#main-nav .nav-links { margin-left: auto; }

@media (max-width: 900px) {
  .theme-toggle { margin-left: auto; margin-right: 12px; }
}
