/* Zeni — toggle lingua IT/EN, condiviso da home + pagine legali.
 *
 * Colori dai token (tokens.css). La logica è in javascripts/lang-toggle.js.
 * Le pagine mettono due blocchi gemelli (.lang-it / .lang-en); qui si mostra
 * una lingua alla volta.
 */

.langtoggle {
  display: inline-flex; border: 1px solid var(--bordo); border-radius: 999px;
  overflow: hidden; background: var(--superficie);
}
.langtoggle button {
  font-family: inherit; font-size: .82rem; font-weight: 600; letter-spacing: .03em;
  color: var(--muto); background: transparent; border: none;
  padding: 8px 15px; min-height: 40px; cursor: pointer;
}
.langtoggle button:hover { color: var(--testo); }
.langtoggle button[aria-pressed="true"] { background: var(--accento); color: var(--su-pieno); }
.langtoggle button:focus-visible { outline: 2px solid var(--accento); outline-offset: 2px; }

/* Una lingua alla volta. Regola "nascondi SOLO l'altra": non si forza mai il
 * display di quella mostrata → ogni elemento tiene il suo display naturale
 * (block per h1/articoli, flex per il bottone, inline per gli span di testo).
 * Default = IT: senza l'attributo data-lang, o con data-lang="it", l'EN è nascosto.
 */
:root:not([data-lang="en"]) .lang-en { display: none; }
:root[data-lang="en"] .lang-it { display: none; }