@media (prefers-color-scheme: light) {
	:root {
		--background: rgb(197, 197, 197);
		--drawer-background: rgb(206, 206, 206);
		--primary: rgba(47, 150, 168);
		--secondary: rgba(78, 78, 254);
		--font-color: rgb(0, 0, 0);

		--primary-hover: rgb(47, 200, 227);
		--primary-active: rgb(84, 174, 190);
		--secondary-hover: rgb(49, 49, 255);
		--secondary-active: rgba(78, 78, 254);

		--lightest: rgba(238, 238, 238, 0.75);
		--lighter: rgb(206, 206, 206, 0.75);
		--light: rgb(126, 126, 126, 0.75);
		--dark: rgb(94, 94, 94, 0.75);
		--darker: rgb(49, 49, 49, 0.75);
		--darkest: rgb(31, 31, 31, 0.75);
	}
}

@media (prefers-color-scheme: dark) {
	:root {
		--background: rgb(0, 0, 0);
		--drawer-background: rgb(71, 71, 71);
		--primary: rgb(36, 127, 144);
		--secondary: rgb(40, 40, 136);
		--font-color: white;

		--primary-hover: rgb(36, 139, 157);
		--primary-active: rgb(69, 158, 173);
		--secondary-hover: rgb(74, 74, 194);
		--secondary-active: rgb(26, 26, 168);

		--darkest: rgb(238, 238, 238);
		--darker: rgb(206, 206, 206);
		--dark: rgb(126, 126, 126);
		--light: rgb(94, 94, 94);
		--lighter: rgb(49, 49, 49);
		--lightest: rgb(31, 31, 31);
	}
}