#navbar-container {
	display: flex;
	flex-direction: column;
	background: #343031;
	width: 175pt;
	height: 100vh;
	position: fixed;
	transition-duration: 0.5s;
	z-index: 1000;
}

#navbar-container:hover {
	box-shadow: 0pt 0pt 10pt #0005;
}

#title-container {
	display: flex;
	flex-direction: column;
	align-items: center;
}

#title-container > p {
	margin: 0pt 5pt 0pt auto;
	font-size: 8pt;
	font-weight: bold;
	margin-bottom: 2pt;
}

#title-container > * {
	margin: 0pt;
}

#title {
	width: 100%;
	padding: 5pt;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
}

.entry {
	padding: 5pt 5pt;
	background: none;
	text-align: left;
	font-size: 13pt;
	width: 100%;
	display: flex;
	flex-direction: row;
	gap: 5pt;
	align-items: center;
}

.entry:hover {
	background: #575052;
}

.entryService {
	display: flex;
	flex-wrap: nowrap;
	gap: 5pt;
	align-items: center;
	justify-content: left;
}

.active {
	background: #464142;
}

#divider {
	height: 2pt;
	width: 100%;
	background: white;
}

.entry,
#navbar-container {
	color: white;
}

#services {
	margin-bottom: auto;
}

/* Mobile overlay */
.mobile-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, 0.5);
	z-index: 999;
}

@media (max-width: 884px) {
	.mobile-overlay {
		display: block;
	}

	/* Hide navbar by default on mobile */
	#navbar-container {
		transform: translateX(-100%);
		transition: transform 0.3s ease-in-out;
	}

	/* Show navbar when mobile menu is open */
	#navbar-container.mobile-open {
		transform: translateX(0);
	}

	/* Adjust hover effects for mobile */
	#navbar-container:hover {
		box-shadow: none;
	}
}
