/*
 * Styles for the map elements
 */

#map {
  background: #f3f3f3;
  height: 40vh;
}

.lake {
  fill: lightblue;
  stroke-width: 0.7px;
}

.canton {
  fill: #fff;
  stroke: #1e1e1e;
  stroke-width: 0.8px;
}

#switzerland_1 {
  stroke: black;
  stroke-width: 0.8px;
  fill: none;
}

.commune {
  fill: #e1e1e1;
  stroke: white;
  stroke-width: 0.3px;
}

.commune.selected {
  fill: #e4002b;
}

.canton.selected {
  fill-opacity: 0;
  pointer-events: none;
}

/***
 * Map Root
 */

.section-map-root {
  position: relative;
}

/*
 * Info page
 */

.wrapper.empty {
  display: none;
}

.section-map-root .wrapper {
  position: absolute;
  background-color: white;
  display: flex;
  flex-direction: row;
  border-radius: 0;
  box-shadow: #00000047 1px 1px 1px 1px;
  bottom: 20px;
  left: 20px;
  max-height: 28em;
  overflow-y: auto;
  padding: 0.5em 0.6em 0.5em 0.6em;
  align-items: flex-start;
}

.section-map-root #info {
  flex-direction: column;
  display: flex;
}

.section-map-root .section {
  display: flex;
  flex-direction: column;
  font-size: 0.75em;
  gap: 0.1em;
  padding: 1em 1.2em 1em 1.2em;
  line-height: 1.3em;
}

.section-map-root .section a {
  font-size: 1em;
  text-decoration: none;
}

.section:not(:last-child) {
  border-bottom: 1px solid black;
}

.section-map-root address {
  font-style: normal;
  line-height: 1.2em;
}

.section-map-root .sectionname {
  font-weight: 800;
}

.section-map-root .sectionname {
  font-weight: 600;
  margin-bottom: 0.5em;
}

/** Wappen **/
#wappen {
  width: 2.5em;
  padding-left: 12px;
}

#reset {
  position: absolute;
  right: 9px;
  bottom: 10px;
  width: 4em;
  filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.4));
  cursor: pointer;
}

/** Sektionsliste **/

p.sp_section_list {
  margin: 0;
}

p.sp_section_list_depth_0 {
  background-color: #aaa;
}

p.sp_section_list_depth_1 {
  background-color: #bbb;
}

p.sp_section_list_depth_2 {
  background-color: #ccc;
}

p.sp_section_list_depth_3 {
  background-color: #ddd;
}

p.sp_section_list_depth_4 {
  background-color: #eee;
}

p.sp_section_list_depth_5 {
  background-color: #fff;
}