/* =========================================================
   GS Media EU – Custom CSS
   Fedaro Free / Helix Ultimate
   Primärfarbe: #4775d1
   Stand: bereinigt – heller blauer Auftritt,
   Header in GS-Media-Blau, Language Switcher als Custom-Dropdown,
   Footer mit 4 Bottom-Modulpositionen + Copyright-Zeile.
   ========================================================= */

/* =========================================================
   01. Design Tokens
   ========================================================= */

:root {
  --gsm-primary: #4775d1;
  --gsm-primary-dark: #315fb8;
  --gsm-primary-deep: #173755;
  --gsm-primary-soft: #f6fbff;
  --gsm-primary-light: #eaf3ff;
  --gsm-primary-footer: #dcecff;
  --gsm-footer-bg: #25488e;
  --gsm-footer-bg-dark: #1b3670;
  --gsm-footer-bg-deep: #142a59;
  --gsm-footer-text: rgba(255, 255, 255, 0.82);
  --gsm-footer-muted: rgba(255, 255, 255, 0.68);
  --gsm-footer-line: rgba(125, 201, 255, 0.88);
  --gsm-accent: #7dc9ff;
  --gsm-white: #ffffff;
  --gsm-text: #173755;
  --gsm-muted: #5d7896;
  --gsm-line: rgba(71, 117, 209, 0.18);
  --gsm-line-strong: rgba(71, 117, 209, 0.34);
  --gsm-shadow-soft: 0 14px 34px rgba(20, 58, 102, 0.14);
  --gsm-shadow-dropdown: 0 22px 55px rgba(20, 58, 102, 0.22);
}

/* =========================================================
   02. Global Base
   ========================================================= */

html,
body {
  background: var(--gsm-primary-soft) !important;
  color: var(--gsm-text) !important;
}

body,
p,
li {
  color: var(--gsm-text);
}

a {
  color: var(--gsm-primary);
}

a:hover,
a:focus {
  color: var(--gsm-primary-dark);
}

.sppb-btn,
.btn,
.uk-button {
  border-radius: 999px;
}

/* =========================================================
   03. Topbar technisch behalten, optisch entfernen
   Das Sprachmodul liegt in toolbar-right und wird optisch in
   die Headerzeile gezogen.
   ========================================================= */

#sp-top-bar,
.tm-toolbar {
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  position: relative !important;
  z-index: 4000 !important;
}

#sp-top-bar .container,
#sp-top-bar .container-inner,
#sp-top-bar .row,
#sp-top-bar .sp-column,
.tm-toolbar .uk-container,
.tm-toolbar .uk-grid,
.tm-toolbar .uk-flex {
  height: 0 !important;
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
}

/* =========================================================
   04. Header / Navigation
   ========================================================= */

#sp-header,
.tm-header,
.uk-navbar-container {
  background: var(--gsm-primary) !important;
  color: #ffffff !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: var(--gsm-shadow-soft) !important;
  min-height: 78px !important;
}

#sp-header .container,
#sp-header .container-inner,
#sp-header .row,
.tm-header .uk-container,
.uk-navbar {
  min-height: 78px !important;
}

#sp-header .row,
.uk-navbar {
  display: flex !important;
  align-items: center !important;
}

#sp-header .sp-column {
  min-height: 78px !important;
}

/* Logo */
#sp-logo a,
.logo a,
.tm-logo,
.uk-logo {
  color: #ffffff !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.id-color,
#sp-logo .id-color,
.logo .id-color,
.tm-logo .id-color {
  color: #dff2ff !important;
}

/* Navigation ist jetzt aktiv. Der frühere display:none-Block wurde entfernt. */

/* Suche im Header entfernen */
#sp-search,
#sp-header .search,
#sp-header .sp-search,
#sp-header .sp-module.search,
#sp-header .search-icon,
.tm-header .uk-search,
.tm-header .tm-search,
.tm-header .uk-search-icon,
.tm-header a[href*="search"],
.tm-header a[href="#search"],
.tm-header a[href="#modal-search"],
.tm-header .uk-navbar-toggle[uk-search-icon],
.search-toggle,
.search-icon,
.sp-search,
.uk-search {
  display: none !important;
}


/* =========================================================
   04b. Header Navigation sichtbar machen und Logo stabilisieren
   ========================================================= */

#sp-header,
#sp-header .container,
#sp-header .container-inner,
#sp-header .row,
.tm-header,
.tm-header .uk-container {
  overflow: visible !important;
}

#sp-header .row {
  display: flex !important;
  align-items: center !important;
  min-height: 78px !important;
}

/* Logo stabil halten */
#sp-logo,
.logo,
.tm-logo,
.uk-logo {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 auto !important;
  min-height: 78px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#sp-logo img,
.logo img,
.tm-logo img,
.uk-logo img {
  display: block !important;
  width: auto !important;
  max-width: 260px !important;
  max-height: 58px !important;
  height: auto !important;
  object-fit: contain !important;
}

/* Menübereich sichtbar */
#sp-menu,
.sp-menu {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto !important;
  min-height: 78px !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}

/* Helix/Fedaro-Menü sichtbar */
.sp-megamenu-parent,
#sp-menu .sp-megamenu-parent,
.tm-header .uk-navbar-nav,
.uk-navbar-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Normales Joomla-Menümodul auf Position menu */
#sp-menu .sp-module,
#sp-menu .sp-module-content,
#sp-menu ul.menu,
#sp-menu ul.nav,
#sp-menu .navbar-nav,
.tm-header ul.menu,
.tm-header ul.nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}

#sp-menu .sp-module-title,
.tm-header .sp-module-title {
  display: none !important;
}

.sp-megamenu-parent > li,
#sp-menu ul.menu > li,
#sp-menu ul.nav > li,
#sp-menu .navbar-nav > li,
.tm-header .uk-navbar-nav > li,
.tm-header ul.menu > li,
.tm-header ul.nav > li {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span,
#sp-menu ul.menu > li > a,
#sp-menu ul.nav > li > a,
#sp-menu .navbar-nav > li > a,
.tm-header .uk-navbar-nav > li > a,
.tm-header ul.menu > li > a,
.tm-header ul.nav > li > a {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  min-height: 78px !important;
  padding: 0 4px !important;
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  text-decoration: none !important;
  background: transparent !important;
}

.sp-megamenu-parent > li.active > a,
.sp-megamenu-parent > li.current-item > a,
.sp-megamenu-parent > li > a:hover,
#sp-menu ul.menu > li.active > a,
#sp-menu ul.menu > li.current > a,
#sp-menu ul.menu > li > a:hover,
#sp-menu ul.nav > li.active > a,
#sp-menu ul.nav > li.current > a,
#sp-menu ul.nav > li > a:hover,
.tm-header .uk-navbar-nav > li.uk-active > a,
.tm-header .uk-navbar-nav > li > a:hover,
.tm-header ul.menu > li.active > a,
.tm-header ul.menu > li.current > a,
.tm-header ul.menu > li > a:hover {
  color: #ffffff !important;
}

.sp-megamenu-parent > li.active > a::after,
.sp-megamenu-parent > li.current-item > a::after,
.sp-megamenu-parent > li > a:hover::after,
#sp-menu ul.menu > li.active > a::after,
#sp-menu ul.menu > li.current > a::after,
#sp-menu ul.menu > li > a:hover::after,
#sp-menu ul.nav > li.active > a::after,
#sp-menu ul.nav > li.current > a::after,
#sp-menu ul.nav > li > a:hover::after,
.tm-header .uk-navbar-nav > li.uk-active > a::after,
.tm-header .uk-navbar-nav > li > a:hover::after,
.tm-header ul.menu > li.active > a::after,
.tm-header ul.menu > li.current > a::after,
.tm-header ul.menu > li > a:hover::after {
  content: "";
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 18px;
  height: 2px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
}


/* =========================================================
   05. Language Switcher
   WICHTIGE MODUL-EINSTELLUNGEN:
   - CSS-Klasse Modul: gsm-lang-switcher
   - Drop-Down benutzen: Nein
   - Bildflaggen benutzen: Ja
   - Aktive Sprache: Ja
   - Horizontale Anzeige: Ja
   - Vollständige Sprachnamen: Ja
   - Titel anzeigen: Verbergen
   - Position: toolbar-right

   Verhalten:
   geschlossen = nur aktive Flagge + kleiner Pfeil
   geöffnet   = vertikale Liste mit Flagge + Sprachname
   ========================================================= */

/* Position des gesamten Sprachmoduls */
#sp-top-bar .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher {
  position: absolute !important;
  top: 23px !important;
  right: clamp(18px, 7.8vw, 150px) !important;
  z-index: 8000 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Das Modul kann je nach Joomla/Template als .sp-module.gsm-lang-switcher
   oder als .mod-languages.gsm-lang-switcher ausgegeben werden. Deshalb
   sind die Selektoren bewusst redundant. */
.gsm-lang-switcher,
.sp-module.gsm-lang-switcher,
.mod-languages.gsm-lang-switcher {
  position: relative !important;
  width: 52px !important;
  min-width: 52px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  z-index: 8000 !important;
}

.gsm-lang-switcher .sp-module-content,
.gsm-lang-switcher .mod-languages,
.mod-languages.gsm-lang-switcher {
  position: relative !important;
  display: block !important;
  width: 52px !important;
  min-width: 52px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

/* Titel / Labels entfernen */
.gsm-lang-switcher .sp-module-title,
.gsm-lang-switcher label,
.gsm-lang-switcher .visually-hidden,
.gsm-lang-switcher .sr-only,
.mod-languages.gsm-lang-switcher label,
.mod-languages.gsm-lang-switcher .visually-hidden,
.mod-languages.gsm-lang-switcher .sr-only {
  display: none !important;
}

/* Falls versehentlich das native Select aktiv ist:
   komplett ausblenden. Für diese Gestaltung muss die Listen-Ausgabe aktiv sein. */
.gsm-lang-switcher select,
.mod-languages.gsm-lang-switcher select {
  display: none !important;
}

/* Listen-Reset */
.gsm-lang-switcher .mod-languages > ul,
.gsm-lang-switcher > ul,
.mod-languages.gsm-lang-switcher > ul {
  position: relative !important;
  display: block !important;
  width: 52px !important;
  min-width: 52px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  list-style: none !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.46) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 8px 22px rgba(20, 58, 102, 0.10) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Hover des geschlossenen Buttons */
.gsm-lang-switcher .mod-languages > ul:hover,
.gsm-lang-switcher > ul:hover,
.mod-languages.gsm-lang-switcher > ul:hover {
  border-color: rgba(255, 255, 255, 0.78) !important;
  background: rgba(255, 255, 255, 0.20) !important;
}

/* Kleiner Pfeil im geschlossenen Zustand */
.gsm-lang-switcher .mod-languages > ul::after,
.gsm-lang-switcher > ul::after,
.mod-languages.gsm-lang-switcher > ul::after {
  content: "";
  position: absolute;
  right: 9px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 2px solid rgba(255, 255, 255, 0.92);
  border-bottom: 2px solid rgba(255, 255, 255, 0.92);
  transform: translateY(-65%) rotate(45deg);
  pointer-events: none;
  z-index: 4;
}

/* Alle Listenelemente grundsätzlich verstecken */
.gsm-lang-switcher .mod-languages > ul > li,
.gsm-lang-switcher > ul > li,
.mod-languages.gsm-lang-switcher > ul > li {
  display: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Nur aktive Sprache geschlossen zeigen */
.gsm-lang-switcher .mod-languages > ul > li.lang-active,
.gsm-lang-switcher > ul > li.lang-active,
.mod-languages.gsm-lang-switcher > ul > li.lang-active {
  display: block !important;
}

/* Geschlossener aktiver Link: nur Flagge sichtbar */
.gsm-lang-switcher .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher > ul > li.lang-active > a,
.gsm-lang-switcher > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher > ul > li.lang-active > span {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 52px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 0 0 10px !important;
  margin: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
  text-decoration: none !important;
  overflow: hidden !important;
}

/* Flaggen im geschlossenen Button */
.gsm-lang-switcher img,
.mod-languages.gsm-lang-switcher img {
  display: block !important;
  width: 20px !important;
  max-width: 20px !important;
  height: auto !important;
  border-radius: 2px !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.56);
  flex: 0 0 auto !important;
}

/* Dropdown öffnen */
.gsm-lang-switcher:hover .mod-languages > ul,
.gsm-lang-switcher:focus-within .mod-languages > ul,
.gsm-lang-switcher:hover > ul,
.gsm-lang-switcher:focus-within > ul,
.mod-languages.gsm-lang-switcher:hover > ul,
.mod-languages.gsm-lang-switcher:focus-within > ul {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  right: 0 !important;
  width: 260px !important;
  min-width: 260px !important;
  height: auto !important;
  min-height: auto !important;
  padding: 8px !important;
  overflow: visible !important;
  border-radius: 16px !important;
  border: 1px solid rgba(71, 117, 209, 0.18) !important;
  background: #ffffff !important;
  box-shadow: var(--gsm-shadow-dropdown) !important;
}

/* Pfeil im offenen Panel ausblenden */
.gsm-lang-switcher:hover .mod-languages > ul::after,
.gsm-lang-switcher:focus-within .mod-languages > ul::after,
.gsm-lang-switcher:hover > ul::after,
.gsm-lang-switcher:focus-within > ul::after,
.mod-languages.gsm-lang-switcher:hover > ul::after,
.mod-languages.gsm-lang-switcher:focus-within > ul::after {
  display: none !important;
}

/* Im geöffneten Dropdown alle Sprachen vertikal anzeigen */
.gsm-lang-switcher:hover .mod-languages > ul > li,
.gsm-lang-switcher:focus-within .mod-languages > ul > li,
.gsm-lang-switcher:hover > ul > li,
.gsm-lang-switcher:focus-within > ul > li,
.mod-languages.gsm-lang-switcher:hover > ul > li,
.mod-languages.gsm-lang-switcher:focus-within > ul > li {
  display: block !important;
  width: 100% !important;
}

/* Links im geöffneten Dropdown */
.gsm-lang-switcher:hover .mod-languages > ul > li > a,
.gsm-lang-switcher:hover .mod-languages > ul > li > span,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > a,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > span,
.gsm-lang-switcher:hover > ul > li > a,
.gsm-lang-switcher:hover > ul > li > span,
.gsm-lang-switcher:focus-within > ul > li > a,
.gsm-lang-switcher:focus-within > ul > li > span,
.mod-languages.gsm-lang-switcher:hover > ul > li > a,
.mod-languages.gsm-lang-switcher:hover > ul > li > span,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > a,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > span {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 38px !important;
  height: auto !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  color: var(--gsm-text) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-indent: 0 !important;
  text-decoration: none !important;
  white-space: normal !important;
  overflow: visible !important;
}

/* Aktive Sprache im offenen Dropdown */
.gsm-lang-switcher:hover .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher:hover .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher:focus-within .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher:focus-within .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher:hover > ul > li.lang-active > a,
.gsm-lang-switcher:hover > ul > li.lang-active > span,
.gsm-lang-switcher:focus-within > ul > li.lang-active > a,
.gsm-lang-switcher:focus-within > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher:hover > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher:hover > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher:focus-within > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher:focus-within > ul > li.lang-active > span {
  background: rgba(71, 117, 209, 0.10) !important;
  color: var(--gsm-primary) !important;
  font-weight: 700 !important;
}

/* Hover im geöffneten Dropdown */
.gsm-lang-switcher:hover .mod-languages > ul > li > a:hover,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > a:hover,
.gsm-lang-switcher:hover > ul > li > a:hover,
.gsm-lang-switcher:focus-within > ul > li > a:hover,
.mod-languages.gsm-lang-switcher:hover > ul > li > a:hover,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > a:hover {
  background: rgba(71, 117, 209, 0.08) !important;
  color: var(--gsm-primary) !important;
}

/* =========================================================
   06. Main / Page Area
   ========================================================= */

#sp-main-body,
#sp-component,
main,
.tm-main {
  background:
    radial-gradient(circle at 13% 5%, rgba(71,117,209,.12), transparent 29%),
    radial-gradient(circle at 88% 10%, rgba(125,201,255,.18), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, var(--gsm-primary-soft) 52%, var(--gsm-primary-light) 100%) !important;
  color: var(--gsm-text) !important;
}

#sp-title,
.sp-page-title,
.tm-page-title {
  background: linear-gradient(180deg, #ffffff 0%, var(--gsm-primary-light) 100%) !important;
  color: var(--gsm-text) !important;
  border-bottom: 1px solid var(--gsm-line) !important;
}

#sp-title h1,
.sp-page-title h1,
.tm-page-title h1 {
  color: var(--gsm-text) !important;
}

.sppb-section,
.sppb-row-container {
  color: var(--gsm-text);
}

/* =========================================================
   07. Footer / Bottom-Bereich
   Nutzt vorhandenes Layout:
   Bottom: bottom1–bottom4
   Footer: footer1 / Copyright

   Gewünscht:
   - Footer-Hauptbereich: #25488e
   - Copyright-Zeile: gleicher Farbton, dunkler abgesetzt
   - deutlicher blau gelagerter Gradient-Trennstreifen
   ========================================================= */

#sp-bottom,
.tm-bottom {
  position: relative !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(125, 201, 255, 0.24), transparent 34%),
    radial-gradient(circle at 92% 12%, rgba(255, 255, 255, 0.11), transparent 28%),
    linear-gradient(135deg, var(--gsm-footer-bg) 0%, #224383 48%, #1f3e7c 100%) !important;
  color: var(--gsm-footer-text) !important;
  padding: 38px 0 30px !important;
  border-top: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

/* vier Footer-Spalten */
#sp-bottom .sp-module,
.tm-bottom .uk-panel {
  margin-bottom: 0 !important;
}

#sp-bottom h3,
#sp-bottom h4,
#sp-bottom .sp-module-title,
.tm-bottom h3,
.tm-bottom h4 {
  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: 750 !important;
  margin: 0 0 18px !important;
  letter-spacing: 0.01em !important;
}

#sp-bottom p,
#sp-bottom li,
.tm-bottom p,
.tm-bottom li {
  color: var(--gsm-footer-muted) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}

#sp-bottom ul,
.tm-bottom ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#sp-bottom li,
.tm-bottom li {
  margin-bottom: 8px !important;
}

#sp-bottom a,
.tm-bottom a {
  color: var(--gsm-footer-muted) !important;
  text-decoration: none !important;
  transition: color .18s ease, padding-left .18s ease;
}

#sp-bottom a:hover,
.tm-bottom a:hover {
  color: #ffffff !important;
  padding-left: 3px;
}

/* Footer Brand / Logo-Text */
.gsm-footer-logo {
  color: #ffffff !important;
  font-size: 25px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
}

.gsm-footer-brand p {
  max-width: 310px;
  color: var(--gsm-footer-muted) !important;
}

/* Deutlicher Gradient-Trennstreifen zwischen Footer-Block und Copyright */
#sp-bottom::after,
.tm-bottom::after {
  content: "";
  display: block;
  height: 4px;
  margin: 28px auto -30px;
  width: 100%;
  max-width: 1180px;
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      rgba(125, 201, 255, 0),
      rgba(125, 201, 255, 0.38) 16%,
      rgba(255, 255, 255, 0.78) 50%,
      rgba(125, 201, 255, 0.38) 84%,
      rgba(125, 201, 255, 0)
    );
  box-shadow:
    0 0 18px rgba(125, 201, 255, 0.35),
    0 0 1px rgba(255, 255, 255, 0.65);
}

/* Copyright-Zeile dunkler abgesetzt */
#sp-footer,
.tm-footer {
  background: linear-gradient(180deg, var(--gsm-footer-bg-dark) 0%, var(--gsm-footer-bg-deep) 100%) !important;
  color: rgba(255, 255, 255, 0.72) !important;
  border-top: 0 !important;
  min-height: 56px !important;
  padding: 0 !important;
  text-align: center !important;
}

#sp-footer .container,
#sp-footer .container-inner,
#sp-footer .row,
#sp-footer .sp-column,
.tm-footer .uk-container {
  min-height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#sp-footer,
#sp-footer p,
#sp-footer div,
.tm-footer {
  font-size: 14px !important;
  line-height: 1.4 !important;
}

#sp-footer a,
.tm-footer a {
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

#sp-footer a:hover,
.tm-footer a:hover {
  color: #ffffff !important;
}

/* =========================================================
   08. Cookie Banner / Back-to-top
   ========================================================= */

#sp-cookie-consent,
.cookie,
.cookie-notice,
#cookie-notice,
.cc-window,
.uk-notification-message {
  background: rgba(255,255,255,.96) !important;
  color: var(--gsm-text) !important;
  border: 1px solid var(--gsm-line) !important;
  box-shadow: 0 18px 55px rgba(20,58,102,.14) !important;
}

#sp-cookie-consent button,
.cookie button,
.cookie-notice button,
.cc-window button {
  background: var(--gsm-primary) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  border: 0 !important;
}

.sp-scroll-up,
.scrollup,
.back-to-top {
  background: var(--gsm-primary) !important;
  color: #fff !important;
  border: none !important;
}


/* =========================================================
   GS Media – Header-Farbgebung wie Footer-Bottom
   ========================================================= */

#sp-header,
.tm-header,
.uk-navbar-container {
  background:
    radial-gradient(circle at 10% 0%, rgba(125, 201, 255, 0.24), transparent 34%),
    radial-gradient(circle at 92% 12%, rgba(255, 255, 255, 0.11), transparent 28%),
    linear-gradient(135deg, var(--gsm-footer-bg) 0%, #224383 48%, #1f3e7c 100%) !important;
  color: #ffffff !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 10px 30px rgba(20, 58, 102, 0.18) !important;
}

/* =========================================================
   GS Media – Prelaunch Hero-Grafik vollständig anzeigen
   Optional: Section/Add-on CSS-Klasse gsm-prelaunch-hero setzen
   ========================================================= */

#sp-main-body {
  padding-top: 0 !important;
}

.gsm-prelaunch-hero,
.gsm-prelaunch-hero .sppb-addon-content,
.gsm-prelaunch-hero .sppb-addon-single-image,
.gsm-prelaunch-hero .sppb-addon-single-image-container,
.gsm-prelaunch-hero .sppb-carousel-extended,
.gsm-prelaunch-hero .sppb-carousel-extended-list,
.gsm-prelaunch-hero .sppb-carousel-extended-item,
.gsm-prelaunch-hero .owl-stage-outer,
.gsm-prelaunch-hero .owl-stage,
.gsm-prelaunch-hero .owl-item {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 0 !important;
}

.gsm-prelaunch-hero img,
.gsm-prelaunch-hero .sppb-img-responsive,
.gsm-prelaunch-hero .sppb-addon-single-image-container img,
.gsm-prelaunch-hero .sppb-carousel-extended-item img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 0 !important;
}

/* Fallback: Erste SP-Page-Builder-Section als Hero behandeln */
#sp-main-body .sppb-section:first-child,
#sp-main-body .sppb-section:first-child .sppb-row-container,
#sp-main-body .sppb-section:first-child .sppb-row,
#sp-main-body .sppb-section:first-child .sppb-column,
#sp-main-body .sppb-section:first-child .sppb-column-addons,
#sp-main-body .sppb-section:first-child .sppb-addon,
#sp-main-body .sppb-section:first-child .sppb-addon-content {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
}

#sp-main-body .sppb-section:first-child .sppb-carousel-extended,
#sp-main-body .sppb-section:first-child .sppb-carousel-extended-list,
#sp-main-body .sppb-section:first-child .sppb-carousel-extended-item,
#sp-main-body .sppb-section:first-child .owl-stage-outer,
#sp-main-body .sppb-section:first-child .owl-stage,
#sp-main-body .sppb-section:first-child .owl-item {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#sp-main-body .sppb-section:first-child img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
}

/* =========================================================
   GS Media – Footer Bottom kompakter
   ========================================================= */

#sp-bottom,
.tm-bottom {
  padding: 38px 0 30px !important;
}

#sp-bottom h3,
#sp-bottom h4,
#sp-bottom .sp-module-title,
.tm-bottom h3,
.tm-bottom h4 {
  margin-bottom: 12px !important;
}

#sp-bottom p,
#sp-bottom li,
.tm-bottom p,
.tm-bottom li {
  font-size: 14px !important;
  line-height: 1.52 !important;
}

#sp-bottom li,
.tm-bottom li {
  margin-bottom: 6px !important;
}

#sp-bottom::after,
.tm-bottom::after {
  height: 3px !important;
  margin: 28px auto -30px !important;
}


/* =========================================================
   GS Media – Header Feinschliff: Navigation + Language Switcher
   Stand: dezenter Sprachumschalter, keine Unterstriche,
   aktive/hover Navigation in hellem Blau.
   ========================================================= */

:root {
  --gsm-nav-hover: #9edcff;
  --gsm-nav-active: #7dc9ff;
  --gsm-lang-panel-bg: rgba(15, 37, 78, 0.92);
}

/* Navigation etwas tiefer setzen */
.sp-megamenu-parent,
#sp-menu .sp-megamenu-parent,
#sp-menu ul.menu,
#sp-menu ul.nav,
#sp-menu .navbar-nav,
.tm-header .uk-navbar-nav,
.tm-header ul.menu,
.tm-header ul.nav {
  align-items: center !important;
}

/* Menülinks tiefer und ohne Unterstreichungs-Optik */
.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span,
#sp-menu ul.menu > li > a,
#sp-menu ul.nav > li > a,
#sp-menu .navbar-nav > li > a,
.tm-header .uk-navbar-nav > li > a,
.tm-header ul.menu > li > a,
.tm-header ul.nav > li > a {
  min-height: 78px !important;
  padding: 8px 5px 0 5px !important;
  transform: translateY(5px);
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* aktive Seite + Hover: helles Blau statt Unterstrich */
.sp-megamenu-parent > li.active > a,
.sp-megamenu-parent > li.current-item > a,
.sp-megamenu-parent > li > a:hover,
#sp-menu ul.menu > li.active > a,
#sp-menu ul.menu > li.current > a,
#sp-menu ul.menu > li > a:hover,
#sp-menu ul.nav > li.active > a,
#sp-menu ul.nav > li.current > a,
#sp-menu ul.nav > li > a:hover,
.tm-header .uk-navbar-nav > li.uk-active > a,
.tm-header .uk-navbar-nav > li > a:hover,
.tm-header ul.menu > li.active > a,
.tm-header ul.menu > li.current > a,
.tm-header ul.menu > li > a:hover {
  color: var(--gsm-nav-hover) !important;
  text-shadow: 0 0 16px rgba(125, 201, 255, 0.34);
}

/* alte aktive Unterstrich-Linie vollständig entfernen */
.sp-megamenu-parent > li.active > a::after,
.sp-megamenu-parent > li.current-item > a::after,
.sp-megamenu-parent > li > a:hover::after,
#sp-menu ul.menu > li.active > a::after,
#sp-menu ul.menu > li.current > a::after,
#sp-menu ul.menu > li > a:hover::after,
#sp-menu ul.nav > li.active > a::after,
#sp-menu ul.nav > li.current > a::after,
#sp-menu ul.nav > li > a:hover::after,
.tm-header .uk-navbar-nav > li.uk-active > a::after,
.tm-header .uk-navbar-nav > li > a:hover::after,
.tm-header ul.menu > li.active > a::after,
.tm-header ul.menu > li.current > a::after,
.tm-header ul.menu > li > a:hover::after {
  display: none !important;
  content: none !important;
}

/* dezenter Punkt zwischen Menüpunkten optional entschärfen */
.sp-megamenu-parent > li:not(:last-child)::after,
#sp-menu ul.menu > li:not(:last-child)::after,
#sp-menu ul.nav > li:not(:last-child)::after {
  color: rgba(125, 201, 255, 0.52) !important;
}

/* =========================================================
   Language Switcher – geschlossen nur Flagge + Mini-Chevron
   geöffnet: kleines vertikales Flaggen-Popup mit Gradient-Kontur
   ========================================================= */

/* Position minimal nach unten, passend zur Navi-Unterkante */
#sp-top-bar .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher {
  top: 25px !important;
  right: clamp(18px, 7.8vw, 150px) !important;
}

/* Grundfläche extrem reduziert */
.gsm-lang-switcher,
.sp-module.gsm-lang-switcher,
.mod-languages.gsm-lang-switcher,
.gsm-lang-switcher .sp-module-content,
.gsm-lang-switcher .mod-languages,
.mod-languages.gsm-lang-switcher {
  width: 34px !important;
  min-width: 34px !important;
  height: 24px !important;
  min-height: 24px !important;
}

/* geschlossener Button: transparent, keine dicke Pill */
.gsm-lang-switcher .mod-languages > ul,
.gsm-lang-switcher > ul,
.mod-languages.gsm-lang-switcher > ul {
  width: 34px !important;
  min-width: 34px !important;
  height: 24px !important;
  min-height: 24px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Mini-Chevron rechts neben der Flagge */
.gsm-lang-switcher .mod-languages > ul::after,
.gsm-lang-switcher > ul::after,
.mod-languages.gsm-lang-switcher > ul::after {
  right: 1px !important;
  width: 5px !important;
  height: 5px !important;
  border-right: 1.5px solid rgba(158, 220, 255, 0.95) !important;
  border-bottom: 1.5px solid rgba(158, 220, 255, 0.95) !important;
}

/* geschlossene aktive Sprache: Text wirklich ausblenden */
.gsm-lang-switcher .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher > ul > li.lang-active > a,
.gsm-lang-switcher > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher > ul > li.lang-active > span {
  width: 34px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  justify-content: flex-start !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
}

/* Flagge kleiner und klar */
.gsm-lang-switcher img,
.mod-languages.gsm-lang-switcher img {
  width: 19px !important;
  max-width: 19px !important;
  height: auto !important;
  margin-left: 0 !important;
  border-radius: 2px !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.72), 0 4px 12px rgba(0,0,0,.18);
}

/* Popup geöffnet: kleines Panel mit Gradient-Rand */
.gsm-lang-switcher:hover .mod-languages > ul,
.gsm-lang-switcher:focus-within .mod-languages > ul,
.gsm-lang-switcher:hover > ul,
.gsm-lang-switcher:focus-within > ul,
.mod-languages.gsm-lang-switcher:hover > ul,
.mod-languages.gsm-lang-switcher:focus-within > ul {
  top: calc(100% + 9px) !important;
  right: -7px !important;
  width: 48px !important;
  min-width: 48px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 6px !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  background:
    linear-gradient(var(--gsm-lang-panel-bg), var(--gsm-lang-panel-bg)) padding-box,
    linear-gradient(145deg, rgba(125,201,255,.95), rgba(255,255,255,.44), rgba(71,117,209,.85)) border-box !important;
  box-shadow: 0 18px 44px rgba(5, 18, 43, 0.34), 0 0 22px rgba(125,201,255,.16) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

/* Im offenen Popup nur Flaggen untereinander */
.gsm-lang-switcher:hover .mod-languages > ul > li,
.gsm-lang-switcher:focus-within .mod-languages > ul > li,
.gsm-lang-switcher:hover > ul > li,
.gsm-lang-switcher:focus-within > ul > li,
.mod-languages.gsm-lang-switcher:hover > ul > li,
.mod-languages.gsm-lang-switcher:focus-within > ul > li {
  display: block !important;
  width: 100% !important;
  margin: 0 0 4px 0 !important;
}

.gsm-lang-switcher:hover .mod-languages > ul > li:last-child,
.gsm-lang-switcher:focus-within .mod-languages > ul > li:last-child,
.gsm-lang-switcher:hover > ul > li:last-child,
.gsm-lang-switcher:focus-within > ul > li:last-child,
.mod-languages.gsm-lang-switcher:hover > ul > li:last-child,
.mod-languages.gsm-lang-switcher:focus-within > ul > li:last-child {
  margin-bottom: 0 !important;
}

/* Linkflächen im Popup: keine Sprachnamen, nur Flaggen */
.gsm-lang-switcher:hover .mod-languages > ul > li > a,
.gsm-lang-switcher:hover .mod-languages > ul > li > span,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > a,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > span,
.gsm-lang-switcher:hover > ul > li > a,
.gsm-lang-switcher:hover > ul > li > span,
.gsm-lang-switcher:focus-within > ul > li > a,
.gsm-lang-switcher:focus-within > ul > li > span,
.mod-languages.gsm-lang-switcher:hover > ul > li > a,
.mod-languages.gsm-lang-switcher:hover > ul > li > span,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > a,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > span {
  width: 34px !important;
  min-height: 28px !important;
  height: 28px !important;
  padding: 0 !important;
  border-radius: 9px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
  background: transparent !important;
}

/* aktive/hover Flagge im Popup */
.gsm-lang-switcher:hover .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher:hover .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher:focus-within .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher:focus-within .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher:hover > ul > li.lang-active > a,
.gsm-lang-switcher:hover > ul > li.lang-active > span,
.gsm-lang-switcher:focus-within > ul > li.lang-active > a,
.gsm-lang-switcher:focus-within > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher:hover > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher:hover > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher:focus-within > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher:focus-within > ul > li.lang-active > span,
.gsm-lang-switcher:hover .mod-languages > ul > li > a:hover,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > a:hover,
.gsm-lang-switcher:hover > ul > li > a:hover,
.gsm-lang-switcher:focus-within > ul > li > a:hover,
.mod-languages.gsm-lang-switcher:hover > ul > li > a:hover,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > a:hover {
  background: rgba(125, 201, 255, 0.16) !important;
}


/* =========================================================
   GS Media – Language Switcher Ultra Minimal
   Ziel: nur Flagge + kleiner Pfeil, kein Kreis / keine Pill / kein DE-Text
   ========================================================= */

/* Position im Header */
#sp-top-bar .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher {
  top: 27px !important;
  right: clamp(18px, 7.8vw, 150px) !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Alle Wrapper neutralisieren */
.gsm-lang-switcher,
.sp-module.gsm-lang-switcher,
.mod-languages.gsm-lang-switcher,
.gsm-lang-switcher .sp-module-content,
.gsm-lang-switcher .mod-languages,
.mod-languages.gsm-lang-switcher {
  width: 32px !important;
  min-width: 32px !important;
  height: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Geschlossener Zustand: keine sichtbare Fläche */
.gsm-lang-switcher .mod-languages > ul,
.gsm-lang-switcher > ul,
.mod-languages.gsm-lang-switcher > ul {
  width: 32px !important;
  min-width: 32px !important;
  height: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Alle möglichen Pseudo-Flächen/Kreise entfernen */
.gsm-lang-switcher::before,
.gsm-lang-switcher::after,
.sp-module.gsm-lang-switcher::before,
.sp-module.gsm-lang-switcher::after,
.mod-languages.gsm-lang-switcher::before,
.mod-languages.gsm-lang-switcher::after,
.gsm-lang-switcher .mod-languages::before,
.gsm-lang-switcher .mod-languages::after {
  display: none !important;
  content: none !important;
}

/* Mini-Pfeil am Listen-Wrapper bleibt als einziges UI-Zeichen */
.gsm-lang-switcher .mod-languages > ul::after,
.gsm-lang-switcher > ul::after,
.mod-languages.gsm-lang-switcher > ul::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  top: 8px !important;
  width: 5px !important;
  height: 5px !important;
  border-right: 1.5px solid rgba(158, 220, 255, 0.95) !important;
  border-bottom: 1.5px solid rgba(158, 220, 255, 0.95) !important;
  transform: rotate(45deg) !important;
  pointer-events: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Geschlossen: nur aktive Sprache zeigen */
.gsm-lang-switcher .mod-languages > ul > li,
.gsm-lang-switcher > ul > li,
.mod-languages.gsm-lang-switcher > ul > li {
  display: none !important;
}

.gsm-lang-switcher .mod-languages > ul > li.lang-active,
.gsm-lang-switcher > ul > li.lang-active,
.mod-languages.gsm-lang-switcher > ul > li.lang-active {
  display: block !important;
}

/* Linkfläche geschlossen: nur Flagge */
.gsm-lang-switcher .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher > ul > li.lang-active > a,
.gsm-lang-switcher > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher > ul > li.lang-active > span {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
}

/* Flagge minimal */
.gsm-lang-switcher img,
.mod-languages.gsm-lang-switcher img {
  display: block !important;
  width: 18px !important;
  max-width: 18px !important;
  height: auto !important;
  margin: 0 !important;
  border-radius: 2px !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.72), 0 3px 9px rgba(0,0,0,.18) !important;
}

/* Popup: nur kleine Flaggenliste, kein breites Panel */
.gsm-lang-switcher:hover .mod-languages > ul,
.gsm-lang-switcher:focus-within .mod-languages > ul,
.gsm-lang-switcher:hover > ul,
.gsm-lang-switcher:focus-within > ul,
.mod-languages.gsm-lang-switcher:hover > ul,
.mod-languages.gsm-lang-switcher:focus-within > ul {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: -6px !important;
  width: 40px !important;
  min-width: 40px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 6px !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  background:
    linear-gradient(rgba(15, 37, 78, 0.94), rgba(15, 37, 78, 0.94)) padding-box,
    linear-gradient(145deg, rgba(125,201,255,.92), rgba(255,255,255,.34), rgba(71,117,209,.74)) border-box !important;
  box-shadow: 0 14px 34px rgba(5, 18, 43, 0.32), 0 0 18px rgba(125,201,255,.13) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* Im Popup alle Sprachen untereinander */
.gsm-lang-switcher:hover .mod-languages > ul > li,
.gsm-lang-switcher:focus-within .mod-languages > ul > li,
.gsm-lang-switcher:hover > ul > li,
.gsm-lang-switcher:focus-within > ul > li,
.mod-languages.gsm-lang-switcher:hover > ul > li,
.mod-languages.gsm-lang-switcher:focus-within > ul > li {
  display: block !important;
  width: 100% !important;
  height: 24px !important;
  min-height: 24px !important;
  margin: 0 0 5px 0 !important;
  padding: 0 !important;
}

.gsm-lang-switcher:hover .mod-languages > ul > li:last-child,
.gsm-lang-switcher:focus-within .mod-languages > ul > li:last-child,
.gsm-lang-switcher:hover > ul > li:last-child,
.gsm-lang-switcher:focus-within > ul > li:last-child,
.mod-languages.gsm-lang-switcher:hover > ul > li:last-child,
.mod-languages.gsm-lang-switcher:focus-within > ul > li:last-child {
  margin-bottom: 0 !important;
}

/* Im Popup: Link nur als Flaggenfläche */
.gsm-lang-switcher:hover .mod-languages > ul > li > a,
.gsm-lang-switcher:hover .mod-languages > ul > li > span,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > a,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > span,
.gsm-lang-switcher:hover > ul > li > a,
.gsm-lang-switcher:hover > ul > li > span,
.gsm-lang-switcher:focus-within > ul > li > a,
.gsm-lang-switcher:focus-within > ul > li > span,
.mod-languages.gsm-lang-switcher:hover > ul > li > a,
.mod-languages.gsm-lang-switcher:hover > ul > li > span,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > a,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  margin: 0 auto !important;
  border-radius: 7px !important;
  background: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
}

/* Popup Hover/Aktiv minimal */
.gsm-lang-switcher:hover .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher:hover .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher:focus-within .mod-languages > ul > li.lang-active > a,
.gsm-lang-switcher:focus-within .mod-languages > ul > li.lang-active > span,
.gsm-lang-switcher:hover > ul > li.lang-active > a,
.gsm-lang-switcher:hover > ul > li.lang-active > span,
.gsm-lang-switcher:focus-within > ul > li.lang-active > a,
.gsm-lang-switcher:focus-within > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher:hover > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher:hover > ul > li.lang-active > span,
.mod-languages.gsm-lang-switcher:focus-within > ul > li.lang-active > a,
.mod-languages.gsm-lang-switcher:focus-within > ul > li.lang-active > span,
.gsm-lang-switcher:hover .mod-languages > ul > li > a:hover,
.gsm-lang-switcher:focus-within .mod-languages > ul > li > a:hover,
.gsm-lang-switcher:hover > ul > li > a:hover,
.gsm-lang-switcher:focus-within > ul > li > a:hover,
.mod-languages.gsm-lang-switcher:hover > ul > li > a:hover,
.mod-languages.gsm-lang-switcher:focus-within > ul > li > a:hover {
  background: rgba(125, 201, 255, 0.14) !important;
}

/* Notbremse gegen Template-Pill-Klassen */
.gsm-lang-switcher .btn,
.gsm-lang-switcher .button,
.gsm-lang-switcher .uk-button,
.gsm-lang-switcher .dropdown-toggle {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* =========================================================
   09. Responsive
   ========================================================= */

@media (max-width: 767px) {
  #sp-header,
  .tm-header,
  .uk-navbar-container {
    min-height: 68px !important;
  }

  #sp-header .container,
  #sp-header .container-inner,
  #sp-header .row,
  .tm-header .uk-container,
  .uk-navbar {
    min-height: 68px !important;
  }

  #sp-header .sp-column {
    min-height: 68px !important;
  }

  #sp-logo,
  .logo,
  .tm-logo,
  .uk-logo {
    min-height: 68px !important;
  }

  #sp-logo img,
  .logo img,
  .tm-logo img,
  .uk-logo img {
    max-height: 48px !important;
    max-width: 220px !important;
  }

  #sp-top-bar .gsm-lang-switcher,
  .tm-toolbar .gsm-lang-switcher,
  #sp-toolbar-right .gsm-lang-switcher {
    top: 18px !important;
    right: 16px !important;
  }

  .gsm-lang-switcher:hover .mod-languages > ul,
  .gsm-lang-switcher:focus-within .mod-languages > ul,
  .gsm-lang-switcher:hover > ul,
  .gsm-lang-switcher:focus-within > ul,
  .mod-languages.gsm-lang-switcher:hover > ul,
  .mod-languages.gsm-lang-switcher:focus-within > ul {
    width: 225px !important;
    min-width: 225px !important;
  }

  #sp-bottom,
  .tm-bottom {
    padding: 38px 0 32px !important;
  }

  #sp-bottom .sp-module {
    margin-bottom: 28px !important;
  }

  #sp-bottom::after,
  .tm-bottom::after {
    height: 3px !important;
    margin: 26px auto -32px !important;
  }

  /* Mobile: Hauptnavigation vorerst ausblenden, solange kein Offcanvas final eingerichtet ist */
  #sp-menu,
  .sp-menu,
  #sp-menu .sp-module,
  #sp-menu ul.menu,
  #sp-menu ul.nav,
  #sp-menu .navbar-nav,
  .sp-megamenu-parent,
  .tm-header .uk-navbar-nav {
    display: none !important;
  }


  #sp-top-bar .gsm-lang-switcher,
  .tm-toolbar .gsm-lang-switcher,
  #sp-toolbar-right .gsm-lang-switcher {
    top: 22px !important;
    right: 16px !important;
  }

  .gsm-lang-switcher:hover .mod-languages > ul,
  .gsm-lang-switcher:focus-within .mod-languages > ul,
  .gsm-lang-switcher:hover > ul,
  .gsm-lang-switcher:focus-within > ul,
  .mod-languages.gsm-lang-switcher:hover > ul,
  .mod-languages.gsm-lang-switcher:focus-within > ul {
    width: 48px !important;
    min-width: 48px !important;
  }

}


/* =========================================================
   GS Media – Feinschliff Header-Linie + Copyright-Leiste
   ========================================================= */

/* Header bekommt unten einen feinen Gradient-Streifen wie im Footer,
   nur subtiler und flacher. */
#sp-header,
.tm-header,
.uk-navbar-container {
  position: relative !important;
  border-bottom: 0 !important;
}

#sp-header::after,
.tm-header::after,
.uk-navbar-container::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(1180px, calc(100% - 120px));
  height: 2px;
  transform: translateX(-50%);
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      rgba(125, 201, 255, 0),
      rgba(125, 201, 255, 0.24) 16%,
      rgba(255, 255, 255, 0.58) 50%,
      rgba(125, 201, 255, 0.24) 84%,
      rgba(125, 201, 255, 0)
    );
  box-shadow:
    0 0 10px rgba(125, 201, 255, 0.24),
    0 0 1px rgba(255, 255, 255, 0.50);
  pointer-events: none;
  z-index: 5;
}

/* Copyright-Leiste dunkler, passend zur dunklen Bild-/Hero-Farbwelt */
:root {
  --gsm-footer-bg-dark: #102653;
  --gsm-footer-bg-deep: #07182f;
}

#sp-footer,
.tm-footer {
  background:
    radial-gradient(circle at 50% 0%, rgba(71, 117, 209, 0.18), transparent 48%),
    linear-gradient(180deg, #102653 0%, #07182f 100%) !important;
  color: rgba(255, 255, 255, 0.74) !important;
  box-shadow: inset 0 1px 0 rgba(125, 201, 255, 0.10);
}

#sp-footer a,
.tm-footer a {
  color: rgba(255, 255, 255, 0.92) !important;
}

#sp-footer a:hover,
.tm-footer a:hover {
  color: #9edcff !important;
}

/* Mobile: Header-Streifen über volle, aber elegante Breite */
@media (max-width: 767px) {
  #sp-header::after,
  .tm-header::after,
  .uk-navbar-container::after {
    width: calc(100% - 36px);
    height: 1px;
  }
}


/* =========================================================
   GS Media – Footer kompakter + kleines Footer-Logo
   ========================================================= */

/* Bottom-Footer kompakter */
#sp-bottom,
.tm-bottom {
  padding: 30px 0 24px !important;
}

/* Spalten enger */
#sp-bottom .sp-module,
.tm-bottom .uk-panel {
  margin-bottom: 0 !important;
}

#sp-bottom h3,
#sp-bottom h4,
#sp-bottom .sp-module-title,
.tm-bottom h3,
.tm-bottom h4 {
  font-size: 15px !important;
  line-height: 1.25 !important;
  margin: 0 0 10px 0 !important;
}

#sp-bottom p,
#sp-bottom li,
.tm-bottom p,
.tm-bottom li {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

#sp-bottom li,
.tm-bottom li {
  margin-bottom: 4px !important;
}

/* Footer-Brand/Logo-Modul */
.gsm-footer-brand {
  max-width: 310px;
}

.gsm-footer-logo-img {
  display: block !important;
  width: 155px !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 0 14px 0 !important;
}

.gsm-footer-brand p {
  max-width: 300px !important;
  margin: 0 !important;
  color: var(--gsm-footer-muted) !important;
}

/* Falls statt Bild nur Text-Logo eingesetzt ist */
.gsm-footer-logo {
  color: #ffffff !important;
  font-size: 21px !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  margin: 0 0 12px 0 !important;
}

/* Gradient-Trennlinie näher an den Inhalt */
#sp-bottom::after,
.tm-bottom::after {
  height: 3px !important;
  margin: 24px auto -24px !important;
}

/* Copyright bleibt, aber minimal kompakter */
#sp-footer,
.tm-footer {
  min-height: 46px !important;
}

#sp-footer .container,
#sp-footer .container-inner,
#sp-footer .row,
#sp-footer .sp-column,
.tm-footer .uk-container {
  min-height: 46px !important;
}

#sp-footer,
#sp-footer p,
#sp-footer div,
.tm-footer {
  font-size: 13px !important;
}

/* Mobile Footer */
@media (max-width: 767px) {
  #sp-bottom,
  .tm-bottom {
    padding: 26px 0 22px !important;
  }

  #sp-bottom .sp-module {
    margin-bottom: 20px !important;
  }

  .gsm-footer-logo-img {
    width: 140px !important;
  }

  #sp-bottom::after,
  .tm-bottom::after {
    margin: 18px auto -22px !important;
  }
}

/* =========================================================
   GS Media – Footer Final Compact + Logo
   Logo-Pfad: /images/gs_media_logo_white_transparent.png
   ========================================================= */

/* Footer-Hauptbereich deutlich kompakter */
#sp-bottom,
.tm-bottom {
  padding: 24px 0 18px !important;
}

#sp-bottom .container,
#sp-bottom .container-inner,
.tm-bottom .uk-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#sp-bottom .row,
.tm-bottom .uk-grid {
  align-items: flex-start !important;
}

#sp-bottom .sp-module,
.tm-bottom .uk-panel {
  margin: 0 !important;
  padding: 0 !important;
}

/* Spalten-Titel kompakter */
#sp-bottom h3,
#sp-bottom h4,
#sp-bottom .sp-module-title,
.tm-bottom h3,
.tm-bottom h4 {
  font-size: 14px !important;
  line-height: 1.2 !important;
  margin: 0 0 8px 0 !important;
  color: #ffffff !important;
}

/* Footer-Text kompakter */
#sp-bottom p,
#sp-bottom li,
.tm-bottom p,
.tm-bottom li {
  font-size: 12.5px !important;
  line-height: 1.38 !important;
  color: rgba(255, 255, 255, 0.70) !important;
}

#sp-bottom p,
.tm-bottom p {
  margin: 0 !important;
}

#sp-bottom ul,
.tm-bottom ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#sp-bottom li,
.tm-bottom li {
  margin: 0 0 3px 0 !important;
  padding: 0 !important;
}

#sp-bottom a,
.tm-bottom a {
  color: rgba(255, 255, 255, 0.70) !important;
  text-decoration: none !important;
}

#sp-bottom a:hover,
.tm-bottom a:hover {
  color: #9edcff !important;
}

/* Bottom-1 Brand-Block */
.gsm-footer-brand {
  max-width: 285px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Variante A: Logo als echtes img im Modul */
.gsm-footer-logo-img {
  display: block !important;
  width: 132px !important;
  max-width: 132px !important;
  height: auto !important;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
}

/* Variante B: Logo automatisch per CSS einblenden,
   wenn im Modul nur <div class="gsm-footer-brand">...</div> steht. */
.gsm-footer-brand::before {
  content: "";
  display: block;
  width: 132px;
  height: 42px;
  margin: 0 0 10px 0;
  background-image: url("/images/gs_media_logo_white_transparent.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left center;
}

/* Wenn ein echtes img verwendet wird, CSS-Logo nicht zusätzlich anzeigen */
.gsm-footer-brand:has(.gsm-footer-logo-img)::before {
  display: none !important;
  content: none !important;
}

.gsm-footer-brand p {
  max-width: 270px !important;
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.70) !important;
}

/* Falls der alte Texttitel "GS MEDIA" noch als Titel/Logo drinsteht */
.gsm-footer-logo {
  display: none !important;
}

/* Gradient-Trennlinie enger an den Footer setzen */
#sp-bottom::after,
.tm-bottom::after {
  height: 2px !important;
  margin: 18px auto -18px !important;
  max-width: 1080px !important;
  opacity: 0.92 !important;
}

/* Copyright-Leiste unverändert dunkel, aber kompakt */
#sp-footer,
.tm-footer {
  min-height: 42px !important;
  padding: 0 !important;
}

#sp-footer .container,
#sp-footer .container-inner,
#sp-footer .row,
#sp-footer .sp-column,
.tm-footer .uk-container {
  min-height: 42px !important;
}

#sp-footer,
#sp-footer p,
#sp-footer div,
.tm-footer {
  font-size: 12.5px !important;
  line-height: 1.35 !important;
}

/* Responsive */
@media (max-width: 767px) {
  #sp-bottom,
  .tm-bottom {
    padding: 22px 0 18px !important;
  }

  #sp-bottom .sp-module {
    margin-bottom: 18px !important;
  }

  .gsm-footer-logo-img,
  .gsm-footer-brand::before {
    width: 122px !important;
    max-width: 122px !important;
    height: 38px !important;
    margin-bottom: 9px !important;
  }

  #sp-bottom::after,
  .tm-bottom::after {
    margin: 12px auto -18px !important;
  }
}

/* =========================================================
   GS Media – Prelaunch Final Tuning
   Footer kompakter, etwas dunkler, Navigation stabil,
   Mobile-Grundoptimierung.
   ========================================================= */

/* ---------------------------------------------------------
   Header Navigation final stabilisieren
   --------------------------------------------------------- */

.sp-megamenu-parent,
#sp-menu .sp-megamenu-parent,
#sp-menu ul.menu,
#sp-menu ul.nav,
#sp-menu .navbar-nav,
.tm-header .uk-navbar-nav,
.tm-header ul.menu,
.tm-header ul.nav {
  gap: 0 !important;
}

.sp-megamenu-parent > li,
#sp-menu ul.menu > li,
#sp-menu ul.nav > li,
#sp-menu .navbar-nav > li,
.tm-header .uk-navbar-nav > li,
.tm-header ul.menu > li,
.tm-header ul.nav > li {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: none !important;
}

.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span,
#sp-menu ul.menu > li > a,
#sp-menu ul.nav > li > a,
#sp-menu .navbar-nav > li > a,
.tm-header .uk-navbar-nav > li > a,
.tm-header ul.menu > li > a,
.tm-header ul.nav > li > a {
  position: relative !important;
  min-height: 78px !important;
  padding: 9px 13px 0 13px !important;
  margin: 0 !important;
  transform: none !important;
  left: auto !important;
  right: auto !important;
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none !important;
  transition:
    color .18s ease,
    text-shadow .18s ease,
    filter .18s ease !important;
}

.sp-megamenu-parent > li:not(:last-child)::after,
#sp-menu ul.menu > li:not(:last-child)::after,
#sp-menu ul.nav > li:not(:last-child)::after,
#sp-menu .navbar-nav > li:not(:last-child)::after,
.tm-header .uk-navbar-nav > li:not(:last-child)::after,
.tm-header ul.menu > li:not(:last-child)::after,
.tm-header ul.nav > li:not(:last-child)::after {
  content: "" !important;
  display: inline-block !important;
  width: 5px !important;
  height: 5px !important;
  min-width: 5px !important;
  margin: 9px 15px 0 15px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #4775d1 !important;
  box-shadow:
    0 0 8px rgba(125, 201, 255, 0.34),
    0 0 1px rgba(255, 255, 255, 0.55) !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: none !important;
}

.sp-megamenu-parent > li.active > a,
.sp-megamenu-parent > li.current-item > a,
.sp-megamenu-parent > li > a:hover,
#sp-menu ul.menu > li.active > a,
#sp-menu ul.menu > li.current > a,
#sp-menu ul.menu > li > a:hover,
#sp-menu ul.nav > li.active > a,
#sp-menu ul.nav > li.current > a,
#sp-menu ul.nav > li > a:hover,
.tm-header .uk-navbar-nav > li.uk-active > a,
.tm-header .uk-navbar-nav > li > a:hover,
.tm-header ul.menu > li.active > a,
.tm-header ul.menu > li.current > a,
.tm-header ul.menu > li > a:hover,
.tm-header ul.nav > li.active > a,
.tm-header ul.nav > li.current > a,
.tm-header ul.nav > li > a:hover {
  color: #9edcff !important;
  transform: none !important;
  left: auto !important;
  padding-left: 13px !important;
  padding-right: 13px !important;
  text-shadow:
    0 0 8px rgba(158, 220, 255, 0.48),
    0 0 18px rgba(125, 201, 255, 0.22) !important;
  filter: brightness(1.05) !important;
}

.sp-megamenu-parent > li > a::after,
.sp-megamenu-parent > li > span::after,
#sp-menu ul.menu > li > a::after,
#sp-menu ul.nav > li > a::after,
#sp-menu .navbar-nav > li > a::after,
.tm-header .uk-navbar-nav > li > a::after,
.tm-header ul.menu > li > a::after,
.tm-header ul.nav > li > a::after {
  display: none !important;
  content: none !important;
}

/* ---------------------------------------------------------
   Footer final: kompakter und etwas dunkler
   --------------------------------------------------------- */

#sp-bottom,
.tm-bottom {
  background:
    radial-gradient(circle at 10% 0%, rgba(125, 201, 255, 0.16), transparent 34%),
    radial-gradient(circle at 92% 12%, rgba(255, 255, 255, 0.07), transparent 28%),
    linear-gradient(135deg, #25488e 0%, #203f80 46%, #1a356f 100%) !important;
  padding: 24px 0 18px !important;
  color: rgba(255, 255, 255, 0.76) !important;
}

#sp-bottom .container,
#sp-bottom .container-inner,
.tm-bottom .uk-container {
  max-width: 1180px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#sp-bottom .row {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr !important;
  column-gap: clamp(32px, 5vw, 70px) !important;
  align-items: start !important;
}

#sp-bottom .row > [class*="col-"],
#sp-bottom .row > .sp-column,
#sp-bottom .row > div {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#sp-bottom .sp-module,
.tm-bottom .uk-panel {
  width: 100% !important;
  max-width: 240px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#sp-bottom h3,
#sp-bottom h4,
#sp-bottom .sp-module-title,
.tm-bottom h3,
.tm-bottom h4 {
  font-size: 14px !important;
  line-height: 1.18 !important;
  margin: 0 0 8px 0 !important;
  color: #ffffff !important;
}

#sp-bottom p,
#sp-bottom li,
.tm-bottom p,
.tm-bottom li {
  font-size: 12.5px !important;
  line-height: 1.34 !important;
  color: rgba(255, 255, 255, 0.70) !important;
}

#sp-bottom p,
.tm-bottom p {
  margin: 0 !important;
}

#sp-bottom ul,
.tm-bottom ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#sp-bottom li,
.tm-bottom li {
  margin: 0 0 3px 0 !important;
  padding: 0 !important;
}

#sp-bottom a,
.tm-bottom a {
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: none !important;
  transition: color .18s ease, text-shadow .18s ease !important;
}

#sp-bottom a:hover,
.tm-bottom a:hover {
  color: #9edcff !important;
  text-shadow: 0 0 10px rgba(125, 201, 255, .24);
}

/* Footer-Logo sichtbar, aber nicht dominant */
.gsm-footer-brand {
  max-width: 240px !important;
}

.gsm-footer-logo-img {
  display: block !important;
  width: 142px !important;
  max-width: 142px !important;
  max-height: 54px !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
}

.gsm-footer-brand::before {
  width: 142px !important;
  max-width: 142px !important;
  height: 54px !important;
  margin: 0 0 10px 0 !important;
  background-size: contain !important;
}

.gsm-footer-brand:has(.gsm-footer-logo-img)::before {
  display: none !important;
  content: none !important;
}

.gsm-footer-brand p {
  max-width: 235px !important;
  margin: 0 !important;
}

/* Trennlinie im Footer etwas dezenter und enger */
#sp-bottom::after,
.tm-bottom::after {
  height: 2px !important;
  margin: 17px auto -18px !important;
  max-width: 1080px !important;
  opacity: .82 !important;
}

/* Copyright-Leiste bleibt dunkel und etwas kompakter */
#sp-footer,
.tm-footer {
  min-height: 40px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(71, 117, 209, 0.16), transparent 48%),
    linear-gradient(180deg, #102653 0%, #07182f 100%) !important;
}

#sp-footer .container,
#sp-footer .container-inner,
#sp-footer .row,
#sp-footer .sp-column,
.tm-footer .uk-container {
  min-height: 40px !important;
}

#sp-footer,
#sp-footer p,
#sp-footer div,
.tm-footer {
  font-size: 12.3px !important;
  line-height: 1.32 !important;
}

/* ---------------------------------------------------------
   Mobile / Tablet Grundlayout
   --------------------------------------------------------- */

@media (max-width: 991px) {
  #sp-bottom .row {
    grid-template-columns: 1fr 1fr !important;
    row-gap: 22px !important;
  }

  #sp-bottom .sp-module,
  .gsm-footer-brand {
    max-width: 280px !important;
  }
}

@media (max-width: 767px) {
  #sp-bottom,
  .tm-bottom {
    padding: 22px 0 18px !important;
  }

  #sp-bottom .row {
    grid-template-columns: 1fr !important;
    row-gap: 17px !important;
  }

  .gsm-footer-logo-img,
  .gsm-footer-brand::before {
    width: 132px !important;
    max-width: 132px !important;
    height: 50px !important;
  }

  #sp-footer,
  .tm-footer,
  #sp-footer .container,
  #sp-footer .container-inner,
  #sp-footer .row,
  #sp-footer .sp-column {
    min-height: 38px !important;
  }
}

/* =========================================================
   GS Media – Language Switcher HARD FIX
   Greift ohne Abhängigkeit von der Modulklasse gsm-lang-switcher.
   ========================================================= */

:root{
  --gsm-lang-bg-a:rgba(8,23,49,.96);
  --gsm-lang-bg-b:rgba(18,44,88,.96);
  --gsm-lang-border-a:rgba(125,201,255,.82);
  --gsm-lang-border-b:rgba(255,255,255,.28);
  --gsm-lang-text:rgba(235,247,255,.94);
  --gsm-lang-active:#9edcff;
}

/* Modul oben rechts treffen – egal ob mit oder ohne gsm-lang-switcher-Klasse */
#sp-top-bar .mod-languages,
#sp-toolbar-right .mod-languages,
.tm-toolbar .mod-languages,
#sp-top-bar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher{
  position:absolute!important;
  top:24px!important;
  right:clamp(18px,7.8vw,150px)!important;
  z-index:99999!important;
  width:62px!important;
  min-width:62px!important;
  height:30px!important;
  min-height:30px!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* Geschlossener Button / geschlossene Liste */
#sp-top-bar .mod-languages .btn,
#sp-top-bar .mod-languages .button,
#sp-top-bar .mod-languages .dropdown-toggle,
#sp-top-bar .mod-languages>ul,
#sp-top-bar .mod-languages ul.lang-inline,
#sp-top-bar .mod-languages ul.mod-languages__list,
#sp-toolbar-right .mod-languages .btn,
#sp-toolbar-right .mod-languages .button,
#sp-toolbar-right .mod-languages .dropdown-toggle,
#sp-toolbar-right .mod-languages>ul,
#sp-toolbar-right .mod-languages ul.lang-inline,
#sp-toolbar-right .mod-languages ul.mod-languages__list,
.tm-toolbar .mod-languages .btn,
.tm-toolbar .mod-languages .button,
.tm-toolbar .mod-languages .dropdown-toggle,
.tm-toolbar .mod-languages>ul,
.tm-toolbar .mod-languages ul.lang-inline,
.tm-toolbar .mod-languages ul.mod-languages__list{
  position:relative!important;
  display:block!important;
  width:62px!important;
  min-width:62px!important;
  max-width:62px!important;
  height:30px!important;
  min-height:30px!important;
  max-height:30px!important;
  padding:0!important;
  margin:0!important;
  list-style:none!important;
  border:1px solid rgba(125,201,255,.24)!important;
  border-radius:9px!important;
  background:rgba(8,23,49,.10)!important;
  box-shadow:none!important;
  overflow:visible!important;
}

/* Pfeil */
#sp-top-bar .mod-languages .dropdown-toggle::after,
#sp-top-bar .mod-languages>ul::after,
#sp-top-bar .mod-languages ul.lang-inline::after,
#sp-top-bar .mod-languages ul.mod-languages__list::after,
#sp-toolbar-right .mod-languages .dropdown-toggle::after,
#sp-toolbar-right .mod-languages>ul::after,
#sp-toolbar-right .mod-languages ul.lang-inline::after,
#sp-toolbar-right .mod-languages ul.mod-languages__list::after,
.tm-toolbar .mod-languages .dropdown-toggle::after,
.tm-toolbar .mod-languages>ul::after,
.tm-toolbar .mod-languages ul.lang-inline::after,
.tm-toolbar .mod-languages ul.mod-languages__list::after{
  content:""!important;
  position:absolute!important;
  right:7px!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  margin:0!important;
  border:0!important;
  border-right:1.5px solid rgba(158,220,255,.95)!important;
  border-bottom:1.5px solid rgba(158,220,255,.95)!important;
  transform:translateY(-65%) rotate(45deg)!important;
  background:transparent!important;
  pointer-events:none!important;
}

/* Geschlossene Liste: nur aktive Sprache */
#sp-top-bar .mod-languages>ul>li,
#sp-top-bar .mod-languages ul.lang-inline>li,
#sp-top-bar .mod-languages ul.mod-languages__list>li,
#sp-toolbar-right .mod-languages>ul>li,
#sp-toolbar-right .mod-languages ul.lang-inline>li,
#sp-toolbar-right .mod-languages ul.mod-languages__list>li,
.tm-toolbar .mod-languages>ul>li,
.tm-toolbar .mod-languages ul.lang-inline>li,
.tm-toolbar .mod-languages ul.mod-languages__list>li{
  display:none!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}

#sp-top-bar .mod-languages>ul>li.lang-active,
#sp-top-bar .mod-languages ul.lang-inline>li.lang-active,
#sp-top-bar .mod-languages ul.mod-languages__list>li.lang-active,
#sp-toolbar-right .mod-languages>ul>li.lang-active,
#sp-toolbar-right .mod-languages ul.lang-inline>li.lang-active,
#sp-toolbar-right .mod-languages ul.mod-languages__list>li.lang-active,
.tm-toolbar .mod-languages>ul>li.lang-active,
.tm-toolbar .mod-languages ul.lang-inline>li.lang-active,
.tm-toolbar .mod-languages ul.mod-languages__list>li.lang-active{
  display:block!important;
}

/* Links geschlossen + geöffnet: Flagge und Kürzel sichtbar */
#sp-top-bar .mod-languages a,
#sp-top-bar .mod-languages span,
#sp-toolbar-right .mod-languages a,
#sp-toolbar-right .mod-languages span,
.tm-toolbar .mod-languages a,
.tm-toolbar .mod-languages span{
  text-indent:0!important;
}

#sp-top-bar .mod-languages>ul>li.lang-active>a,
#sp-top-bar .mod-languages>ul>li.lang-active>span,
#sp-top-bar .mod-languages ul.lang-inline>li.lang-active>a,
#sp-top-bar .mod-languages ul.lang-inline>li.lang-active>span,
#sp-top-bar .mod-languages ul.mod-languages__list>li.lang-active>a,
#sp-top-bar .mod-languages ul.mod-languages__list>li.lang-active>span,
#sp-toolbar-right .mod-languages>ul>li.lang-active>a,
#sp-toolbar-right .mod-languages>ul>li.lang-active>span,
#sp-toolbar-right .mod-languages ul.lang-inline>li.lang-active>a,
#sp-toolbar-right .mod-languages ul.lang-inline>li.lang-active>span,
#sp-toolbar-right .mod-languages ul.mod-languages__list>li.lang-active>a,
#sp-toolbar-right .mod-languages ul.mod-languages__list>li.lang-active>span,
.tm-toolbar .mod-languages>ul>li.lang-active>a,
.tm-toolbar .mod-languages>ul>li.lang-active>span,
.tm-toolbar .mod-languages ul.lang-inline>li.lang-active>a,
.tm-toolbar .mod-languages ul.lang-inline>li.lang-active>span,
.tm-toolbar .mod-languages ul.mod-languages__list>li.lang-active>a,
.tm-toolbar .mod-languages ul.mod-languages__list>li.lang-active>span{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:5px!important;
  width:62px!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 18px 0 7px!important;
  margin:0!important;
  color:var(--gsm-lang-text)!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1!important;
  letter-spacing:.02em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}

/* Flaggen */
#sp-top-bar .mod-languages img,
#sp-toolbar-right .mod-languages img,
.tm-toolbar .mod-languages img{
  display:inline-block!important;
  width:18px!important;
  max-width:18px!important;
  height:auto!important;
  margin:0!important;
  border-radius:2px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.7),0 3px 9px rgba(0,0,0,.2)!important;
  flex:0 0 auto!important;
}

/* Offenes Dropdown: Bootstrap-Variante */
#sp-top-bar .mod-languages .dropdown-menu,
#sp-top-bar .mod-languages .dropdown-menu.show,
#sp-top-bar .mod-languages .dropdown-menu[data-bs-popper],
#sp-toolbar-right .mod-languages .dropdown-menu,
#sp-toolbar-right .mod-languages .dropdown-menu.show,
#sp-toolbar-right .mod-languages .dropdown-menu[data-bs-popper],
.tm-toolbar .mod-languages .dropdown-menu,
.tm-toolbar .mod-languages .dropdown-menu.show,
.tm-toolbar .mod-languages .dropdown-menu[data-bs-popper]{
  position:absolute!important;
  inset:auto 0 auto auto!important;
  left:auto!important;
  right:0!important;
  top:calc(100% + 8px)!important;
  transform:none!important;
  width:92px!important;
  min-width:92px!important;
  max-width:92px!important;
  padding:7px!important;
  margin:0!important;
  border:1px solid transparent!important;
  border-radius:13px!important;
  background:linear-gradient(var(--gsm-lang-bg-a),var(--gsm-lang-bg-b)) padding-box,linear-gradient(145deg,var(--gsm-lang-border-a),var(--gsm-lang-border-b),rgba(71,117,209,.76)) border-box!important;
  box-shadow:0 18px 44px rgba(5,18,43,.38),0 0 20px rgba(125,201,255,.15)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
  overflow:hidden!important;
}

/* Offenes Dropdown: Listen-Variante */
#sp-top-bar .mod-languages:hover>ul,
#sp-top-bar .mod-languages:focus-within>ul,
#sp-top-bar .mod-languages:hover ul.lang-inline,
#sp-top-bar .mod-languages:focus-within ul.lang-inline,
#sp-top-bar .mod-languages:hover ul.mod-languages__list,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list,
#sp-toolbar-right .mod-languages:hover>ul,
#sp-toolbar-right .mod-languages:focus-within>ul,
#sp-toolbar-right .mod-languages:hover ul.lang-inline,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list,
.tm-toolbar .mod-languages:hover>ul,
.tm-toolbar .mod-languages:focus-within>ul,
.tm-toolbar .mod-languages:hover ul.lang-inline,
.tm-toolbar .mod-languages:focus-within ul.lang-inline,
.tm-toolbar .mod-languages:hover ul.mod-languages__list,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list{
  position:absolute!important;
  top:calc(100% + 8px)!important;
  right:0!important;
  left:auto!important;
  width:92px!important;
  min-width:92px!important;
  max-width:92px!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:7px!important;
  border:1px solid transparent!important;
  border-radius:13px!important;
  background:linear-gradient(var(--gsm-lang-bg-a),var(--gsm-lang-bg-b)) padding-box,linear-gradient(145deg,var(--gsm-lang-border-a),var(--gsm-lang-border-b),rgba(71,117,209,.76)) border-box!important;
  box-shadow:0 18px 44px rgba(5,18,43,.38),0 0 20px rgba(125,201,255,.15)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
  overflow:hidden!important;
}

/* Offene Liste: alle Sprachen anzeigen */
#sp-top-bar .mod-languages:hover>ul>li,
#sp-top-bar .mod-languages:focus-within>ul>li,
#sp-top-bar .mod-languages:hover ul.lang-inline>li,
#sp-top-bar .mod-languages:focus-within ul.lang-inline>li,
#sp-top-bar .mod-languages:hover ul.mod-languages__list>li,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list>li,
#sp-toolbar-right .mod-languages:hover>ul>li,
#sp-toolbar-right .mod-languages:focus-within>ul>li,
#sp-toolbar-right .mod-languages:hover ul.lang-inline>li,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline>li,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list>li,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list>li,
.tm-toolbar .mod-languages:hover>ul>li,
.tm-toolbar .mod-languages:focus-within>ul>li,
.tm-toolbar .mod-languages:hover ul.lang-inline>li,
.tm-toolbar .mod-languages:focus-within ul.lang-inline>li,
.tm-toolbar .mod-languages:hover ul.mod-languages__list>li,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list>li{
  display:block!important;
  width:100%!important;
  margin:0 0 4px 0!important;
  padding:0!important;
}

#sp-top-bar .mod-languages:hover>ul::after,
#sp-top-bar .mod-languages:focus-within>ul::after,
#sp-toolbar-right .mod-languages:hover>ul::after,
#sp-toolbar-right .mod-languages:focus-within>ul::after,
.tm-toolbar .mod-languages:hover>ul::after,
.tm-toolbar .mod-languages:focus-within>ul::after{
  display:none!important;
  content:none!important;
}

/* Dropdown-Zeilen */
#sp-top-bar .mod-languages .dropdown-menu a,
#sp-top-bar .mod-languages .dropdown-menu span,
#sp-top-bar .mod-languages:hover>ul>li>a,
#sp-top-bar .mod-languages:hover>ul>li>span,
#sp-toolbar-right .mod-languages .dropdown-menu a,
#sp-toolbar-right .mod-languages .dropdown-menu span,
#sp-toolbar-right .mod-languages:hover>ul>li>a,
#sp-toolbar-right .mod-languages:hover>ul>li>span,
.tm-toolbar .mod-languages .dropdown-menu a,
.tm-toolbar .mod-languages .dropdown-menu span,
.tm-toolbar .mod-languages:hover>ul>li>a,
.tm-toolbar .mod-languages:hover>ul>li>span{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  width:100%!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 8px!important;
  margin:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--gsm-lang-text)!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1!important;
  letter-spacing:.02em!important;
  text-transform:uppercase!important;
  text-indent:0!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}

#sp-top-bar .mod-languages .dropdown-menu a:hover,
#sp-top-bar .mod-languages .dropdown-menu .active>a,
#sp-top-bar .mod-languages:hover>ul>li>a:hover,
#sp-top-bar .mod-languages:hover>ul>li.lang-active>a,
#sp-toolbar-right .mod-languages .dropdown-menu a:hover,
#sp-toolbar-right .mod-languages .dropdown-menu .active>a,
#sp-toolbar-right .mod-languages:hover>ul>li>a:hover,
#sp-toolbar-right .mod-languages:hover>ul>li.lang-active>a,
.tm-toolbar .mod-languages .dropdown-menu a:hover,
.tm-toolbar .mod-languages .dropdown-menu .active>a,
.tm-toolbar .mod-languages:hover>ul>li>a:hover,
.tm-toolbar .mod-languages:hover>ul>li.lang-active>a{
  background:rgba(125,201,255,.15)!important;
  color:var(--gsm-lang-active)!important;
  text-shadow:0 0 10px rgba(125,201,255,.28)!important;
}

/* =========================================================
   GS Media – Language Switcher Flag + Code Final
   Ergänzung zum Hardfix:
   - Flagge wieder sichtbar
   - Sprachkürzel DE/EN sichtbar
   - geschlossen und geöffnet
   ========================================================= */

/* Grundbreiten für Flagge + Kürzel + Pfeil */
#sp-top-bar .mod-languages,
#sp-toolbar-right .mod-languages,
.tm-toolbar .mod-languages,
#sp-top-bar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher {
  width: 66px !important;
  min-width: 66px !important;
  height: 30px !important;
  min-height: 30px !important;
}

/* Geschlossene Listenfläche */
#sp-top-bar .mod-languages > ul,
#sp-top-bar .mod-languages ul.lang-inline,
#sp-top-bar .mod-languages ul.mod-languages__list,
#sp-toolbar-right .mod-languages > ul,
#sp-toolbar-right .mod-languages ul.lang-inline,
#sp-toolbar-right .mod-languages ul.mod-languages__list,
.tm-toolbar .mod-languages > ul,
.tm-toolbar .mod-languages ul.lang-inline,
.tm-toolbar .mod-languages ul.mod-languages__list {
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
}

/* Geschlossener aktiver Link: Flagge + Kürzel sichtbar */
#sp-top-bar .mod-languages > ul > li.lang-active > a,
#sp-top-bar .mod-languages > ul > li.lang-active > span,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active > a,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active > span,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active > span,
#sp-toolbar-right .mod-languages > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active > a,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active > span,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active > span,
.tm-toolbar .mod-languages > ul > li.lang-active > a,
.tm-toolbar .mod-languages > ul > li.lang-active > span,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active > a,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active > span,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active > a,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active > span {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 18px 0 7px !important;
  margin: 0 !important;
  font-size: 0 !important;
  line-height: 1 !important;
  color: transparent !important;
  text-indent: 0 !important;
  overflow: visible !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

/* Alle Language-Links im geöffneten Panel: Text verstecken, Code per ::after setzen */
#sp-top-bar .mod-languages .dropdown-menu a,
#sp-top-bar .mod-languages .dropdown-menu span,
#sp-top-bar .mod-languages:hover > ul > li > a,
#sp-top-bar .mod-languages:hover > ul > li > span,
#sp-top-bar .mod-languages:focus-within > ul > li > a,
#sp-top-bar .mod-languages:focus-within > ul > li > span,
#sp-top-bar .mod-languages:hover ul.lang-inline > li > a,
#sp-top-bar .mod-languages:hover ul.lang-inline > li > span,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li > a,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li > span,
#sp-top-bar .mod-languages:hover ul.mod-languages__list > li > a,
#sp-top-bar .mod-languages:hover ul.mod-languages__list > li > span,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list > li > a,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list > li > span,
#sp-toolbar-right .mod-languages .dropdown-menu a,
#sp-toolbar-right .mod-languages .dropdown-menu span,
#sp-toolbar-right .mod-languages:hover > ul > li > a,
#sp-toolbar-right .mod-languages:hover > ul > li > span,
#sp-toolbar-right .mod-languages:focus-within > ul > li > a,
#sp-toolbar-right .mod-languages:focus-within > ul > li > span,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li > a,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li > span,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li > a,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li > span,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list > li > a,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list > li > span,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list > li > a,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list > li > span,
.tm-toolbar .mod-languages .dropdown-menu a,
.tm-toolbar .mod-languages .dropdown-menu span,
.tm-toolbar .mod-languages:hover > ul > li > a,
.tm-toolbar .mod-languages:hover > ul > li > span,
.tm-toolbar .mod-languages:focus-within > ul > li > a,
.tm-toolbar .mod-languages:focus-within > ul > li > span,
.tm-toolbar .mod-languages:hover ul.lang-inline > li > a,
.tm-toolbar .mod-languages:hover ul.lang-inline > li > span,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li > a,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li > span,
.tm-toolbar .mod-languages:hover ul.mod-languages__list > li > a,
.tm-toolbar .mod-languages:hover ul.mod-languages__list > li > span,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list > li > a,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list > li > span {
  font-size: 0 !important;
  color: transparent !important;
  text-indent: 0 !important;
  overflow: visible !important;
}

/* Flaggen sichtbar erzwingen */
#sp-top-bar .mod-languages img,
#sp-toolbar-right .mod-languages img,
.tm-toolbar .mod-languages img,
#sp-top-bar .gsm-lang-switcher img,
#sp-toolbar-right .gsm-lang-switcher img,
.tm-toolbar .gsm-lang-switcher img {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 2px !important;
  transform: none !important;
  text-indent: 0 !important;
  flex: 0 0 18px !important;
}

/* Sprachkürzel via CSS erzeugen */
#sp-top-bar .mod-languages a::after,
#sp-top-bar .mod-languages span::after,
#sp-toolbar-right .mod-languages a::after,
#sp-toolbar-right .mod-languages span::after,
.tm-toolbar .mod-languages a::after,
.tm-toolbar .mod-languages span::after {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(235, 247, 255, 0.94) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  text-indent: 0 !important;
  text-transform: uppercase !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Deutsch erkennen */
#sp-top-bar .mod-languages a[hreflang^="de"]::after,
#sp-top-bar .mod-languages a[href*="/de"]::after,
#sp-top-bar .mod-languages a:has(img[src*="de"])::after,
#sp-top-bar .mod-languages span:has(img[src*="de"])::after,
#sp-toolbar-right .mod-languages a[hreflang^="de"]::after,
#sp-toolbar-right .mod-languages a[href*="/de"]::after,
#sp-toolbar-right .mod-languages a:has(img[src*="de"])::after,
#sp-toolbar-right .mod-languages span:has(img[src*="de"])::after,
.tm-toolbar .mod-languages a[hreflang^="de"]::after,
.tm-toolbar .mod-languages a[href*="/de"]::after,
.tm-toolbar .mod-languages a:has(img[src*="de"])::after,
.tm-toolbar .mod-languages span:has(img[src*="de"])::after {
  content: "DE" !important;
}

/* Englisch erkennen */
#sp-top-bar .mod-languages a[hreflang^="en"]::after,
#sp-top-bar .mod-languages a[href*="/en"]::after,
#sp-top-bar .mod-languages a:has(img[src*="en"])::after,
#sp-top-bar .mod-languages span:has(img[src*="en"])::after,
#sp-toolbar-right .mod-languages a[hreflang^="en"]::after,
#sp-toolbar-right .mod-languages a[href*="/en"]::after,
#sp-toolbar-right .mod-languages a:has(img[src*="en"])::after,
#sp-toolbar-right .mod-languages span:has(img[src*="en"])::after,
.tm-toolbar .mod-languages a[hreflang^="en"]::after,
.tm-toolbar .mod-languages a[href*="/en"]::after,
.tm-toolbar .mod-languages a:has(img[src*="en"])::after,
.tm-toolbar .mod-languages span:has(img[src*="en"])::after {
  content: "EN" !important;
}

/* Offenes Panel etwas breiter, damit Flagge + Kürzel sauber sitzen */
#sp-top-bar .mod-languages:hover > ul,
#sp-top-bar .mod-languages:focus-within > ul,
#sp-top-bar .mod-languages:hover ul.lang-inline,
#sp-top-bar .mod-languages:focus-within ul.lang-inline,
#sp-top-bar .mod-languages:hover ul.mod-languages__list,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list,
#sp-toolbar-right .mod-languages:hover > ul,
#sp-toolbar-right .mod-languages:focus-within > ul,
#sp-toolbar-right .mod-languages:hover ul.lang-inline,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list,
.tm-toolbar .mod-languages:hover > ul,
.tm-toolbar .mod-languages:focus-within > ul,
.tm-toolbar .mod-languages:hover ul.lang-inline,
.tm-toolbar .mod-languages:focus-within ul.lang-inline,
.tm-toolbar .mod-languages:hover ul.mod-languages__list,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list {
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
}

/* Offene Links mit Platz für Flagge + Kürzel */
#sp-top-bar .mod-languages:hover > ul > li > a,
#sp-top-bar .mod-languages:hover > ul > li > span,
#sp-top-bar .mod-languages:focus-within > ul > li > a,
#sp-top-bar .mod-languages:focus-within > ul > li > span,
#sp-top-bar .mod-languages:hover ul.lang-inline > li > a,
#sp-top-bar .mod-languages:hover ul.lang-inline > li > span,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li > a,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li > span,
#sp-top-bar .mod-languages:hover ul.mod-languages__list > li > a,
#sp-top-bar .mod-languages:hover ul.mod-languages__list > li > span,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list > li > a,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list > li > span,
#sp-toolbar-right .mod-languages:hover > ul > li > a,
#sp-toolbar-right .mod-languages:hover > ul > li > span,
#sp-toolbar-right .mod-languages:focus-within > ul > li > a,
#sp-toolbar-right .mod-languages:focus-within > ul > li > span,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li > a,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li > span,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li > a,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li > span,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list > li > a,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list > li > span,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list > li > a,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list > li > span,
.tm-toolbar .mod-languages:hover > ul > li > a,
.tm-toolbar .mod-languages:hover > ul > li > span,
.tm-toolbar .mod-languages:focus-within > ul > li > a,
.tm-toolbar .mod-languages:focus-within > ul > li > span,
.tm-toolbar .mod-languages:hover ul.lang-inline > li > a,
.tm-toolbar .mod-languages:hover ul.lang-inline > li > span,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li > a,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li > span,
.tm-toolbar .mod-languages:hover ul.mod-languages__list > li > a,
.tm-toolbar .mod-languages:hover ul.mod-languages__list > li > span,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list > li > a,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list > li > span {
  gap: 7px !important;
  padding: 0 8px !important;
  justify-content: flex-start !important;
}

/* Aktiv/Hover: Kürzel hellblau */
#sp-top-bar .mod-languages:hover > ul > li.lang-active > a::after,
#sp-top-bar .mod-languages:hover > ul > li.lang-active > span::after,
#sp-top-bar .mod-languages:hover ul.lang-inline > li.lang-active > a::after,
#sp-top-bar .mod-languages:hover ul.lang-inline > li.lang-active > span::after,
#sp-toolbar-right .mod-languages:hover > ul > li.lang-active > a::after,
#sp-toolbar-right .mod-languages:hover > ul > li.lang-active > span::after,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li.lang-active > a::after,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li.lang-active > span::after,
.tm-toolbar .mod-languages:hover > ul > li.lang-active > a::after,
.tm-toolbar .mod-languages:hover > ul > li.lang-active > span::after,
.tm-toolbar .mod-languages:hover ul.lang-inline > li.lang-active > a::after,
.tm-toolbar .mod-languages:hover ul.lang-inline > li.lang-active > span::after,
#sp-top-bar .mod-languages a:hover::after,
#sp-toolbar-right .mod-languages a:hover::after,
.tm-toolbar .mod-languages a:hover::after {
  color: #9edcff !important;
}

/* Mobile gleich halten */
@media (max-width: 767px) {
  #sp-top-bar .mod-languages,
  #sp-toolbar-right .mod-languages,
  .tm-toolbar .mod-languages {
    width: 66px !important;
    min-width: 66px !important;
  }

  #sp-top-bar .mod-languages:hover > ul,
  #sp-top-bar .mod-languages:hover ul.lang-inline,
  #sp-top-bar .mod-languages:hover ul.mod-languages__list,
  #sp-toolbar-right .mod-languages:hover > ul,
  #sp-toolbar-right .mod-languages:hover ul.lang-inline,
  #sp-toolbar-right .mod-languages:hover ul.mod-languages__list,
  .tm-toolbar .mod-languages:hover > ul,
  .tm-toolbar .mod-languages:hover ul.lang-inline,
  .tm-toolbar .mod-languages:hover ul.mod-languages__list {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
  }
}

/* =========================================================
   GS Media – Language Switcher Closed Button Fix
   Stand:
   - Popdown-Färbung bleibt
   - geschlossener Button zeigt Flagge + DE/EN
   - Button sitzt deutlich höher im Header
   ========================================================= */

/* Button deutlich höher setzen */
#sp-top-bar .mod-languages,
#sp-toolbar-right .mod-languages,
.tm-toolbar .mod-languages,
#sp-header .mod-languages,
.tm-header .mod-languages,
#sp-top-bar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher,
#sp-header .gsm-lang-switcher,
.tm-header .gsm-lang-switcher {
  top: 13px !important;
  right: clamp(18px, 7.8vw, 150px) !important;
  width: 68px !important;
  min-width: 68px !important;
  height: 30px !important;
  min-height: 30px !important;
  z-index: 99999 !important;
  overflow: visible !important;
}

/* Geschlossene Grundfläche */
#sp-top-bar .mod-languages > ul,
#sp-top-bar .mod-languages ul.lang-inline,
#sp-top-bar .mod-languages ul.mod-languages__list,
#sp-toolbar-right .mod-languages > ul,
#sp-toolbar-right .mod-languages ul.lang-inline,
#sp-toolbar-right .mod-languages ul.mod-languages__list,
.tm-toolbar .mod-languages > ul,
.tm-toolbar .mod-languages ul.lang-inline,
.tm-toolbar .mod-languages ul.mod-languages__list,
#sp-header .mod-languages > ul,
#sp-header .mod-languages ul.lang-inline,
#sp-header .mod-languages ul.mod-languages__list,
.tm-header .mod-languages > ul,
.tm-header .mod-languages ul.lang-inline,
.tm-header .mod-languages ul.mod-languages__list {
  position: relative !important;
  width: 68px !important;
  min-width: 68px !important;
  max-width: 68px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

/* geschlossener Button: aktive Sprache als echtes Element oben sichtbar machen */
#sp-top-bar .mod-languages > ul > li.lang-active,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active,
#sp-toolbar-right .mod-languages > ul > li.lang-active,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active,
.tm-toolbar .mod-languages > ul > li.lang-active,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active,
#sp-header .mod-languages > ul > li.lang-active,
#sp-header .mod-languages ul.lang-inline > li.lang-active,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active,
.tm-header .mod-languages > ul > li.lang-active,
.tm-header .mod-languages ul.lang-inline > li.lang-active,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 68px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 2 !important;
  overflow: visible !important;
}

/* Geschlossen: Flagge + Kürzel sichtbar; alte text-indent-Verstecke überschreiben */
#sp-top-bar .mod-languages > ul > li.lang-active > a,
#sp-top-bar .mod-languages > ul > li.lang-active > span,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active > a,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active > span,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active > span,
#sp-toolbar-right .mod-languages > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active > a,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active > span,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active > span,
.tm-toolbar .mod-languages > ul > li.lang-active > a,
.tm-toolbar .mod-languages > ul > li.lang-active > span,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active > a,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active > span,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active > a,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active > span,
#sp-header .mod-languages > ul > li.lang-active > a,
#sp-header .mod-languages > ul > li.lang-active > span,
#sp-header .mod-languages ul.lang-inline > li.lang-active > a,
#sp-header .mod-languages ul.lang-inline > li.lang-active > span,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active > span,
.tm-header .mod-languages > ul > li.lang-active > a,
.tm-header .mod-languages > ul > li.lang-active > span,
.tm-header .mod-languages ul.lang-inline > li.lang-active > a,
.tm-header .mod-languages ul.lang-inline > li.lang-active > span,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active > a,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active > span {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: 68px !important;
  min-width: 68px !important;
  max-width: 68px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 19px 0 8px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(235, 247, 255, 0.94) !important;
  font-size: 0 !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  text-indent: 0 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

/* Flagge im geschlossenen Zustand sichtbar erzwingen */
#sp-top-bar .mod-languages > ul > li.lang-active img,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active img,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active img,
#sp-toolbar-right .mod-languages > ul > li.lang-active img,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active img,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active img,
.tm-toolbar .mod-languages > ul > li.lang-active img,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active img,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active img,
#sp-header .mod-languages > ul > li.lang-active img,
#sp-header .mod-languages ul.lang-inline > li.lang-active img,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active img,
.tm-header .mod-languages > ul > li.lang-active img,
.tm-header .mod-languages ul.lang-inline > li.lang-active img,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active img {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: auto !important;
  margin: 0 !important;
  transform: none !important;
  text-indent: 0 !important;
  flex: 0 0 18px !important;
}

/* Sprachkürzel geschlossen per Seitensprache erzwingen */
html[lang^="de"] #sp-top-bar .mod-languages > ul > li.lang-active > a::after,
html[lang^="de"] #sp-top-bar .mod-languages > ul > li.lang-active > span::after,
html[lang^="de"] #sp-toolbar-right .mod-languages > ul > li.lang-active > a::after,
html[lang^="de"] #sp-toolbar-right .mod-languages > ul > li.lang-active > span::after,
html[lang^="de"] .tm-toolbar .mod-languages > ul > li.lang-active > a::after,
html[lang^="de"] .tm-toolbar .mod-languages > ul > li.lang-active > span::after,
html[lang^="de"] #sp-header .mod-languages > ul > li.lang-active > a::after,
html[lang^="de"] #sp-header .mod-languages > ul > li.lang-active > span::after,
html[lang^="de"] .tm-header .mod-languages > ul > li.lang-active > a::after,
html[lang^="de"] .tm-header .mod-languages > ul > li.lang-active > span::after {
  content: "DE" !important;
}

html[lang^="en"] #sp-top-bar .mod-languages > ul > li.lang-active > a::after,
html[lang^="en"] #sp-top-bar .mod-languages > ul > li.lang-active > span::after,
html[lang^="en"] #sp-toolbar-right .mod-languages > ul > li.lang-active > a::after,
html[lang^="en"] #sp-toolbar-right .mod-languages > ul > li.lang-active > span::after,
html[lang^="en"] .tm-toolbar .mod-languages > ul > li.lang-active > a::after,
html[lang^="en"] .tm-toolbar .mod-languages > ul > li.lang-active > span::after,
html[lang^="en"] #sp-header .mod-languages > ul > li.lang-active > a::after,
html[lang^="en"] #sp-header .mod-languages > ul > li.lang-active > span::after,
html[lang^="en"] .tm-header .mod-languages > ul > li.lang-active > a::after,
html[lang^="en"] .tm-header .mod-languages > ul > li.lang-active > span::after {
  content: "EN" !important;
}

/* Kürzel im geschlossenen Button sichtbar stylen */
#sp-top-bar .mod-languages > ul > li.lang-active > a::after,
#sp-top-bar .mod-languages > ul > li.lang-active > span::after,
#sp-toolbar-right .mod-languages > ul > li.lang-active > a::after,
#sp-toolbar-right .mod-languages > ul > li.lang-active > span::after,
.tm-toolbar .mod-languages > ul > li.lang-active > a::after,
.tm-toolbar .mod-languages > ul > li.lang-active > span::after,
#sp-header .mod-languages > ul > li.lang-active > a::after,
#sp-header .mod-languages > ul > li.lang-active > span::after,
.tm-header .mod-languages > ul > li.lang-active > a::after,
.tm-header .mod-languages > ul > li.lang-active > span::after {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(235, 247, 255, 0.94) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  text-indent: 0 !important;
  text-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Popdown bleibt wie vorher, aber rechts sauber unter dem höheren Button */
#sp-top-bar .mod-languages:hover > ul,
#sp-top-bar .mod-languages:focus-within > ul,
#sp-top-bar .mod-languages:hover ul.lang-inline,
#sp-top-bar .mod-languages:focus-within ul.lang-inline,
#sp-top-bar .mod-languages:hover ul.mod-languages__list,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list,
#sp-toolbar-right .mod-languages:hover > ul,
#sp-toolbar-right .mod-languages:focus-within > ul,
#sp-toolbar-right .mod-languages:hover ul.lang-inline,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list,
.tm-toolbar .mod-languages:hover > ul,
.tm-toolbar .mod-languages:focus-within > ul,
.tm-toolbar .mod-languages:hover ul.lang-inline,
.tm-toolbar .mod-languages:focus-within ul.lang-inline,
.tm-toolbar .mod-languages:hover ul.mod-languages__list,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list,
#sp-header .mod-languages:hover > ul,
#sp-header .mod-languages:focus-within > ul,
#sp-header .mod-languages:hover ul.lang-inline,
#sp-header .mod-languages:focus-within ul.lang-inline,
#sp-header .mod-languages:hover ul.mod-languages__list,
#sp-header .mod-languages:focus-within ul.mod-languages__list,
.tm-header .mod-languages:hover > ul,
.tm-header .mod-languages:focus-within > ul,
.tm-header .mod-languages:hover ul.lang-inline,
.tm-header .mod-languages:focus-within ul.lang-inline,
.tm-header .mod-languages:hover ul.mod-languages__list,
.tm-header .mod-languages:focus-within ul.mod-languages__list {
  top: calc(100% + 8px) !important;
  right: 0 !important;
}

/* Mobile */
@media (max-width: 767px) {
  #sp-top-bar .mod-languages,
  #sp-toolbar-right .mod-languages,
  .tm-toolbar .mod-languages,
  #sp-header .mod-languages,
  .tm-header .mod-languages,
  #sp-top-bar .gsm-lang-switcher,
  #sp-toolbar-right .gsm-lang-switcher,
  .tm-toolbar .gsm-lang-switcher,
  #sp-header .gsm-lang-switcher,
  .tm-header .gsm-lang-switcher {
    top: 12px !important;
    right: 16px !important;
  }
}

/* =========================================================
   GS Media – Language Switcher Functional Final
   - geschlossen: Flagge + DE/EN + Pfeil sichtbar
   - geöffnet: bleibt nutzbar, keine Hover-Lücke
   - Popdown-Farbe bleibt im GS-Media-Stil
   Voraussetzung im Modul:
   Drop-down benutzen: Nein
   Bildflaggen benutzen: Ja
   Aktive Sprache: Ja
   Vollständige Sprachnamen: Nein
   ========================================================= */

/* Modulposition: wieder sauber in die Headerhöhe, deutlich höher */
#sp-top-bar .mod-languages,
#sp-toolbar-right .mod-languages,
.tm-toolbar .mod-languages,
#sp-header .mod-languages,
.tm-header .mod-languages,
#sp-top-bar .gsm-lang-switcher,
#sp-toolbar-right .gsm-lang-switcher,
.tm-toolbar .gsm-lang-switcher,
#sp-header .gsm-lang-switcher,
.tm-header .gsm-lang-switcher {
  position: absolute !important;
  top: 12px !important;
  right: clamp(18px, 7.8vw, 150px) !important;
  width: 70px !important;
  min-width: 70px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  z-index: 99999 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Modulbeschriftung ausblenden */
#sp-top-bar .mod-languages > p,
#sp-toolbar-right .mod-languages > p,
.tm-toolbar .mod-languages > p,
#sp-header .mod-languages > p,
.tm-header .mod-languages > p,
#sp-top-bar .mod-languages label,
#sp-toolbar-right .mod-languages label,
.tm-toolbar .mod-languages label,
#sp-header .mod-languages label,
.tm-header .mod-languages label {
  display: none !important;
}

/* Sprachliste geschlossen als Button */
#sp-top-bar .mod-languages > ul,
#sp-top-bar .mod-languages ul.lang-inline,
#sp-top-bar .mod-languages ul.mod-languages__list,
#sp-toolbar-right .mod-languages > ul,
#sp-toolbar-right .mod-languages ul.lang-inline,
#sp-toolbar-right .mod-languages ul.mod-languages__list,
.tm-toolbar .mod-languages > ul,
.tm-toolbar .mod-languages ul.lang-inline,
.tm-toolbar .mod-languages ul.mod-languages__list,
#sp-header .mod-languages > ul,
#sp-header .mod-languages ul.lang-inline,
#sp-header .mod-languages ul.mod-languages__list,
.tm-header .mod-languages > ul,
.tm-header .mod-languages ul.lang-inline,
.tm-header .mod-languages ul.mod-languages__list {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  display: block !important;
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  overflow: visible !important;
  border: 1px solid rgba(125, 201, 255, 0.28) !important;
  border-radius: 10px !important;
  background: rgba(8, 23, 49, 0.08) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;
  z-index: 99999 !important;
}

/* Pfeil geschlossen */
#sp-top-bar .mod-languages > ul::after,
#sp-top-bar .mod-languages ul.lang-inline::after,
#sp-top-bar .mod-languages ul.mod-languages__list::after,
#sp-toolbar-right .mod-languages > ul::after,
#sp-toolbar-right .mod-languages ul.lang-inline::after,
#sp-toolbar-right .mod-languages ul.mod-languages__list::after,
.tm-toolbar .mod-languages > ul::after,
.tm-toolbar .mod-languages ul.lang-inline::after,
.tm-toolbar .mod-languages ul.mod-languages__list::after,
#sp-header .mod-languages > ul::after,
#sp-header .mod-languages ul.lang-inline::after,
#sp-header .mod-languages ul.mod-languages__list::after,
.tm-header .mod-languages > ul::after,
.tm-header .mod-languages ul.lang-inline::after,
.tm-header .mod-languages ul.mod-languages__list::after {
  content: "" !important;
  position: absolute !important;
  right: 9px !important;
  top: 50% !important;
  display: block !important;
  width: 5px !important;
  height: 5px !important;
  border: 0 !important;
  border-right: 1.5px solid rgba(158, 220, 255, 0.95) !important;
  border-bottom: 1.5px solid rgba(158, 220, 255, 0.95) !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateY(-65%) rotate(45deg) !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

/* geschlossen: nur aktive Sprache */
#sp-top-bar .mod-languages > ul > li,
#sp-top-bar .mod-languages ul.lang-inline > li,
#sp-top-bar .mod-languages ul.mod-languages__list > li,
#sp-toolbar-right .mod-languages > ul > li,
#sp-toolbar-right .mod-languages ul.lang-inline > li,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li,
.tm-toolbar .mod-languages > ul > li,
.tm-toolbar .mod-languages ul.lang-inline > li,
.tm-toolbar .mod-languages ul.mod-languages__list > li,
#sp-header .mod-languages > ul > li,
#sp-header .mod-languages ul.lang-inline > li,
#sp-header .mod-languages ul.mod-languages__list > li,
.tm-header .mod-languages > ul > li,
.tm-header .mod-languages ul.lang-inline > li,
.tm-header .mod-languages ul.mod-languages__list > li {
  display: none !important;
  width: 100% !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

#sp-top-bar .mod-languages > ul > li.lang-active,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active,
#sp-toolbar-right .mod-languages > ul > li.lang-active,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active,
.tm-toolbar .mod-languages > ul > li.lang-active,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active,
#sp-header .mod-languages > ul > li.lang-active,
#sp-header .mod-languages ul.lang-inline > li.lang-active,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active,
.tm-header .mod-languages > ul > li.lang-active,
.tm-header .mod-languages ul.lang-inline > li.lang-active,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active {
  display: block !important;
}

/* Link geschlossen: Flagge + echtes Sprachkürzel sichtbar */
#sp-top-bar .mod-languages > ul > li.lang-active > a,
#sp-top-bar .mod-languages > ul > li.lang-active > span,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active > a,
#sp-top-bar .mod-languages ul.lang-inline > li.lang-active > span,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-top-bar .mod-languages ul.mod-languages__list > li.lang-active > span,
#sp-toolbar-right .mod-languages > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active > a,
#sp-toolbar-right .mod-languages ul.lang-inline > li.lang-active > span,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-toolbar-right .mod-languages ul.mod-languages__list > li.lang-active > span,
.tm-toolbar .mod-languages > ul > li.lang-active > a,
.tm-toolbar .mod-languages > ul > li.lang-active > span,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active > a,
.tm-toolbar .mod-languages ul.lang-inline > li.lang-active > span,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active > a,
.tm-toolbar .mod-languages ul.mod-languages__list > li.lang-active > span,
#sp-header .mod-languages > ul > li.lang-active > a,
#sp-header .mod-languages > ul > li.lang-active > span,
#sp-header .mod-languages ul.lang-inline > li.lang-active > a,
#sp-header .mod-languages ul.lang-inline > li.lang-active > span,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active > a,
#sp-header .mod-languages ul.mod-languages__list > li.lang-active > span,
.tm-header .mod-languages > ul > li.lang-active > a,
.tm-header .mod-languages > ul > li.lang-active > span,
.tm-header .mod-languages ul.lang-inline > li.lang-active > a,
.tm-header .mod-languages ul.lang-inline > li.lang-active > span,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active > a,
.tm-header .mod-languages ul.mod-languages__list > li.lang-active > span {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 20px 0 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(235, 247, 255, 0.94) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  text-indent: 0 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Bilder/Flaggen sichtbar und klickbar */
#sp-top-bar .mod-languages img,
#sp-toolbar-right .mod-languages img,
.tm-toolbar .mod-languages img,
#sp-header .mod-languages img,
.tm-header .mod-languages img {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 2px !important;
  transform: none !important;
  text-indent: 0 !important;
  flex: 0 0 18px !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.70),
    0 3px 9px rgba(0,0,0,.20) !important;
}

/* geöffnet: das gleiche UL wächst direkt aus dem Button heraus.
   Dadurch gibt es keine Lücke mehr und die Sprache ist klickbar. */
#sp-top-bar .mod-languages:hover > ul,
#sp-top-bar .mod-languages:focus-within > ul,
#sp-top-bar .mod-languages:hover ul.lang-inline,
#sp-top-bar .mod-languages:focus-within ul.lang-inline,
#sp-top-bar .mod-languages:hover ul.mod-languages__list,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list,
#sp-toolbar-right .mod-languages:hover > ul,
#sp-toolbar-right .mod-languages:focus-within > ul,
#sp-toolbar-right .mod-languages:hover ul.lang-inline,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list,
.tm-toolbar .mod-languages:hover > ul,
.tm-toolbar .mod-languages:focus-within > ul,
.tm-toolbar .mod-languages:hover ul.lang-inline,
.tm-toolbar .mod-languages:focus-within ul.lang-inline,
.tm-toolbar .mod-languages:hover ul.mod-languages__list,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list,
#sp-header .mod-languages:hover > ul,
#sp-header .mod-languages:focus-within > ul,
#sp-header .mod-languages:hover ul.lang-inline,
#sp-header .mod-languages:focus-within ul.lang-inline,
#sp-header .mod-languages:hover ul.mod-languages__list,
#sp-header .mod-languages:focus-within ul.mod-languages__list,
.tm-header .mod-languages:hover > ul,
.tm-header .mod-languages:focus-within > ul,
.tm-header .mod-languages:hover ul.lang-inline,
.tm-header .mod-languages:focus-within ul.lang-inline,
.tm-header .mod-languages:hover ul.mod-languages__list,
.tm-header .mod-languages:focus-within ul.mod-languages__list {
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 7px !important;
  border: 1px solid transparent !important;
  border-radius: 13px !important;
  background:
    linear-gradient(rgba(8, 23, 49, 0.96), rgba(18, 44, 88, 0.96)) padding-box,
    linear-gradient(145deg, rgba(125,201,255,.82), rgba(255,255,255,.28), rgba(71,117,209,.76)) border-box !important;
  box-shadow:
    0 18px 44px rgba(5, 18, 43, 0.38),
    0 0 20px rgba(125,201,255,.15) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

/* geöffnet: Pfeil weg, weil Panel jetzt vollständig sichtbar ist */
#sp-top-bar .mod-languages:hover > ul::after,
#sp-top-bar .mod-languages:focus-within > ul::after,
#sp-top-bar .mod-languages:hover ul.lang-inline::after,
#sp-top-bar .mod-languages:focus-within ul.lang-inline::after,
#sp-toolbar-right .mod-languages:hover > ul::after,
#sp-toolbar-right .mod-languages:focus-within > ul::after,
#sp-toolbar-right .mod-languages:hover ul.lang-inline::after,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline::after,
.tm-toolbar .mod-languages:hover > ul::after,
.tm-toolbar .mod-languages:focus-within > ul::after,
.tm-toolbar .mod-languages:hover ul.lang-inline::after,
.tm-toolbar .mod-languages:focus-within ul.lang-inline::after,
#sp-header .mod-languages:hover > ul::after,
#sp-header .mod-languages:focus-within > ul::after,
#sp-header .mod-languages:hover ul.lang-inline::after,
#sp-header .mod-languages:focus-within ul.lang-inline::after,
.tm-header .mod-languages:hover > ul::after,
.tm-header .mod-languages:focus-within > ul::after,
.tm-header .mod-languages:hover ul.lang-inline::after,
.tm-header .mod-languages:focus-within ul.lang-inline::after {
  display: none !important;
  content: none !important;
}

/* geöffnet: alle Sprachen sichtbar */
#sp-top-bar .mod-languages:hover > ul > li,
#sp-top-bar .mod-languages:focus-within > ul > li,
#sp-top-bar .mod-languages:hover ul.lang-inline > li,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li,
#sp-top-bar .mod-languages:hover ul.mod-languages__list > li,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list > li,
#sp-toolbar-right .mod-languages:hover > ul > li,
#sp-toolbar-right .mod-languages:focus-within > ul > li,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list > li,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list > li,
.tm-toolbar .mod-languages:hover > ul > li,
.tm-toolbar .mod-languages:focus-within > ul > li,
.tm-toolbar .mod-languages:hover ul.lang-inline > li,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li,
.tm-toolbar .mod-languages:hover ul.mod-languages__list > li,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list > li,
#sp-header .mod-languages:hover > ul > li,
#sp-header .mod-languages:focus-within > ul > li,
#sp-header .mod-languages:hover ul.lang-inline > li,
#sp-header .mod-languages:focus-within ul.lang-inline > li,
#sp-header .mod-languages:hover ul.mod-languages__list > li,
#sp-header .mod-languages:focus-within ul.mod-languages__list > li,
.tm-header .mod-languages:hover > ul > li,
.tm-header .mod-languages:focus-within > ul > li,
.tm-header .mod-languages:hover ul.lang-inline > li,
.tm-header .mod-languages:focus-within ul.lang-inline > li,
.tm-header .mod-languages:hover ul.mod-languages__list > li,
.tm-header .mod-languages:focus-within ul.mod-languages__list > li {
  display: block !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
}

#sp-top-bar .mod-languages:hover > ul > li:last-child,
#sp-toolbar-right .mod-languages:hover > ul > li:last-child,
.tm-toolbar .mod-languages:hover > ul > li:last-child,
#sp-header .mod-languages:hover > ul > li:last-child,
.tm-header .mod-languages:hover > ul > li:last-child {
  margin-bottom: 0 !important;
}

/* geöffnet: Links voll klickbar, Flagge + Kürzel sichtbar */
#sp-top-bar .mod-languages:hover > ul > li > a,
#sp-top-bar .mod-languages:hover > ul > li > span,
#sp-top-bar .mod-languages:focus-within > ul > li > a,
#sp-top-bar .mod-languages:focus-within > ul > li > span,
#sp-top-bar .mod-languages:hover ul.lang-inline > li > a,
#sp-top-bar .mod-languages:hover ul.lang-inline > li > span,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li > a,
#sp-top-bar .mod-languages:focus-within ul.lang-inline > li > span,
#sp-toolbar-right .mod-languages:hover > ul > li > a,
#sp-toolbar-right .mod-languages:hover > ul > li > span,
#sp-toolbar-right .mod-languages:focus-within > ul > li > a,
#sp-toolbar-right .mod-languages:focus-within > ul > li > span,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li > a,
#sp-toolbar-right .mod-languages:hover ul.lang-inline > li > span,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li > a,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline > li > span,
.tm-toolbar .mod-languages:hover > ul > li > a,
.tm-toolbar .mod-languages:hover > ul > li > span,
.tm-toolbar .mod-languages:focus-within > ul > li > a,
.tm-toolbar .mod-languages:focus-within > ul > li > span,
.tm-toolbar .mod-languages:hover ul.lang-inline > li > a,
.tm-toolbar .mod-languages:hover ul.lang-inline > li > span,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li > a,
.tm-toolbar .mod-languages:focus-within ul.lang-inline > li > span,
#sp-header .mod-languages:hover > ul > li > a,
#sp-header .mod-languages:hover > ul > li > span,
#sp-header .mod-languages:focus-within > ul > li > a,
#sp-header .mod-languages:focus-within > ul > li > span,
#sp-header .mod-languages:hover ul.lang-inline > li > a,
#sp-header .mod-languages:hover ul.lang-inline > li > span,
#sp-header .mod-languages:focus-within ul.lang-inline > li > a,
#sp-header .mod-languages:focus-within ul.lang-inline > li > span,
.tm-header .mod-languages:hover > ul > li > a,
.tm-header .mod-languages:hover > ul > li > span,
.tm-header .mod-languages:focus-within > ul > li > a,
.tm-header .mod-languages:focus-within > ul > li > span,
.tm-header .mod-languages:hover ul.lang-inline > li > a,
.tm-header .mod-languages:hover ul.lang-inline > li > span,
.tm-header .mod-languages:focus-within ul.lang-inline > li > a,
.tm-header .mod-languages:focus-within ul.lang-inline > li > span {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 8px !important;
  margin: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: rgba(235, 247, 255, 0.94) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  text-indent: 0 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

/* Hover/aktiv im Panel */
#sp-top-bar .mod-languages:hover > ul > li > a:hover,
#sp-top-bar .mod-languages:focus-within > ul > li > a:hover,
#sp-toolbar-right .mod-languages:hover > ul > li > a:hover,
#sp-toolbar-right .mod-languages:focus-within > ul > li > a:hover,
.tm-toolbar .mod-languages:hover > ul > li > a:hover,
.tm-toolbar .mod-languages:focus-within > ul > li > a:hover,
#sp-header .mod-languages:hover > ul > li > a:hover,
#sp-header .mod-languages:focus-within > ul > li > a:hover,
.tm-header .mod-languages:hover > ul > li > a:hover,
.tm-header .mod-languages:focus-within > ul > li > a:hover,
#sp-top-bar .mod-languages:hover > ul > li.lang-active > a,
#sp-top-bar .mod-languages:hover > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages:hover > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages:hover > ul > li.lang-active > span,
.tm-toolbar .mod-languages:hover > ul > li.lang-active > a,
.tm-toolbar .mod-languages:hover > ul > li.lang-active > span,
#sp-header .mod-languages:hover > ul > li.lang-active > a,
#sp-header .mod-languages:hover > ul > li.lang-active > span,
.tm-header .mod-languages:hover > ul > li.lang-active > a,
.tm-header .mod-languages:hover > ul > li.lang-active > span {
  background: rgba(125, 201, 255, 0.15) !important;
  color: #9edcff !important;
  text-shadow: 0 0 10px rgba(125,201,255,.28) !important;
}

/* Bootstrap-Dropdown sicher aus dem Spiel nehmen, falls noch Rest-Markup vorhanden ist */
#sp-top-bar .mod-languages .dropdown-menu,
#sp-toolbar-right .mod-languages .dropdown-menu,
.tm-toolbar .mod-languages .dropdown-menu,
#sp-header .mod-languages .dropdown-menu,
.tm-header .mod-languages .dropdown-menu {
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
  background:
    linear-gradient(rgba(8, 23, 49, 0.96), rgba(18, 44, 88, 0.96)) padding-box,
    linear-gradient(145deg, rgba(125,201,255,.82), rgba(255,255,255,.28), rgba(71,117,209,.76)) border-box !important;
  border: 1px solid transparent !important;
  border-radius: 13px !important;
  padding: 7px !important;
  box-shadow:
    0 18px 44px rgba(5, 18, 43, 0.38),
    0 0 20px rgba(125,201,255,.15) !important;
}

/* Mobile */
@media (max-width: 767px) {
  #sp-top-bar .mod-languages,
  #sp-toolbar-right .mod-languages,
  .tm-toolbar .mod-languages,
  #sp-header .mod-languages,
  .tm-header .mod-languages,
  #sp-top-bar .gsm-lang-switcher,
  #sp-toolbar-right .gsm-lang-switcher,
  .tm-toolbar .gsm-lang-switcher,
  #sp-header .gsm-lang-switcher,
  .tm-header .gsm-lang-switcher {
    top: 10px !important;
    right: 16px !important;
  }
}

/* =========================================================
   GS Media – Language Switcher Closed Label Final
   Nur Korrektur geschlossener Zustand:
   - Button zeigt aktive Flagge + DE/EN
   - geöffnetes Popdown bleibt unverändert
   ========================================================= */

/* Geschlossener Button bekommt ein eigenes sichtbares Label.
   Dadurch sind wir nicht mehr davon abhängig, ob Joomla den aktiven
   Listeneintrag sichtbar rendert. */
#sp-top-bar .mod-languages > ul::before,
#sp-top-bar .mod-languages ul.lang-inline::before,
#sp-top-bar .mod-languages ul.mod-languages__list::before,
#sp-toolbar-right .mod-languages > ul::before,
#sp-toolbar-right .mod-languages ul.lang-inline::before,
#sp-toolbar-right .mod-languages ul.mod-languages__list::before,
.tm-toolbar .mod-languages > ul::before,
.tm-toolbar .mod-languages ul.lang-inline::before,
.tm-toolbar .mod-languages ul.mod-languages__list::before,
#sp-header .mod-languages > ul::before,
#sp-header .mod-languages ul.lang-inline::before,
#sp-header .mod-languages ul.mod-languages__list::before,
.tm-header .mod-languages > ul::before,
.tm-header .mod-languages ul.lang-inline::before,
.tm-header .mod-languages ul.mod-languages__list::before {
  position: absolute !important;
  inset: 0 !important;
  z-index: 8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: 70px !important;
  height: 32px !important;
  padding: 0 20px 0 8px !important;
  margin: 0 !important;
  color: rgba(235, 247, 255, 0.96) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  pointer-events: none !important;
  background-repeat: no-repeat !important;
  background-size: 18px auto !important;
  background-position: 8px center !important;
  text-indent: 26px !important;
  text-shadow: none !important;
}

/* Aktive Sprache aus dem HTML-Lang-Attribut ableiten */
html[lang^="de"] #sp-top-bar .mod-languages > ul::before,
html[lang^="de"] #sp-top-bar .mod-languages ul.lang-inline::before,
html[lang^="de"] #sp-top-bar .mod-languages ul.mod-languages__list::before,
html[lang^="de"] #sp-toolbar-right .mod-languages > ul::before,
html[lang^="de"] #sp-toolbar-right .mod-languages ul.lang-inline::before,
html[lang^="de"] #sp-toolbar-right .mod-languages ul.mod-languages__list::before,
html[lang^="de"] .tm-toolbar .mod-languages > ul::before,
html[lang^="de"] .tm-toolbar .mod-languages ul.lang-inline::before,
html[lang^="de"] .tm-toolbar .mod-languages ul.mod-languages__list::before,
html[lang^="de"] #sp-header .mod-languages > ul::before,
html[lang^="de"] #sp-header .mod-languages ul.lang-inline::before,
html[lang^="de"] #sp-header .mod-languages ul.mod-languages__list::before,
html[lang^="de"] .tm-header .mod-languages > ul::before,
html[lang^="de"] .tm-header .mod-languages ul.lang-inline::before,
html[lang^="de"] .tm-header .mod-languages ul.mod-languages__list::before {
  content: "DE" !important;
  background-image: url("/media/mod_languages/images/de_de.gif") !important;
}

/* Fallback für Joomla-Installationen mit anderer deutscher Flag-Datei */
html[lang^="de"] #sp-top-bar .mod-languages > ul,
html[lang^="de"] #sp-toolbar-right .mod-languages > ul,
html[lang^="de"] .tm-toolbar .mod-languages > ul,
html[lang^="de"] #sp-header .mod-languages > ul,
html[lang^="de"] .tm-header .mod-languages > ul {
  --gsm-current-lang-code: "DE";
}

html[lang^="en"] #sp-top-bar .mod-languages > ul::before,
html[lang^="en"] #sp-top-bar .mod-languages ul.lang-inline::before,
html[lang^="en"] #sp-top-bar .mod-languages ul.mod-languages__list::before,
html[lang^="en"] #sp-toolbar-right .mod-languages > ul::before,
html[lang^="en"] #sp-toolbar-right .mod-languages ul.lang-inline::before,
html[lang^="en"] #sp-toolbar-right .mod-languages ul.mod-languages__list::before,
html[lang^="en"] .tm-toolbar .mod-languages > ul::before,
html[lang^="en"] .tm-toolbar .mod-languages ul.lang-inline::before,
html[lang^="en"] .tm-toolbar .mod-languages ul.mod-languages__list::before,
html[lang^="en"] #sp-header .mod-languages > ul::before,
html[lang^="en"] #sp-header .mod-languages ul.lang-inline::before,
html[lang^="en"] #sp-header .mod-languages ul.mod-languages__list::before,
html[lang^="en"] .tm-header .mod-languages > ul::before,
html[lang^="en"] .tm-header .mod-languages ul.lang-inline::before,
html[lang^="en"] .tm-header .mod-languages ul.mod-languages__list::before {
  content: "EN" !important;
  background-image: url("/media/mod_languages/images/en_gb.gif") !important;
}

/* Das echte aktive Listenelement im geschlossenen Zustand unsichtbar machen,
   damit es nicht mit dem Pseudo-Label kollidiert. Klickfläche bleibt erhalten. */
#sp-top-bar .mod-languages > ul > li.lang-active > a,
#sp-top-bar .mod-languages > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages > ul > li.lang-active > span,
.tm-toolbar .mod-languages > ul > li.lang-active > a,
.tm-toolbar .mod-languages > ul > li.lang-active > span,
#sp-header .mod-languages > ul > li.lang-active > a,
#sp-header .mod-languages > ul > li.lang-active > span,
.tm-header .mod-languages > ul > li.lang-active > a,
.tm-header .mod-languages > ul > li.lang-active > span {
  opacity: 0 !important;
}

/* Beim Öffnen: Pseudo-Label ausblenden, echte Joomla-Einträge wieder sichtbar.
   Dadurch bleibt das von dir gelobte Dropdown optisch/funktional erhalten. */
#sp-top-bar .mod-languages:hover > ul::before,
#sp-top-bar .mod-languages:focus-within > ul::before,
#sp-top-bar .mod-languages:hover ul.lang-inline::before,
#sp-top-bar .mod-languages:focus-within ul.lang-inline::before,
#sp-top-bar .mod-languages:hover ul.mod-languages__list::before,
#sp-top-bar .mod-languages:focus-within ul.mod-languages__list::before,
#sp-toolbar-right .mod-languages:hover > ul::before,
#sp-toolbar-right .mod-languages:focus-within > ul::before,
#sp-toolbar-right .mod-languages:hover ul.lang-inline::before,
#sp-toolbar-right .mod-languages:focus-within ul.lang-inline::before,
#sp-toolbar-right .mod-languages:hover ul.mod-languages__list::before,
#sp-toolbar-right .mod-languages:focus-within ul.mod-languages__list::before,
.tm-toolbar .mod-languages:hover > ul::before,
.tm-toolbar .mod-languages:focus-within > ul::before,
.tm-toolbar .mod-languages:hover ul.lang-inline::before,
.tm-toolbar .mod-languages:focus-within ul.lang-inline::before,
.tm-toolbar .mod-languages:hover ul.mod-languages__list::before,
.tm-toolbar .mod-languages:focus-within ul.mod-languages__list::before,
#sp-header .mod-languages:hover > ul::before,
#sp-header .mod-languages:focus-within > ul::before,
#sp-header .mod-languages:hover ul.lang-inline::before,
#sp-header .mod-languages:focus-within ul.lang-inline::before,
#sp-header .mod-languages:hover ul.mod-languages__list::before,
#sp-header .mod-languages:focus-within ul.mod-languages__list::before,
.tm-header .mod-languages:hover > ul::before,
.tm-header .mod-languages:focus-within > ul::before,
.tm-header .mod-languages:hover ul.lang-inline::before,
.tm-header .mod-languages:focus-within ul.lang-inline::before,
.tm-header .mod-languages:hover ul.mod-languages__list::before,
.tm-header .mod-languages:focus-within ul.mod-languages__list::before {
  display: none !important;
  content: none !important;
}

/* Geöffnet aktive Sprache wieder sichtbar */
#sp-top-bar .mod-languages:hover > ul > li.lang-active > a,
#sp-top-bar .mod-languages:hover > ul > li.lang-active > span,
#sp-top-bar .mod-languages:focus-within > ul > li.lang-active > a,
#sp-top-bar .mod-languages:focus-within > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages:hover > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages:hover > ul > li.lang-active > span,
#sp-toolbar-right .mod-languages:focus-within > ul > li.lang-active > a,
#sp-toolbar-right .mod-languages:focus-within > ul > li.lang-active > span,
.tm-toolbar .mod-languages:hover > ul > li.lang-active > a,
.tm-toolbar .mod-languages:hover > ul > li.lang-active > span,
.tm-toolbar .mod-languages:focus-within > ul > li.lang-active > a,
.tm-toolbar .mod-languages:focus-within > ul > li.lang-active > span,
#sp-header .mod-languages:hover > ul > li.lang-active > a,
#sp-header .mod-languages:hover > ul > li.lang-active > span,
#sp-header .mod-languages:focus-within > ul > li.lang-active > a,
#sp-header .mod-languages:focus-within > ul > li.lang-active > span,
.tm-header .mod-languages:hover > ul > li.lang-active > a,
.tm-header .mod-languages:hover > ul > li.lang-active > span,
.tm-header .mod-languages:focus-within > ul > li.lang-active > a,
.tm-header .mod-languages:focus-within > ul > li.lang-active > span {
  opacity: 1 !important;
}

/* Falls die GIF-Flaggen wider Erwarten nicht laden, Kürzel bleibt trotzdem sichtbar. */
#sp-top-bar .mod-languages > ul::before,
#sp-toolbar-right .mod-languages > ul::before,
.tm-toolbar .mod-languages > ul::before,
#sp-header .mod-languages > ul::before,
.tm-header .mod-languages > ul::before {
  background-color: transparent !important;
}

/* Mobile unverändert brauchbar */
@media (max-width: 767px) {
  #sp-top-bar .mod-languages > ul::before,
  #sp-toolbar-right .mod-languages > ul::before,
  .tm-toolbar .mod-languages > ul::before,
  #sp-header .mod-languages > ul::before,
  .tm-header .mod-languages > ul::before {
    width: 70px !important;
    height: 32px !important;
  }
}