/**
 * Regionsauswahl als Bootstrap-3-Dropdown in der oberen Leiste
 * (Region head_navigation des lwc-Themes).
 *
 * Die Geschwister dort (.block-language und das Legal-<nav>) sind in
 * themes/lwc/css/style.css mit "float: right" gesetzt. Ein nicht gefloateter
 * Block belegt eine eigene Zeile; da die gefloateten Geschwister dann keine
 * Höhe mehr beitragen, kollabiert die Leiste und wirkt leer. Der Umschalter
 * muss deshalb ebenfalls gefloatet werden.
 */

.head-info .block-lwc-region-switcher {
  float: right;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}

.head-info .lwc-region-dropdown {
  display: inline-block;
  margin: 0 16px 0 0;
}

/*
 * Trenner zum Legal-Menü. Das Theme setzt ihn sonst über
 * ".head-info ul.links li + li::before"; der Umschalter ist aber keine
 * Link-Liste mehr, deshalb hier explizit.
 */
.head-info .lwc-region-dropdown::before {
  content: '|';
  padding-right: 5px;
  font-weight: 700;
}

/* Auslöser an die helle Schrift der dunklen Leiste angleichen. */
.head-info .lwc-region-dropdown > .dropdown-toggle {
  color: white;
  text-decoration: none;
  white-space: nowrap;
}

.head-info .lwc-region-dropdown > .dropdown-toggle:hover,
.head-info .lwc-region-dropdown > .dropdown-toggle:focus {
  color: white;
  text-decoration: underline;
}

/*
 * Die Leiste ist nur 36px hoch; ohne z-index legen sich nachfolgende
 * Abschnitte (u. a. der Slider) über das aufgeklappte Menü.
 */
.head-info .lwc-region-dropdown .dropdown-menu {
  z-index: 1050;
  min-width: 100%;
  margin-top: 0;
  font-size: 14px;
  text-transform: uppercase;
}

.head-info .lwc-region-dropdown .dropdown-menu > li > a {
  color: #333;
  line-height: 1.6;
  padding: 4px 16px;
}

.head-info .lwc-region-dropdown .dropdown-menu > .active > a,
.head-info .lwc-region-dropdown .dropdown-menu > .active > a:hover,
.head-info .lwc-region-dropdown .dropdown-menu > .active > a:focus {
  background-color: #eee;
  color: #333;
  font-weight: 700;
}

/*
 * Im Fußbereich (falls der Block dort zusätzlich platziert wird) gilt die
 * Float-Logik der Kopfleiste nicht; dort klappt das Menü nach oben auf.
 */
.foot-navigation .block-lwc-region-switcher {
  float: none;
  font-weight: 700;
  text-transform: uppercase;
}

.foot-navigation .lwc-region-dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
}