:root{
    --colore-sfondo-chiaro: #eee;
    --colore-sfondo-scuro: #333;
    --colore-bottone-tema-chiaro: #6e90f7;
    --colore-bottone-tema-scuro: #227;
}

.barraTitolo {
    display: flex;
    background-color: var(--colore-sfondo-chiaro);
    border-radius: 1rem;
    margin: 1rem;
    padding: 1em;
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
  }
  
  .langSel img{
    cursor: pointer;
    max-width: 32px;
    margin-right: 1em;
  }

  .contenuto {
    background-color: var(--colore-sfondo-chiaro);
    border-radius: 1rem;
    margin: 1rem;
    padding: 1em;
  }
  
.listaDomande ul li {
  display: grid;
  grid-template-columns: 70% auto;
  column-gap: 4em;
  padding-block: 0.5em;
}
.risp-txt input{
  margin-right: 1.5em;
}

.btnInviaDati {
  margin: 1em;
    background-color:var(--colore-bottone-tema-chiaro);
    padding: 1em;
    border-radius: 1em;
    border-style: none;
}

@media (prefers-color-scheme: dark){
.barraTitolo {
  background-color: var(--colore-sfondo-scuro);
  }
.contenuto {
    background-color: var(--colore-sfondo-scuro);
  }
.btnInviaDati {
  background-color: var(--colore-bottone-tema-scuro);
}
}

@media only screen and (max-width:768px) {
    .listaDomande ul {
      padding-left:0;
    }
    .listaDomande ul li {
     display: grid;
     grid-template-columns: auto;
      grid-auto-flow: row;
      row-gap: 1em;
    }
    .risp-txt input{
        margin-right: 1em;
      }
  }