#map-tooltip {
  position: absolute;
  pointer-events: none;

  padding: var(--tooltip-padding);
  border-radius: var(--tooltip-radius);

  background: var(--tooltip-bg);
  border: var(--tooltip-border);

  color: var(--tooltip-color);
  font-size: var(--tooltip-font-size);
  font-family: system-ui, sans-serif;

  box-shadow: var(--tooltip-shadow);

  z-index: 1000;
}

#map-tooltip .tooltip-city {
  font-weight: 700;
}

#map-tooltip .tooltip-country {
  color: var(--color-text-muted);
  font-size: 11px;
}

#globe-container {
  position: relative;
}

#map-toggle-btn {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 20;

  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--color-border-medium);

  background: var(--color-overlay-bg);
  color: var(--color-text-base);

  font-size: 13px;
  font-weight: 600;
  cursor: pointer;

  backdrop-filter: blur(6px);
}

#map-toggle-btn:hover {
  background: rgba(30, 41, 59, 0.95);
}

#globe-container {
  position: relative;
}

#map-toggle-btn {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 20;

  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--color-border-medium);

  background: var(--color-overlay-bg);
  color: var(--color-text-base);

  font-size: 13px;
  font-weight: 600;
  cursor: pointer;

  backdrop-filter: blur(6px);
}

#map-toggle-btn:hover {
  background: rgba(30, 41, 59, 0.95);
}
