.themeBtn {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	border: 1px solid var(--primaryLt);
	padding: 0.2rem 0.5rem;
	border-radius: var(--borderRadius);
	background-color: transparent;
	cursor: pointer;
	color: var(--text);
	font-size: .8rem;
}

.themeSwitcher {
	position: absolute;
	top: 8px;
	right: 32px;
	width: 10em;
	background-color: var(--bg);
	padding: 0.5rem;
	border: 1px solid var(--primaryLt);
	border-radius: var(--borderRadius);
	list-style: none;
}

.themeSwitcher li {
	margin-bottom: 0.25rem;
}

.themeSwitcherBtn {
	background-color: none;
	color: var(--text);
	display: flex;
	gap: 0.5rem;
	align-items: center;
	cursor: pointer;
	padding: 0.5rem;
	width: 100%;
	border: none;
	background-color: var(--bg);
	font-size: 0.8rem;
}

.themeSwitcher li.activeBtn {
	border-left: 3px solid var(--primary);
}

.themeSwitcherBtn:hover {
	background-color: var(--primaryLt);
	font-weight: bold;
}

.themeSwitcherBtn:focus {
	background-color: var(--primaryLt);
	font-weight: bold;
}

@media (min-width: 800px) {
	.themeSwitcher {
		top: 8px;
		right: 0;
	}
}
