.visitor-chart-wrap {
  position: relative;
  margin-top: 8px;
}

.visitor-chart-wrap .visitor-chart {
  margin-top: 0;
}

.visitor-chart circle {
  cursor: pointer;
  transition: r 0.12s, fill 0.12s;
}

.visitor-chart circle:hover,
.visitor-chart circle:focus {
  fill: #3573ee;
  outline: none;
  r: 7px;
}

.visitor-chart-tooltip {
  position: absolute;
  z-index: 3;
  transform: translateY(calc(-100% - 10px));
  min-width: 145px;
  padding: 10px 12px;
  border-radius: 9px;
  background: #17233a;
  color: #fff;
  box-shadow: 0 8px 25px #0f172a55;
  pointer-events: none;
  text-align: left;
}

.visitor-chart-tooltip::after {
  content: "";
  position: absolute;
  left: var(--visitor-tooltip-arrow, 50%);
  bottom: -6px;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #17233a;
  border-bottom: 0;
}

.visitor-chart-tooltip b,
.visitor-chart-tooltip span,
.visitor-chart-tooltip small {
  display: block;
}

.visitor-chart-tooltip b {
  margin-bottom: 4px;
  color: #b9c7db;
  font-size: 12px;
}

.visitor-chart-tooltip span {
  font-size: 13px;
}

.visitor-chart-tooltip strong {
  font-size: 17px;
}

.visitor-chart-tooltip small {
  margin-top: 2px;
  color: #b9c7db;
  font-size: 11px;
}