/* =========================================================
   WPML Language Switcher (legacy-dropdown-click)
   an Astra Primary Menu (.ast-builder-menu-1) angeglichen
   Werte aus dem Astra Customizer übernommen:
   - Menü:      1.11111rem, global-color-0, Hover global-color-1, Overline
   - Submenü:   240px, weiss, Border-Top 2px global-color-0, Shadow
   - Sublinks:  1rem, Padding 10px 18px .9em
   ========================================================= */

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click {
	--ls-color:       var(--ast-global-color-0);
	--ls-color-hover: var(--ast-global-color-1);
	--ls-font-size:   1.11111rem;           /* = Astra Menü-Schrift */
	--ls-sub-size:    1rem;                 /* = Astra Submenü-Schrift */
	--ls-sub-width:   240px;
	--ls-sub-bg:      var(--ast-global-color-5, #fff);
	--ls-sub-border:  var(--ast-global-color-0);
	--ls-sub-shadow:  0 4px 10px -2px rgba(0, 0, 0, 0.1);
	--ls-pad-x:       10px;                 /* ergibt 40px Textabstand zu "Contact Us" wie im Menü */

	position: relative;
	display: flex;
	width: auto;
	max-width: none;
	font-family: inherit;
	font-size: var(--ls-font-size);
	font-weight: 400;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click > ul,
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click > ul > .wpml-ls-item {
	display: flex;
	position: relative;
	margin: 0;
	padding: 0;
}

/* WPML-Defaults neutralisieren */
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click a {
	display: block;
	border: 0;
	background: none;
	color: var(--ls-color);
	text-decoration: none;
	transition: color 0.2s ease;
}

/* ---------- Toggle (wie .main-header-menu > .menu-item > .menu-link) ---------- */
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	padding: 0 0 0 var(--ls-pad-x);
	font-size: inherit;
	line-height: 1.5;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle:hover,
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle:focus,
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle[aria-expanded="true"] {
	background: none;
	color: var(--ls-color-hover);
}

/* Chevron */
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle::after {
	content: "";
	position: static;
	top: auto;
	right: auto;
	width: 0.4em;
	height: 0.4em;
	margin-left: 0.1em;
	border: 0;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-25%) rotate(45deg);
	transition: transform 0.2s ease;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle[aria-expanded="true"]::after,
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click
	.wpml-ls-item:has(> .wpml-ls-sub-menu[style*="visible"]) > .wpml-ls-item-toggle::after {
	transform: translateY(25%) rotate(-135deg);
}

/* ---------- Submenü (wie .ast-builder-menu-1 .sub-menu) ---------- */
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu {
	position: absolute;
	top: 100%;
	right: 0;
	left: auto;
	z-index: 1000;
	width: var(--ls-sub-width);
	margin: 0;
	padding: 0;
	border: 0;
	border-top: 2px solid var(--ls-sub-border);
	border-radius: 0;
	background: var(--ls-sub-bg);
	box-shadow: var(--ls-sub-shadow);
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.2s ease, visibility 0s linear 0.2s;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu[style*="visible"] {
	opacity: 1;
	transition-delay: 0s;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu .wpml-ls-item {
	margin: 0;
	padding: 0;
	border: 0;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu a {
	padding: 10px 18px 0.9em;
	font-size: var(--ls-sub-size);
	line-height: 1.45;
	white-space: nowrap;
}

.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu a:hover,
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu a:focus {
	background: none;
	color: var(--ls-color-hover);
}

/* ---------- Fokus ---------- */
.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click a:focus-visible {
	outline: 1px dotted currentColor;
	outline-offset: -2px;
}

/* =========================================================
   Desktop: volle Header-Höhe wie die Menü-Links
   → gleiche Text-Baseline, Dropdown startet an der Header-Unterkante,
     funktioniert auch mit Sticky-Shrink
   ========================================================= */
.ast-desktop .site-header-section > .ast-builder-layout-element:has(.wpml-ls) {
	align-self: stretch;
	padding-left: 0; /* Astra: .site-header-section > * { padding: 0 10px } */
}

.ast-desktop .ast-header-html:has(.wpml-ls) > .ast-builder-html-element,
.ast-desktop .ast-header-html:has(.wpml-ls) .ast-builder-html-element > p,
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click,
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click > ul,
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click > ul > .wpml-ls-item,
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle {
	height: 100%;
	margin: 0;
}

.ast-desktop .ast-header-html:has(.wpml-ls) {
	height: 100%;
}

/* Menü-Link hat padding-top: 10px → Text sitzt 5px unter der Mitte */
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle {
	padding-top: 10px;
}

/* Overline-Hover wie .ast-menu-hover-style-overline */
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle::before {
	content: "";
	position: absolute;
	top: 0;
	left: calc(var(--ls-pad-x) - 8px);
	right: -8px;
	height: 1px;
	background-color: currentColor;
	transform: scaleX(0);
	transition: transform 0.3s ease-in-out;
}

.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle:hover::before,
.ast-desktop .ast-header-html .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle[aria-expanded="true"]::before {
	transform: scaleX(1);
}

/* =========================================================
   Mobile Header / Off-Canvas
   ========================================================= */
.ast-header-break-point .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle {
	padding: 0.5em 0;
}

.ast-header-break-point .wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu {
	right: 0;
	left: auto;
	width: auto;
	min-width: 160px;
}

#ast-mobile-popup .wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu {
	right: auto;
	left: 0;
}

/* =========================================================
   Header-Menü: kein Umbruch zwischen 1200 und 1499px
   (deutsche Menüpunkte sind breiter als die englischen)
   Getestet auf /de/dienstleistungen/ inkl. 17px Scrollbar.
   Unter 1200px → Hamburger (astra_tablet_breakpoint = 1199)
   ========================================================= */
@media (min-width: 1200px) {
	.ast-desktop .ast-builder-menu-1 .main-header-menu > .menu-item > .menu-link {
		white-space: nowrap;
	}
}

@media (min-width: 1360px) and (max-width: 1499px) {
	:root { --ins-menu-fs: 18px; --ins-menu-pad: 16px; }
}

@media (min-width: 1280px) and (max-width: 1359px) {
	:root { --ins-menu-fs: 16px; --ins-menu-pad: 14px; }
}

@media (min-width: 1200px) and (max-width: 1279px) {
	:root { --ins-menu-fs: 15px; --ins-menu-pad: 10px; }
}

@media (min-width: 1200px) and (max-width: 1499px) {
	.ast-desktop .ast-builder-menu-1 .main-header-menu > .menu-item > .menu-link {
		font-size: var(--ins-menu-fs);
		padding-left: var(--ins-menu-pad);
		padding-right: var(--ins-menu-pad);
	}

	/* Language Switcher skaliert mit (gleiche Schrift, gleicher Abstand) */
	.wpml-ls-statics-shortcode_actions.wpml-ls-legacy-dropdown-click {
		--ls-font-size: var(--ins-menu-fs);
		--ls-pad-x: calc(var(--ins-menu-pad) - 10px);
	}
}

/* =========================================================
   Leeres Dropdown ausblenden
   WPML gibt das <ul> auch dann aus, wenn die aktuelle Seite in
   keiner anderen Sprache existiert. Ohne diese Regel erscheint
   beim Klick nur der 2px-Rand.
   (:empty greift nicht – WPML schreibt Whitespace in das <ul>)
   ========================================================= */
.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu:not(:has(.wpml-ls-item)) {
	display: none;
}

.wpml-ls-legacy-dropdown-click .wpml-ls-item:has(> .wpml-ls-sub-menu:not(:has(.wpml-ls-item))) > .wpml-ls-item-toggle {
	pointer-events: none;
}

.wpml-ls-legacy-dropdown-click .wpml-ls-item:has(> .wpml-ls-sub-menu:not(:has(.wpml-ls-item))) > .wpml-ls-item-toggle::after {
	display: none;
}

/* =========================================================
   Sticky Header (geschrumpft)
   Astra setzt im Sticky-Zustand padding-top der Menü-Links auf 0
   (.ast-sticky-shrunk). Der Switcher muss das mitmachen,
   sonst sitzt der Text ca. 5px zu tief.
   ========================================================= */
.ast-desktop .ast-sticky-shrunk .ast-header-html .wpml-ls-legacy-dropdown-click .wpml-ls-item-toggle {
	padding-top: 0;
}