/* Definisco le regole per il corpo del documento */
body { 
	 background: White; 
	 /*font-family: Geneva, Arial, Helvetica, sans-serif;*/
}

form {
    all: unset; /* Resetta tutti gli stili applicati al form */
    display: block; /* Ripristina il comportamento di blocco */
}

div#centro{
	align: center;
}

.collapsed {
    display: none;
}

.testa{
	font-size: xx-small;
	border: 0px none black;
	border-collapse:collapse;
	padding: 0px ;
	background-color: #E0E0E0;
}

.testaQuadro {
    border: 1px solid black; /* Bordo principale */
    border-radius: 10px; /* Bordi arrotondati */
    border-collapse: separate; /* Necessario per supportare border-radius */
    border-spacing: 0; /* Per evitare spazi aggiuntivi tra le celle */
    padding: 5px; /* Spazio interno della tabella */
}

.testaQuadro td, .testaQuadro th {
    border: 0px solid black; /* Bordi delle celle */
    padding: 5px; /* Spazio interno nelle celle */
}



.testaPad{
	font-weight: 200;
	border-collapse:collapse;
	padding: 0px ;
	background-color: #E0E0E0;
}

.itemSx
 {
	border-left-width:1px;
	border-left-style:solid;
	border-left-color:#000000;
}

.testoColonne{
	font-size: xx-small;
}

.linkTxt{
	color: black;
	text-decoration: none;
}

td.titolo 
{
	font-size: 100%;
	font-weight: bold;
	color: #0000FF;
	border-radius: 5px; /* Bordi arrotondati */
}
td.titoloBianco 
{
	font-size: 100%;
	font-weight: bold;
	color: #FFFFFF;
	border-radius: 5px; /* Bordi arrotondati */
}
td.voce 
{
	font-size: 90%;
	color: rgb(0, 0, 255);
	font-size: 9px;
}

td.bottom_text
{
	color: rgb(128, 128, 128);
	font-size: 11px;
}
td.bottom_text a {
    margin-right: 30px; /* Aggiunge 30px di spazio a destra di ogni link */
    text-decoration: none; /* Rimuove la sottolineatura (opzionale) */
    color: rgb(128, 128, 128); /* Imposta il colore grigio (opzionale) */
}

td.bottom_text a:last-child {
    margin-right: 0; /* Rimuove il margine a destra per l'ultimo link */
}

div#menu
 {
 	background-color:#fff5f5;
 	border-top-width:1px;
	border-top-style:solid;
	border-top-color:#000000;
 
	border-right-width:1px;
	border-right-style:solid;
	border-right-color:#000000;
}
div#gruppo
 {
 	background-color:rgb(255, 255, 255);
}

div#form
 {
 	background-color:#ffffff;
	width:100%;
}

#presentazione { 
	 background: White; 
	 /*font-family: Geneva, Arial, Helvetica, sans-serif;*/
	 font-size: 9px; 

	 border: 2px solid black;
	 border-collapse: collapse;
}

#cella { 
	 background: White; 
	 /*font-family: Geneva, Arial, Helvetica, sans-serif;*/
	 font-size: 9px; 
	 
	border-top-width:1px;
	border-top-style:solid;
	border-top-color:#000000;
 
	border-left-width:1px;
	border-left-style:solid;
	border-left-color:#000000;	 
}

#hcella { 
	 background: White; 
	 /*font-family: Geneva, Arial, Helvetica, sans-serif;*/
	 font-size: 9px; 
	 font-weight: 800;
	 
	 border: 1px solid black;
}

#hcellaRed { 
	 background: White; 
	 /*font-family: Geneva, Arial, Helvetica, sans-serif;*/
	 font-size: 9px; 
	 font-weight: 800;
	 color: #FF0000;
	 border: 1px solid black;
	 border-radius: 5px; /* Bordi arrotondati */
}

#largecella { 
	 background: White; 
	 /*font-family: Geneva, Arial, Helvetica, sans-serif;*/
	 font-size: 20px; 
	 font-weight: 1200;
	 
	 border: 1px solid black;
}

table {
    display: table;
    border-collapse: separate;
    box-sizing: border-box;
    text-indent: initial;
    unicode-bidi: isolate;
    line-height: normal;
    font-weight: normal;
    font-size: medium;
    font-style: normal;
    color: -internal-quirk-inherit;
    text-align: start;
    border-spacing: 2px;
    border-color: gray;
    white-space: normal;
    font-variant: normal;
    background-color: white; /* Imposta il background bianco */
}

/* Stile per il pulsante */
.access-button {
    background-color: rgb(255, 0, 0); /* Verde acceso */
    color: rgb(255, 255, 255); /* Testo bianco */
    border: none; /* Nessun bordo */
    padding: 5px 60px; /* Spazi interni */
    border-radius: 5px; /* Angoli arrotondati */
    font-size: 14px; /* Dimensione del testo */
    cursor: pointer; /* Cambia il cursore in "puntatore" */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Effetto ombra */
    transition: background-color 0.3s ease, transform 0.2s ease; /* Animazioni per hover */
}

.margin-top-30 {
	margin-top: 30px; /* Margine superiore */
}

/* Effetto al passaggio del mouse */
.access-button:hover {
    background-color: rgb(255, 0, 0); /* Verde più scuro */
    transform: scale(1.05); /* Leggero ingrandimento */
}

/* Effetto al clic */
.access-button:active {
    background-color: rgb(255, 0, 0); /* Verde ancora più scuro */
    transform: scale(0.98); /* Leggera compressione */
}

/* Tabella con classe "custom-table" */
.custom-table tr:first-child td {
    font-weight: bold;
    font-size: 18px;
    color: rgb(255, 255, 255);
    text-align: center;
}

.custom-table tr:nth-child(2) td {
    font-weight: normal;
    font-size: 14px;
    color: rgb(0, 0, 0);
    text-align: center;
}

.custom-table tr:nth-child(4) td a {
    font-weight: bold;
    font-size: 16px;
    color: rgb(0, 0, 0); /* Colore del link */
    text-decoration: none; /* Nessuna sottolineatura */
}

.custom-table tr:nth-child(4) td a:hover {
    color: rgb(0, 0, 0); /* Colore al passaggio del mouse */
    text-decoration: underline; /* Aggiunge sottolineatura al passaggio */
}

.custom-table-filter {
	padding: 40px 10px 40px 10px;
}

/* Stile base per il link */
.back-link {
    text-decoration: none; /* Rimuove la sottolineatura */
    font-weight: bold; /* Testo in grassetto */
    font-size: 16px; /* Dimensione del testo */
    color: black; /* Colore del testo */
    padding: 5px 60px; /* Spaziatura interna */
    border: none; /* Nessun bordo di default */
    border-radius: 5px; /* Arrotonda gli angoli */
}

/* Stile al passaggio del mouse */
.back-link:hover {
    border: 1px solid red; /* Aggiunge un bordo rosso */
    text-decoration: none; /* Assicura che la sottolineatura non ritorni */
    border-radius: 5px; /* Mantiene gli angoli arrotondati */
}

fieldset {
	margin: 30px 10px 10px 10px;
    border: 1px solid rgb(128, 128, 128); /* Bordo blu con spessore di 2px */
    border-radius: 5px; /* Facoltativo: Arrotonda leggermente gli angoli del bordo */
    background-color: rgb(255, 255, 255); /* Sfondo bianco per contrasto (opzionale) */
}


/* Classe specifica per il form */
.centered-form {
    display: flex; /* Attiva Flexbox */
    justify-content: center; /* Centra orizzontalmente */
    margin: 0 auto; /* Assicura il posizionamento centrato orizzontale */
}

/* La tabella all'interno del form */
.centered-form #presentazione {
    text-align: center; /* Centra il contenuto della tabella */
    margin: 0 auto; /* Centra la tabella all'interno del form */
    border: 1px solid #ddd; /* Bordo leggero per distinguere la tabella */
    padding: 20px; /* Aggiunge spaziatura interna */
    border-radius: 10px; /* Arrotonda i bordi della tabella */
    background-color: #f9f9f9; /* Sfondo chiaro */
}

/* Classe per centrare il contenuto al centro del div */
.centered-div {
    display: flex; /* Abilita Flexbox */
    justify-content: center; /* Centra orizzontalmente */
    align-items: center; /* Centra verticalmente */
    width: 100%; /* Imposta larghezza al 100% del contenitore */
    border: 0px solid rgb(0, 0, 0); /* Bordo leggero per vedere il div (opzionale) */
    background-color: #ffffff; /* Sfondo chiaro (opzionale) */
    border-radius: 5px; /* Arrotonda i bordi della tabella */
    padding: 5px 5px;
    margin: 0px 0px;
}

/* Classe per centrare il contenuto al centro del div */
.centered {
    display: flex; /* Abilita Flexbox */
    flex-direction: column; /* Disposizione in colonna */
    justify-content: center; /* Centra verticalmente */
    align-items: center; /* Allinea al centro orizzontalmente */
    width: 100%; /* Imposta larghezza al 100% del contenitore */
    background-color: #ffffff; /* Sfondo chiaro (opzionale) */
}

/* Classe per centrare il contenuto al centro del div */
.centered-inner {
    display: flex; /* Abilita Flexbox */
    flex-direction: column; /* Disposizione in colonna */
    justify-content: center; /* Centra verticalmente */
    align-items: center; /* Allinea al centro orizzontalmente */
    width: 90%; /* Imposta larghezza al 100% del contenitore */
    border: 1px solid rgb(0, 0, 0); /* Bordo leggero per vedere il div (opzionale) */
    background-color: #ffffff; /* Sfondo chiaro (opzionale) */
    border-radius: 10px; /* Arrotonda i bordi della tabella */
    padding: 5px 10px; /* Spaziatura interna */
    margin: 20px 0px;
}


.vline {
    flex-direction: column; /* Dispone i contenuti in verticale */
}

.centered-div a {
    margin: 0 5px; /* Aggiunge 15px su entrambi i lati per un totale di 30px tra gli elementi */
}

.presentazione-table {
    width: 100%; /* La tabella occupa il 90% della larghezza */
    border-collapse: collapse; /* Rimuove lo spazio tra i bordi delle celle */
    font-size: 12px; /* Dimensione del testo */
    color: #24292f; /* Colore del testo */
    background-color: #ffffff; /* Sfondo della tabella */
    border-radius: 5px; /* Arrotonda i bordi della tabella */
    border: none; /* Nessun bordo visibile intorno alla tabella */
}

.presentazione-table th,
.presentazione-table td {
    padding: 6px 8px; /* Spaziatura interna */
    text-align: left; /* Testo allineato a sinistra */
    border: none; /* Nessun bordo visibile */
}

.presentazione-table th {
    background-color: #f6f8fa; /* Sfondo leggero per l'intestazione */
    color: #24292f; /* Colore del testo dell'intestazione */
    border: none; /* Nessun bordo visibile */
}

.presentazione-table tr {
    border-bottom: 1px solid #bbbbbb; /* Bordo sotto ogni riga */
}

.presentazione-table tr:hover {
    background-color: #e1e1e1; /* Sfondo rosso al passaggio del mouse */
    color: rgb(0, 0, 0); /* Cambia il colore del testo a bianco per contrasto */
    border-bottom: 1px solid #e1e1e1; /* Cambia il bordo sotto la riga al passaggio del mouse */
}

.presentazione-table tr.clicked { /* Stile della riga cliccata */
    background-color: #e1e1e1; /* Sfondo bianco */
    color: #24292f; /* Testo nero */
    border: 1px solid #e1e1e1; /* Bordo rosso */
}

.header-table {
    background-color: #e1e1e1; /* Sfondo rosso al passaggio del mouse */
    color: #000000; /* Cambia il colore del testo a bianco per contrasto */
    border-bottom: 1px solid rgb(128, 128, 128); /* Cambia il bordo sotto la riga al passaggio del mouse */
    font-size: 13px; /* Dimensione del testo */
    padding: 8px 12px;
}

.urbanist-default {
    font-family: "Urbanist", sans-serif;
    font-weight: 400; /* Puoi modificare il peso da 100 a 900 */
    font-style: normal; /* Cambia in 'italic' se necessario */
  }

  .urbanist-bold {
    font-family: "Urbanist", sans-serif;
    font-weight: 700;
    font-style: normal;
  }

  .urbanist-light {
    font-family: "Urbanist", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
.maintenance {
  background-color: #ff0000; /* Sfondo rosso */
  color: #ffffff; /* Testo bianco */
  /* display: flex; */
  /* flex-direction: column; */ /* Disposizione verticale dei div */
  /* gap: 15px; */ /* Spazio di 15px tra i div */
  padding: 5px; /* Padding interno opzionale */
}

/* Contenuto centrale */
.maintenance-content {
  max-width: 600px;
  padding: 20px;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.3); /* Sfondo semi-trasparente per maggiore contrasto */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); /* Leggera ombra */
}

/* Icona di avviso */
.maintenance-icon {
  font-size: 50px;
  margin-bottom: 20px;
  display: block;
}

/* Titolo */
.maintenance-content h1 {
  font-size: 32px;
  margin: 10px 0;
  font-weight: bold;
}

/* Testo descrittivo */
.maintenance-content p {
  font-size: 18px;
  line-height: 1.5;
}

/* Contenitore della select */
.select-multiple-container {
    width: 300px;
    margin: 20px auto;
    position: relative;
}

/* Stile della select multiple */
.select-multiple {
    width: 350px;
    height: 100px; /* Altezza regolabile */
    padding: 10px;
    border: 1px solid #808080; /* Bordo personalizzato */
    border-radius: 1px; /* Angoli arrotondati */
    background-color: #ffffff; /* Colore di sfondo */
    color: rgb(0, 0, 0);
    font-size: 14px;
    font-family: "Urbanist", sans-serif;
    outline: none;
    overflow-y: auto; /* Scorrimento verticale */
}

/* Hover per la select */
.select-multiple:hover {
    border-color: #808080;
    background-color: #ffffff;
}

/* Stile per gli elementi selezionati */
.select-multiple option:checked {
    background-color: rgb(255, 0, 0); /* Sfondo per gli elementi selezionati */
    color: #fff;
    font-weight: bold;
}

/* Stile per disabilitare */
.select-multiple:disabled {
    background-color: #ffffff;
    color: rgb(0, 0, 0);
    border-color: #ced4da;
    cursor: not-allowed;
}

/* Scrollbar personalizzata per la select (opzionale) */
.select-multiple::-webkit-scrollbar {
    width: 8px;
}

.select-multiple::-webkit-scrollbar-thumb {
    background-color: #808080; /* Colore della barra */
    border-radius: 5px;
}

.select-multiple::-webkit-scrollbar-thumb:hover {
    background-color: #808080; /* Hover barra */
}

.select-multiple::-webkit-scrollbar-track {
    background-color: #ffffff;
}

.table-align-vertical td {
    align-items: start;
    justify-items: center;
}

.filters-table {
    border-collapse: separate; /* Per permettere lo spazio tra le celle */
    border-spacing: 30px; /* Spazio di 30px tra le celle */
}

.filters-table tbody {
    vertical-align: top; /* Allinea verticalmente in alto */
    display: table-row-group; /* Mantieni il comportamento predefinito */
    unicode-bidi: isolate; /* Mantieni */
    border-color: inherit; /* Mantieni */
}

.filters-table tbody tr {
    vertical-align: top; /* Allinea le righe in alto */
}

.filters-table tbody td {
    vertical-align: top; /* Allinea le celle in alto */
    padding: 5px; /* Opzionale, aggiunge spazio interno */
    min-width: 1px; /* Assicura che le celle abbiano dimensioni minime */
    white-space: nowrap; /* Evita che il testo vada a capo (opzionale) */
}

.sticky-header {
    position: sticky;
    top: 0; /* Posizione rispetto alla parte superiore della pagina */
    z-index: 1000; /* Assicurati che stia sopra altri elementi */

}

.pagination {
    display: flex; /* Dispone i pulsanti in fila */
    justify-content: center; /* Centra i pulsanti */
    align-items: center; /* Allinea verticalmente */
    gap: 10px; /* Spazio tra i pulsanti */
}

.pagination a {
    background-color: rgb(255, 0, 0); /* Rosso acceso */
    color: rgb(255, 255, 255); /* Testo bianco */
    border: none; /* Nessun bordo */
    padding: 5px 20px; /* Spazi interni ridotti rispetto all'access-button */
    border-radius: 5px; /* Angoli arrotondati */
    font-size: 14px; /* Dimensione del testo */
    cursor: pointer; /* Cambia il cursore in "puntatore" */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Effetto ombra */
    text-decoration: none; /* Rimuove la sottolineatura */
    transition: background-color 0.3s ease, transform 0.2s ease; /* Animazioni per hover */
}

/* Effetto al passaggio del mouse */
.pagination a:hover {
    background-color: rgb(255, 0, 0); /* Rosso più scuro */
    transform: scale(1.05); /* Leggero ingrandimento */
}

/* Effetto al clic */
.pagination a:active {
    background-color: rgb(255, 0, 0); /* Rosso ancora più scuro */
    transform: scale(0.98); /* Leggera compressione */
}

/* Pulsante disabilitato */
.pagination a.disabled {
    background-color: rgb(200, 200, 200); /* Grigio chiaro */
    color: rgb(100, 100, 100); /* Testo grigio */
    cursor: not-allowed; /* Cursore disabilitato */
    box-shadow: none; /* Nessuna ombra */
    pointer-events: none; /* Disabilita i clic */
}

/* Stile per la label del parametro secondario */
.label-secondaria {
  font-size: 14px; /* Più piccola rispetto al testo principale */
  font-weight: normal;
  color: #666666; /* Grigio chiaro */
  background-color: #eeeeee; /* Sfondo leggero per migliorare visibilità */
  padding: 1px 6px; /* Padding per creare un piccolo effetto "pill" */
  border-radius: 4px; /* Bordo arrotondato */
  margin-left: 15px;
  /*display: inline-block;*/ /* Per mantenerla accanto al parametro principale */
}

/* Stile per la label del parametro secondario */
.label-on-time {
  background-color: #daf1d6; /* Sfondo leggero per migliorare visibilità */
  padding: 2px 6px; /* Padding per creare un piccolo effetto "pill" */
  border-radius: 4px; /* Bordo arrotondato */
}

.label-damaged-missing {
  background-color: #ffc4c4; /* Sfondo leggero per migliorare visibilità */
  padding: 2px 6px; /* Padding per creare un piccolo effetto "pill" */
  border-radius: 4px; /* Bordo arrotondato */
}

.label-late-closed {
  background-color: #ffd5ab; /* Sfondo leggero per migliorare visibilità */
  padding: 2px 6px; /* Padding per creare un piccolo effetto "pill" */
  border-radius: 4px; /* Bordo arrotondato */
}

/* Contenitore principale simile a un tbody */
.tbody-container-details {
  display: flex;
  flex-direction: column;
  width: 100%; /* Occupa l'intera larghezza disponibile */
  height: auto;
  border: 1px solid #ddd; /* Bordo per evidenziare il contenitore */
  background-color: #f9f9f9; /* Colore di sfondo leggero */
  padding: 16px;
  box-sizing: border-box;
}

/* Contenitore per le due tabelle in fila */
.tables-wrapper-details {
  display: flex;
  justify-content: space-between; /* Distribuisce le tabelle */
  gap: 16px; /* Spazio tra le tabelle */
  margin-bottom: 16px; /* Spazio sotto le tabelle */
}

/* Tabelle sinistra e destra */
.table-left-details, .table-right-details {
  border-collapse: collapse;
  width: 48%; /* Ogni tabella occupa metà dello spazio */
}

.table-left-details th, .table-left-details td, 
.table-right-details th, .table-right-details td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: center;
}

/* Footer con parametri centrati */
.footer-details {
  display: flex;
  justify-content: space-evenly; /* Centra gli elementi orizzontalmente */
  align-items: flex-start; /* Centra gli elementi verticalmente */
  gap: 15px; /* Spazio tra i parametri */
  padding: 8px;
  background-color: #eeeeee; /* Colore di sfondo del footer */
  border-top: 1px solid #ccc; /* Bordo superiore per distinguere il footer */
}

.full-width-div {
  width: 100%; /* Larghezza completa */
  /*height: 100px; /* Altezza di 100px */
  /*background-color: #cccccc; /* Sfondo giallo */
  display: flex; /* Per centrare il testo */
  justify-content: flex-start; /* Allinea orizzontalmente il contenuto */
  align-items: flex-start; /* Allinea verticalmente il contenuto */
  border: 0px solid rgb(192, 192, 192); /* Bordo nero */
  border-radius: 5px;
  gap: 30px; /* Spazio tra i parametri */
}

no-hover-zone {
  background-color: #ffffff; /* Nessuno sfondo */
}
/* Stile per disabilitare l'hover su una riga specifica */
no-hover-zone:hover {
  background-color: #ffffff; /* Nessuno sfondo */
}

/* Contenitore principale */
.container-tratta {
  display: flex; /* Attiva Flexbox */
  flex-direction: column; /* Imposta la direzione su colonna */
  gap: 10px; /* Spazio tra i div */
  /*width: 100%; /* Larghezza del contenitore */
  padding: 2px; /* Padding interno */
  /*background-color: #f0f0f0; /* Sfondo leggero */
}

/* Div figli */
.child-tratta {
  padding: 4px 2px; /* Padding interno per ogni div */
  /*background-color: #d9edf7; /* Sfondo blu chiaro */
  /*border: 0px solid #bce8f1; /* Bordo blu */
  /*border-radius: 4px; /* Bordo arrotondato */
  display: flex; /* Disposizione orizzontale */
  flex-wrap: wrap; /* Permette di andare a capo se lo spazio è insufficiente */
  gap: 10px; /* Spazio tra le label */
  align-items: center;
}

/* Label */
.child-tratta label {
  /*font-size: 16px; /* Dimensione del testo */
  color: #333; /* Colore del testo */
}

/* Div figli */
.child-tratta a {

  display: flex; /* Disposizione orizzontale */
  flex-wrap: wrap; /* Permette di andare a capo se lo spazio è insufficiente */
  gap: 5px; /* Spazio tra le label */
  align-items: center;
}

/* Label */
.child-tratta-a-red {
  /*font-size: 16px; /* Dimensione del testo */
  width: 20px;
  height: 20px;
  border-radius: 10px;
  color: #ffffff; /* Colore del testo */
  background-color: red;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}

.child-tratta-a-green {
  /*font-size: 16px; /* Dimensione del testo */
  width: 20px;
  height: 20px;
  border-radius: 10px;
  color: #ffffff; /* Colore del testo */
  background-color: green;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}

.child-tratta-a-orange {
  /*font-size: 16px; /* Dimensione del testo */
  width: 20px;
  height: 20px;
  border-radius: 10px;
  color: #ffffff; /* Colore del testo */
  background-color: orange;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}

/* Label */
.child-param-a-red {
  /*font-size: 16px; /* Dimensione del testo */
  padding: 4px 8px;
  border-radius: 10px;
  color: #333333; /* Colore del testo */
  background-color: #ffc4c4;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}

.child-param-a-green {
  /*font-size: 16px; /* Dimensione del testo */
  padding: 4px 8px;
  border-radius: 10px;
  color: #333333; /* Colore del testo */
  background-color: #daf1d6;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}

.child-param-a-orange {
  /*font-size: 16px; /* Dimensione del testo */
  padding: 4px 8px;
  border-radius: 10px;
  color: #333333; /* Colore del testo */
  background-color: #ffd5ab;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}

.child-param-a-grey {
  /*font-size: 16px; /* Dimensione del testo */
  padding: 4px 8px;
  border-radius: 10px;
  color: #333333; /* Colore del testo */
  background-color: #eeeeee;
  display: flex; /* Attiva Flexbox */
  justify-content: center; /* Centra orizzontalmente */
  align-items: center; /* Centra verticalmente */
}