/* Definisco le regole per il corpo del documento */
body {
	background: White;
	/*font-family: Geneva, Arial, Helvetica, sans-serif;*/
	overflow-y: scroll;
	/* Mantiene la scrollbar sempre visibile */
}

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: #ffffff;
}

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: 10px 10px 20px 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,204,204); /* 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%;
	border-collapse: collapse;
	font-size: 12px;
	color: #24292f;
	background-color: #ffffff;
	border-radius: 5px;
	border: none;
}

.presentazione-table th,
.presentazione-table td {
	padding: 3px 3px;
	text-align: left;
	border: none;
}

.presentazione-table tr {
	border-bottom: 1px solid #bbbbbb;
}

/*.presentazione-table tr[data-index]:nth-of-type(even) {
    background-color: #f1f1f1;  Colore per righe con indice pari 
}

.presentazione-table tr[data-index]:nth-of-type(odd) {
    background-color: #ffffff;  Colore per righe con indice dispari 
}*/

/*.presentazione-table tr:hover {
	background-color: #e1e1e1;
	color: rgb(0, 0, 0);
	border-bottom: 1px solid #e1e1e1;
}

.presentazione-table tr.clicked {
	background-color: #e1e1e1;
	color: #24292f;
	border: 1px solid #e1e1e1;
}*/

.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 */
}

/* Wrapper per input e icona */
.input-wrapper {
	position: relative;
	display: inline-block;
	/*min-width: 400px;
	max-width: 500px;*/
	/* Larghezza del wrapper */
	margin-top: 5px;

}

/* Input con stile */
.insert-shipment {
	width: 100%;
	height: 36px;
	border: 1px solid #999;
	border-radius: 5px;
	font-size: 16px;
	padding: 5px 35px 5px 10px;
	/* Spazio per l'icona */
	box-sizing: border-box;
}

/* Icona all'interno del campo */
.input-icon {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	color: #999;
	font-size: 18px;
	pointer-events: none;
	/* Evita l'interazione con l'icona */
}


/* Select con padding per l'icona */
.select-shipment {
	width: 100%;
	height: 35px;
	border: 1px solid #999;
	border-radius: 5px;
	padding: 5px 35px 5px 10px;
	/* Spazio per l'icona a destra */
	font-size: 16px;
	box-sizing: border-box;
	appearance: none;
	background-color: #e9e9ed;
	/* Rimuove lo stile predefinito della select */
}


.custom-file-upload {
	display: inline-block;
	padding: 10px 20px;
	cursor: pointer;
	background-color: #000;
	color: white;
	border-radius: 5px;
	font-size: 16px;
	font-weight: bold;
	border: none;
	transition: background 0.3s ease;
}

.custom-file-upload:hover {
	background-color: #333;
}

.custom-file-upload input {
	display: none;
}


/* Contenitore della riga */
.row {
	display: flex;
	justify-content: start;
	/* Spaziatura uniforme tra colonne */
	gap: 30px;
	margin-bottom: 15px;
	/* Spaziatura tra righe */
}

/* Contenitore delle colonne */
.col {
	margin-left: 0px;
	/* Spaziatura tra colonne */
	text-align: left;
	/* Allinea il contenuto a sinistra */
	box-sizing: border-box;
	/* Include padding nelle dimensioni */
	display: flex;
	/* Imposta il contenuto della colonna come flex */
	flex-direction: column;
	/* Dispone i figli in colonna (verticale) */
	flex: 0 1 32%;
}

/* Rimuove la spaziatura a destra dall'ultima colonna */
.col:last-child {
	margin-right: 0;
}


/* Stile per l'etichetta */
.label-title {
	font-weight: bold;
	display: block;
	margin-bottom: 5px;
}

.my-ok-button {
	background-color: red;
	/* Verde */
	color: #fff;
	/* Testo bianco */
	font-size: 14px;
	padding: 8px 35px;
	border-radius: 5px;
	border: none;
}

.my-ok-button:hover {
	background-color: red;
	/* Verde scuro al passaggio del mouse */
}

.my-cancel-button {
	background-color: #fff;
	/* Verde */
	color: red;
	/* Testo bianco */
	font-size: 14px;
	padding: 8px 35px;
	border-radius: 5px;
	border: none;
}

.my-cancel-button:hover {
	background-color: red;
	color: #fff;
	/* Verde scuro al passaggio del mouse */
}

.my-confirm-button {
	background-color: red;
	/* Verde */
	color: #fff;
	/* Testo bianco */
	font-size: 14px;
	padding: 8px 35px;
	border-radius: 5px;
	border: none;
}

.my-confirm-button:hover {
	background-color: red;
	/* Verde scuro al passaggio del mouse */
}

/*.suggestions-box {
	position: absolute;
	background: white;
	border: 1px solid #ccc;
	border-radius: 4px;
	width: calc(100% - 2px);
	margin-top: 5px;
	z-index: 1010;
}

.suggestion-item {
	padding: 8px 10px;
	cursor: pointer;
}

.suggestion-item:hover {
	background-color: #f0f0f0;
}*/

.suggestions-box {
	max-height: 200px;
	/* Altezza massima per 10 righe */
	overflow-y: auto;
	/* Abilita lo scroll verticale */
	border: 1px solid #ccc;
	/* Opzionale: bordo per visibilità */
	background-color: #fff;
	/* Colore di sfondo */
	z-index: 1010;
	/* Per evitare che sia coperto da altri elementi */
	position: absolute;
	/* Per posizionare sopra altri elementi */
	width: 100%;
	/* Stesso larghezza del campo di input */
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	/* Effetto ombra */
}

.suggestion-item {
	padding: 8px 10px;
	/* Spaziatura interna */
	cursor: pointer;
	/* Cambia il cursore al passaggio */
}

.suggestion-item:hover {
	background-color: #f0f0f0;
	/* Colore al passaggio */
}

.mod-suggestions-box {
	max-height: 200px;
	/* Altezza massima per 10 righe */
	overflow-y: auto;
	/* Abilita lo scroll verticale */
	border: 1px solid #ccc;
	/* Opzionale: bordo per visibilità */
	background-color: #fff;
	/* Colore di sfondo */
	z-index: 1010;
	/* Per evitare che sia coperto da altri elementi */
	position: absolute;
	/* Per posizionare sopra altri elementi */
	width: 100%;
	/* Stesso larghezza del campo di input */
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	/* Effetto ombra */
}

.mod-suggestion-item {
	padding: 8px 10px;
	/* Spaziatura interna */
	cursor: pointer;
	/* Cambia il cursore al passaggio */
}

.mod-suggestion-item:hover {
	background-color: #f0f0f0;
	/* Colore al passaggio */
}

/* Stile di base per i bottoni */
button.btn-modifica,
button.btn-elimina {
	background: none;
	/* Rimuove lo sfondo del bottone */
	border: none;
	/* Rimuove il bordo del bottone */
	cursor: pointer;
	/* Cambia il cursore su hover */
	padding: 5px;
	/* Spaziatura interna */
}

/* Colore grigio di default per le icone */
button.btn-modifica i,
button.btn-elimina i {
	color: gray;
	font-size: 0.8rem;
	/* Dimensione delle icone */
	transition: color 0.2s ease;
	/* Transizione fluida del colore */
}

/* Hover: bottone modifica (arancione) */
button.btn-modifica:hover i {
	color: orange;
}

/* Hover: bottone elimina (rosso) */
button.btn-elimina:hover i {
	color: red;
}

.custom-swal-popup {
	width: 600px !important;
	/* Imposta la larghezza desiderata */
	max-width: 90%;
	/* Limita la larghezza al 90% dello schermo */
	font-family: "Urbanist", sans-serif;
	font-weight: 400;
	/* Puoi modificare il peso da 100 a 900 */
	font-style: normal;
	/* Cambia in 'italic' se necessario */
}

.swal2-html-container {
	text-align: center;
	/* Per allineare il testo a sinistra, se necessario */
}

/* Selettore per personalizzare lo spinner di SweetAlert2 */
.swal2-icon.swal2-loading:after {
	content: "";
	display: block;
	position: absolute;
	width: 4rem;
	/* Dimensione dello spinner */
	height: 4rem;
	border: 0.25em solid rgba(255, 0, 0, 0.2);
	/* Bordo trasparente rosso */
	border-top: 0.25em solid red;
	/* Bordo superiore rosso */
	border-radius: 50%;
	animation: swal2-rotate 0.75s linear infinite;
}

/* Animazione di rotazione */
@keyframes swal2-rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.popup-volume-wrapper {
	position: relative;
	display: inline-block;
}

.popup {
	display: none;
	position: absolute;
	top: 100%;
	margin-top: 5px;
	background: #fff;
	border: 1px solid #ccc;
	padding: 10px;
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	z-index: 10;
	width: 90%;
}

.popup-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 5px;
}

.popup-volume-button {
	padding: 3px 8px;
}

.fascia-oraria-container {
    /*margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;*/
}

.fascia-oraria-container label {
    margin-right: 10px;
    font-weight: bold;
    color: #333;
}

.riepilogo-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    margin-bottom: 15px;
    padding: 20px;
    
    /*background: #f9f9f9;
    border-radius: 8px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);*/
}

.riepilogo-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    flex: 1;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #ccc;
    background: #fff;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
}

.riepilogo-item label {
    margin-bottom: 5px;
    color: #333;
}

.riepilogo-item span {
    font-size: 20px;
    color: #000;
    font-weight: bold;
    white-space: nowrap;
}