:root {
	--white: #ffffff;
	--black: #36383F;
	--arancione: #00bfff;
}


body {
	background-color: var(--coloresfondo); /* Rimetto lo sfondo della pagina */
	width: 100%;
	//font-family: "Raleway", sans-serif;
	font-family: "Open+Sans", sans-serif;
	font-optical-sizing: auto;
	font-weight: 300;
	font-style: normal;
}

/* Rimuovo solo lo sfondo/blur dell'AREA del sidebar (non del sidebar stesso) */
.wrapper {
	background: transparent !important;
}

.sfondomenu {
	background-color: var(--coloremenu);
}

.sfondomenusecondario {
	background-color: var(--coloremenusecondario);
}

.coloresogliatesto,
.coloresogliatestobold {
	display: inline-block;
	color: var(--coloresoglia);
	padding: 0.02em 0.3em;
	border-radius: 4px;
	border: 1px solid var(--coloresoglia);
}

.coloresogliatestobold {
	font-weight: 600;
}

.coloreentrate,
.coloreentratebold {
	display: inline-block;
	color: var(--verde);
	padding: 0.02em 0.3em;
	border-radius: 4px;
	border: 1px solid var(--verde);
}

.coloreentratebold {
	font-weight: 600;
}

.coloreuscite,
.coloreuscitebold {
	display: inline-block;
	color: var(--rosso);
	padding: 0.02em 0.3em;
	border-radius: 4px;
	border: 1px solid var(--rosso);
}

.coloreuscitebold {
	font-weight: 600;
}

.testomenu,
.testomenu a,
.nav-item {
	color: var(--coloremenutesto);
}

.nav-item:hover {
	color: var(--coloremenutesto);
}

h1 {
	margin: 0;
	padding: 0;
}

td.noborder {
	border: 0;
}

table {
	border-collapse: collapse;
	text-align: center;
	font-size: 0.7em;
	width: 80%;
	margin: 2em auto;
}

th,
td {
	//border: 1px solid black;

}

td.totaleuscite {
	background-color: var(--rosso);
	color: #fff;
	font-weight: bold;
}

td.totaleusciteparziale {
	background-color: rgb(253, 200, 200);
	color: #000;
	font-weight: bold;
}

td.totaleentrate {
	background-color: var(--verde);
	color: #fff;
	font-weight: bold;
}

td.totaleentrateparziale {
	background-color: rgb(200, 253, 200);
	color: #000;
	font-weight: bold;
}

th,
.thcell {
	background-color: #ccc;
	font-weight: bold;
}

a.aggiungimovimento {
	border: 1px solid rgb(255, 128, 0);
	color: rgb(255, 128, 0);
	margin: 1em 0;
	display: inline-block;
	padding: 0.1em 1em;
	text-decoration: none;
	font-weight: bold;
	border-radius: 8px;
}

a.aggiungimovimento:hover {
	background-color: rgb(255, 128, 0);
	color: #fff;
}

a.gestionefornitori {
	border: 1px solid rgb(255, 0, 132);
	color: rgb(255, 0, 132);
	margin: 1em 0;
	display: inline-block;
	padding: 0.1em 1em;
	text-decoration: none;
	font-weight: bold;
	border-radius: 8px;
}

a.gestionefornitori:hover {
	background-color: rgb(255, 0, 132);
	color: #fff;
}

fieldset {
	width: 100%;
	margin: 3em auto 1em auto;
	padding: 0 0em 1em 0em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}

legend {
	margin-top: 1em;
	border-bottom: 1px solid #fff;
}

/*
fieldset legend {
	padding: 0 1em;
	text-transform: uppercase;
}
*/
label {
	display: block;
	float: none;
	clear: both;
	margin: 2em 0 0 0;
}

.warninfo {
	background-color: #f00;
	padding: 0.1em 1em;
	border-radius: 6px;
	color: #fff;
	font-size: 0.7em;
	text-transform: uppercase;
}

a.iconamodifica {
	color: #999;
	text-decoration: none;
}

a.iconamodifica:hover {
	color: #fff;
}

table#tabellafinale {
	margin: 2em auto;
	font-size: 1.7em;
	text-align: center;
	display: block;
	width: 400px;
}

a.bilancio-mensile {
	border: 1px solid #666;
}

a.bilancio-mensile:hover,
.bilancio-mensile-selezionato {
	background-color: #666;
	color: #fff;
	padding: 0.1em 1em;
	border-radius: 6px;
	border: 1px solid #666;

}

a.arretrati-da-pagare {
	border: 1px solid #f00;
}

a.arretrati-da-pagare:hover,
.arretrati-da-pagare-selezionato {
	background-color: #f00;
	color: #fff;
	padding: 0.1em 1em;
	border-radius: 6px;
	border: 1px solid #f00;

}

a.arretrati-da-incassare,
a.arretrati-da-incassare-all {
	border: 1px solid #090;
}

a.arretrati-da-incassare:hover,
.arretrati-da-incassare-selezionato,
a.arretrati-da-incassare-all:hover,
.arretrati-da-incassare-all-selezionato {
	background-color: #090;
	color: #fff;
	padding: 0.1em 1em;
	border-radius: 6px;
	border: 1px solid #090;

}

.note {
	font-size: 0.8em;
	margin: 6em 0 2em 0;
	border: 1px solid #bbb;
	color: #aaa;
	padding: 2em;
	border-radius: 20px;
}

.note h2 {
	margin: 0 0 0.8em 0;
	padding: 0;
	font-size: 1.2em;
}

.note ul {
	margin: 0 0 0 1em;
	padding: 0;
}


.bi {
	vertical-align: -.125em;
	fill: currentColor;
}

h2,
h3 {
	font-weight: normal;
}

/* RESET COMPLETO - Tutte le card usano lo stile del sidebar */
.bggrigio,
.bggrigioscroll,
.card,
.neumorphism-card,
.modern-expense-card,
.modern-patrimonio-card,
.login-card,
.logout-card,
.error-card {
	/* COPIA ESATTA dello stile .sidebar-menu-box */
	background: rgba(255, 255, 255, 0.03) !important;
	backdrop-filter: blur(25px) saturate(1.2) !important;
	-webkit-backdrop-filter: blur(25px) saturate(1.2) !important;
	border-radius: 20px !important;
	padding: 1rem 0 !important;
	margin-bottom: 1.5rem !important;
	border: 1px solid rgba(255, 255, 255, 0.05) !important;
	position: relative !important;
	overflow: hidden !important;
	color: rgba(255, 255, 255, 0.8) !important;
	
	/* Shadow identico al sidebar */
	box-shadow: 
		0 4px 20px rgba(0, 0, 0, 0.15),
		0 1px 4px rgba(0, 0, 0, 0.1),
		inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}


/* Contenuto interno delle card - padding come i menu items */
.bggrigio > *,
.bggrigioscroll > *,
.card > *,
.neumorphism-card > *,
.modern-expense-card > *,
.modern-patrimonio-card > *,
.login-card > *,
.logout-card > *,
.error-card > * {
	padding: 0.85rem 1.5rem !important;
	position: relative;
	z-index: 2;
}

/* Titoli delle card stile sidebar-menu-item */
.bggrigio h1, .bggrigio h2, .bggrigio h3,
.neumorphism-card h1, .neumorphism-card h2, .neumorphism-card h3,
.neumorphism-title {
	color: rgba(255, 255, 255, 0.95) !important;
	font-size: 0.95rem !important;
	font-weight: 500 !important;
	margin: 0 !important;
	padding: 0.85rem 1.5rem !important;
	position: relative;
	z-index: 2;
}

/* Icone nei titoli come nel sidebar */
.bggrigio h1 i, .bggrigio h2 i, .bggrigio h3 i,
.neumorphism-card h1 i, .neumorphism-card h2 i, .neumorphism-card h3 i,
.neumorphism-title i {
	width: 20px;
	height: 20px;
	margin-right: 1rem;
	color: rgba(255, 255, 255, 0.6);
	font-size: 1.1rem;
}

.coloreverde {
	color: var(--verde);
}

.sfondoverde {
	background-color: var(--verde);
}

.colorerosso {
	color: var(--rosso);
}

.sfondorosso {
	background-color: var(--rosso);
}

.colorearancione {
	color: var(--arancione);
}

.coloreazzurro {
	color: var(--azzurro);
}

.sfondoazzurro {
	background-color: var(--azzurro);
}

.coloresfondoazzurro {
	background-color: var(--azzurro);
}

#tabellabilancio {
	padding: 2em;
	width: 100%;
}

.intestazionetabella {
	padding: 2em;
	text-transform: uppercase;
}

.tabellaspectratio {
	aspect-ratio: 1.3;
	padding: 2em;
}

@media (min-width: 800px) {
	.tabellaspectratio {
		aspect-ratio: 2;
		padding: 4em;
	}
}

.areagrafico {
	width: 100%;
	float: none;
	margin: 0 auto;
	aspect-ratio: 6/4;
	padding: 2em 1em;
}

@media (min-width: 800px) {
	.areagrafico {
		width: 48%;
		margin: 1%;
		float: left;
	}
}

.tabellaspectratio2 {
	aspect-ratio: 1.3;
}

@media (min-width: 800px) {
	.tabellaspectratio2 {
		aspect-ratio: 2;

	}
}

.badgesommaverde {
	background-color: var(--verde);
	padding: 0.2em 0.8em;
	border-radius: 4px;
}

.badgesommarosso {
	background-color: var(--rosso);
	padding: 0.2em 0.8em;
	border-radius: 4px;
}

.totale-negativo {
	color: white !important;
	background-color: #dc3545 !important;
	padding: 4px 8px !important;
	border-radius: 4px !important;
}

.substringa {
	cursor: help;
}

.attiva {
	background-color: var(--verde);
	display: inline-block;
	padding: 0.2em 1em;
	border-radius: 4px;
}

a .disattiva {
	background-color: #666;
	display: inline-block;
	padding: 0.2em 1em;
	border-radius: 4px;
	color: #fff;
	text-decoration: none;
}

a .disattiva:hover {
	background-color: var(--verde);
}



/* ===============================
   SIDEBAR BOX UNICO - ESATTAMENTE COME NELL'IMMAGINE CRYPTO APP
   =============================== */

/* Container principale sidebar - COMPLETAMENTE TRASPARENTE */
body .sidebar-container,
body .sidebar-neumorphism.sidebar-container,
body #sidebar.sidebar-container {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 280px !important;
	height: 100vh !important;
	background: transparent !important;
	backdrop-filter: none !important; /* RIMUOVO IL BLUR */
	-webkit-backdrop-filter: none !important; /* RIMUOVO IL BLUR */
	transition: transform 0.3s ease !important; /* Transition per l'animazione hide/show */
	overflow-y: auto;
	overflow-x: hidden;
	padding: 1.5rem 1rem;
	border: none !important;
	box-shadow: none !important;
	z-index: 999;
}

/* Sidebar VISIBILE - regola semplificata */
#sidebar:not(.active) {
	transform: translateX(0) !important;
	transition: transform 0.3s ease !important;
}

/* Fallback per vecchio .sidebar-neumorphism senza .sidebar-container */
.sidebar-neumorphism:not(.sidebar-container) {
	min-width: 250px;
	max-width: 250px;
	background: var(--coloremenu);
	color: #fff;
	transition: all 0.3s;
	padding: 0;
}

/* Header separato e più piccolo */
.sidebar-header {
	padding: 0 0 1.5rem 0.5rem;
	border: none;
	background: transparent;
}

.sidebar-header-title {
	font-size: 1.8rem;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.95);
	margin: 0;
	letter-spacing: -0.01em;
	display: flex;
	align-items: center;
	padding-top: 4px;
}

.sidebar-header-title i {
	margin-right: 0.6rem;
	margin-left: 16px;
	color: rgba(255, 255, 255, 0.95);
	font-size: 1.2rem;
}

/* BOX MENU UNICO ARROTONDATO - Come nell'immagine */
.sidebar-menu-box {
	background: rgba(255, 255, 255, 0.03);
	backdrop-filter: blur(25px) saturate(1.2);
	-webkit-backdrop-filter: blur(25px) saturate(1.2);
	border-radius: 20px; /* ANGOLI CURVI COME NELL'IMMAGINE */
	padding: 1rem 0;
	margin-bottom: 1.5rem;
	border: 1px solid rgba(255, 255, 255, 0.05);
	position: relative;
	overflow: hidden;

	/* Shadow sottile del box */
	box-shadow: 
		0 4px 20px rgba(0, 0, 0, 0.15),
		0 1px 4px rgba(0, 0, 0, 0.1),
		inset 0 1px 0 rgba(255, 255, 255, 0.05);
}


/* VOCI MENU - Solo testo semplice, NON pulsanti */
.sidebar-menu-item {
	display: flex;
	align-items: center;
	padding: 0.85rem 1.5rem;
	color: rgba(128, 128, 128, 0.8) !important; /* GRIGIO per voci normali */
	text-decoration: none !important;
	font-size: 0.95rem;
	font-weight: 500;
	transition: all 0.3s ease;
	border-radius: 0; /* NIENTE ANGOLI - è una semplice riga */
	position: relative;
	z-index: 2;
	letter-spacing: -0.01em;
	cursor: pointer;
}

/* Icone delle voci - dimensioni normali */
.sidebar-menu-item i,
.sidebar-menu-item .bi,
.sidebar-menu-item .bi-clock-fill,
.sidebar-menu-item .bi-wallet2,
.sidebar-menu-item .bi-speedometer2,
.sidebar-menu-item .bi-graph-up-arrow,
.sidebar-menu-item .bi-file-spreadsheet,
.sidebar-menu-item .bi-arrow-down-circle-fill,
.sidebar-menu-item .bi-arrow-up-circle-fill,
.sidebar-menu-item .bi-piggy-bank,
.sidebar-menu-item .bi-gear {
	width: 20px;
	height: 20px;
	margin-right: 1rem;
	color: rgba(128, 128, 128, 0.6) !important; /* GRIGIO per icone normali */
	font-size: 1.1rem;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-shrink: 0;
}

.sidebar-menu-item span {
	flex: 1;
	transition: all 0.3s ease;
	font-weight: 500;
}

/* Hover effect - testo e icone diventano BIANCHI */
.sidebar-menu-item:hover {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO al hover */
	background: rgba(255, 255, 255, 0.02); /* Appena percettibile */
}

.sidebar-menu-item:hover i,
.sidebar-menu-item:hover .bi,
.sidebar-menu-item:hover .bi-clock-fill,
.sidebar-menu-item:hover .bi-wallet2,
.sidebar-menu-item:hover .bi-speedometer2,
.sidebar-menu-item:hover .bi-graph-up-arrow,
.sidebar-menu-item:hover .bi-file-spreadsheet,
.sidebar-menu-item:hover .bi-arrow-down-circle-fill,
.sidebar-menu-item:hover .bi-arrow-up-circle-fill,
.sidebar-menu-item:hover .bi-piggy-bank,
.sidebar-menu-item:hover .bi-gear {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per icone al hover */
}

/* Voce attiva - BIANCO per testo e icona */
.sidebar-menu-item.active {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per voce attiva */
	font-weight: 600;
	background: rgba(0, 200, 255, 0.08);
}

.sidebar-menu-item.active i,
.sidebar-menu-item.active .bi,
.sidebar-menu-item.active .bi-clock-fill,
.sidebar-menu-item.active .bi-wallet2,
.sidebar-menu-item.active .bi-speedometer2,
.sidebar-menu-item.active .bi-graph-up-arrow,
.sidebar-menu-item.active .bi-file-spreadsheet,
.sidebar-menu-item.active .bi-arrow-down-circle-fill,
.sidebar-menu-item.active .bi-arrow-up-circle-fill,
.sidebar-menu-item.active .bi-piggy-bank,
.sidebar-menu-item.active .bi-gear {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per icone attive */
}

/* Box configurazione separato */
.sidebar-config-box {
	/* Stessi stili del menu principale */
}

/* Dropdown arrow per configurazione */
.dropdown-arrow {
	margin-left: auto;
	transition: transform 0.3s ease;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.4);
}

/* Header configurazione normale - grigio come le altre voci */
.sidebar-menu-item.dropdown-toggle {
	color: rgba(128, 128, 128, 0.8) !important; /* GRIGIO per configurazione normale */
}

.sidebar-menu-item.dropdown-toggle i:not(.dropdown-arrow) {
	color: rgba(128, 128, 128, 0.6) !important; /* GRIGIO per icona configurazione normale */
}

/* Hover per header configurazione */
.sidebar-menu-item.dropdown-toggle:hover {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO al hover */
}

.sidebar-menu-item.dropdown-toggle:hover i:not(.dropdown-arrow) {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per icona al hover */
}

.dropdown-toggle[aria-expanded="true"] .dropdown-arrow {
	transform: rotate(180deg);
	color: rgba(255, 255, 255, 0.7);
}

/* Submenu items - GRIGI per default */
.sidebar-submenu-item {
	display: flex;
	align-items: center;
	padding: 0.7rem 2rem; /* Più indentati */
	color: rgba(128, 128, 128, 0.7) !important; /* GRIGIO per submenu normali */
	text-decoration: none !important;
	font-size: 0.88rem;
	font-weight: 400;
	transition: all 0.3s ease;
	cursor: pointer;
}

.sidebar-submenu-item i,
.sidebar-submenu-item .bi,
.sidebar-submenu-item .bi-buildings,
.sidebar-submenu-item .bi-tags,
.sidebar-submenu-item .bi-credit-card-2-front,
.sidebar-submenu-item .bi-wallet2,
.sidebar-submenu-item .bi-palette {
	width: 16px;
	height: 16px;
	margin-right: 0.8rem;
	color: rgba(128, 128, 128, 0.5) !important; /* GRIGIO per icone submenu normali */
	font-size: 0.95rem;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.sidebar-submenu-item:hover {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO al hover per submenu */
	background: rgba(255, 255, 255, 0.02);
}

.sidebar-submenu-item:hover i,
.sidebar-submenu-item:hover .bi,
.sidebar-submenu-item:hover .bi-buildings,
.sidebar-submenu-item:hover .bi-tags,
.sidebar-submenu-item:hover .bi-credit-card-2-front,
.sidebar-submenu-item:hover .bi-wallet2,
.sidebar-submenu-item:hover .bi-palette {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per icone submenu al hover */
}

.sidebar-submenu-item.active {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per submenu attivo */
	font-weight: 500;
	background: rgba(0, 200, 255, 0.06);
}

.sidebar-submenu-item.active i,
.sidebar-submenu-item.active .bi,
.sidebar-submenu-item.active .bi-buildings,
.sidebar-submenu-item.active .bi-tags,
.sidebar-submenu-item.active .bi-credit-card-2-front,
.sidebar-submenu-item.active .bi-wallet2,
.sidebar-submenu-item.active .bi-palette {
	color: rgba(255, 255, 255, 1) !important; /* BIANCO per icone submenu attive */
}

/* DA SIDEBAR */
a,
a:hover,
a:focus {
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
}

.navbar {
	padding: 0.5rem 1rem;
	border: none;
	border-radius: 0;
	margin-bottom: 0;
	font-size: 0.9em;
	background: transparent !important;
	position: fixed !important; /* FIXED per stare sempre in alto */
	top: 0 !important;
	right: 0 !important;
	left: 280px !important; /* Start after sidebar */
	z-index: 1000 !important;
	height: 60px;
	width: calc(100% - 280px) !important;
}

#navbarSupportedContent ul li a {
	color: #fff;
}

#navbarSupportedContent ul li a:hover {
	background-color: #fff;
	color: #000;
}

.navbar-btn {
	box-shadow: none;
	outline: none !important;
	border: none;
}

.line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed #ddd;
	margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE - AGGIORNATO PER NEUMORPHISM
----------------------------------------------------- */

.wrapper {
	display: flex;
	width: 100%;
	min-height: 100vh;
	flex-direction: row;
	align-items: stretch; /* Stretch per altezza uguale */
	gap: 0;
	margin: 0;
	padding: 0;
}

/* FORCE trasparenza per il nuovo sistema, mantieni il vecchio per compatibilità */
#sidebar.sidebar-container,
.sidebar-container {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

/* Mantieni gli stili vecchi per le altre pagine */
#sidebar:not(.sidebar-container) {
	min-width: 250px;
	max-width: 250px;
	background: var(--coloremenu);
	color: #fff;
	transition: all 0.3s;
}

/* Sidebar nascosto - regola semplificata */
#sidebar.active {
	transform: translateX(-280px) !important;
	transition: transform 0.3s ease !important;
}

/* DESKTOP: Content normale quando sidebar è visibile - MASSIMA SPECIFICITÀ */
html body #sidebar:not(.active) ~ #content,
html body #sidebar.sidebar-container:not(.active) ~ #content {
	left: 280px !important; /* Content inizia dopo il sidebar */
	width: calc(100% - 280px) !important; /* Content ridotto */
	transition: all 0.3s ease !important;
}

/* DESKTOP: Content espanso quando sidebar è nascosto - MASSIMA SPECIFICITÀ */
html body #sidebar.active ~ #content,
html body #sidebar.sidebar-container.active ~ #content,
html body #content.sidebar-hidden,
html body.sidebar-collapsed #content {
	left: 0 !important; /* Content inizia da 0 */
	width: 100% !important; /* Content occupa tutta la larghezza */
	transition: all 0.3s ease !important;
}

/* DESKTOP: Navbar normale quando sidebar è visibile - MASSIMA SPECIFICITÀ */
html body #sidebar:not(.active) ~ #content .navbar,
html body #sidebar.sidebar-container:not(.active) ~ #content .navbar {
	left: 280px !important; /* Navbar inizia dopo il sidebar */
	width: calc(100% - 280px) !important; /* Navbar ridotta */
	transition: all 0.3s ease !important;
}

/* DESKTOP: Navbar espansa quando sidebar è nascosto - MASSIMA SPECIFICITÀ */
html body #sidebar.active ~ #content .navbar,
html body #sidebar.sidebar-container.active ~ #content .navbar,
html body.sidebar-collapsed .navbar,
html body #content.sidebar-hidden .navbar {
	left: 0 !important; /* Navbar inizia da 0 */
	width: 100% !important; /* Navbar occupa tutta la larghezza */
	transition: all 0.3s ease !important;
}


.sfondored {
	background-color: rgb(199, 0, 0);
}

.sfondogold {
	background-color: #F5BF03;
	opacity: 0.8;
	color: #000000;
}

/* DISABLE vecchi stili sidebar per evitare conflitti */
#sidebar:not(.sidebar-neumorphism) {
	min-width: 250px;
	max-width: 250px;
	background: var(--coloremenu);
	color: #fff;
	transition: all 0.3s;
}

#sidebar:not(.sidebar-neumorphism) .sidebar-header {
	padding: 20px;
	margin: 0;
}

#sidebar:not(.sidebar-neumorphism) ul.components {
	padding: 0px 0;
}

#sidebar:not(.sidebar-neumorphism) ul li a {
	padding: 10px 10px 10px 25px;
	font-size: 0.9em;
	display: block;
}

#sidebar:not(.sidebar-neumorphism) ul li a:hover {
	color: #000;
	background: #fff;
}

#sidebar:not(.sidebar-neumorphism) ul li.active>a,
#sidebar:not(.sidebar-neumorphism) a[aria-expanded="true"] {
	color: #000;
	background: #fff;
}

#sidebar:not(.sidebar-neumorphism) a[data-toggle="collapse"] {
	position: relative;
}

#sidebar:not(.sidebar-neumorphism) .dropdown-toggle::after {
	display: block;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
}

#sidebar:not(.sidebar-neumorphism) ul ul {
	margin: 0;
	padding: 0;
}

#sidebar:not(.sidebar-neumorphism) ul ul a {
	font-size: 0.9em !important;
	padding-left: 30px !important;
	color: #fff;
}

#sidebar:not(.sidebar-neumorphism) ul.CTAs {
	padding: 20px;
}

#sidebar:not(.sidebar-neumorphism) ul.CTAs a {
	text-align: center;
	font-size: 0.9em !important;
	display: block;
	border-radius: 5px;
	margin-bottom: 5px;
}

.colorenavbar {
	background-color: transparent !important;
}

/* Navbar floating per il nuovo design */
.navbar.colorenavbar {
	background: transparent !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	border-bottom: none !important;
}

#sidebarCollapse {
	background-color: transparent;
	border: 0;
	color: #fff;
}

/* ---------------------------------------------------
    CONTENT STYLE - Affiancato al sidebar
----------------------------------------------------- */

#content {
	position: absolute !important;
	top: 0 !important;
	left: 280px !important; /* Dopo il sidebar */
	right: 0 !important;
	bottom: 0 !important;
	width: calc(100% - 280px) !important;
	padding: 0;
	margin: 0;
	min-height: 100vh;
	transition: all 0.3s;
	background: transparent;
	overflow-x: hidden;
}

/* Container interno del content per il padding */
#content > .text-light > .container-fluid {
	padding: 120px 20px 20px 20px !important; /* Ancora più spazio per il titolo */
	margin: 0 !important;
	margin-top: 0 !important; /* Forza margin-top a 0 */
}

/* Override diretto del container-fluid con my-0 */
#content .container-fluid.my-0 {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 120px !important;
}

/* FORCE il titolo Dashboard a non sovrapporsi - REGOLA COMPLETA */
h1#titolopagina {
	font-weight: 200 !important;
	font-size: 1.8em !important;
	margin-top: 10px !important; /* Ridotto a 10px - molto vicino al margine */
	margin-bottom: 3rem !important; /* Equivalente a mb-5 di Bootstrap (48px) */
	padding-top: 0 !important;
	position: relative !important;
	z-index: 1 !important;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */

@media (max-width: 768px) {
	/* FORCE: Sidebar completamente nascosta in mobile quando non attiva */
	body #sidebar,
	html body #sidebar {
		margin-left: -280px !important;
		transform: translateX(0) !important;
	}

	/* FORCE: Sidebar visibile quando attiva */
	body #sidebar.active,
	html body #sidebar.active {
		margin-left: 0 !important;
		transform: translateX(0) !important;
	}

	/* CRITICAL: Content deve essere sempre espanso in mobile - OVERRIDE TUTTE LE REGOLE CON MASSIMA SPECIFICITÀ */
	html body #sidebar ~ #content,
	html body #sidebar:not(.active) ~ #content,
	html body #sidebar.active ~ #content,
	html body #sidebar.sidebar-container ~ #content,
	html body #sidebar.sidebar-container:not(.active) ~ #content,
	html body #sidebar.sidebar-container.active ~ #content,
	html body #content.sidebar-hidden,
	html body.sidebar-collapsed #content,
	html body #content {
		left: 0 !important;
		width: 100% !important;
		right: 0 !important;
		position: absolute !important;
	}

	/* Navbar deve essere sempre espansa in mobile - OVERRIDE TUTTE LE REGOLE CON MASSIMA SPECIFICITÀ */
	html body #sidebar ~ #content .navbar,
	html body #sidebar:not(.active) ~ #content .navbar,
	html body #sidebar.active ~ #content .navbar,
	html body #sidebar.sidebar-container ~ #content .navbar,
	html body #sidebar.sidebar-container:not(.active) ~ #content .navbar,
	html body #sidebar.sidebar-container.active ~ #content .navbar,
	html body.sidebar-collapsed .navbar,
	html body #content.sidebar-hidden ~ * .navbar,
	html body #content .navbar {
		left: 0 !important;
		width: 100% !important;
		right: 0 !important;
		position: fixed !important;
	}

	#sidebarCollapse span {
		display: none !important;
	}
}

/* Stili per menu verticale */
nav#menu {
	position: fixed;
	left: 0;
	top: 0;
	width: 250px;
	height: 100vh;
	background-color: var(--coloremenu);
	padding: 20px 0;
	z-index: 1000;
	overflow-y: auto;
}

nav#menu a,
nav#menu span {
	display: block;
	padding: 15px 25px;
	color: var(--coloremenutesto);
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	transition: all 0.3s ease;
}

nav#menu a:hover {
	background-color: rgba(255, 255, 255, 0.1);
	padding-left: 35px;
}

nav#menu .bilancio-mensile-selezionato,
nav#menu .arretrati-da-pagare-selezionato,
nav#menu .arretrati-da-incassare-selezionato,
nav#menu .arretrati-da-incassare-all-selezionato {
	background-color: rgba(255, 255, 255, 0.2);
	font-weight: bold;
}

/* Sposta il contenuto per fare spazio al menu fisso */
.smart-dashboard-content {
	margin-left: 250px;
}

.cartacontenitore {
	position: absolute;
	left: 0;
	top: 130px;
	width: 100%;
	z-index: 1;
	text-align: center;
	overflow: hidden;
}

.cartasfondoblur {
	background: rgba(0, 0, 0, 0.4);
	backdrop-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
	-moz-filter: blur(3px);
	-webkit-filter: blur(3px);
	margin: -10px -10px -10px 0px;
	width: 100%;
	height: 100%;
	display: block;
	line-height: 120px;
}

.cartadati {
	position: absolute;
	left: 0;
	top: 0px;
	width: 100%;
	font-size: 1em;
	text-align: left;
	padding: 1em 2em 0.2em 1.5em;
}

.cartadatiimporto {
	text-align: right;
	font-size: 1.3em;
}

.cartadatimodifica {
	text-align: left;
	font-size: 1em;
	top: 30px;
	left: 30px;
	position: absolute;
}

.circle {
	padding: 8px;
	border-radius: 50%;
	font-size: 50px;
	color: #000;
	text-align: center;
	background: #fff;
}

.circleicon {
	padding: 7px 5px;
	border-radius: 50%;
	font-weight: bold;
	color: #000;
	text-align: center;
	width: 34px;
	height: 34px;
}

/*
  .circleicon:hover {
	background: #f00;
  }
	*/
.iconaentrata {
	background-color: rgb(0, 170, 0);
	color: #fff;
}

.iconauscita {
	background-color: rgb(220, 37, 0);
	color: #fff;
}

.iconatrasferimento {
	background-color: rgb(0, 146, 194);
	color: #fff;
}

.iconapagato {
	color: rgb(0, 151, 0);
	border: 1px solid rgb(0, 151, 0);
	border-radius: 6px;
	padding: 2px 9px 2px 4px;
	white-space: nowrap;
	font-size: 0.9em;
	text-transform: uppercase;
}

.datascadenza {
	color: rgb(255, 149, 0);
}

table tr td {
	padding: 40px;
}






/* ===============================
   STILI SPECIFICI TABELLA SPESE
   =============================== */

/* Rimozione completa di tutti i bordi della tabella */
.tabella-spese,
.tabella-spese *,
table.tabella-spese,
table.tabella-spese * {
	border: none !important;
	border-top: none !important;
	border-right: none !important;
	border-bottom: none !important;
	border-left: none !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
}

/* Tabella principale */
.tabella-spese {
	font-size: 13px;
	margin: 10px auto;
	background-color: transparent;
	width: 100%;
	table-layout: fixed;
}

/* Celle della tabella */
.tabella-spese th,
.tabella-spese td {
	width: 14.28%;
	/* 100% / 7 giorni */
	height: 25px;
	text-align: center;
	vertical-align: middle;
	padding: 2px 1px;
	background-color: transparent;
}

/* Intestazioni giorni della settimana */
.tabella-spese th {
	background-color: #555555;
	font-weight: bold;
	font-size: 12px;
	color: #ffffff;
	height: 24px;
	vertical-align: middle;
}

/* Contenitore per ogni giorno del mese */
.giorno-mese {
	position: relative;
}

/* Pallini indicatori spese */
.pallino {
	width: 11px;
	height: 11px;
	border-radius: 50%;
	display: inline-block;
	border: none;
	cursor: pointer;
	transition: transform 0.2s ease;
}

/* Effetto hover sui pallini */
.pallino:hover {
	transform: scale(1.3);
}

.pallino-bianco {
	background-color: white;
}

.pallino-rosso {
	background-color: #dc3545;
}

/* Weekend styling */
.weekend {
	background-color: #222222;
}

/* ===============================
   LEGENDA
   =============================== */

.legenda-container {
	text-align: center;
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
}

.legenda-container small {
	font-size: 12px;
}

.legenda-container .pallino {
	width: 9px;
	height: 9px;
}