html {
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  color-scheme: light;
}

html[data-map-theme="dark"] {
  color-scheme: dark;
}

body.map-theme {
  margin: 0;
  min-height: 100vh;
  background: var(--map-bg);
  color: var(--map-text-1);
  font-family: var(--map-font-sans);
}

.map-theme {
  --bs-body-font-family: var(--map-font-sans);
  --bs-body-color: var(--map-text-1);
  --bs-body-bg: var(--map-bg);
  --bs-secondary-color: var(--map-text-2);
  --bs-secondary-color-rgb: 74, 76, 106;
  --bs-tertiary-color: var(--map-text-3);
  --bs-tertiary-color-rgb: 112, 112, 160;
  --bs-primary: var(--map-ink);
  --bs-primary-rgb: 28, 30, 48;
  --bs-success: var(--map-green-dark);
  --bs-success-rgb: 63, 212, 88;
  --bs-danger: var(--map-red);
  --bs-danger-rgb: 255, 51, 74;
  --bs-warning: var(--map-yellow);
  --bs-warning-rgb: 255, 219, 74;
  --bs-info: var(--map-purple);
  --bs-info-rgb: 69, 84, 214;
  --bs-border-color: var(--map-border);
  --bs-border-color-translucent: rgba(208, 208, 226, 0.7);
  --bs-light: var(--map-surface-2);
  --bs-light-rgb: 247, 247, 252;
  --bs-dark: var(--map-ink);
  --bs-dark-rgb: 28, 30, 48;
  --bs-border-radius: var(--map-radius-md);
  --bs-border-radius-sm: var(--map-radius-sm);
  --bs-border-radius-lg: var(--map-radius-lg);
  --bs-border-radius-xl: var(--map-radius-xl);
  --bs-box-shadow-sm: var(--map-shadow-sm);
  --bs-box-shadow: var(--map-shadow-md);
  --bs-box-shadow-lg: var(--map-shadow-lg);
  --bs-link-color: var(--map-purple);
  --bs-link-hover-color: var(--map-ink);
}

[data-map-theme="dark"] .map-theme {
  --bs-body-color: var(--map-text-1);
  --bs-body-bg: var(--map-bg);
  --bs-secondary-color: var(--map-text-2);
  --bs-secondary-color-rgb: 200, 204, 224;
  --bs-tertiary-color: var(--map-text-3);
  --bs-tertiary-color-rgb: 154, 160, 191;
  --bs-primary: var(--map-primary-bg);
  --bs-primary-rgb: 84, 229, 107;
  --bs-success: var(--map-green);
  --bs-success-rgb: 84, 229, 107;
  --bs-danger: var(--map-red);
  --bs-danger-rgb: 255, 92, 109;
  --bs-warning: var(--map-yellow);
  --bs-warning-rgb: 255, 209, 102;
  --bs-info: var(--map-purple);
  --bs-info-rgb: 124, 134, 255;
  --bs-border-color: var(--map-border);
  --bs-border-color-translucent: rgba(255, 255, 255, 0.14);
  --bs-light: var(--map-surface-2);
  --bs-light-rgb: 23, 27, 43;
  --bs-dark: var(--map-bg);
  --bs-dark-rgb: 8, 10, 18;
  --bs-link-color: var(--map-sky);
  --bs-link-hover-color: var(--map-green);
}

.map-theme *,
.map-theme *::before,
.map-theme *::after {
  box-sizing: border-box;
}

.map-theme ::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.map-theme ::-webkit-scrollbar-track {
  background: transparent;
}

.map-theme ::-webkit-scrollbar-thumb {
  background: var(--map-border-2);
  border-radius: 999px;
}

.map-theme ::-webkit-scrollbar-thumb:hover {
  background: var(--map-border-3);
}

[data-map-theme="dark"] .map-theme img:not([src*=".svg"]) {
  color-scheme: normal;
}

@keyframes map-spin {
  to {
    transform: rotate(360deg);
  }
}
