/* mobile.css — rifiniture per gli schermi stretti.
   Agisce sugli attributi gia' presenti: nessuna riga di HTML riscritta. */

@media (max-width: 820px) {
  /* larghezze rigide scritte a mano negli style: diventano un massimo */
  [style*="width:960px"], [style*="width: 960px"],
  [style*="width:760px"], [style*="width: 760px"],
  [style*="width:700px"], [style*="width: 700px"],
  [style*="width:600px"], [style*="width: 600px"],
  [style*="max-width:960px"], [style*="max-width:760px"] {
    width: auto !important;
    max-width: 100% !important;
  }

  /* le tabelle scorrono da sole invece di allargare la pagina */
  table { display: block; max-width: 100%; overflow-x: auto;
          -webkit-overflow-scrolling: touch; }

  /* una griglia con una colonna fissa non si restringe: qui collassa */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* le immagini non escono mai dal contenitore */
  img, picture, video, iframe { max-width: 100%; height: auto; }

  /* niente puo' trascinare la pagina di lato */
  html, body { max-width: 100%; overflow-x: clip; }

  /* parole lunghe e indirizzi vanno a capo invece di sfondare */
  p, li, td, dd, blockquote { overflow-wrap: break-word; }
}

/* la riga della lingua sotto il pulsante */
.lingua-badge {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.4;
  opacity: .78;
}
.lingua-badge::before { content: "\2713\FE0E"; margin-right: 5px; }
