.dope-map-widget {
  --dope-popup-bg: #0f1621;
  --dope-popup-text: #ecf4ff;
  --dope-popup-border-color: rgba(255, 255, 255, 0.12);
  --dope-popup-radius: 12px;
  --dope-popup-title-color: #f6f9ff;
  --dope-popup-subtitle-color: #c9d8eb;
  --dope-popup-link-color: #eef5ff;
  --dope-popup-link-bg: #1a3659;
  --dope-popup-link-hover-color: #ffffff;
  --dope-popup-link-hover-bg: #274a75;
  --dope-popup-link-radius: 8px;
  --dope-popup-image-radius: 0px;
  --dope-popup-image-max-height: 140px;
  --dope-popup-close-color: #ffffff;
  --dope-popup-close-bg: rgba(0, 0, 0, 0.4);
  --dope-popup-close-focus: #9cc8ff;
  --dope-info-links-color: #ffffff;
  --dope-info-links-hover-color: #b3d4ff;
  --dope-info-links-bg: transparent;
  --dope-info-links-border-color: rgba(255, 255, 255, 0.14);
  --dope-info-links-left: 16px;
  --dope-info-links-right: auto;
  --dope-info-links-top: auto;
  --dope-info-links-bottom: 16px;
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #0653a6;
}

.dope-map-stage {
  position: relative;
  isolation: isolate;
}

.dope-map-canvas {
  width: 100%;
  height: 520px;
}

.dope-map-info-table {
  position: absolute;
  left: var(--dope-info-links-left);
  right: var(--dope-info-links-right);
  top: var(--dope-info-links-top);
  bottom: var(--dope-info-links-bottom);
  z-index: 20;
  display: block;
  width: auto;
  min-width: max-content;
  max-width: min(420px, calc(100% - 32px));
  max-height: calc(100% - 32px);
  overflow: auto;
  border: 1px solid var(--dope-info-links-border-color);
  border-radius: 12px;
  background: var(--dope-info-links-bg);
  pointer-events: auto;
}

.dope-map-info-table__links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
}

.dope-map-info-table__trigger {
  display: inline-flex;
  align-items: center;
  color: var(--dope-info-links-color);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.dope-map-info-table__trigger:hover,
.dope-map-info-table__trigger:focus-visible {
  color: var(--dope-info-links-hover-color);
}

.dope-map-info-table__trigger:focus-visible {
  outline: 2px solid var(--dope-info-links-hover-color);
  outline-offset: 2px;
}

.dope-map-widget .jvectormap-container {
  background: transparent !important;
}

.dope-map-widget .jvectormap-marker {
  cursor: pointer;
  transition: transform 180ms ease, filter 180ms ease;
  transform-box: fill-box;
  transform-origin: center;
}

.dope-map-widget .jvectormap-marker.dope-map-marker-hover {
  transform: scale(1.18);
  filter: drop-shadow(0 2px 6px rgba(193, 224, 255, 0.45));
}

.dope-map-marker-labels {
  position: absolute;
  inset: 0;
  z-index: 12;
  pointer-events: none;
}

.dope-map-marker-label {
  position: absolute;
  transform: translateY(-50%);
  padding: 0;
  border: 0;
  background: transparent;
  color: #c1e0ff;
  font-size: 10px;
  line-height: 1.2;
  white-space: nowrap;
  pointer-events: auto;
  cursor: pointer;
  transition: transform 180ms ease, color 180ms ease;
  transform-origin: left center;
}

.dope-map-marker-label:hover,
.dope-map-marker-label.is-hovered,
.dope-map-marker-label:focus-visible {
  transform: translateY(-50%) scale(1.08);
  color: #ffffff;
}

.dope-map-marker-label:focus-visible {
  outline: 2px solid #c1e0ff;
  outline-offset: 2px;
}

.dope-map-popup-backdrop {
  position: absolute;
  inset: 0;
  z-index: 30;
  background: rgba(5, 11, 20, 0.58);
}

.dope-map-popup-backdrop[hidden] {
  display: none !important;
}

.dope-map-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 40;
  width: min(520px, calc(100% - 24px));
  max-height: calc(100% - 24px);
  background: var(--dope-popup-bg);
  color: var(--dope-popup-text);
  border: 1px solid var(--dope-popup-border-color);
  border-radius: var(--dope-popup-radius);
  box-shadow: 0 12px 38px rgba(0, 0, 0, 0.42);
  overflow: hidden;
  transform: translate(-50%, -50%);
}

.dope-map-popup[hidden] {
  display: none !important;
}

.dope-map-widget .dope-map-popup__close,
.dope-map-widget .dope-map-popup__close:hover,
.dope-map-widget .dope-map-popup__close:focus,
.dope-map-widget .dope-map-popup__close:active {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 999px !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  box-shadow: none !important;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  text-decoration: none !important;
  color: var(--dope-popup-close-color) !important;
  background: var(--dope-popup-close-bg) !important;
  opacity: 1 !important;
  transform: none !important;
}

.dope-map-widget .dope-map-popup__close:focus-visible {
  outline: 2px solid var(--dope-popup-close-focus);
  outline-offset: 2px;
}

.dope-map-popup__image-wrap {
  display: none;
  width: 100%;
  max-height: var(--dope-popup-image-max-height);
  overflow: hidden;
}

.dope-map-popup__image-wrap.is-visible {
  display: block;
}

.dope-map-popup__image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--dope-popup-image-radius);
}

.dope-map-popup__content {
  max-height: calc(100vh - 120px);
  overflow: auto;
  padding: 14px 14px 16px;
}

.dope-map-widget .dope-map-popup__title {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  color: var(--dope-popup-title-color);
}

.dope-map-widget .dope-map-popup__subtitle {
  margin: 8px 0 0;
  color: var(--dope-popup-subtitle-color);
  font-size: 14px;
  line-height: 1.45;
}

.dope-map-widget .dope-map-popup__subtitle p,
.dope-map-widget .dope-map-popup__subtitle ul,
.dope-map-widget .dope-map-popup__subtitle ol {
  margin: 0 0 8px;
  color: inherit;
}

.dope-map-widget .dope-map-popup__subtitle p:last-child,
.dope-map-widget .dope-map-popup__subtitle ul:last-child,
.dope-map-widget .dope-map-popup__subtitle ol:last-child {
  margin-bottom: 0;
}

.dope-map-widget .dope-map-popup__subtitle a {
  color: inherit;
  text-decoration: underline;
}

.dope-map-widget .dope-map-popup__button,
.dope-map-widget .dope-map-popup__button:visited {
  display: none;
  margin-top: 12px;
  padding: 8px 14px;
  border: 0 !important;
  border-radius: var(--dope-popup-link-radius) !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--dope-popup-link-color) !important;
  background: var(--dope-popup-link-bg) !important;
  opacity: 1 !important;
  transform: none !important;
}

.dope-map-widget .dope-map-popup__button:hover,
.dope-map-widget .dope-map-popup__button:focus,
.dope-map-widget .dope-map-popup__button:active {
  color: var(--dope-popup-link-hover-color) !important;
  background: var(--dope-popup-link-hover-bg) !important;
}

.dope-map-popup__button.is-visible {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.dope-map-widget .dope-map-popup__button:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

@media (max-width: 767px) {
  .dope-map-canvas {
    height: 420px;
  }

  .dope-map-info-table__links {
    gap: 8px 14px;
    padding: 12px;
  }

  .dope-map-popup {
    width: min(360px, calc(100% - 16px));
    max-height: calc(100% - 8px);
  }

  .dope-map-popup__content {
    max-height: calc(100vh - 56px);
  }

  .dope-map-info-table {
    width: min(320px, calc(100% - 24px));
  }
}