/* Dotted world map of where visitors come from.
   Data is fetched from two static JSON files; see assets/js/visitor-map.js. */

.visitor-map {
  --vmap-land: #b4b4c2;
  --vmap-dot: var(--global-theme-color);

  max-width: 420px;
  margin: 0 auto;
  /* Stays out of the layout until there is data to draw. */
  display: none;
}

.visitor-map.is-ready {
  display: block;
}

html[data-theme="dark"] .visitor-map {
  --vmap-land: #6b6b7a;
}

.vmap-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.vmap-land {
  fill: var(--vmap-land);
}

.vmap-dot {
  fill: var(--vmap-dot);
  fill-opacity: 0.78;
}