/*
 * Frontend + Editor Styles für den Deutschlandkarten-Block.
 * Sichtbares Design: volle Breite, weiße Grenzen, Rotorange-Rot-Magenta-Farben.
 * Barrierefreiheit ergänzt Fokus- und Hover-Zustände, ohne das Layout sichtbar zu verändern.
 */

.wp-block-besd-deutschlandkarte,
.besd-de-map {
  width: 100%;
}

.besd-de-map__svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.besd-de-map__shape {
  stroke: #ffffff;
  stroke-width: 4;
  stroke-linejoin: round;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  transition: filter 160ms ease, transform 160ms ease, opacity 160ms ease, stroke-width 160ms ease;
  transform-box: fill-box;
  transform-origin: center;
}

.besd-de-map__hit-area {
  fill: transparent;
  stroke: transparent;
  stroke-width: 18;
  vector-effect: non-scaling-stroke;
}

.besd-de-map__state-link.is-linked {
  cursor: pointer;
}

.besd-de-map__state-link.is-linked:hover .besd-de-map__shape,
.besd-de-map__state-link.is-linked:focus .besd-de-map__shape,
.besd-de-map__state-link.is-linked:focus-visible .besd-de-map__shape {
  filter: brightness(1.08) saturate(1.08);
  stroke-width: 6;
}

.besd-de-map__state-link.is-linked:active .besd-de-map__shape {
  transform: scale(0.992);
}

.besd-de-map__state-link.is-not-linked .besd-de-map__shape {
  opacity: 0.98;
}

.besd-de-map__editor-note {
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.4;
  opacity: 0.8;
}

.besd-de-map__control-group {
  padding: 10px 0 14px;
  border-top: 1px solid #e0e0e0;
}

.besd-de-map__control-group:first-child {
  border-top: 0;
  padding-top: 0;
}

.besd-de-map__control-title {
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.3;
  font-weight: 600;
}

.editor-styles-wrapper .wp-block-besd-deutschlandkarte,
.block-editor-block-list__layout .wp-block-besd-deutschlandkarte {
  width: 100%;
}
