/**
 * Language switcher: a button that opens a dropdown of languages.
 *
 * Rendered by WAF_I18N_Switcher in the header and via the
 * [waf_i18n_switcher] shortcode. Uses native <details>/<summary>, so it
 * works with no JavaScript.
 */

.waf-i18n-switcher {
	position: relative;
	display: inline-block;
	margin: 0;
	padding: 0;
	font-size: 0.75rem;
}

.waf-i18n-switcher__toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.45rem 0.85rem;
	border: 1px solid currentColor;
	border-radius: var(--waf-radius, 2px);
	color: inherit;
	font: inherit;
	font-weight: 600;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
	cursor: pointer;
	list-style: none;
}

.waf-i18n-switcher__toggle::-webkit-details-marker {
	display: none;
}

.waf-i18n-switcher__toggle::after {
	content: "\25be";
	font-size: 0.7em;
	opacity: 0.7;
}

.waf-i18n-switcher[open] .waf-i18n-switcher__toggle::after {
	transform: rotate(180deg);
}

.waf-i18n-switcher__menu {
	position: absolute;
	right: 0;
	z-index: 100;
	min-width: 11rem;
	margin: 0.4rem 0 0;
	padding: 0.35rem 0;
	list-style: none;
	background: var(--waf-color-paper, #fff);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14);
	border-radius: var(--waf-radius, 2px);
}

.waf-i18n-switcher__item {
	display: block;
	padding: 0.45rem 1rem;
	color: var(--waf-color-ink, #111);
	text-decoration: none;
	white-space: nowrap;
}

.waf-i18n-switcher__item:hover,
.waf-i18n-switcher__item:focus {
	background: var(--waf-color-surface, #f5f3ef);
}

.waf-i18n-switcher__item[aria-current="true"] {
	font-weight: 700;
}

/* Inside the Astra header bar: compact, pushed to the right of the row. */
.ast-primary-header-bar .waf-i18n-switcher:not(.waf-i18n-switcher--in-header),
.ast-above-header-bar .waf-i18n-switcher:not(.waf-i18n-switcher--in-header),
.ast-below-header-bar .waf-i18n-switcher:not(.waf-i18n-switcher--in-header) {
	margin-left: auto;
}

.ast-primary-header-bar .waf-i18n-switcher__toggle,
.ast-above-header-bar .waf-i18n-switcher__toggle,
.ast-below-header-bar .waf-i18n-switcher__toggle {
	padding: 0.3rem 0.6rem;
}

/* Header placement -------------------------------------------------------
   Without JavaScript the switcher is a slim, right-aligned bar under the
   header row. With JavaScript it is moved into the header's right cluster
   (alongside the icons), where the rules below make it inline. */
.site-header > .waf-i18n-switcher:not(.waf-i18n-switcher--in-header),
.site-header + .waf-i18n-switcher {
	position: static;
	display: block;
	margin: 0;
	padding: 0.3rem 1.25rem;
	text-align: right;
	background: var(--waf-color-paper, #fff);
	border-bottom: 1px solid rgba(0, 0, 0, 0.07);
	transform: none;
}

.waf-i18n-switcher--in-header {
	display: inline-flex;
	align-items: center;
	margin: 0 0.6rem 0 0;
	padding: 0;
	background: none;
	border: 0;
}

.waf-i18n-switcher--in-header .waf-i18n-switcher__toggle {
	padding: 0.25rem 0.55rem;
	border-color: rgba(0, 0, 0, 0.15);
	border-radius: var(--waf-radius, 2px);
	font-size: 0.7rem;
}

@media (max-width: 921px) {
	.site-header > .waf-i18n-switcher:not(.waf-i18n-switcher--in-header),
	.site-header + .waf-i18n-switcher {
		padding: 0.3rem 1rem;
	}
}
