.wr-rm{
  position: relative;
  width: 100%;
  min-width: 500px;
  height: 700px;
  margin-inline: auto;
}

.wr-rm__svg{
  position: absolute;
  inset: 0;
}

.wr-rm__base-map,
.wr-rm__overlay{
  position: absolute;
  inset: 0;
}

.wr-rm__base-map{
  pointer-events: none;
}

.wr-rm__overlay{
  pointer-events: none;
}

.wr-rm__overlay [data-region]{
  pointer-events: auto;
}

.wr-rm__svg svg{
  width: 100%;
  height: 100%;
  display: block;
}

.wr-rm__svg svg [data-region]{
  cursor: pointer;
  transition: fill .18s ease;
  vector-effect: non-scaling-stroke;
}

.wr-rm__svg svg [data-region].is-active,
.wr-rm__svg svg [data-region].is-active:hover{
  fill: var(--wr-rm-active-fill, #FF2D7A) !important;
}

.wr-rm__svg svg [data-region]:focus{
  outline: none;
}

.wr-rm__svg svg [data-region].is-active{
  /* kolor aktywnego regionu ustawiasz kontrolką w Elementorze (selector) */
}

.wr-rm__pin-layer{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.wr-rm__pin{
  transform-origin: center;
}

.wr-rm__pin-bg{
  fill: #fff;
}

.wr-rm__pin-img{
  clip-path: none;
}

.wr-rm__pin-ring{
  stroke: #FF2D7A;
  stroke-width: 4;
}

.wr-rm__empty{
  padding: 14px 16px;
  border: 1px dashed rgba(0,0,0,0.25);
}

@media (max-width: 1024px){
  .wr-rm{
    width: 100%;
    height: 620px;
  }
}

@media (max-width: 767px){
  .wr-rm{
    height: 500px;
  }
}