/* ==========================================================================
   A LÍNGUA DO SISTEMA (i18n, fase 2) — shared/_idioma_do_menu.
   Um globo pequeno no canto da barra do topo, com o vocabulário do seletor
   das páginas públicas (.idioma, em 30_juridico.css): mesmo botão, mesma
   lista, mesma marca de "atual". Aqui só o que muda: o botão é só o globo
   (nem sigla nem seta), e as opções são botões de formulário (PATCH /idioma),
   não links.
   ========================================================================== */
.idioma--sistema { flex: none; }

.idioma--sistema .idioma__botao {
  justify-content: center;
  width: 2rem;
  min-height: 2rem;
  padding: 0;
  border-color: transparent;
  background: transparent;
  color: var(--cor-texto-suave);
}

.idioma--sistema .idioma__botao:hover,
.idioma--sistema[open] > .idioma__botao {
  border-color: var(--cor-borda);
  color: var(--cor-texto);
}

.idioma--sistema .idioma__globo { width: 16px; height: 16px; }

.idioma--sistema .idioma__menu { min-width: 12rem; }

.idioma-do-menu__form { margin: 0; }

.idioma--sistema .idioma__opcao {
  width: 100%;
  border: 0;
  background: none;
  font: inherit;
  font-size: .9375rem;
  text-align: left;
  cursor: pointer;
}

.idioma--sistema .idioma__opcao--atual { color: var(--cor-acao); font-weight: 600; }


/* O MESMO GLOBO, NO MENU DO USUÁRIO — só no celular. Em 390px a barra do topo
   não tem 2rem sobrando: o globo ali apertava a busca até a dica "Buscar" não
   caber (polimento_acabamentos_test). Então, no celular, o do canto some e
   este aparece no fim do menu, com a lista aberta dentro do próprio menu. */
.idioma--menu { display: none; }

@media (max-width: 30rem) {
  .idioma--barra { display: none; }
  .idioma--menu { display: block; }
  .idioma--menu .idioma__botao {
    justify-content: flex-start;
    gap: var(--esp-2);
    width: 100%;
    min-height: 2.5rem;
    padding: 0 .75rem;
    border-radius: var(--raio-md);
  }
  .idioma--menu .idioma__botao::after { content: none; }
  .idioma--menu .idioma__menu {
    position: static;
    min-width: 0;
    padding: 0 0 0 var(--esp-4);
    border: 0;
    box-shadow: none;
    animation: none;
  }
  .idioma--menu .idioma__legenda { display: none; }
}