/* bug bootstrap 3: serve a levare la scroll bar della pagina quando è aperta una modsal window */
body.modal-open {
  overflow: hidden !important;
}
/* nasconde la scrollbar della modal ma mantiene lo scroll */
.modal {
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* IE/Edge */
}
.modal::-webkit-scrollbar {
  display: none;                /* Chrome/Safari */
}

/* Caricamento font TTF locali */
@font-face {
  font-family: 'ElMessiri';
  src: url('../fonts/ElMessiri-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@media (max-width: 600px) {
	body {
		 position: relative;
	}
	.hidden-xxs {
		display: none !important;
	}
}

.sidebar-menu li a {
	padding-left: 12px;
}
.sidebar-menu li a i {
	text-align: center;
	padding-right: 6px;
}

.logo {
	font-family: 'ElMessiri', sans-serif !important;
}
.logo-lg, .logo-mini {
	font-family: 'ElMessiri', sans-serif !important;
}
.logo-mini {
	color: #ccffff;
}
.logo-iniziali {
	color: #aaffff;
	font-size: 110%;
}
.logo-corpo {
	color: white;
	font-size: 90%;
}
/* LEVA PLACEHOLDERS QUANDO I CAMPI SONO DISABLED */
input:disabled::placeholder, input:disabled::-webkit-input-placeholder, input:disabled::-moz-placeholder, input:disabled:-moz-placeholder, input:disabled:-ms-input-placeholder {
	color: transparent;
}

/* dropdown piu' scuro, senno' sembra disabled */
.dropdown-menu > li > a {
  color:  #333; /* era #777; */
}

.dropdown-menu > li > a:hover {
  color: black; /* era #333; */
}
.dropdown-menu li.active > a::before {
	content: "✓"; /* simbolo spunta */
	position: absolute;
	left: 5px;
}
/* */

@media (max-width: 430px) {		/* se meno di 430 px nasconde*/
	.main-header .logo-small .logo-lg {display:none}
}
@media (min-width: 430px) {		/* se più di 430 px nasconde*/
	.main-header .logo-small .logo-mini {display: none;}
}

.defevent {
   border-left: solid 6px #f3f3f3;
}
.defevent td {
   vertical-align: middle;
}
.defeventscad {
    border-left: solid 6px #edd1d1;
}
.defeventscad td {
   vertical-align: middle;
}
.man-icon {
	font-size: 150%;
}

h2,h3,h4,h5 {
	margin: 0px;
	padding: 0px;
}
.image-holder {
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	border-bottom: solid 1px #ff0000;
	border-right: solid 1px #ff0000;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

.tmpquadr {
	display: block;
	border-top: solid 1px #ff0000;
	border-left: solid 1px #ff0000;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.isactive {
   background: rgba(24,223,84,0.6)
}
.ismag {
   background: rgba(36,144,214,0.6)
}
.isdisable {
   background: rgba(243,12,12,0.6)
}
.isselected {
   background: rgba(24,223,84,0.6);
}
.clear-all {
   display: block;
   clear: both;
}

.modaldb {
	width: 800px;
	max-width: calc(100% - 20px);
}
.dbfieldopen {
	cursor: pointer;
}

/* Aggiustamento per larghezza bassa */
.table-responsive {
	margin-bottom: 0;
	border: 0;
}
.table-responsive .table {			/* override defalt tables.less che su dimensioni piccole fa white-space: nowrap; */
	> thead, 
	> tbody,
	> tfoot {
		> tr {
			> th,
			> td {
				white-space: wrap;
			}
		}
	}
}
.table-responsive-compact {
	padding: 0; 
	border: none;
	margin: 0;
}

/* Per le table, rimpiazza rules=all */
.table-rules-all td {
	border-top: 1px solid #e8e8e8; 
	border-left: 1px solid #e8e8e8; 
	border-right: 1px solid #e8e8e8; 
	border-bottom: 1px solid black; /* #e8e8e8; */
}
.table-rules-all {border-collapse: collapse;}
.table-rules-all tr:first-child td {border-top: 0;}
.table-rules-all tr td:first-child {border-left: 0;}
.table-rules-all tr:last-child td {border-bottom: 0;}
.table-rules-all tr td:last-child {border-right: 0;}
.table-rules-all tr td {white-space: normal !important}

/* Table liste principali */
.table-listona, .table-listona-cliccabile, .table-listona-compatta {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1em;
}
.table-listona thead, .table-listona-cliccabile thead, .table-listona-compatta thead {
	font-weight: bold;
}
.table-listona thead tr th, .table-listona-cliccabile thead tr th, .table-listona-compatta thead tr th {
	vertical-align: top;
}
.table-listona tbody, .table-listona-cliccabile tbody , .table-listona-compatta tbody {
	font-weight: normal;
}
.table-listona-cliccabile tbody tr:hover td {
	cursor: pointer;
}
.table-listona-compatta tbody td {
	border-top: 1px solid #ddd !important;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

.table-legenda{
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
}
.table-legenda td {						padding: 8px;}
.table-legenda td:nth-child(1) {		padding: 8px 0px 0px 8px; text-align: center}
.table-legenda td:nth-child(2) {		padding: 8px 8px 0px 4px;}
/* END */

/* per far stare oggetti di una row sempre in linea e che non vadano a capo */
.in-linea {
	white-space: nowrap;
}

.in-linea > div, .in-linea > h2 {
  width: 600px;
  background: black;
  border: 3px solid white;
  height: 20px;
  display: inline-block;
} 

/* biscottini filtri */
.biscotti-container {
	padding: 0 0 2px 11px;
	line-height:30px;
}
.biscotto-filtro {
	padding: 6px 4px 6px 4px; 
	margin-left: 4px;
	background-color: #ACDBDF;
	border-radius: 8px;
	white-space: nowrap;
}
.testo-filtro {
	font-size: 15px;
	font-size: clamp(13px, 12px + 0.4vw, 16px);		/* da 13px a 16px; */
	padding-left:6px;
	color: #333;
	white-space: nowrap;
}
.remove-filtro {
	padding:0 4px 0 4px !important; 
	color: maroon; 
	font-size: 13px;
	cursor: pointer;	
}
/* end biscottini */

/* biscotto dati (usato per dati file) */
.biscotto-dati {
	position: relative;
	display: block;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
	min-height: 39px;
	padding: 8px 10px;
	outline: none;
	border-width: 2px;
	border-style: solid;
	background: #fff;
	font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	
	font-size: 14px;		/* added by SSS */
	font-weight: 700;		/* added by SSS */
	
	color: #333;
	
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 4px;
	
	border-color: #d4ccc8;
}

.biscotto-dati .file-name {
	font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 14px;
	padding-left:6px;
	color: #62625f;
}
.biscotto-dati .file-info {
	font-size: 11px; 
	color: #888; 
	margin-top: 2px;
}
/* end biscotto */

/******************* Spinner *********************/
#overlay {
	/* display: inline-block;	*/ /* non columns */
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	
	background: #ffffff;
	color: #666666;
	
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 5000;
	text-align: center;
	opacity: 0.8;	/*.80; */
	justify-content: center;
}
#overlay div {
	flex: 100%;
}
#overlay img {
	height: 300px; 
	width: 300px;
}
#overlay p.msg-wait {
	font-size: 28px; 
	font-weight: bold; color: maroon;
	position: relative; top: -100px;
}

.spinner {
	margin: 0 auto;
	height: 64px;
	width: 64px;
	animation: rotate 0.8s infinite linear;
	border: 5px solid firebrick;
	border-right-color: transparent;
	border-radius: 50%;
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
/* ******************************************************* */

/* per la legenda delle manutenzioni */
.legend {
	font-style: italic;
	font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
	/* font-size: 13px !important;
	margin-left: 2px; */
}
.legend-container {
	display: block;
	float: right;
}

@media (max-width: 430px) {		/* se meno di 430 px nasconde*/
	.legend-container {display:none}
}

/* il colore della colonna che indica se il lavoro è bloccante */
.bloccante {background-color:#961010 !important}

/* per le righe dei lavori scaduti */
.scaduto td:not(.bloccante) {
	background-color: #F9DBDB !important
}

/* bottoncini add group ecc */
.abilitato {
	transition: all 0.2s ease;
}
.abilitato:hover {
	border-color: #0063dc;
	border-radius: 3px;
	background-color: #f5f9ff;
	box-shadow: 0 2px 6px rgba(0, 99, 220, 0.15);
	transform: translateY(-1px);
}
.abilitato:active {
	transform: translateY(0);
	box-shadow: 0 1px 2px rgba(0, 99, 220, 0.1);
}

/* ////////////////////////////////////////////////////////// */


.disabilitato {
	color: #cccccc !important; 
	cursor: default;
}
.disabilitato:hover {
	color: #cccccc !important;
}

/* modifica colore per bootstrap table stripped */
.table-striped>tbody>tr:nth-child(odd):not(.row-deleted):not(.row-deleted)>td, .table-striped>tbody>tr:nth-child(odd)>th {
   background-color: AliceBlue; /* Choose your own color here */
}

.table-vertical-rules td:not(:first-child) {
  border-left: 1px solid #ccc;  /* Linea verticale tra colonne */
}


/* font più piccolo per table (LEVARE ?)*/
.h3small {
	font-size:20px;
}


/* Header fixed to the top of the modal */
.modal-header {
  position: sticky;
  top: -16px;
  border-radius: 6px 6px 0 0;
  background-color: inherit;
  z-index: 1055;
}

/* Footer fixed to the bottom of the modal */
.modal-footer {
	position: sticky;
	bottom: -14px;
	border-radius: 0 0 6px 6px;
	background-color: inherit;
	z-index: 1055;
}
/* Ritocco per fare la barra di scroll visibile a fianco del div nel .modal-body */  /* non si sa da dove viene quel 212 */
.modal-body {
	height: auto; 
	max-height: calc(100vh - 212px); 
	overflow-y: auto;
}
.modal-over-modal { 
	z-index: 1500 !important;
	padding-top: 30px;
}
.modal-over-modal .modal-content {
	background-color: #FDF6EC;
}

.modal-over-modal .box-title {
	color: #632626;
}

/* to center vertically a dialog using "dialog-centered" class  */
.dialog-centered.modal {
	text-align: center;
	padding: 0!important;
}
.dialog-centered.modal:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -4px;
}
.dialog-centered .modal-dialog {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}

/* finestre modali color crema (per c ambio al volo di codifiche o simili) */
.modal-subdialog .modal-content {
	background-color: #FDF6EC;
}
.modal-subdialog .modal-header {
	color: rgb(99, 38, 38);
}
.modal-subdialog .modal-body {
	height: auto;
}

/* Animazione per item menù clicked */
@keyframes menu-item-glowing {
	0% {
	  /* background-color: #2ba805; */
	  box-shadow: -4px 0 5px blue;
	}
	50% {
	  /* background-color: #49e819; */
	  box-shadow: -4px 0 20px blue;
	}
	100% {
	  /* background-color: #2ba805; */
	  box-shadow: -4px 0 5px blue;
	}
}
.menu-item-flashing {
	animation: menu-item-glowing 1800ms infinite;
}
/* segue animazione bottone */
@keyframes glowing {
	0% {
	  /* background-color: #2ba805; */
	  box-shadow: 0 0 5px blue;
	}
	50% {
	  /* background-color: #49e819; */
	  box-shadow: 0 0 20px blue;
	}
	100% {
	  /* background-color: #2ba805; */
	  box-shadow: 0 0 5px blue;
	}
}
.flashing {
	animation: glowing 1800ms infinite;
}
@keyframes glowing-slow {
	0% {
	  /* background-color: #2ba805; */
	  box-shadow: 0 0 0 yellow;
	}
	50% {
	  /* background-color: #2ba805; */
	  box-shadow: 0 0 2px yellow;
	}
	70% {
	  /* background-color: #2ba805; */
	  box-shadow: 0 0 5px yellow;
	}
	90% {
	  /* background-color: #49e819; */
	  box-shadow: 0 0 10px yellow;
	}
	100% {
	  /* background-color: #2ba805; */
	  box-shadow: 0 0 5px yellow;
	}
}
.flashing-slowly {
	animation: glowing-slow 3000ms infinite;
}

.materiale-scarso {
	/* border-radius: 12px; border: 3px dotted red;padding: 6px; */
	border-radius: 4px;
	border: 2px solid red;
	padding: 1px 6px 1px 6px;
	white-space: nowrap;
}

/* Per mostrare stati avanzamento */
.stato_container {
	width:100%;
	margin-bottom: 10px;
}
.stato_container .stato {
	width: 600px;
	aspect-ratio: 1;
	clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%, 10% 50%);

	font-size: 14px;
	text-align: center;

	display: table-cell;
	vertical-align:middle;
	height: 60px;
	line-height: 26px;
	min-width:60px;
	background: lightgray;
	color: gray;
	cursor: pointer;
 }
.stato_container .done {
	background: green !important; 
	color: white !important;
}

/* per andare a capo nei popover */
.popover-content a {
	word-break: break-all;
}

/* Tutti i seguenti elementi resposive vanno da un minimo a un massimo corrispondenti a 250px a 1000px di larghezza screen*/
.box-title {
	font-size: 36px; /* Fallback value */
	font-size: clamp(24px, 20px + 1.6vw, 36px); 	/* 24 to 36 px*/
	float: left;
	font-weight: 200; 
	font-family: "Roboto", sans-serif;
	margin-top: 10px;
	margin-bottom: 10px;
}
.box-title i {
	margin-right: 14px;
	font-size: 36px; /* Fallback value */
	font-size: clamp(24px, 20px + 1.6vw, 36px); 	/* 24 to 36 px*/
}

/* questo mette lo sfondo blu sotto l'icona */
.box-title:not(:has(i.pallino-rosso-grande)) i {
	color: black;
	background: radial-gradient(circle, rgba(144, 224, 239, 0.5) 0%, rgba(0, 180, 216, 0.25) 40%, transparent 65%);
	border-radius: 50%;
	filter: drop-shadow(0 0 6px rgba(180, 240, 255, 0.6));
}

/* from AI */
.btn-group i {
  font-size: 16px; /* Default grandezza */
}

/* Scala fluida da 700px a 300px */
@media (max-width: 700px) and (min-width: 300px) {
  .btn-group i {
    font-size: calc(12px + (16 - 12) * ((100vw - 300px) / (700 - 300)));
  }
}

/* Sotto i 300px */
@media (max-width: 300px) {
  .btn-group i {
		font-size: 12px;
  }
}

/* end */


.box-title .ion-search {		/* Eccezione icona ricerca: bianca con fondo blu */
	color:#fff;
	background-color: #3c8dbc;
	padding: 2px 6px 2px 7px;
	border-radius: 3px;
}
.box-title .fa-download {		/* Eccezione icona download: bianca con fondo blu */
	color:#fff;
	background-color: #3c8dbc;
	padding: 4px 4px 0 4px;
	border-radius: 3px;
}
.modal-header .box-title i {		/* titolo nelle modal window */
	margin-left: 4px;
	margin-right: 8px;
}
@media (max-width: 430px) {		/* se meno di 430 px nasconde icona sul titolo */
	.box-title i.fa, 
	.box-title i.ion {
		display: none !important;
	}
}

/* *** */

.box-subtitle {
	font-size: 30px; /* Fallback value */
	font-size: clamp(20px, 16.6667px + 1.3333vw, 30px); 	/* 20 to 30 px*/
	font-weight: normal;
}

.box-body {
	padding:0;
}
.box-body, .info-box {
	font-size: 16px; /* Fallback value */
	font-size: clamp(13px, 12px + 0.4vw, 16px);		/* 13 to 16 px*/
}

.center {
  border: 5px solid;
  margin: auto;
  width: 50%;
  padding: 10px;
}

.box-tools button { 
	padding: 6px 12px 6px 12px;
	/* padding-left: clamp(4px, 1.3333px + 1.0667vw, 12px);
	padding-right: clamp(4px, 1.3333px + 1.0667vw, 12px);
	padding-top: clamp(0px, -2px + 0.8000vw, 6px);
	padding-bottom: clamp(0px, -2px + 0.8000vw, 6px);		*/
}

.box-tools-on-title {
	float: right !important;
	/* margin-top: 12px; */
	margin-top: 8px;
	margin-bottom: 8px;
}

.carrello-acquisto-cancellato		{font-size:100%; color: #d60896}
.carrello-acquisto					{margin-top:6px; font-size:140%; color: #3a6e8c}
.icona-richiesta-acquisto			{margin-top:6px; font-size:130%; color: #3a6e8c; background-color: white}

.icona-blu {
	color: #3a6e8c;
}

.table-hover > tbody > tr:hover > td:not(.bloccante) {
	background-color: #ffffe0 !important; /*  grigio default: #f4f4f4; */
}

.clip-allegati {
	font-size: 170%; 
	text-align:center; 
	padding-bottom:0 !important; 
	padding-top:0 !important;
}

.alert-no-data {
	text-align: center;
	margin-bottom: 0px;
}

.totale-righe {
	text-align: right; 
	font-size: 14px; 
	font-style: italic;
	padding:0 8px 0 0; 
	margin-bottom:20px;
	background-color: #ecf0f5 !important;
	color: #367fa9;
}
@media (max-width: 430px) {		/* se meno di 430 px nasconde*/
	.totale-righe {display:none}
}

.totale-righe-piccolo {
	font-size: 13.5px; 
	font-style: italic;
	color: #367fa9;
	margin-right: 2px;
}
@media (max-width: 430px) {		/* se meno di 430 px nasconde*/
	.totale-righe-piccolo {display:none}
}

@media (max-width: 400px) {		/* se meno di 400 px nasconde*/
	.hide-lt-400 {display:none !important}
}
@media (max-width: 430px) {		/* se meno di 430 px nasconde*/
	.hide-lt-430 {display:none !important}
}
@media (max-width: 500px) {		/* se meno di 500 px nasconde*/
	.hide-lt-500 {display:none !important}
}
@media (max-width: 600px) {
	.hide-lt-600 {display:none !important}
}
@media (max-width: 700px) {
	.hide-lt-700 {display:none !important}
}
@media (max-width: 800px) {
	.hide-lt-800 {display:none !important}
}
@media (max-width: 900px) {
	.hide-lt-900 {display:none !important}
}

.menu-shadow {
	box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
	width:auto !important; 
	min-width:30px; 
	border-radius: 1px; 
	border-color: lightgray;
}
.box-shadow {
	box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
	border-radius: 1px; 
	border-color: lightgray;
}
.menu-align-left {
	right: auto !important;
}

/* Sistema di help */
.info-system, .info-system-mouse, .info-system-touch, .info-system-custom {
	margin: 8px;
	padding: 10px;
}
.info-system h4, .info-system-mouse h4, .info-system-touch h4, .info-system-custom h4 {		/* titolo */
	font-size: 120%;
}
.info-system i, .info-system-mouse i, .info-system-touch i, .info-system-custom i {		/* icona fumetto nel titolo */
   background: radial-gradient(circle, white 0%, transparent 100%);
   padding: 0.2em;
}
.info-system button, .info-system-mouse button, .info-system-touch button, .info-system-custom button {
	margin-top: 8px;
}
.info-system p, .info-system-mouse p, .info-system-touch p, .info-system-custom p {
	margin: 0px 0 8px 2px;
}


.info-system .alert-heading, .info-system-mouse .alert-heading, .info-system-touch .alert-heading, .info-system-custom .alert-heading {
	margin-bottom: 6px;
}


.info-system-compact {
	margin: 8px 0 8px 0;
	padding: 4px;
}

/* show only on mouse devices */
@media (hover: hover), (pointer:fine) {
   .info-system-touch {
		display:none; 
	}
}
/* show only on touch devices */
@media (hover: none), (pointer:coarse) {
   .info-system-mouse {
		display:none; 
	}
}
/* end */

.modal-dialog-shadowed {
	box-shadow: 0 0 0 7px rgba(0,0,0,0.1);
}

.linguetta_sul_box, .linguetta_sul_box_cliccabile {
	padding-bottom: 2px; 
	margin-left: 2px;
}
.linguetta_sul_box > span:first-of-type, .linguetta_sul_box_cliccabile > span:first-of-type {
	line-height: 1.3;
	color: white; 
	background-color: #1C39BB; 		/* era #0070F6; /// #00c0ef; */
	padding: 4px 12px 4px 8px; 
	margin-top: 12px; 
	border-top-right-radius: 12px;
	cursor: pointer;
	white-space: nowrap;
	font-size: 18px; /* Fallback value */
	font-size: clamp(14px, 10px + 1.6vw, 18px); 	/* 14 to 18 px*/
}
.linguetta_sul_box > span:first-of-type i, .linguetta_sul_box_cliccabile > span:first-of-type i {
	margin-right: 12px;
}
.linguetta_sul_box_cliccabile > span:first-of-type {
	cursor: pointer;
}

.linguetta_sul_box_cliccabile .arrow-accordion {
	font-size: 80%; 
	margin-left: 12px;
	margin-right: 0 !important;
	transition: transform 0.3s;
}
.linguetta_sul_box_cliccabile .arrow-accordion.collapsed {
	transform: rotate(-90deg);
}		
.linguetta_sul_box_cliccabile .totale-righe-piccolo {
	float: right; 
	margin-top:8px;
}
.box-sotto-linguetta {
	border-top-width: 1px !important;
	border-top-color: #1C39BB !important; /* #0070F6; */
}
.btn-superAccordion {
	position: relative;
	top: -12px;
}

/* Segue finestra modal-dialog nel formato per le info. Uso: <div class="modal fade modal-info" ..... /> */
.modal-dialog-info {
	margin-top: 90px;
}
.modal-dialog-info .modal-content {
	margin: 10px;
	/* box-shadow: 5px 10px 30px navy; #003399 */
	box-shadow: 5px 10px 30px #003399;
}
.modal-dialog-info .modal-header {
	background-color: #FDF6EC;
}

table.dialog-footer-3columns {
	width: 100%;
}
table.dialog-footer-3columns tr td:nth-child(1) {
	text-align: left;
	width: 5%;	
}
table.dialog-footer-3columns tr td:nth-child(2) {
	text-align: left;
	width: 90%;
	padding-left: 12px;
	padding-right: 4px;
}
table.dialog-footer-3columns tr td:nth-child(3) {
	text-align: right;
	width: 5%;
	white-space: nowrap;
}

.row-deleted {		/* background righe diagonali rossine x record cancellati */
	/* background: repeating-linear-gradient(45deg, #ccc, #ccc 10px, #aaa 10px, #aaa 20px);		altra possibilità con grigi */
	background: repeating-linear-gradient(-30deg, #fff, #fff 10px, #fcc 10px, #fcc 20px);
}

/* modal dialog data entry UNUSED
.data-entry .modal-header {
	padding-top:12px; padding-bottom: 12px;
}
.data-entry .modal-header h1 {
	display: inline; 
	font-size: 36px; /* Fallback value
	font-size: clamp(24px, 20px + 1.6vw, 36px);
}
.data-entry .modal-header i {
	font-size: 30px;
	font-size: clamp(20px, 16px + 1.6vw, 30px);
	margin-right: 8px;
}
.data-entry .modal-header .close {
	font-size: 28px; 
	line-height: 18px;
}
*/

.info-cancellazione {
	border: 1px solid red;
	border-radius: 6px;
	font-size: 14px;
	font-weight: bold;
	padding: 8px;
	margin-bottom: 12px;
	color: maroon;
	background-color: white;
}
.versione_numero {
	background-color: orange; /* #0a0a23; */
	/* color: #fff; */
	border: none;
	border-radius: 12px;
	/* box-shadow: 0px 0px 2px 2px rgb(0,0,0); */
	box-shadow: 0 0 2px 2px orange;
	padding: 5px 10px!important;
	color: blue;
	font-size: 16px;
	font-weight: bold;
}

.table-allegati {
	border-style: none !important; 
	margin-left:2px !important; 
	margin-right:2px !important; 
	overflow-wrap: anywhere;
	background: unset !important;
}
/* class box con no border per scrivere numero righe tabella in basso */
.box-no-border-bottom {
	box-shadow: none !important;
}

.pallino-rosso {
	position: relative;
}
.pallino-rosso::after {
	content: "";
	position: absolute;
	top: -4px;
	right: 1px;
	width: 8px;
	height: 8px;
	background-color: red;
	border-radius: 50%;
	border: 1px solid black;
	box-sizing: border-box; /* fondamentale per mantenere le dimensioni */
}
.pallino-rosso-grande {
	position: relative;
}
.pallino-rosso-grande::after {
	content: "";
	position: absolute;
	top: 0px;
	right: -5px;
	width: 12px;
	height: 12px;
	background-color: red;
	border-radius: 50%;
	border: 2px solid white;
	box-sizing: border-box; /* fondamentale per mantenere le dimensioni */  
}

.sfondo-radiale-bianco {
	background: radial-gradient(circle at center, white 0%, transparent 0%);
}

/* Per mettere il segnale di pericolo sovrapposto ad un'altra icona */
.icona-sopra {
	position: relative; 
	z-index: 10;
	top: 4px;
}
.icona-sotto {
	position:relative; 
	right: 9px;
}

/* Privacy Policy */
.pp p {
	text-align: justify;
}
.pp .box-title {
	float: none;
}

section.content {
	padding-left: clamp(5px, calc(5px + (15 - 5) * ((100vw - 300px) / (1000 - 300))), 15px);		/* da 5px a 15px; da 300 a 1000 width screen */
	padding-right: clamp(5px, calc(5px + (15 - 5) * ((100vw - 300px) / (1000 - 300))), 15px);
}

/* per il bottone info nella tabella */
.td-with-buttons {
	text-align: right; 
	padding-bottom: 0 !important;
}
.btn-info-in-table {
	padding: 2px 10px;
}

/* tools che appaiono quando si passa sulla riga 
table.with-actions tr td:last-of-type {
	position: relative;
}
table.with-actions tr:hover .actions {
	opacity: 1;
	pointer-events: auto;
}

table.with-actions .actions {
  position: sticky;
  right: 0;
	
	xposition: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	gap: 5px;
	display: flex;
   transition: opacity 0.4s ease, visibility 0s linear 0.2s;		
}

table.with-actions .actions {max-height: 0px}

table.with-actions > tbody > tr:hover {
	background-color: #ffffe0;
}

table.with-actions tr:hover .actions, table.with-actions tr:focus .actions, table.with-actions tr:focus-within .actions {
	opacity: 1;
	visibility: visible;
}
table.with-actions > tbody > tr:focus td {
	background-color: #ffffd0 !important;
}
table.with-actions > tbody > tr:focus {
	outline: none;
	outline: 2px solid yellow;
}
*/
/* END */
/* 488, 428, 422, 575, 791, 826 */


.dropdown-menu-allineato li a {
  display: flex;
  align-items: center;
  padding-left:14px;
}

.dropdown-menu-allineato li a i {
  /* Imposta una larghezza fissa per tutte le icone */
  width: 24px; 
  text-align: center;
  margin-right: 8px; /* Spazio tra icona e testo */
  font-size: 120%; /* Mantieni la dimensione voluta */
  line-height: 1; /* Allinea verticalmente meglio */
  color: black;
  
  margin-top: 4px; 
  margin-bottom: 4px;
}

/* SCROLL BAR EVIDENZIATE */
* {
	scrollbar-width: auto; /* per Firefox */
	scrollbar-color: darkblue transparent; /* colore thumb e track */
}
/* */
#barche {
	color: white;
	background-color: #222d32;
	border: 1px solid #333 !important; /* o il bordo che vuoi mantenere */
	margin-top: 3px;
	border: none;
	outline: none;
}

#barche:hover {
	border: 1px solid #ccc !important; /* o il bordo che vuoi mantenere */
	border: 1px solid rgba(81, 203, 238, 1) !important;
	outline: none;
}
#barche:focus {
   box-shadow: 0 0 5px rgba(81, 203, 238, 1) !important;
   border: 1px solid rgba(81, 203, 238, 1) !important;
}

/* */

ul.lista-codici  {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

ul.lista-codici  li {
	position: relative;
	padding-left: 15px; /* Spazio per il bullet */
	margin-bottom: 0px; /* Compattezza verticale */
}

ul.lista-codici  li::before {
	content: '▹'; /* Bullet moderno (open circle, professionale) */
	position: absolute;
	left: 0;
	top: 4px; /* Centra verticalmente */
	color: #4a5568; /* Grigio scuro elegante */
	font-size: 14px;
	font-weight: bold;
	line-height: 1.2;	
}

/**********************************************/
/* Ritocco a nav-tab (le linguette) per colori più decisi e visibili */
.nav-tabs {
	border-bottom-color: #0070F6;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	border-top-color: #0070F6;
	border-left-color: #0070F6;
	border-right-color: #0070F6;
}

/* link versione sulla finestra di editing tipo "versione 3 di 3" */
.link-versione, .link-versione:visited {
	display: inline-flex; 
	align-items: center; 
	gap: 6px; 
	font-size: 90%;
	text-decoration: none;
}
.link-versione:hover {
	text-decoration: underline;
}
.link-versione .versione {
	white-space: nowrap;
}

/* ////////////////////////////////////////////////////////////////////////////////////
// CRONOLOGIA 
/////////////////////////////////////////// */
table.cronologia { width:100%; border-collapse:collapse; }
table.cronologia thead tr { border-bottom:0.5px solid #e0e0e0; }
xtable.cronologia thead th { xfont-size:12px; xcolor:#888; font-weight:500; padding:6px 12px; }
table.cronologia thead th.versione-num { width:50px; text-align:center; }
/* table.cronologia tbody tr { cursor:pointer; } */
table.cronologia tbody tr:hover td { background:#f7f7f5; }
table.cronologia td { font-size:13px; padding:9px 12px; vertical-align: middle !important; color:black}
table.cronologia td.versione-num { text-align:center; }
table.cronologia td.versione-num span { display:inline-flex; width:26px; height:26px; border-radius:50%; background:#f1f1ee; 
						  border: 1px solid #bbb; align-items:center; justify-content:center; xfont-size:11px; xfont-weight:500; /* color:#888; */}
table.cronologia .evento span { /* font-size:11px; */ padding:2px 10px; border-radius:999px; font-weight:600; border: 2px solid; white-space: nowrap}

/* inserito */
table.cronologia tr.inserito .evento span { background: #d4edda; color: #1a6b2f; border-color: #1a6b2f;}
table.cronologia tr.inserito { cursor:pointer; }

/* modificato */
table.cronologia tr.modificato .evento span {background: #cce0ff; color: #0047b3; border-color: #0047b3;}
table.cronologia tr.modificato { cursor:pointer; }

/* cancellato */
table.cronologia tr.cancellato td { opacity:0.75; }
table.cronologia tr.cancellato .versione-num span { background:#fcebeb; border-color: #c0392b;}
table.cronologia tr.cancellato .versione-num i { color:#c0392b; font-size:12px; }
table.cronologia tr.cancellato .data { text-decoration:line-through; color:#c0392b; }
table.cronologia tr.cancellato .evento span { /* border:0.5px solid #f7c1c1; */ background: #fdd; color: #c0392b; border-color: #c0392b;}
table.cronologia tr.cancellato .autore { color:#c0392b; }

/* corrente */
table.cronologia tr.corrente td { background:#e6f1fb; }
table.cronologia tr.corrente:hover td { opacity:0.85; }
table.cronologia tr.corrente td:first-child { border-left:2px solid #378add; }
table.cronologia tr.corrente .versione-num span { background:#fff; border-color:#378add; color:#185fa5; }
table.cronologia tr.corrente .data { color:#185fa5; font-weight:500; }
xtable.cronologia tr.corrente .evento span { background:#fff; color:#185fa5; border:0.5px solid #b5d4f4; }
table.cronologia tr.corrente .autore { color:#185fa5; }

/* acquisto eseguito */
table.cronologia tr.eseguito .evento span {  background: #fef3cd;  color: #7d5a00;  border-color: #7d5a00;}