@import 'https://fonts.googleapis.com/css?family=Poppins';

.nubelfon-body{
	background-color: var(--nubelfon-body-background);
}
/*GENERAL*/
a{
	text-decoration:none;
}

.font-weight-bold{
	font-weight: bold;
}

.noHover{
    pointer-events: none;
}
.yesHover{
    pointer-events:all;
}

 /****  floating-Lable style start ****/
.floating-label { 
	position:relative; 
  }

  .floating-input{
	display:block;
	width:100%;
	background-color: transparent;
	border:none;
    font-size: 0.9rem;
    font-weight: 400;
    /*color: #212529;*/
    border: 1px solid #ced4da;
    border-radius: 0rem;
  }
  
  .floating-select {
	display:block;
	width:100%;
	/*background-color: transparent;*/
	border:none;
    font-size: 0.9rem;
    font-weight: 400;
    /*color: #212529;*/
    border: 1px solid #ced4da;
    border-radius: 0rem; 
  }

  .floating-input:focus , .floating-select:focus {
	   outline:none;
  }
  .floating-input:focus{
	margin-left:30px;
  }
  .f-label {
	/*color:#999; */
	color:#686b6f;
	font-weight:normal;
	position:absolute;
	pointer-events:none;
	left: 25px;
    bottom: 20px;
	font-size: small;

  }
  
  .show select, option {
	  text-align:right; 
	    
  }
  
  .floating-textarea {
	 min-height: 30px;
	 max-height: 260px; 
	 overflow:hidden;
	overflow-x: hidden; 
  }
  
  .floating-select:focus ~ .f-label, .floating-select:not([value=""]):valid ~ .f-label {
	left:60px;
	top:5px;
	font-size:40px;
  }

  /****  floating-Lable style end ****/

	html{
		/* background-color:white; */
		height: 100%;
		background: url('../images/background/pattern-1.svg') no-repeat center bottom fixed; 
		background-position-x: center;
		background-position-y: bottom;
		background-size: initial;
		background-repeat-x: no-repeat;
		background-repeat-y: no-repeat;
		background-attachment: fixed;
		background-origin: initial;
		background-clip: initial;
		background-color: initial;
		background-size: cover;
		font-family:'Poppins',sans-serif, 'Calibri' !important;
}


	body{
		padding-top: 70px;
		height: 100%;
		-webkit-font-smoothing: subpixel-antialiased;
	}

	.panel{
		border-color: #d3e0e9;
		margin-bottom: 22px;
		background-color: #fff;
		border: 1px solid transparent;
		border-radius: 4px;
		-webkit-box-shadow: 0 1px 1px rgb(0 0 0 / 5%);
		box-shadow: 0 1px 1px rgb(0 0 0 / 5%);
	}

	.panel-default{
		background-color:white;
		border-color:#6e6e6e;
	}
	.panel-heading{
		padding:0px 15px 0px 15px;	
		background-color:var(--nubelfon-tables-body);
	}

	.scroll-header{
		padding:0px 15px 0px 15px;
	}
	.scroll-tail{
		padding:0px 15px 0px 15px;
	}

	.scroll-body{
		padding:0px 15px 0px 15px;	
	}

	.scroll-tableH{ /* scrollable table header */
		margin: 0px 0px 0px 0px !important;
		border-bottom: 2px solid currentColor;
	  }
	  .scroll-tableB{ /* scrollable table body */
		margin: 0px 0px 0px 0px !important;
	  
	  }
	  .scroll-tableT{ /* scrollable table tail */
		margin: 0px 0px 0px 0px !important;
	  
	  }
	  .scroll-tableB > :not(:first-child) { /* scrollable table body */
		border-top: 0px solid currentColor !important;
	  }
	  .scroll-tableH > :not(:first-child) { /* scrollable table body */
		border-top: 0px solid currentColor !important;
	  }

	.card-header{
		background-image: linear-gradient(var(--nubelfon-titles), var(--nubelfon-filters),var(--nubelfon-tables-total));
		/*background-color: #6e6e6e !important;*/
		color:var(--nubelfon-text-dark);
		border-bottom: 1px solid #0000002d;
	}
	.card-header>div.row{
		align-items: center;
	}

	.card-body{
		background-color: var(--nubelfon-tables-body);
	}

	/*pensat per fer headers flotants arrodonits*/
    .top-round{
		border-radius: calc(1.25rem - 1px) calc(1.25rem - 1px) 0 0 !important;
	}
	.card-subheader {
		text-decoration: underline;
		padding: 0.5rem 1rem 0rem 1rem;
		margin-bottom: 0;
		/* background-color: var(--nubelfon-filters) !important; */
		color: black;
	}

	/*Modal*/
	.modal-header{
		background-image: linear-gradient(var(--nubelfon-titles), var(--nubelfon-filters),var(--nubelfon-tables-total));
		/*background-color: #6e6e6e !important;*/
		color:var(--nubelfon-text-dark);
		border-bottom: 1px solid #0000002d;
	}
	.modal-body{
		background-color: var(--nubelfon-tables-body);
	}
    
	.modal-footer{
		background-image: linear-gradient(var(--nubelfon-titles), var(--nubelfon-filters),var(--nubelfon-tables-total));
		/*background-color: #6e6e6e !important;*/
		color:var(--nubelfon-text-dark);
		border-bottom: 1px solid #0000002d;
	}

	.allscreen{
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
	} 
	/*LAYOUT APP NAVBAR*/
	#app{
		padding-bottom:50px;
	}
	.panel-vista{ 
	padding-top: 82px !important;
	}

	.navbar{
		background-color:#3278bc !important;
		/* overflow: hidden; */
	}
	  
	.navbar:before {
		content: "";
		position: absolute;
		top: 0;
		left: -100%;
		width: 200%;
		height: 100%;
		background-image: url('/images/background/cloudy-sky.jpg');
		background-size: cover;
		opacity:0.3;
		animation: moverNubes 30s linear infinite; 
	}
	
	@keyframes moverNubes {
		0% { left: -100%; }
		50%{ left: -50%; }
		100% { left: -100%; }
	}
	/* nav.navbar > * ul{
		background-color:#3278bc !important;
	} */

	/* Estilos para todos los submenús incluido el primero */
	ul.navbar-nav .dropdown-toggle[aria-expanded="true"] ~ ul.dropdown-menu {
		/* Estilos para los submenús */
		color: #000;
		background-color: #56a8f0 !important;
	}
	
	/* Estilos para los submenús alternos (a partir del segundo submenú) */
	ul.navbar-nav .dropdown-toggle[aria-expanded="true"] ~ ul.dropdown-menu ul.dropdown-menu:nth-child(even) {
		background-color: #009dff;
		width: fit-content;
		/* padding-left:1rem; */
	}
	
	/* Estilos para los submenús alternos (a partir del tercer submenú) */
	ul.navbar-nav .dropdown-toggle[aria-expanded="true"] ~ ul.dropdown-menu ul.dropdown-menu:nth-child(odd) {
		background-color: #3278bc; /* Color alternativo para los siguientes submenús */
		width: fit-content;
		/* padding-left:1rem; */
	}

	nav.navbar > * a{
		position:relative;
		z-index: 2;
	}

	.nubel-nav-links{
		color: #ffffff !important;
		font-weight: 400;
		letter-spacing: .1rem;
		text-decoration: none;
		text-transform: uppercase;
	}

	.dropdown-menu{
		border: 1px solid #009bdf;
		border-top-color: #009bdf;
		border-top-style: solid;
		border-top-width: 1px;
		border-right-color: #009bdf;
		border-right-style: solid;
		border-right-width: 1px;
		border-bottom-color: #009bdf;
		border-bottom-style: solid;
		border-bottom-width: 1px;
		border-left-color: #009bdf;
		border-left-style: solid;
		border-left-width: 1px;
		border-image-source: initial;
		border-image-slice: initial;
		border-image-width: initial;
		border-image-outset: initial;
		border-image-repeat: initial;
		width:fit-content;
		height:fit-content;
		padding-top:0px;
		padding-bottom:0px;
	}
	/*SUBMENU MARCAT*/
	.dropdown-menu :focus{
		background-color: #a2d4ff !important;
	}
	.responsive-image-welcome{
		width:800px;
	}

	.responsive-image-login{
		width:250px;
	}

	.titulos-welcome{
		font-size:1.5em;
	}
	#logo-menu{
		position:relative;
		width:90px;
		margin-top:-5px;
		margin-bottom:5px;
		margin-right:20px;
		z-index:5;
	}

	#top-menu li a:hover{
		/*color:red;*/
		background-color:#a2d4ff !important;
		color:rgb(0, 0, 0) !important;
		font-weight:600;
	}

	#top-menu li.active a{
		/*color:red;*/
		background-color:#009bdf !important;
		/* background-color:var(--light-clr); */
		color:rgb(0, 0, 0);
		font-weight:600;
	}
	.navbar-right{
		float:right!important;margin-right:-15px
	}
	.navbar-right li a:not(.no-hover):hover {
		background-color:#a2d4ff !important;
		color:#000000 !important;
		font-weight:600;
	}
	.navbar-right li.active a{
		background-color:#009bdf !important;
		color:rgb(0, 0, 0);
		font-weight:600;
	}
	
	/*FACT*/
	.fact-dload-icon{
		width:2rem;
	}

	/*FORM CREAR FACTURES*/


	#enviat{
		width:3vw;
		font-size:11px !important;
	}
	#enviat option{
		font-size:8px !important;

	}
	.form_h>select{
		margin-left:.3vw;
		margin-right:.3vw;
	}
	.form_h>input{
		margin-left:.3vw;
		margin-right:.3vw;
	}
	/*DATEPICKER*/
	.datetimepicker1{
		width:57px;
	}
	/*DATEPICKER END*/

	/*FORM CERCA FACTURES*/
	/*inputs*/
	.card.cerca>div>.md-form{
		display:inline-flex !important;
	}

	/*SEVEIS*/
	.servicio-bonos{
		padding:0.5rem 0.5rem;
	}
	.terminos{
		padding:0.5rem 0.5rem;
	}
	/*PREFACT*/

	/*PREFACTURA*/
	.prefact-table tbody td, .prefact-table thead th{
		font-size:.9rem;
	}
	.scrollable{
        max-height:500px;
        overflow:auto;
    }
	.prefact-total-table > *{
		background-color:var(--nubelfon-tables-total) !important;
	}
    .headerLinia {
    background-color: lightgrey;
    font-size: 11px; height:12px;text-align: left;
    font-weight: bold;
    color: black;
    }
    .totalLinia {
    background-color: lightgrey;
    font-size: 11px; height:12px;text-align: left;
    font-weight: bold;
    color: black;
    }
    .tarifa {
        background-color: lightblue;
        font-size: 10px; height:10px;text-align: left;
        padding: 2px;
        /*text-indent: 6px;*/
        line-height: 10px;
        font-weight: normal;
    	color: black;
    }
	tr.tarifa td:first-child{
		padding-left:20px;
	}




	tr.active.dadesfact{
		font-size: .9rem;
	}
	

	/*TOTALS*/
	tr.totals-comi{
		background-color:var(--nubelfon-tables-total);
		font-weight: 800;
	}

	.totals-fact{
		background-color:#f7fbff; 	
		font-size:.8rem;
		color: black;
		font-weight: 800;
		box-shadow:unset ;
	}
	tr.totals-fact{
		border-bottom:hidden;
		background-color:var(--nubelfon-tables-total);
		
	}
	.totals-fact td {
		text-align: right !important; /* Alinea todos los td a la derecha */
	}
	  
	tr.totals-fact td:nth-child(-n+2) {
		text-align: left !important;  /* Excepto el primer td, que se alinea a la izquierda */
	}

	.table-totals-fact{
		table-layout: fixed;
		width:100%;
		/*border:1px solid black !important;*/
	}

	tr.dadesfact:hover{
		background-color:#d9edf7 !important;
	}

	/*generic*/
	.card.cerca>div>div>tr>td>input{
		float:left !important;
		margin-right:1vw;
		width:10vw !important;
	}

	/*submit*/
	.card-button{
		font-size:1rem;
		font-weight:bold;
		color:orange;
	}

	#buscar_button{
		width:auto;
		padding:2px 6px;
	}
	#cercaCalls{
		position: relative;
		display: block;
		margin: 0 auto;
		height:auto;
		width:90%;
		font-size:.7vw;
		padding-left:.5vw;
		padding-right:.5vw;
	}
	/*SCROLL*/
	#button-scrollup{
	color:white !important;
	display: none; /* Hidden by default */
	z-index: 9999;
	/*z-index: 99; /* Make sure it does not overlap */
	border: none; /* Remove borders */
	outline: none; /* Remove outline */
	background-color: grey;  /*Set a background color #3097d1*/
	color: white; /* Text color */
	cursor: pointer; /* Add a mouse pointer on hover */
	/*Some padding */
	padding-top:2px;
	padding-bottom:4px;
	padding-left:8px;  
	padding-right:8px;
	/*margin-top:1vh;*/
	position:fixed;
	bottom:10vh;
	right:5vw;
	border-radius: 5px; /* Rounded corners */
	/*line-height: 3vh;*/
	/*font-size: 2vh;  Increase font size */
	-size:20px;
	}
	#button-scrollup.span.glyphicon{
	color:white !important;
	z-index: 9999;
	font-size:20px;
	}
	#button-scrollup:hover { z-index: 9999;
	background-color: red; /* Add a dark-grey background on hover */
	}
	#button-scrollup>span{
		z-index: 9999;
		color: white !important;
		vertical-align: middle; 
	}
	/*CHECK BUTTON*/
	a.check-button.flex-min{
		text-decoration: none;
		color: inherit;
		border:1px solid black !important;
		height:45%;
	}
	a.check-button.flex-min:hover{
		color: white;
		background-color: green !important;
	}
	a.check-button:hover i {
		color: white;
		background-color: green;
	}

	.nohover{
		background-color:#FFFFFF;
	}

	.nohover td{
		background-color:#FFFFFF;
	}
	.descargas-modal{
		font-size:.6vw;
		margin:0 !important;
	}

	.descargas-li {
		line-height: 10px;
	}

	.descargas-modal p{
	text-align:center;
	}
	/*PERFIL*/
	div.client{
		background-color:var(--nubelfon-tables-body);
	}

	.active-tab-btn {
		background-color: var(--nubelfon-body-light); /* Color del botón activo (puedes cambiarlo) */
		color: var(--nubelfon-text-dark);
	}

	button.top-menu-tab{
		border-box:unset;
		border-sizing:unset;
		border:unset;
		border-top-right-radius: 5%;
		border-top-left-radius: 5%;
	}

	button.top-menu-tab:hover{
		background-color:#009bdf;
		color:white;
	}

	/*SIDEBAR*/
	.sidebar {
		width: 215px;
		padding: 15px;
		background-color: var(--nubelfon-tables-body);
		height:100%;
	}
	.content {
		flex: 1;
	}
	.sidebar a {
		display: block;
		margin: 10px 0;
		text-decoration: none;
		color: var(--nubelfon-text-dark);
	}
	.sidebar a.active {
		font-weight: bold;
	}

	/*FACTURES CLIENT*/

	.dd-descargas{
		padding:0px !important;
	}
	.responsive-show{
		display:none;
	}

	.ampletotal{
		width:100%;
	}

	.busqueda-hide>div>input{
		width: 100%;
		text-align:left;
		display: block;
		float:right;
	}

	.totals-hide{
		width: 100%;
		text-align:center;
		display: none;
	}

	.width100{
		width:100%;
	}

	.width100>tr>td{
		width:100%;
	}
	.width100>tr{
		width:100%;
	}

	#items{
		padding:3px;
		display:inline;
		font-size:.7vw;
	}

	#items2{
		padding:3px;
		display:inline;
		font-size:.7vw;
	}
	/*PAGINACIO*/
	.paginacio{
		font-size:.6vw;
	}
	.paginacio>form{
		padding-left:1vw;
		font-size:.6vw;
	}
	/*SELECTED PAGE COLOR*/
	ul.pagination>li.page-item[aria-current]:is([aria-current="page"])>span.page-link {
		color:white !important;
		background-color: #3490dc !important;
		font-weight: bold;
	  }
	
	ul.pagination{
		margin-top:1rem !important;
	}
	  /*Ordres de venta*/

	/*Footer*/
	footer{
		margin-top:200px;
		margin-bottom:250px;
		/*border-top:1px solid black;
		border-left:1px solid black;
		border-right:1px solid black;
		border-bottom:1px solid black;
		border-color: #d3e0e9;
		border-top-color: rgb(211, 224, 233);
		border-right-color: rgb(211, 224, 233);
		border-bottom-color: rgb(211, 224, 233);
		border-left-color: rgb(211, 224, 233);*/
		margin: auto auto 0 auto;
		width:100%;
	}
	table#footer{
		width:100%;
	}/* BUIT
	table#footer>tbody>tr{

	}
	*/

	.TotalFacturasTable>tr{
		background-color:var(--nubelfon-tables-total);
	}

	table#footer>tbody>tr>td{
		border-collapse: collapse;
	}

	.padding-right{
		padding-right:20px;
	}

	.padding-left{
		padding-left:20px;
	}
	/*BORDER TAULES*/
	.border-right{
		border-right:3px solid #908b8b61;
	}

	.border-left{
		border-left:3px solid #908b8b61;
	}


	.footer-social{	
		margin-left:.5vw;
		margin-right:.5vw;
		height:40px;
	}

	#footer-copyright{
		font-size:14px;
		/*background-color:#0c6bb6;*/
		text-align:center;
	}


	/*WELCOME PAGE*/
	.errorText {
		color: red;
	}

	/*TEXT AREA INSERTS*/
	.textinput {
		width: 100%;
		min-height: 20vh;
		outline: none;
	}
	.align-right{
		text-align:right !important;
	}
	/*USUARIS*/
	table#taula_usuaris{
		width:90%;
		padding-top:0px;
		margin-top:0px;
		border-collapse: collapse;
		position: relative; 
		margin-left:20px;
		margin-right:20px;
	}

	#taula_usuaris tbody tr td{
		height:400px;
		padding-top:0px;
		margin-top:0px;
		vertical-align:top;
	}

	#taula_usuaris tbody tr td:nth-child(1) {
	width:35%;
	margin-right:10px;
	}

	#taula_usuaris tbody tr td:nth-child(2) {
	width:65%;
	}

	label{
		font-weight: 300 !important;
		font-size:14px;
	}

	.uploadfile{
		background-color:#3097d1 !important;
		background:#3097d1 !important;
		color:white !important;
		border:2px solid black;
	}

	.table_ino_modal td{
		width:50%;
		padding-bottom: .5em;
	}

	.table_ino_modal th{
		width:25%;
		padding-bottom: .5em;
	}

	.hide{
		display: none;
	}
/* GENERAL */
:root{
	--nubelfon-titles:#F3F3F3;
	--nubelfon-filters:#E3E3E3;
	--nubelfon-tables-body:#F3F3F3;
	--nubelfon-tables-total:#E3E3E3;
	--nubelfon-text-dark:#000000;
	--nubelfon-text-light:#FFFFFF;
	--nubelfon-body-dark:#000000;
	--nubelfon-body-background:#F3F3F3;
	--nubelfon-body-light:#FFFFFF;
	--nubelfon-brand-color:#009CDE;
	--nubelfon-dark-color:#0078ab;
	--error-clr:#ab130b;
	--error-clr-hover:#F9423A;
	--warning-clr:#FFCD00;
	--primary-clr:#009cde;
	--light-clr:#12b9ff;
	--dark-clr:#0078ab;
	--secondary-clr:#c1c6cb;
	--tertiary-clr:#9cde00;
	}
/*TABLES*/
.nf_list_table {
	border-collapse: collapse;
	margin: 0;
	/*width: 100%;*/
	table-layout: auto;
  }
  
  .nf_list_table caption {
	font-size: 1.4em;
  }
  
  /*#myTable tr {
   
   }
  */
  .nf_list_table th,
  .nf_list_table td {
	text-align: left;
  }
  
  .nf_list_table th {
	
	letter-spacing: .1em;
	text-transform: uppercase;
  }
	.error-clr{
		background-color:var(--error-clr) !important;
	}
	.btn-no-style{
		background: none;
		color: inherit;
		border: none;
		padding: 0;
		font: inherit;
		cursor: pointer;
		outline: inherit;
	}
	.btn-link-nubelfon {
		font-weight: 400;
		color: var(--nubelfon-dark-color) !important;
		/* text-decoration: underline; */
	}

/* Filters css */
	.filters{
		display:block;
		background-color:var(--nubelfon-filters);
	}
	
	.filters-button{
		font-size:1.1rem;
		color:var(--nubelfon-text-dark);
	}

	.filters-button:hover{
		font-size:1.1rem;
		color:var(--nubelfon-brand-color)!important;
	}

	button.filter{
		padding-left:0px !important;
		padding-right:0px !important;
	}
	/* .filters-hr{
		margin:0px;
		padding:0px;
	} */
	.generar{
		display:none;
		background-color:var(--nubelfon-filters);
	}

	.form-floating > .form-select {
		padding-top: 10px;
	}
	
	.form-floating > .form-control.form-floating > select.form-control.form-select.floating-select.show{
		height: calc(2.5rem + 2px);
	}
	
	div.floating-label > select.form-control.form-select.floating-select.show {
		height: calc(2.5rem + 2px);
	}
	
	.form-floating > .form-control, .form-floating > .form-select {
		height: calc(2.5rem + 2px);
	}

	div.floating-label > .form-control.form-floating > .form-select {
		height: calc(2.5rem + 2px);
	}
	/*DESPLEGABLE TABLERO*/
	.floating-label > select.form-control.form-select.floating-select.centered.show {
		height: 2rem !important;
	}

	.buscarbutton{
		background-color:var(--nubelfon-dark-color);
		text-decoration:none !important;
		color:var(--nubelfon-text-light);
	}
	.buscarbutton:hover{
		border-color:var(--primary-clr) !important;
		background-color:var(--nubelfon-brand-color) !important;
		color:var(--nubelfon-text-light);
		text-decoration:none !important;
	}
	.buscarbutton * :hover{
		background-color:var(--dark-clr) !important;
		text-decoration:none !important;
		color:var(--nubelfon-text-light);
	}

	.cleanbutton{
		background-color:var(--error-clr);
		text-decoration:none !important;
		color:var(--nubelfon-text-light);
	}
	.cleanbutton:hover{
		border-color:var(--error-clr) !important;
		background-color:var(--error-clr-hover) !important;
		color:var(--nubelfon-text-light);
		text-decoration:none !important;
	}
	.cleanbutton * :hover{
		background-color:var(--dark-clr) !important;
		text-decoration:none !important;
		color:var(--nubelfon-text-light);
	}
	/*IMPORTS HEADER CSS*/
	.imports{
		display:none;
	}

	/*DROPDOWN MULTI*/
		.bootstrap-select .dropdown-toggle .filter-option .filter-option-inner .filter-option-inner-inner{
			overflow: hidden !important;
			text-overflow: ellipsis;
			white-space: nowrap;
			width: 100% !important; /* Asegura que el ancho sea 100% del contenedor */
		}

		div.centered.form-floating>div.dropdown.bootstrap-select.show-tick{
			height: calc(2rem) !important;
		}
	
		div.dropdown.bootstrap-select.show-tick{
			width:100% !important;
			border: 1px solid #ced4da !important;
			height: calc(2.5rem + 2px);
			border-radius: 0.25rem;
			background-clip: padding-box;
			transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
			transition-property: border-color, box-shadow;
			transition-duration: 0.15s, 0.15s;
			transition-timing-function: ease-in-out, ease-in-out;
			transition-delay: 0s, 0s;
		}

		div.dropdown.bootstrap-select{
			width:100% !important;
			border: 1px solid #ced4da !important;
			height: calc(2.5rem + 2px);
			border-radius: 0.25rem;
			background-clip: padding-box;
			transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
			transition-property: border-color, box-shadow;
			transition-duration: 0.15s, 0.15s;
			transition-timing-function: ease-in-out, ease-in-out;
			transition-delay: 0s, 0s;
		}

		select.selectpicker+button{
			/*font-family:'Poppins', 'Calibri' !important;
			font-size:.7rem !important;
			color:#212529 !important;*/
			height: 100%;
			/*position: absolute;*/
			bottom: 0 !important;
			left: 0;
			/*padding: 1rem 0.75rem;
			transform-origin: 0 0;
			transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
			display: inline-block;*/
		}
		select.selectpicker+button>div>div>div.filter-option-inner-inner{
			height: 100%;
			display: inline-block;
			bottom: 0;
			position: absolute;
			left: 0;
			padding: 1rem 0.75rem;
			transform-origin: 0 0;
			transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
		}

		div.form-floating.centered>div.bootstrap-select>select.selectpicker+button+div>div>ul>li>a{
			font-size:.8rem;
		}

		/* div.form-floating.centered>div.bootstrap-select>select.selectpicker+button>div>div>div.filter-option-inner-inner{
			bottom: 6px !important;
			font-size:.8rem !important;
		} */
		div.form-floating>div.bootstrap-select>select.selectpicker+button>div>div>div.filter-option-inner-inner{
			bottom: 6px !important;
			font-size:.8rem;
		}


		/* Filters */

		.form-flex{
			display: inline-flex;
			align-items: center;
			width:auto !important;
		}
		.form-flex >div{
			padding-right: calc(var(--bs-gutter-x) * 0.4);
			padding-left: calc(var(--bs-gutter-x) * 0.4);
		}
		.flex-min{
			flex: 0 0 0%;
		}
		.flex-half{
			flex: .5 1 0;
		}
		.flex-2{
			flex: 2 1 0;
		}
		.flex-1_5{
			flex: 1.5 1 0;
		}

	/* NORMAL DISPLAY TABLE */
	.table > :not(caption) > * > * {
		padding: 0.5rem 0.5rem;
		background-color: var(--bs-table-bg);
		border-bottom-width: 1px;
		box-shadow: transparent !important;
		}

	/* for stacking icons */
	.stack{
		position: relative;
		top: 0;
		left: 0;
	}
	.stack1{
		position: relative;
		bottom: 5px;
		left: 3px;
	}
	.stack2{
		position: absolute;
		left: 0px;
	}
	.stack3{
		position: relative;
		left: 0px;
		bottom: 0px;
	}

    .stackToggle{
		position: relative;
		top: 0;
		left: 0;
	}
	.stack1Toggle1{
		position: relative;
		top: -1px;
		right: 5px;
        font-size:0.6rem;
        color:white;
	}
	.stack1Toggle2{
		position: relative;
		top: -1px;
		left: 5px;
        font-size:0.6rem;
        color:white;
	}
	.stack2Toggle{
		position: absolute;
		left: 0px;
        top:0px;
        font-size:1.6rem;
	}
	.stack3Toggle{
		position: relative;
		left: 0px;
		bottom: 0px;
	}
    
	/*SELECT DESELECT SELECTPICKER BUTTON*/
	.bs-select-all{
		border:1px solid black;
	}
	.bs-select-all:hover{
		background-color:var(--dark-clr) !important;
		border-color:var(--primary-clr) !important;
		border-top:1px var(--primary-clr) solid !important;
		border-left:1px var(--primary-clr) solid !important;
		border-bottom:1px var(--primary-clr) solid !important;
		border-right:1px var(--primary-clr) solid !important;
	}


	.bs-deselect-all{
		border:1px solid black;
	}
	.bs-deselect-all:hover{
		background-color:var(--dark-clr) !important;
		border-color:var(--primary-clr) !important;
		border-top:1px var(--primary-clr) solid !important;
		border-left:1px var(--primary-clr) solid !important;
		border-bottom:1px var(--primary-clr) solid !important;
		border-right:1px var(--primary-clr) solid !important;
	}

	/*icon button remove filter icon stack*/
	.icon-container {
		position: relative;
		display: inline-block;
	}
	
	.icon-container .icon-1 {
		font-size: 1.5rem; /* Ajusta el tamaño del icono si es necesario */
		position: relative;
	}
	
	.icon-container .icon-2 {
		font-size: 1.8rem; /* Ajusta el tamaño del icono si es necesario */
		position: absolute;
		/* top: 0; Ajusta la posición según sea necesario */
		right: -1px;
		/* left: 0; */
		bottom:0px; /* Ajusta la posición según sea necesario */
		color: red; /* Cambia el color si es necesario */
	}
	
	/*TAULELL*/
	.caixaResum{
		float:left;
		margin-top:20px;
		position:relative;
		/*background: white;*/
		color: var(--primary-clr);
		width: 24%;
		margin-right:1%;
		/*min-width:50px;*/
		min-height: 80px;
		box-shadow: 10px 10px 0 rgba(0, 0, 0, .3);
		text-align: center;
		overflow:hidden;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		border:solid 1px #000;
		display:flex;
		flex-wrap:wrap;
		justify-content: center;
	}

	.caixaResumMes{
		float:left;
		position:relative;
		/*background: white;*/
		color: var(--primary-clr);
		width: 100%;
		padding-bottom:20px;
		/*height:50%;*/
		/*box-shadow: 10px 10px 0 rgba(0, 0, 0, .3);*/
		text-align: center;
		overflow:hidden;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		border:solid 1px #000;
		display:flex;
		
	}

	.caixaResumNum {
		color: var(--secondary-clr); 
		position:relative;
	  	font-size: 1.5rem;
	  	/* padding-top: 10px; */
		display:flex;
		justify-content: center;
		align-items: center;
		
	}
	.headingUltimMes{
		position:relative;
		font-size: 1rem;
		width:100%;
		background-color: var(--light-clr);
		color:white;
		/* padding-bottom: 45px;
		padding-top: 10px; */
		/*padding: 25px 0 !important;*/
		display:flex;
		justify-content: center;
    	align-items: center;
		flex-wrap: nowrap;
		border-bottom: solid 1px #000;
	}
	.blocksUltimMes {
		margin: 0 auto;
	}

	/*NOTIFICACIONS*/
	.close-button{
	border: 0px solid black !important;
    background: transparent !important;
	}

	/*ICON*/
	.mostra-amaga-icon{
		/*color:#74a500;*/
		cursor: pointer;
		font-size: 0.5vw;
		/*margin-left:4px;*/
	}


	.taulashowhidenf>thead>tr>th>button{
		font-weight:bold;
	}
	.so-description>span>span{
		font-size:0.8rem !important;
		font-family:'Poppins',sans-serif, 'Calibri' !important;
	}
	
	/*TABNAV*/
	.tab-body{
		background-color: var(--nubelfon-body-background);
	}

	.tab-background{
		background-color: var(--nubelfon-body-light);
	}
	.tab-content{
		background-color: var(--nubelfon-body-light);
	}
	.tab-content div{
		background-color: var(--nubelfon-body-light);
	}

	div.tabnav {
   		/* margin-top: 5px; */
		/* border-top:1px solid white; */
		width: fit-content;
	}
	
	div.tabnav > ul {
		text-align: left;
		padding-left: 0;
		list-style: none;
		margin:0px;
	}
	div.tabnav > ul li {
	  font: bold 14px/18px sans-serif;
	  color:var(--nubelfon-text-dark);
	  display: inline-flex;
	  position: relative;
	  padding: 10px 15px;
	  background-color:var(--nubelfon-body-background);
	  cursor: pointer;
	  -webkit-transition: all 0.2s;
	  -moz-transition: all 0.2s;
	  -ms-transition: all 0.2s;
	  -o-transition: all 0.2s;
	  transition: all 0.2s;
	}
	div.tabnav > ul > li >span{
		display: inline-block;
	  }
	div.tabnav > ul li:hover {
	  background: var(--nubelfon-brand-color);
	  color: var(--nubelfon-text-light);
	}
	div.tabnav > ul li ul {
	  padding: 0;
	  position: absolute;
	  top: 48px;
	  left: 0;
	  width: 150px;
	  display: none;
	  opacity: 0;
	  visibility: hidden;
	  
	}
	div.tabnav > ul li ul li { 
	  background: #ff0000; 
	  display: block; 
	  color: var(--nubelfon-text-dark);
	  
	}
	div.tabnav > ul li ul li:hover { 
		background-color:var(--nubelfon-body-dark);; 
	}
	
	div.tabnav > ul li:hover ul {
	  display: block;
	  opacity: 1;
	  visibility: visible;
	}

	#divLinks > div{
		background-color: var(--nubelfon-body-light) !important;
	}
	/*MENU COUNT */
	.super {
		vertical-align: super;
		font-size: smaller;
	  }

	/*ACTIVE MENUS*/
	.actived{
		background-color:var(--nubelfon-body-light) !important;
		color:var(--nubelfon-text-dark) !important;
	}
	.actived:hover{
		background-color:var(--nubelfon-brand-color) !important;
		color:var(--nubelfon-text-light) !important;
		
	}
	/*csvHeaderPicker*/
	div.csvHeaderPicker div table{
		border-collapse: collapse;
		width: 100%;
	}

	div.csvHeaderPicker div table th, 
	div.csvHeaderPicker div table td {
		border: 1px solid #dddddd;
		text-align: left;
		padding: 8px;
	}
	div.csvHeaderPicker div table th {
		background-color: #f2f2f2;
	}
	div.csvHeaderPicker div table .show select, 
	div.csvHeaderPicker div table .show select option {
		text-align: left;
	}


	/*Import INO*/
	div.importIno span{
		font-size:.9em;
	}
	div.importIno i{
		font-size:1em;
		font-weight: bold;
	}
	/*COLUMNES*/
	.col-min{
		flex: 0 0 auto;
		width: 4.333333%;
	}