/* Botão de idioma (PT, EN, ES) de todas as skins: js/idioma.js põe junto das ferramentas ou, quando elas não aparecem, flutuando. */
.idioma { position: relative; display: inline-flex; }
.idioma .idioma-botao { width: auto; min-width: 42px; padding: 0 11px 0 9px; border-radius: 21px; display: inline-flex; align-items: center; gap: 5px; }
.idioma .idioma-botao svg { width: 18px; height: 18px; }
.idioma-sigla { font-size: 12px; font-weight: 700; letter-spacing: .06em; }
.idioma-lista {
  position: absolute; z-index: 30; top: calc(100% + 8px); right: 0; margin: 0; padding: 6px; list-style: none; min-width: 168px;
  background: var(--branco); color: var(--tinta); border-radius: 10px; box-shadow: var(--sombra);
  animation: idioma-abre .18s ease;
}
@keyframes idioma-abre { from { opacity: 0; transform: translateY(-4px); } }
.idioma-lista button {
  width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-radius: 7px;
  background: transparent; color: inherit; text-align: left; font-size: 14px;
}
.idioma-lista button b { width: 26px; font-size: 11px; letter-spacing: .06em; color: color-mix(in srgb, var(--tinta) 60%, transparent); }
.idioma-lista button:hover, .idioma-lista button:focus-visible { background: color-mix(in srgb, var(--ouro) 16%, transparent); outline: none; }
.idioma-lista button[aria-checked="true"] { font-weight: 700; }
.idioma-lista button[aria-checked="true"] b { color: var(--ouro); }
.idioma-lista button[aria-checked="true"]::after { content: ''; width: 7px; height: 7px; margin-left: auto; border-radius: 50%; background: var(--ouro); }
/* sem barra de ferramentas visível (skins livres, editoriais, celular com navegação Matrix) */
.idioma.idioma-flutuante { position: fixed; z-index: 16; top: max(14px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right)); }
body.com-faixa .idioma.idioma-flutuante { top: calc(var(--faixa-h) + 10px); }
body.tour-em-abertura .idioma.idioma-flutuante, body.janela-3d .idioma { visibility: hidden; }
/* na barra da skin Terreno imersivo */
.tr-navegacao .idioma .idioma-botao { height: 36px; border: 0; background: transparent; }
.tr-navegacao .idioma .idioma-botao:hover { background: rgba(255, 255, 255, .12); }
@media (max-width: 760px) {
  .idioma .idioma-botao { min-width: 38px; height: 38px; padding: 0 9px 0 7px; }
  .idioma-sigla { font-size: 11px; }
}
