/* Shared stats map primitives (flare layout) */



.cprcart-stats-map {

  --cpr-sm-red: #b1181e;

  --cpr-sm-red-dark: #8f1318;

  --cpr-sm-gray: #626367;

  --cpr-sm-dark: #0d0e10;



  box-sizing: border-box;

  line-height: 1.5;

}



.cprcart-stats-map *,

.cprcart-stats-map *::before,

.cprcart-stats-map *::after {

  box-sizing: border-box;

}



.cprcart-stats-map__counter-value {

  font-weight: 700;

  line-height: 1;

  letter-spacing: -0.03em;

  font-variant-numeric: tabular-nums;

}



.cprcart-stats-map__counter-label {

  font-weight: 600;

  text-transform: uppercase;

}



.cprcart-stats-map__svg {

  display: block;

  width: 100%;

  height: 100%;

}



.cprcart-stats-map__pins {

  position: absolute;

  inset: 0;

  pointer-events: none;

}



.cprcart-stats-map__pin {

  position: absolute;

  border: 0;

  padding: 0;

  background: transparent;

  cursor: pointer;

  pointer-events: auto;

  transform: translateZ(0);

  animation: cprcart-sm-pin-enter 0.6s ease backwards;

}



.cprcart-stats-map__pin::before,

.cprcart-stats-map__pin::after {

  content: '';

  position: absolute;

}



.cprcart-stats-map__pin:focus-visible {

  outline: 2px solid var(--cpr-sm-red);

  outline-offset: 4px;

  border-radius: 50%;

}



.cprcart-stats-map__tooltip {

  position: absolute;

  z-index: 10;

  min-width: 140px;

  max-width: 220px;

  padding: 10px 14px;

  border-radius: 10px;

  background: rgba(22, 23, 27, 0.94);

  color: #fff;

  font-size: 0.82rem;

  line-height: 1.45;

  pointer-events: none;

  opacity: 0;

  transform: translate(-50%, -8px);

  transition: opacity 0.2s ease, transform 0.2s ease;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);

}



.cprcart-stats-map__tooltip.is-visible {

  opacity: 1;

  transform: translate(-50%, -12px);

}



.cprcart-stats-map__tooltip strong {

  display: block;

  margin-bottom: 4px;

  font-size: 0.88rem;

  color: #fff;

}



.cprcart-stats-map__tooltip span {

  color: rgba(255, 255, 255, 0.82);

}



@keyframes cprcart-sm-pin-enter {

  from {

    opacity: 0;

    transform: scale(0.4) translateY(8px);

  }



  to {

    opacity: 1;

    transform: scale(1) translateY(0);

  }

}



@media (prefers-reduced-motion: reduce) {

  .cprcart-stats-map__pin,

  .cprcart-stats-map__tooltip {

    animation: none !important;

    transition: none !important;

  }

}