
.nav-sidebar * .nav-link.active{
	/*background-color: var(--primary) !important;
	border: var(--bs-btn-border-width) solid color-mix(in srgb,var(--primary) 80%, black) !important;*/
	background: linear-gradient(90deg, var(--primary) 3px, color-mix(in srgb,var(--primary) 10%, transparent) 3px);
	box-shadow: inset 1px 1px 0px var(--primary), inset -1px -1px 0px var(--primary);
}


.nav-sidebar * .nav-link.active:Hover{
	/*background-color: var(--primary) !important;
	border: var(--bs-btn-border-width) solid color-mix(in srgb,var(--primary) 80%, black) !important;*/
	background: linear-gradient(90deg, var(--primary) 3px, color-mix(in srgb,var(--primary) 20%, transparent) 3px);
}

#main-sidebar{
	z-index: 1000;
	width: fit-content;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	display: inline-block;
	background-color: #333333 !important;
	transition: all 0.3s;
	width: 250px;
	ms-overflow-style: none;
	scrollbar-width: none;
}

.sidebar{
	width: 250px;
	height: fit-content;
	background-color: rgba(0, 0, 0, 0) !important;
	overflow-x: hidden;
}

.nav-treeparent{
	position: relative;
}

.nav-treeparent * .right{
	position: absolute;
	right: 15px;
	top: 15px;
	transition: all 0.3s;
	transform-origin: center;
	transform: rotate(-90deg);
}

.nav-treeparent.collapsed * .right{
	transform: rotate(0deg);
}

.nav-sidebar{
	overflow: scroll !important;
	height: calc(100vh - 50px);
	ms-overflow-style: none;
	scrollbar-width: none;
}


@media only screen and (min-width: 768px) {
	#main-sidebar.closed{
		width: 74px;
	}

	#main-sidebar.closed * .nav-link{
		transform: translateX(-20px);
		overflow: hidden !important;
		width: 400px;
	}

	#main-sidebar.closed * .fst-sidebar-logo{
		transform: translateX(-15px) scale(1.05);
	}

	#main-sidebar.closed * span{
		margin-left: 25px;
	}

	#main-sidebar.closed * i{
		margin-right: 80px !important;
	}

	#main-sidebar:Hover.closed{
		width: 250px;
	}

	#main-sidebar:Hover.closed * .nav-link{
		transform: translateX(0px);
		overflow: hidden !important;
		width: 100%;
	}

	#main-sidebar:Hover.closed * .fst-sidebar-logo{
		transform: translateX(0px) scale(1);
	}

	#main-sidebar:Hover.closed * span{
		margin-left: .5rem;
	}

	#main-sidebar:Hover.closed * i{
		margin-right: .5rem!important;
	}

	.sidebar-dim{
		display: none;
	}
}

@media only screen and (max-width: 768px) {
	#main-sidebar{
		position: absolute;
		transform: translateX(-250px);
	}

	#main-sidebar.closed{
		transform: translateX(0px);
	}

	.sidebar-dim.closed{
		background-color: rgba(0, 0, 0, 0.2);
		width: 100vw;
		height: 100vh;
		position: absolute;
		left: 0px;
		top: 0px;
		z-index: 1000;
	}
}
