#map {
  --map-pin-color-inactive: #0A0C0D;
  --map-pin-color-hover: #1B3D44;
  --map-pin-color-active: #306E7B;
  --map-pin-color-focus-border: #1B3D44;
}

#map.map-brand-aquagir {
  --map-pin-color-inactive: #0A0C0D;
  --map-pin-color-hover: #1B3D44;
  --map-pin-color-active: #306E7B;
  --map-pin-color-focus-border: #1B3D44;
}

#map .svg-marker-wrapper .svg-marker-path {
  fill: var(--map-pin-color-inactive);
  stroke: transparent;
  stroke-width: 0;
  transition: fill 0.2s ease;
}

#map .svg-marker-path.hovered,
#map .svg-marker-wrapper:hover .svg-marker-path {
  fill: var(--map-pin-color-hover);
}

#map .svg-marker-wrapper.marker-active .svg-marker-path,
#map .svg-marker-wrapper:active .svg-marker-path {
  fill: var(--map-pin-color-active);
}

#map .svg-marker-wrapper:focus .svg-marker-path {
  fill: var(--map-pin-color-active);
  stroke: var(--map-pin-color-focus-border);
  stroke-width: 1px !important;
  outline: none;
}

#map .svg-marker-wrapper.marker-secondary .svg-marker-path {
  fill: var(--map-pin-color-inactive);
}

#map .svg-marker-wrapper.marker-secondary .svg-marker-path.hovered,
#map .svg-marker-wrapper.marker-secondary:hover .svg-marker-path {
  fill: var(--map-pin-color-hover);
}

#map .svg-marker-wrapper.marker-secondary.marker-active .svg-marker-path,
#map .svg-marker-wrapper.marker-secondary:active .svg-marker-path {
  fill: var(--map-pin-color-active);
}

#map .svg-marker-wrapper.marker-secondary:focus .svg-marker-path {
  fill: var(--map-pin-color-active);
  stroke: var(--map-pin-color-focus-border);
  stroke-width: 1px !important;
  outline: none;
}
