/* GradeGrid Website V4.0 - gemeinsame Regionswahl und Marktnachweise. */
.region-switch {
  display: inline-flex;
  align-items: center;
  gap: .18rem;
  padding: .18rem;
  margin-left: .25rem;
  border: 1px solid rgba(16, 35, 39, .13);
  border-radius: 999px;
  background: rgba(255, 255, 255, .72);
}

.region-switch a,
.site-head nav .region-switch a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  min-height: 2rem;
  padding: .25rem;
  margin: 0;
  border: 0;
  border-radius: 999px;
  color: #536468;
  background: transparent;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-decoration: none;
}

.region-switch a[aria-current="page"],
.site-head nav .region-switch a[aria-current="page"] {
  color: #fff;
  background: #087782;
  box-shadow: 0 4px 12px rgba(8, 119, 130, .2);
}

.region-switch a:hover,
.region-switch a:focus-visible,
.site-head nav .region-switch a:hover,
.site-head nav .region-switch a:focus-visible {
  color: #063b43;
  background: rgba(8, 119, 130, .11);
}

.region-switch a[aria-current="page"]:hover,
.region-switch a[aria-current="page"]:focus-visible {
  color: #fff;
  background: #063b43;
}

.market-proof {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .95rem;
  margin: 1rem 0 0;
  padding: .85rem 1rem;
  border: 1px solid rgba(123, 225, 221, .18);
  border-radius: 14px;
  color: rgba(237, 248, 246, .76);
  background: rgba(255, 255, 255, .045);
  font-size: .76rem;
  font-weight: 680;
  list-style: none;
}

.market-proof li {
  display: inline-flex;
  align-items: center;
  gap: .42rem;
}

.market-proof li::before {
  content: "";
  width: .38rem;
  height: .38rem;
  border-radius: 50%;
  background: #2bc0c4;
  box-shadow: 0 0 0 4px rgba(43, 192, 196, .1);
}

@media (max-width: 60rem) {
  .site-head nav .region-switch {
    justify-self: start;
    margin: .25rem .45rem .1rem;
  }

  .site-head nav .region-switch a {
    width: 3.25rem;
    min-height: 2.75rem;
  }
}

@media (max-width: 46rem) {
  header nav .region-switch {
    order: 10;
    margin-top: .35rem;
  }

  header nav .region-switch a {
    width: 3.25rem;
    min-height: 2.75rem;
    border-bottom: 0;
  }

  .market-proof {
    display: grid;
    gap: .55rem;
  }
}

@media print {
  .region-switch,
  .market-proof { display: none; }
}
