/* ----------------
   ----- PAGE -----
   ---------------- */

html {
    height: 100%;
    width: 100%;
    margin: 0;
}

body {
    /*min-height: 100%;*/
    width: 100%;
    margin: 0;
    position: relative;
    padding-top: .65rem;
    padding-bottom: .35rem;
    background-color: #FAFAFA; /* #3366CC   #047cff   ecf0f1 */
    font-family: 'Lato', sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 25px;
    color: rgba(111,110,110,1); /* #1e293b */
    text-align: center;
    font-weight: 400;
}
		
.divEsterno {
    width: 100%; 
    margin: 0px; 
    /* border-top: 2px solid #C0C0C0;
    border-bottom: 2px solid #C0C0C0; */
}
        
/*.header {
    width: 100%; 
    margin: 0px; 
    background-color: #fff; 
    color: #047cff; 
    font-size: 30pt; 
    padding: 10px 0px;
    font-weight: 500;
    position: fixed;
    top: 0px;
    z-index: 1;
}*/
        
.blocco {
    -webkit-appearance: none;
	-webkit-border-radius: 2;
	-moz-border-radius: 2;
	border-radius: 2px;
	background-color: #fff;			
	display: inline-block; 
	vertical-align: top;			
	font-size: 14pt;			
	margin: 10px;
}

select {
    /*appearance: auto !important;
    -webkit-appearance: menulist-button !important; 

    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
}

hr.style14 { 
	border: 0; 
	height: 1px; 
	background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
	margin: 50px 0px;
}
        
ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}		

/*.footer { 
	margin: 0px;
	padding: 10px;
	left: 0;
	bottom: 0;
	right: 0;
	position: absolute;
		  
	border-top: solid 1px #9E9E9E;
	background-color: #BDBDBD;
		  
	color: #616161;
	font-size: 14pt;
}
		
a.aFooter {
	color: #616161;
	text-decoration: none;
}
		
a.aFooter:visited {
	color: #616161;
	text-decoration: none;
}
		
a.aFooter:active {
    color: #616161;
	text-decoration: none;
}*/


/* Width (già presenti: w-25 w-50 w-75 w-100) */
.w-7 { /* 1/13 */
    width: 7%;
}
.w-9 { /* 1/11 */
    width: 9%;
}
.w-12 { /* 1/8 */
    width: 12%;
}
.w-15 { /* 2/13 */
    width: 15%;
}
.w-17 { /* 1/6 */
    width: 17%;
}
.w-18 { /* 2/11 */
    width: 18%;
}
.w-20 { /* 1/5 */
    width: 17%;
}
.w-23 { /* 3/13 */
    width: 23%;
}
.w-27 { /* 3/11 */
    width: 27%;
}
.w-30 { /* 4/13 */
    width: 30%;
}
.w-33 { /* 1/3 */
    width: 33%;
}
.w-36 { /* 4/11 */
    width: 36%;
}
.w-38 { /* 5/13 */
    width: 38%;
}
.w-45 { /* 5/11 - 6/13 */
    width: 45%;
}
.w-54 { /* 6/11 - 7/13 */
    width: 54%;
}
.w-61 { /* 8/13 */
    width: 61%;
}
.w-63 { /* 7/11 */
    width: 63%;
}
.w-67 { /* 2/3 */
    width: 67%;
}
.w-69 { /* 9/13 */
    width: 69%;
}
.w-72 { /* 8/11 */
    width: 72%;
}
.w-77 { /* 10/13 */
    width: 77%;
}
.w-81 { /* 9/11 */
    width: 81%;
}
.w-83 { /* 5/6 */
    width: 83%;
}
.w-85 { /* 11/13 */
    width: 85%;
}
.w-88 { /* 7/8 */
    width: 88%;
}
.w-91 { /* 10/11 */
    width: 91%;
}
.w-92 { /* 12/13 */
    width: 92%;
}
.w-95 { 
    width: 95%;
}


/* -----------------
   --- FINE PAGE ---
   ----------------- */
   
   
   
/* ------------------
   ----- HEADER -----
   ------------------ */

.header {
    width: 100%; 
    margin: 0px;
    padding: 16px 0px 15px 0px; 
    border-bottom: 1px solid #dcdcdc; 
    background-color: #fff; 
    font-size: 12pt; 
    position: fixed;
    top: 0px;
    z-index: 999;
}
     
.tableHeader {
    width: 100%; 
    margin: 0px; 
    padding: 0px; 
    /* border: 1px solid #000; */
}

.logoHeader {
    margin: 0px; 
    width: calc(100% - 500px); 
    text-align: center; 
    vertical-align: middle;
}

.buttonHeader {
    -webkit-appearance: none; 
    text-decoration: none; 
    outline-style: none; 
    background-color: transparent; 
    border: 0px; 
    margin: 2px;
    display: inline-block;
}

.lblBadge {
    vertical-align: super; 
    font-size: 8pt; 
    margin-left: -20px;
    display: inline-block;
}

/* -------------------
   --- FINE HEADER ---
   ------------------- */



/* ---------------------
   ----- NOTIFICHE -----
   --------------------- */
   
.testoNotifNonVis {
	-webkit-line-clamp: 2;
	line-clamp: 2; 
	overflow : hidden; 
	text-overflow: ellipsis; 
	display: -webkit-box; 
	-webkit-box-orient: vertical;
	margin-top: 5px;
}    
    
.testoNotifVis {
	-webkit-line-clamp: none;
	line-clamp: none;
	overflow : hidden; 
	text-overflow: ellipsis; 
	display: -webkit-box; 
	-webkit-box-orient: vertical;
	margin-top: 5px;
}

#testoNotif {
	margin-top: 5px;
}

h5.mb-1 {
	font-weight: 600;
}

.liAbbonamenti {    
	/* display: none; */
}

/* ----------------------
   --- FINE NOTIFICHE ---
   ---------------------- */
   
   
   
/* -------------------
   ----- BUTTONS -----
   ------------------- */

/* per non far vedere bordi azzurri dopo aver cliccato un button */
button { outline: none; }			
button:focus { outline: none; }
   
/* 'btn' già classe Bootstrap */
.button {
	-webkit-appearance: none;
	-webkit-border-radius: 5;
	-moz-border-radius: 5;
	border-radius: 5px;
			  
	color: #fff;
	font-size: 12pt;
	background: #2196F3;
	padding: 5px 10px;
	text-decoration: none;
	outline-style:none;
			  
	text-align: center;
	border: 2px solid rgba(255,255,255,0);
	box-sizing: border-box;
	cursor: pointer;
	vertical-align: middle;
}
			
.button:hover {
	color: #fff;
}
			
.button:visited {
	color: #fff;
}
			
.btnHelpModal {
	-webkit-appearance: none;
	text-decoration: none;
	outline-style: none;
	background-color: transparent;
			  
	display: inline-block;
	padding: 0px;
	margin: 0px;
	vertical-align: middle;
	display: inline-block;
			  
	border: 0;
	cursor: pointer;
	outline: none;
}
			
.btnHelpModal:focus { outline: none; }

.btnQuestionMark {
    color: #000;
    font-size: calc(0.75em + 3vmin);
    position: absolute;
    top: 90px;
    right: 25px;
    cursor: pointer;
}

.btnDashboardCliente {
    /*font-size: calc(0.75em + 3vmin);
    width: 1ch;   
    height: auto;*/ /* Mantiene le proporzioni dell'immagine */
    width: 40px;
    position: sticky;
    position: -webkit-sticky;
    top: 90px;
    float: right;
    padding: 0;
    margin: 0;
    margin-right: 5px;
    margin-top: 60px;
    z-index: 1029;
    background-color: transparent;
    border: 0;
    cursor: pointer;
}

.btnRed {
    -webkit-appearance: none;
    -webkit-border-radius: 5;
    -moz-border-radius: 5;
    border-radius: 5px;
    color: #ffffff;
    font-size: 50pt;
    background: #fd3c3c;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    text-align: center;
    border: 2px dashed rgba(255, 255, 255, 0);
    box-sizing: border-box;
    cursor: text;
}
			
.btnGreen {
	-webkit-appearance: none;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #ffffff;
	font-size: 50pt;
	background-color: #00C853;
	padding: 10px 20px 10px 20px;
	text-decoration: none;
			  
	text-align: center;
	border: 2px dashed rgba(255, 255, 255, 0);
	box-sizing: border-box;
			  
}
			
.btnYellow {
	-webkit-appearance: none;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #ffffff;
	font-size: 50pt;
	background-color: #FFC107;
	padding: 10px 20px 10px 20px;
	text-decoration: none;
			  
	text-align: center;
	border: 2px dashed rgba(255, 255, 255, 0);
	box-sizing: border-box;
			  
}

/* btn Menu */			
.btnMenu {
	-webkit-appearance: none;
	text-decoration: none;
	outline-style: none;
	background-color: transparent;
	font-family: 'Lato', georgia;
	font-weight: 350;
	-webkit-font-smoothing: antialiased;
			  
	color: #7f8c8d;
	display: inline-block;
	padding: 0px 0px 0px 5px;
	margin: 10px 0px;
	white-space: normal;
			  
	text-align: left;
	border: 0;
	cursor: pointer;
	outline: none;
}
			
.btnMenu:hover { color: #2a2e2e; }
.btnMenu:focus, .btnMenu:active, .btnMenu:visited { outline: none; }
			
.menu {
	-webkit-appearance: none;
	color: #ffffff;
	font-size: 50pt;
	/*background: #3cb0fd;*/
	text-decoration: none;
	outline-style:none;
			  
	text-align: center;
	border: 0;
	cursor: text;
			  
}

/* Paginazione (frmElencoRapp) */
.btnPagina {
	-webkit-appearance: none;
	text-decoration: none;
	outline-style: none;
	outline: none;
	
	-webkit-font-smoothing: antialiased;	
	background-color: transparent;
	font-family: 'Lato', georgia;
	font-weight: 350;
	color: #7f8c8d;
	white-space: normal;
	text-align: left;
	
	vertical-align: middle;
	display: inline-block;
	/*padding: 0px 0px 0px 5px;*/
	/*margin: 10px 0px;*/
	border: 0;
	cursor: pointer;
			  
}
			
.btnPaginaSelected {
	-webkit-appearance: none;
	text-decoration: none;
	outline-style: none;
	outline: none;
	
	-webkit-font-smoothing: antialiased;
	background-color: transparent;
	font-family: 'Lato', georgia;
	font-weight: bold;
	color: #2a2e2e;
	white-space: normal;
	text-align: left;
	
	vertical-align: middle;
	display: inline-block;
	padding: 0px 0px 0px 5px;
	/*margin: 10px 0px;*/
	border: 0;
	cursor: pointer;
}	

			
#btnOpen, #btnClose, #btnEliminaInt, #btnApriInt {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0px;
	color: #ffffff;
	font-size: 30px;
	background: transparent;
	padding: 10px 0px 0px 0px;
	text-decoration: none;
	outline-style:none;
			  
	text-align: center;
	border: 0px dashed rgba(255, 255, 255, 0);
	box-sizing: border-box;
			  
}
			
.buttonAdd {
	margin-left: 0px; 
	position: fixed; 
	bottom: 30px; 
	right: 30px; 
	border-radius: 50%; 
	border: solid 1px #2196F3; 
	background-color: #2196F3; 
	font-size: 36px; 
	color: #fff; 
	display: block; 
	height: 50px; 
	width: 50px; 
	vertical-align: middle; 
	text-align: center; 
	cursor: pointer;
}

.btnCanc {
	-webkit-appearance: none;
	text-decoration: none;
	outline-style: none;
	background-color: transparent;
	font-family: 'Lato', georgia;
	font-weight: 350;
	-webkit-font-smoothing: antialiased;
	font-size: 12pt;
	color: #7f8c8d;
	/* display: block; */
			  
	vertical-align: middle;
	border: 0;
	cursor: pointer;			  
}
			
			
.etMobile {
	-webkit-appearance: none;
	-webkit-border-radius: 5;
	-moz-border-radius: 5;
	border-radius: 5px;
			  
	color: #fff;
	font-size: 12pt;
	background: #2ecc71;
	padding: 5px 8px;
	margin: 12px 5px 0px 0px;
	text-decoration: none;
	outline-style:none;
			  
	text-align: center;
	border: 2px solid #2ecc71;
	box-sizing: border-box;
			  
}

.btnIMG {
	-webkit-appearance: none;
	text-decoration: none;
	outline-style: none;
	background-color: transparent;
	-webkit-font-smoothing: antialiased;			  
	vertical-align: middle;
	border: 0;
	cursor: pointer;
	outline: none;			  
}

.btnIMG:hover { outline: none; }
.btnIMG:focus { outline: none; }


.btn-link-dismiss {
    -webkit-appearance: none;
    text-decoration: none;
    outline-style: none;
    background-color: transparent;
    -webkit-font-smoothing: antialiased;
    vertical-align: middle;
    border: 0;
    cursor: pointer;
    outline: none;
    color: #6c757d;
}
.btn-link-dismiss:hover {
    text-decoration: underline;
    color: #6c757d;
}

/* Buttons disabled */
.disabled{
  text-decoration: line-through;
  cursor: default;
}
.disabled:hover,
.disabled:focus,
.disabled:hover,
.disabled:focus {
  text-decoration: line-through;
  cursor: default;
  color: #7f8c8d
}

/* chiudi immagini */
.x-per-image {
    position: absolute;
    top: -8px;
    right: -8px;

    /*min-width: 23px;
    max-width: 23px;
    min-height: 23px;
    max-height: 23px;*/

    height: 23px;
    width: 23px;
    line-height: 23px;
    font-size: 20px;
    font-weight: 600;
    border-radius: 50%;
    border: none;
    background-color: #303030;
    opacity: 1;
    color: #fff;
    text-align: center;
    cursor: pointer;
    text-decoration: none; 

    display: flex;
    justify-content: center;
    align-items: center;
}
        
.btnClosePopup { /* btn Chiudi Popup */
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999999;

    /*min-width: 23px;
    max-width: 23px;
    min-height: 23px;
    max-height: 23px;*/

    height: 30px;
    width: 30px;
    line-height: 30px;
    font-size: 1.6em;
    border-radius: 50%;
    border: none;
    background-color: #303030;
    opacity: 0.8;
    color: #fff;
    text-align: center;
    cursor: pointer;
    text-decoration: none; 

    /*display: flex;
    justify-content: center;
    align-items: center;*/
}

.xBtnClosePopup { /* "x" del btn Chiudi Popup */
    cursor: pointer;
    color: #fff;
}

.close {
    cursor: pointer !important;
}

/* Close x Btn Popup */
.btn-close-custom {
    position: absolute;
    top: 30px;
    right: 30px;
    border: none;
    background: transparent;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer !important;
    transition: background 0.15s ease, transform 0.15s ease;
}

    .btn-close-custom span {
        font-size: 24px;
        line-height: 1;
        color: #222;
        font-weight: 500;
        cursor: pointer !important;
    }

    .btn-close-custom:hover {
        background: rgba(0, 0, 0, 0.08);
    }

        .btn-close-custom:hover span {
            color: #000;
        }

    .btn-close-custom:focus,
    .btn-close-custom:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(0,0,0,0.12);
    }


/* Input Foto */
.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    font-size: 1.25em;
    font-weight: 700;
    color: white;
    background-color: black;
    display: inline-block;
    cursor: pointer;
}

.inputfile:focus + label,
.inputfile + label:hover {
    background-color: red;
}

.inputfile:focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}
/* Fine Input Foto */

/* Paginazione */
.pag-selezionata {
    color: #0066ffDD;
}

.pag-normale {
    color: black;    
}


/* Badge AI */
.badge-ai {
    background: #0066FF;
    color: white;
    font-size: 14px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

/* Effetto luce che attraversa */
.badge-ai.active-sparkle::before {
    content: "";
    position: absolute;
    top: 0;
    left: -130%;
    width: 120%;
    height: 100%;
    background: linear-gradient( 115deg, transparent 0%, rgba(255,255,255,0.7) 50%, transparent 100% );
    transform: skewX(-20deg);
    animation: shine 2.2s ease-in-out infinite;
    opacity: 0.6;
}

/* Piccoli glitter */
.badge-ai.active-sparkle::after {
    content: "";
    position: absolute;
    width: 260%;
    height: 260%;
    top: -80%;
    left: -80%;
    background: radial-gradient(circle, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0) 60%) 20% 20%, radial-gradient(circle, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 70%) 80% 30%, radial-gradient(circle, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 60%) 50% 80%;
    background-size: 8px 8px, 6px 6px, 7px 7px;
    background-repeat: no-repeat;
    animation: sparkleMove 3s linear infinite;
    opacity: 0.7;
    pointer-events: none;
}

/* Animazione passata di luce */
@keyframes shine {
    0% {
        left: -130%;
    }

    40% {
        left: 130%;
    }

    100% {
        left: 130%;
    }
}

/* Movimento lento dei glitter */
@keyframes sparkleMove {
    0% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(8%, 8%);
    }

    100% {
        transform: translate(0, 0);
    }
}


/* --------------------
   --- FINE BUTTONS ---
   -------------------- */



/* ----------------------
   ----- CAMPI RAPP -----
   ---------------------- */

/* Textbox Orario */
.inputTime {
    vertical-align: middle;
    text-align: center;
    margin: 0 0 5px 0;
    padding: 3px;
    min-height: 42px;
    width: 100px;
    background-color: #fff;
    border: 0;
    font-size: 18pt;
    display: inline;
}

/* Label sopra i Campi del Rapportino */
.labelCampiRapp {
    font-size: 14pt; 
    text-align: left;
}

/* Dropbox/select Campo Rapportino */
.selectCampiRapp {
    margin: 0px 0 10px 0; 
    padding: 10px; 
    width: 100%; 
    background-color: #fff; 
    border: 0; 
    font-size: 16pt;
}
        
/* Input TextBox Campo Rapportino */
.inputTextboxCampiRapp {
    vertical-align: middle; 
    margin: 0px 0 13px 0; 
    padding: 10px;  
    width: calc(100% - 2px); 
    background-color: #fff; 
    border: 0; 
    font-size: 14pt; 
    display: inline-block;
}
        
/* Input TextArea Campo Rapportino */
.inputTextareaCampiRapp {
    margin: 5px 0 13px 0; 
    padding: 10px; 
    width: 100%; 
    height: 150px; 
    background-color: #fff; 
    border: 0; 
    font-size: 14pt;
}

/* Input Number Campo Rapportino */
.inputNumberCampiRapp {
    vertical-align: middle; 
    margin: 0; 
    padding: 5px; 
    width: 100%; 
    max-width: 125px; 
    text-align: right; 
    background-color: #fff; 
    border: 0; 
    font-size: 14pt; 
    color: #000; 
    display: inline-block;
}
        
/* Input Data Campo Rapportino */
.inputDataCampiRapp {
    vertical-align: middle; 
    width: 100%; 
    max-width: 200px;
    background-color: #fff; 
    border: 0; 
    font-size: 14pt; 
    text-align: left; 
    margin: 5px 0 13px 0; 
    padding: 10px;
}

/* INPUT-TEXTBOX */
input { outline: none; } /* per non far vedere bordi azzurri dopo aver cliccato su un input */
input:focus { outline: none; }
input[type=date], input[type=datetime-local], input[type=month], input[type=time] { -webkit-appearance: none; } /* x non far togliere le classi con iOS 16 */

input:disabled {
    cursor: not-allowed;
    opacity: .6;
}


/* -----------------------
   --- FINE CAMPI RAPP ---
   ----------------------- */



/* ----------------
   ----- VARI -----
   ---------------- */
   


/* DROPDOWNLIST */	


/* TESTO */
h1, h2, h3, h4, h5, h6, p, span, label, ul, li, table, td, th { cursor: default; }

/* Disable Text Selection */
.user-select-none {
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}


/* STILE PLACEHOLDER INPUT */
input::placeholder {
    /*color: red;
    font-size: 1.2em;*/
    font-style: italic;
}
/* Chrome, Safari, Opera */
::-webkit-input-placeholder {
    /* font-size: 1.2em; 
    color: #c0c0c0;*/
    font-style: italic;
}
/* Firefox 19+ */
::-moz-placeholder {
    /*color: red;
    font-size: 1.2em;*/
    font-style: italic;
}
/* IE 10+ */
:-ms-input-placeholder {
    /*color: red;
    font-size: 1.2em;*/
    font-style: italic;
}
/* Firefox 18- */
:-moz-placeholder {
    /*color: red;
    font-size: 1.2em;*/
    font-style: italic;
}


/* x mettere sulla stessa linea checkbox e testo (label) */
label {
    display: inline; 
    padding-left: 4px;
}

input[type="checkbox"] ~ label {
    cursor: pointer;
}

/* CHECKBOX */
input[type='checkbox'] {
    width: 0.9rem; 
    height: 0.9rem;
    cursor: pointer;
    vertical-align: middle;
}


/* Tooltips */
.arrow-onboarding {
    border-color: #dbeafe !important;
}
/*.arrow-onboarding:before {
    border-color: #dbeafe !important;
}
.arrow-onboarding:after {
    border-color: #dbeafe !important;
}*/
.tooltip-inner-onboarding {
    text-align: left !important;
    max-width: 300px !important;
    padding: 1rem !important;
    background-color: #f0f9ff !important; /* #000 #dbeafe */
    color: #303030 !important; /* #fff #000 #303030 */
    font-size: 1.025rem !important;
    opacity: 1 !important;
}

.divFocusOnboarding {
    position: relative;
    z-index: 1032;
}

.tooltip.show {
    opacity: 1 !important;
}

.tooltip-inner { /* x dare allineamnto testo a sinistra ai Tooltips */
    text-align: left;
}

.tooltip-inner-larger {
    width: 400px !important;
    max-width: 400px !important;
}


/* Hide scrollbar */
.noScrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari and Opera */
}
.noScrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 18px;
}
::-webkit-scrollbar-track {
    background-color: transparent;
}
#divMenuContab::-webkit-scrollbar-track {
    background-color: #fff;
}
#divMenuTabelle::-webkit-scrollbar-track {
    background-color: #fff;
}
::-webkit-scrollbar-thumb {
    min-height: 100px;
    background-color: #a8bbbf; /* #d6dee1 */
    border-radius: 15px;
    border: 4px solid transparent;
    background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover {
    background-color: #92A2A6; /* #a8bbbf */
}

/* Loading - Spinner */
.loading-panel {    
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(1, 1, 1, 0.7);
    z-index: 99999;

    display: flex;
    justify-content: center;
    align-items: center;

} 

.spinnerCustom {    
    width: 2.5rem; 
    height: 2.5rem;
} 

/* No Overflow */
.no-overflow {
    /* border: 0px !important; */
    box-sizing: none !important;
    box-shadow: none !important;
    outline: 0px !important;
    -webkit-appearance:none;
} 

/* Cursor Pointer x Buttons/link... */
.cursor-pointer {
    cursor: pointer;
}

/* Pagination */
ul.pagination li a {
    color: black;
    padding: 8px 16px;
    text-decoration: none;
}

ul.pagination li a.active {
    background-color: #0066FF;
    color: white;
}

ul.pagination li a:hover:not(.active) {background-color: #ddd;}


/* GAP */
.gap-0 {
    gap: 0rem;
}
.gap-1 {
    gap: .25rem;
}
.gap-2 {
    gap: .5rem;
}
.gap-3 {
    gap: 1rem;
}
.gap-4 {
    gap: 1.5rem;
}
.gap-5 {
    gap: 3rem;
}



/* Border Radius */
.rounded-0 {
    border-radius: 0;
}

.rounded-1 {
    border-radius: 0.2rem;
}

.rounded-2 {
    border-radius: 0.3rem;
}

.rounded-3 {
    border-radius: 0.5rem;
}

.rounded-4 {
    border-radius: 0.75rem;
}

.rounded-5 {
    border-radius: 1rem;
}



/* Grid Row-cols */
.row-cols-1 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.row-cols-2 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

.row-cols-3 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.row-cols-4 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

.row-cols-5 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.row-cols-6 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

@media only screen and (min-width: 576px) and (max-width: 767px) { /* sm - Small devices (tablets, 768px and up) */
    .row-cols-sm-1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .row-cols-sm-2 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
    .row-cols-sm-3 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; }
    .row-cols-sm-4 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }
    .row-cols-sm-5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }
    .row-cols-sm-6 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) { /* md - Medium devices (desktops, 992px and up) */
    .row-cols-md-1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .row-cols-md-2 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
    .row-cols-md-3 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; }
    .row-cols-md-4 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }
    .row-cols-md-5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }
    .row-cols-md-6 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) { /* lg - Large devices (large desktops, 1200px and up) */
    .row-cols-lg-1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .row-cols-lg-2 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
    .row-cols-lg-3 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; }
    .row-cols-lg-4 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }
    .row-cols-lg-5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }
    .row-cols-lg-6 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; }
}

@media only screen and (min-width: 1200px) { /* xl - Large devices (large desktops, 1200px and up) */
    .row-cols-xl-1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .row-cols-xl-2 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
    .row-cols-xl-3 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; }
    .row-cols-xl-4 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }
    .row-cols-xl-5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }
    .row-cols-xl-6 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; }
}


/* Seleziona Scadenza */
.scadSelezionata {
    background: rgba(51, 65, 85, 0.2) !important;
}


/*STAMPA*/
.print, .print * {
    display: none;
}

@media print {
    .no-print, .no-print * {
        display: none !important;
    }

    .print, .print * {
        display: inline-block !important;
    }

    /* Forza la stampa di sfondi e colori 
    * {
        print-color-adjust: exact !important;
        -webkit-print-color-adjust: exact !important;
    }*/
}

.d-none-important {
    display: none !important;
}

        
/* -----------------
   --- FINE VARI ---
   ----------------- */


   
/* ----------------------
   ----- RESPONSIVE -----
   ---------------------- */

/* Small-Smartphone */
@media only screen and (max-width: 350px) {
    /*.header { height: 80px; } */
	#logo { max-width: 200px; }
	.footer { display: none; }
	.noMobile { display: none; }
	.onlyMobile { display: block; }
	
	/*  */
	.divResp {
        width: 100%;
        max-width: 400px;
        padding: 10px;
        margin: 10px 0px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: fixed;
        top: 20px;
        right: 20px;
    }     
    
    /* btn x Download App
    #btnDownloadApp {
        display: block;
    }      */

    #btnWhatsapp {
        bottom: 24px;
        right: 24px;
        width: 60px;
        height: 60px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
        max-height: 100vh;
        overflow-y: scroll;
    }

    .btnDashboardCliente {
        width: 30px;
        top: 80px;
        margin-top: 30px;
        margin-right: 5px;
    }

}
        
/* Smartphone */
@media only screen and (min-width: 351px) and (max-width: 480px) {
	/*.header { height: 80px; } */
	#logo { max-width: 200px; }
	.footer { display: none; }
	.noMobile { display: none; }
	.onlyMobile { display: block; }
	
	/*  */
	.divResp {
        width: 100%;
        max-width: 400px;
        padding: 10px;
        margin: 10px 0px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: fixed;
        top: 20px;
        right: 20px;
    }  
    
    /* btn x Download App
    #btnDownloadApp {
        display: block;
    }    */

    #btnWhatsapp {
        bottom: 24px;
        right: 24px;
        width: 60px;
        height: 60px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
        max-height: 100vh;
        overflow-y: scroll;
    }

    .btnDashboardCliente {
        width: 30px;
        top: 80px;
        margin-top: 30px;
        margin-right: 5px;
    }

}

/* Large-Smartphone */		
@media only screen and (min-width: 481px) and (max-width: 575px) {
	/*.header { height: 80px; } */
	#logo { max-width: 200px; }
	.footer { display: none; }
	.noMobile { display: none; }
	.onlyMobile { display: block; }
	
	/*  */
	.divResp {
        width: calc(50% - 22px);
        max-width: 350px;
        padding: 10px;
        margin: 10px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: fixed;
        top: 20px;
        right: 20px;
    }  
    
    /* btn x Download App 
    #btnDownloadApp {
        display: block;
    }   */

    #btnWhatsapp {
        bottom: 32px;
        right: 32px;
        width: 60px;
        height: 60px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
        max-height: 100vh;
        overflow-y: scroll;
    }

    .btnDashboardCliente {
        width: 36px;
        top: 80px;
        margin-top: 35px;
        margin-right: 5px;
    }

}
	
/* Tablet */		
@media only screen and (min-width: 576px) and (max-width: 767px) {
	#logo { max-width: 200px; }
	.footer { display: inherit; }
	.noMobile { display: none; }
	.onlyMobile { display: block; }
	
	/*  */
	.divResp {
        width: calc(50% - 22px);
        max-width: 350px;
        padding: 10px;
        margin: 10px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: fixed;
        top: 20px;
        right: 20px;
    }  
    
    /* btn x Download App
    #btnDownloadApp {
        display: block;
    }    */

    #btnWhatsapp {
        bottom: 32px;
        right: 32px;
        width: 60px;
        height: 60px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
        max-height: 100vh;
        overflow-y: scroll;
    }

    .btnDashboardCliente {
        width: 36px;
        top: 80px;
        margin-top: 40px;
        margin-right: 5px;
    }

}

/* Small-Desktop */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	#logo { max-width: 300px; }
	.footer { display: inherit; }
	.noMobile { display: initial; }
	.onlyMobile { display: none; }
	
	/*  */
	.divResp {
        width: calc(50% - 2px);
        max-width: 350px;
        padding: 10px;
        margin: 10px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: absolute;
        top: 5px;
        right: 11px;
    }  
    
    /* btn x Download App
    #btnDownloadApp {
        display: block;
    }    */

    #btnWhatsapp {
        bottom: 32px;
        right: 32px;
        width: 50px;
        height: 50px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
        max-height: 100vh;
        overflow-y: scroll;
    }

    .btnDashboardCliente {
        width: 36px;
        top: 80px;
        margin-top: 40px;
        margin-right: 5px;
    }

}

/* Desktop */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
	#logo { max-width: 300px; }
	.footer { display: inherit; }
	.noMobile { display: initial; }
	.onlyMobile { display: none; }
	
	/*  */
	.divResp {
        width: calc(50% - 2px);
        max-width: 350px;
        padding: 10px;
        margin: 10px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: absolute;
        top: 5px;
        right: 11px;
    }  
    
    /* btn x Download App
    #btnDownloadApp {
        display: none;
    }    */

    #btnWhatsapp {
        bottom: 32px;
        right: 32px;
        width: 50px;
        height: 50px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
        max-height: 100vh;
        overflow-y: scroll;
    }

    .btnDashboardCliente {
        width: 36px;
        top: 80px;
        margin-top: 40px;
        margin-right: 5px;
    }

}

/* Large-Desktop */	
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
	#logo { max-width: 300px; }
	.footer { display: inherit; }
	.noMobile { display: initial; }
	.onlyMobile { display: none; }
	
	/*  */
	.divResp {
        width: calc(50% - 2px);
        max-width: 350px;
        padding: 10px;
        margin: 10px;
    }
	
	/* btn Chiudi Popup */
    .btnClosePopup {
        position: absolute;
        top: 5px;
        right: 11px;
    }  
    
    /* btn x Download App
    #btnDownloadApp {
        display: block;
    }    */

    #btnWhatsapp {
        bottom: 32px;
        right: 32px;
        width: 50px;
        height: 50px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
    }

    .btnDashboardCliente {
        width: 36px;
        top: 80px;
        margin-top: 45px;
        margin-right: 5px;
    }

}

/* Large-Desktop */
@media only screen and (min-width: 1400px) {
    #logo {
        max-width: 300px;
    }

    .footer {
        display: inherit;
    }

    .noMobile {
        display: initial;
    }

    .onlyMobile {
        display: none;
    }

    /*  */
    .divResp {
        width: calc(50% - 2px);
        max-width: 350px;
        padding: 10px;
        margin: 10px;
    }

    /* btn Chiudi Popup */
    .btnClosePopup {
        position: absolute;
        top: 5px;
        right: 11px;
    }

    /* btn x Download App
    #btnDownloadApp {
        display: block;
    }    */

    #btnWhatsapp {
        bottom: 32px;
        right: 32px;
        width: 50px;
        height: 50px;
    }

    /* overflow x Menu mobile */
    .overflow-menu-mobile {
    }

/*
    .navbar-expand-xl {
        -ms-flex-flow: row nowrap;
        flex-direction: row;
        flex-wrap: nowrap;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }*/

    .navbar-expand-2xl {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .navbar-expand-2xl .navbar-nav {
        flex-direction: row;
    }
    .navbar-expand-2xl .dropdown-menu {
        position: absolute;
    }
    .navbar-expand-2xl .nav-link {
        padding-right: .5rem;
        padding-left: .5rem;
    }
    .navbar-expand-2xl > .container {
        flex-wrap: nowrap;
    }
    .navbar-expand-2xl .navbar-collapse {
        display: flex!important;
        flex-basis: auto;
    }
    .navbar-expand-2xl .navbar-toggler {
        display: none;
    }

    .btnDashboardCliente {
        width: 46px;
        top: 90px;
        margin-top: 60px;
        margin-right: 5px;
    }

}

/* ---------------------------
   ----- FINE RESPONSIVE -----
   --------------------------- */
   

   
/* ------------------
   ----- SWITCH -----
   ------------------ */

/* IMPORTANT: These Sass variables are defined in Bootstrap's variables.scss. You should import that file first, then remove these. */
$font-size-base: 1rem;
$font-size-lg: ($font-size-base * 1.25);
$font-size-sm: ($font-size-base * .875);
$input-height: 2.375rem;
$input-height-sm: 1.9375rem;
$input-height-lg: 3rem;
$input-btn-focus-width: .2rem;
$custom-control-indicator-bg: #dee2e6;
$custom-control-indicator-disabled-bg: #e9ecef;
$custom-control-description-disabled-color: #868e96;
$white: white;
$theme-colors: ('primary': #08d);

/* These variables can be used to customize the switch component. */
$switch-height: calc(#{$input-height} * .8) !default;
$switch-height-sm: calc(#{$input-height-sm} * .8) !default;
$switch-height-lg: calc(#{$input-height-lg} * .8) !default;
$switch-border-radius: $switch-height !default;
$switch-bg: $custom-control-indicator-bg !default;
$switch-checked-bg: map-get($theme-colors, 'primary') !default;
$switch-disabled-bg: $custom-control-indicator-disabled-bg !default;
$switch-disabled-color: $custom-control-description-disabled-color !default;
$switch-thumb-bg: $white !default;
$switch-thumb-border-radius: 50% !default;
$switch-thumb-padding: 2px !default;
$switch-focus-box-shadow: 0 0 0 $input-btn-focus-width rgba(map-get($theme-colors, 'primary'), .25);
$switch-transition: .2s all !default;

.switch {
  font-size: $font-size-base;
  position: relative;

  input {
    position: absolute;
    height: 1px;
    width: 1px;
    background: none;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    padding: 0;

    + label {
      position: relative;
      min-width: calc(#{$switch-height} * 2);
      border-radius: $switch-border-radius;
      height: $switch-height;
      line-height: $switch-height;
      display: inline-block;
      cursor: pointer;
      outline: none;
      user-select: none;
      vertical-align: middle;
      text-indent: calc(calc(#{$switch-height} * 2) + .5rem);
    }

    + label::before,
    + label::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: calc(#{$switch-height} * 2);
      bottom: 0;
      display: block;
    }

    + label::before {
      right: 0;
      background-color: $switch-bg;
      border-radius: $switch-border-radius;
      transition: $switch-transition;
    }

    + label::after {
      top: $switch-thumb-padding;
      left: $switch-thumb-padding;
      width: calc(#{$switch-height} - calc(#{$switch-thumb-padding} * 2));
      height: calc(#{$switch-height} - calc(#{$switch-thumb-padding} * 2));
      border-radius: $switch-thumb-border-radius;
      background-color: $switch-thumb-bg;
      transition: $switch-transition;
    }

    &:checked + label::before {
      background-color: $switch-checked-bg;
    }

    &:checked + label::after {
      margin-left: $switch-height;
    }

    &:focus + label::before {
      outline: none;
      box-shadow: $switch-focus-box-shadow;
    }

    &:disabled + label {
      color: $switch-disabled-color;
      cursor: not-allowed;
    }

    &:disabled + label::before {
      background-color: $switch-disabled-bg;
    }
  }

  /* Small variation */
  &.switch-sm {
    font-size: $font-size-sm;

    input {
      + label {
        min-width: calc(#{$switch-height-sm} * 2);
        height: $switch-height-sm;
        line-height: $switch-height-sm;
        text-indent: calc(calc(#{$switch-height-sm} * 2) + .5rem);
      }

      + label::before {
        width: calc(#{$switch-height-sm} * 2);
      }

      + label::after {
        width: calc(#{$switch-height-sm} - calc(#{$switch-thumb-padding} * 2));
        height: calc(#{$switch-height-sm} - calc(#{$switch-thumb-padding} * 2));
      }

      &:checked + label::after {
        margin-left: $switch-height-sm;
      }
    }
  }

  /* Large variation */ 
  &.switch-lg {
    font-size: $font-size-lg;

    input {
      + label {
        min-width: calc(#{$switch-height-lg} * 2);
        height: $switch-height-lg;
        line-height: $switch-height-lg;
        text-indent: calc(calc(#{$switch-height-lg} * 2) + .5rem);
      }

      + label::before {
        width: calc(#{$switch-height-lg} * 2);
      }

      + label::after {
        width: calc(#{$switch-height-lg} - calc(#{$switch-thumb-padding} * 2));
        height: calc(#{$switch-height-lg} - calc(#{$switch-thumb-padding} * 2));
      }

      &:checked + label::after {
        margin-left: $switch-height-lg;
      }
    }
  }

  + .switch {
    margin-left: 1rem;
  }
}
   
/* -----------------------
   ----- FINE SWITCH -----
   ----------------------- */