/**
 * @file
 * Clickable Missouri region map (clickable_map paragraph).
 */

.clickable-map-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 1rem;
  margin-block: 1rem 1.5rem;
}

.clickable-map-map-wrapper,
.clickable-map-items-wrapper {
  width: 100%;
}

@media (min-width: 768px) {
  .clickable-map-map-wrapper {
    width: calc(50% - 0.5rem);
  }

  .clickable-map-map-wrapper.full-width {
    width: 100%;
  }

  .clickable-map-items-wrapper {
    width: calc(50% - 0.5rem);
  }

  .clickable-map-items-wrapper.zero-width {
    display: none;
  }
}

.hover-map.clickable-map {
  width: 100%;
  height: auto;
}

.hover-map.clickable-map svg {
  display: block;
  width: 100%;
  height: auto;
}

.hover-map.clickable-map .mo-northwest,
.hover-map.clickable-map .mo-northeast,
.hover-map.clickable-map .mo-kansascity,
.hover-map.clickable-map .mo-central,
.hover-map.clickable-map .mo-stlouis,
.hover-map.clickable-map .mo-southwest,
.hover-map.clickable-map .mo-southeast {
  fill: var(--sml-orange);
  cursor: pointer;
}

.hover-map.clickable-map .mo-northwest.active,
.hover-map.clickable-map .mo-northwest:hover,
.hover-map.clickable-map .mo-northeast.active,
.hover-map.clickable-map .mo-northeast:hover,
.hover-map.clickable-map .mo-kansascity.active,
.hover-map.clickable-map .mo-kansascity:hover,
.hover-map.clickable-map .mo-central.active,
.hover-map.clickable-map .mo-central:hover,
.hover-map.clickable-map .mo-stlouis.active,
.hover-map.clickable-map .mo-stlouis:hover,
.hover-map.clickable-map .mo-southwest.active,
.hover-map.clickable-map .mo-southwest:hover,
.hover-map.clickable-map .mo-southeast.active,
.hover-map.clickable-map .mo-southeast:hover {
  fill: var(--sml-purple);
}

.clickable-map-items-wrapper h3 {
  color: var(--sml-black);
  font-family: var(--sml-font-code-pro-bold);
}

.clickable-map-items-wrapper a {
  color: var(--sml-black);
}

.clickable-map-items-wrapper a:hover,
.clickable-map .clickable-region-wrapper.savemo-links a.active {
  color: var(--sml-purple);
  text-decoration: underline;
}

.field.field--name-field-map-title {
  width: 100%;
  margin-bottom: 10px;
}

.clickable-map-links.hide_nw .nw-region,
.clickable-map-links.hide_ne .ne-region,
.clickable-map-links.hide_kc .kc-region,
.clickable-map-links.hide_ce .ce-region,
.clickable-map-links.hide_sl .sl-region,
.clickable-map-links.hide_sw .sw-region,
.clickable-map-links.hide_se .se-region {
  display: none;
}
