.sidebar {
	width: 220px;
	background: var(--primary);
	border-right: 1px solid #cbd5e0;
	transition: all 0.3s ease;
	position: relative;
}

.sidebar::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(
		135deg,
		transparent 0%,
		rgba(59, 130, 246, 0.03) 50%,
		transparent 100%
	);
	pointer-events: none;
}

.sidebar a {
	text-decoration: none;
}

.nav-item {
	padding: 1rem;
	border-bottom: 1px solid var(--secondary);
	transition: background-color 0.2s;
	cursor: pointer;
	font-weight: 500;
	color: var(--light-grey);
	text-decoration: none;
	font-size: 1rem;
}

.nav-item:hover {
	text-decoration: underline;
}

.nav-item.header-item {
	background-color: #dde4ee;
	font-weight: 600;
}

.nav-item.is-active {
	font-weight: 600;
	border-left: 3px solid var(--accent);
}