/* Seletor de idiomas (DSH_Lang_Switcher): item de menu, shortcode [dsh_idiomas] e Cabeçalho do Site.
   Herda cor e tipografia do contexto; o Cabeçalho do Site estiliza por cima (.dsh-lang__item, .is-active...). */
.dsh-lang {
	--dsh-lang-active: var(--e-global-color-accent, currentColor);
	/* --dsh-lang-flag-h (18px) e --dsh-lang-gap (24px) não são declaradas aqui: quem as define (render, Top Bar) vence. */
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .25em .75em;
	position: relative;
	line-height: 1.3;
}
.dsh-lang__label {
	display: inline-flex;
	align-items: center;
}
.dsh-lang__label .dsh-mi-icon { margin-right: .45em; }
.dsh-lang__items {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .25em var(--dsh-lang-gap, 24px);
}
.dsh-lang__item {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}
a.dsh-lang__item:hover { text-decoration: underline; }
a.dsh-lang__item:focus-visible,
.dsh-lang__toggle:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
	border-radius: 3px;
}
.dsh-lang__item.is-active {
	font-weight: 600;
	cursor: default;
}
/* Cor de destaque do ativo: só na Lista Suspensa (nos outros modos o ativo só ganha peso e perde o link). */
.dsh-lang--dropdown .dsh-lang__item.is-active { color: var(--dsh-lang-active); }
/* `.dsh-lang img.dsh-lang__flag` vence o `.elementor img { height: auto; max-width: 100% }` (com height:auto a bandeira
   ignorava --dsh-lang-flag-h e esticava até a largura do contêiner). Sempre 1:1: círculo e quadrado arredondado. */
.dsh-lang img.dsh-lang__flag {
	display: inline-block;
	flex: 0 0 auto;
	height: var(--dsh-lang-flag-h, 18px);
	width: auto;
	max-width: none;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	vertical-align: middle;
}
.dsh-lang--frame-rounded .dsh-lang__flag { border-radius: 4px; }
.dsh-lang--frame-circle .dsh-lang__flag { border-radius: 50%; }
.dsh-lang__code { opacity: .75; font-size: .9em; }
.dsh-lang__code--solo { opacity: 1; font-size: 1em; font-weight: 600; }
.dsh-lang__dev-row { display: block; flex: 0 0 100%; margin-top: .25em; }
.dsh-lang__dev {
	display: inline-block;
	padding: .1em .5em;
	border-radius: 999px;
	background: #f5a623;
	color: #1f1300;
	font-size: .7em;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .02em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Lista suspensa (<details>; funciona sem JS). */
details.dsh-lang,
.dsh-lang__dd { position: relative; display: inline-block; }
.dsh-lang--dropdown_active { display: inline-flex; flex-direction: column; align-items: flex-start; gap: .35em; }
.dsh-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	cursor: pointer;
	list-style: none;
}
.dsh-lang__toggle::-webkit-details-marker { display: none; }
.dsh-lang__toggle::marker { content: ""; }
.dsh-lang__caret {
	font-size: .8em;
	line-height: 1;
	transition: transform .15s ease;
}
details[open] > .dsh-lang__toggle .dsh-lang__caret { transform: rotate(180deg); }
.dsh-lang--label-above { flex-direction: column; align-items: flex-start; }
.dsh-lang__dev-item { margin: 0; padding: .35em .9em .2em; list-style: none; }
.dsh-lang__list {
	position: absolute;
	z-index: 50;
	top: calc(100% + .4em);
	left: 0;
	min-width: 100%;
	margin: 0;
	padding: .35em 0;
	list-style: none;
	background: var(--dsh-lang-bg, #fff);
	color: var(--dsh-lang-fg, #1c2330);
	border: 1px solid rgba(0, 0, 0, .12);
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
}
/* Listas suspensas: "Espaço entre itens" (--dsh-lang-gap) é o espaço entre a bandeira e o nome dentro de cada idioma
   (lista e gatilho com o ativo); entre as linhas o espaço é fixo. No Em Linha ele separa os idiomas (.dsh-lang__items). */
.dsh-lang__list { display: flex; flex-direction: column; gap: 8px; }
.dsh-lang__li { margin: 0; padding: 0; list-style: none; }
.dsh-lang__list .dsh-lang__item { display: flex; width: 100%; padding: .45em .9em; box-sizing: border-box; }
:is(.dsh-lang__list, .dsh-lang__toggle) .dsh-lang__item { gap: var(--dsh-lang-gap, 24px); }
.dsh-lang__list a.dsh-lang__item:hover { background: rgba(0, 0, 0, .06); text-decoration: none; }

/* Dentro de uma lista de menu: sem listas aninhadas visíveis fora do dropdown. */
.menu-item > .dsh-lang { vertical-align: middle; }
