/* Vector map of Ukraine (oblasts + Kyiv city + AR Crimea + Sevastopol).
   Overrides the old schematic-tile-grid rules for .rmap / .rmap__tile in app.css (kept there
   for reference by other markup) so the inline SVG below renders as a real map, not a grid. */

.rmap.rmap--svg {
  display: block;
  width: 100%;
  aspect-ratio: auto;
}

.rmap--svg .rmap__svg {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  overflow: visible;
  filter: drop-shadow(0 14px 28px rgba(26, 56, 112, .16));
}

/* Kill the old tile-grid box model + hover tooltip on the SVG links */
.rmap--svg .rmap__tile {
  position: static;
  aspect-ratio: auto;
  display: inline;
  place-items: unset;
  border-radius: 0;
  background: none;
  border: 0;
  padding: 0;
  font-size: 0;
  transform: none;
  cursor: pointer;
  outline: none;
}
.rmap--svg .rmap__tile:hover,
.rmap--svg .rmap__tile.is-hl,
.rmap--svg .rmap__tile:focus-visible {
  background: none;
  transform: none;
}
.rmap--svg .rmap__tile[data-name]:hover::after,
.rmap--svg .rmap__tile::after {
  content: none;
}

.rmap__shape {
  fill: #fff;
  stroke: var(--blue-light, #bdcae2);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
  transition: fill .2s var(--ease, ease), stroke .2s var(--ease, ease);
}

.rmap__marker {
  fill: #fff;
  stroke: var(--blue-light, #bdcae2);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
  transition: fill .2s var(--ease, ease), stroke .2s var(--ease, ease);
}

/* Підсвічена/обрана область — контур у колір заливки: регіон виглядає цілісно, без внутрішніх ліній
   (напр. межа м. Київ ↔ Київська область), а межі з сусідами лишаються світлими лініями сусідів. */
.rmap__tile:hover .rmap__shape,
.rmap__tile.is-hl .rmap__shape,
.rmap__tile:hover .rmap__marker,
.rmap__tile.is-hl .rmap__marker {
  fill: var(--primary, #2b55a2);
  stroke: var(--primary, #2b55a2);
  stroke-width: 1;
}

.rmap__tile.is-current .rmap__shape,
.rmap__tile.is-current .rmap__marker,
.rmap__tile.is-current:hover .rmap__shape,
.rmap__tile.is-current.is-hl .rmap__shape,
.rmap__tile.is-current:hover .rmap__marker,
.rmap__tile.is-current.is-hl .rmap__marker {
  fill: var(--accent, #ffcc00);
  stroke: var(--accent, #ffcc00);
  stroke-width: 1;
}

.rmap__tile:focus-visible .rmap__shape,
.rmap__tile:focus-visible .rmap__marker {
  stroke: #0d0802;
  stroke-width: 2.5;
}

/* Keep Kyiv-city / Sevastopol dot markers a readable, constant screen size */
.rmap__marker {
  transition: fill .2s var(--ease, ease), stroke .2s var(--ease, ease), r .2s var(--ease, ease);
}
.rmap__tile:hover .rmap__marker,
.rmap__tile.is-hl .rmap__marker,
.rmap__tile:focus-visible .rmap__marker {
  r: 8.5;
}

@media (max-width: 640px) {
  .rmap--svg .rmap__svg { max-width: 100%; }
}
