
.sidebar{
	height: 100vh;
	width: 100%;
	background-color: #181818;
	padding: 0 0.5rem;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow-y: auto;
	padding-bottom: 2.5rem;
}

.userContainer > a{
	width: 100%;
	aspect-ratio: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.userContainer{
	position: relative;
}

.userContainer > a > img{
	width: 33.3%;
}

.userContainer > a > div{
	margin-top: 1rem;
	font-size: 1.25rem;
	font-weight: 600;
	color: white;
	text-align: center;
}

.separatore > div{
	height: 5px;
	width: 5px;
	border-radius: 50%;
	background-color: white;
}

.separatore{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.listContainer{
	margin-top: 3rem !important;
}

.imgList{
	width: 1.5vw;
}

.listContainer a{
	display: flex;
	align-items: center;
	gap: 1rem;
}

.listContainer > li:nth-of-type(n+2){
	margin-top: 2rem;
}

.listContainer div{
	color: white;
}

.logoutContainer{
	width: calc(100% - 1rem);
	display: flex;
	flex-direction: column;
	align-items: center;
	/*position: absolute;
	left: 0.5rem;
	bottom: 0;*/
	margin-top: 2.5rem;
}

.logoutContainer > a{
	display: flex;
	gap: 0.5rem;
	align-items: center;
}

.logoutContainer > a > i{
	color: white;
}

.logoutContainer > a > div{
	color: white;
}

.separatore2 > div{
	height: 5px;
	width: 5px;
	border-radius: 50%;
	background-color: white;
}

.separatore2{
	width: 100%;
	display: flex;
	justify-content: space-between;
	margin-top: 1rem;
}

/* Stile base per la scrollbar */
.sidebar::-webkit-scrollbar {
    width: 7.5px; /* Larghezza della scrollbar */
}

/* Stile per il thumb (la parte che si muove) */
.sidebar::-webkit-scrollbar-thumb {
    background-color: #8AAF48; /* Colore della thumb */
    border-radius: 999px; /* Arrotondamento degli angoli */
}

/* Stile per il track (la traccia su cui scorre il thumb) */
.sidebar::-webkit-scrollbar-track {
    background-color: #333333; /* Colore del track */
}

@media screen and (max-width: 992px) {
	.resDisNone{
		display: none !important;
	}
	
	.resIcon{
		width: 100% !important;
	}
	
	.sidebar{
		padding: 1.25rem !important;
	}
	
	.logoutContainer > a > i{
		font-size: 2.5rem;
	}
	
	.sidebar{
		justify-content: unset;
	}
	
	.sidebar > div:nth-of-type(2){
		width: unset;
	}
}

@media screen and (max-width: 576px) {
	.sidebar{
		padding: 1.25rem 0.5rem !important;
	}
	
	.logoutContainer > a > i{
		font-size: 1.5rem;
	}
}