@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap');

:root {
	/*
	 * Accent variable
	 * Use this website: https://htmlcolorcodes.com/color-picker/
	 * to get your desired RGB numbers. Then simply put each number in their respective area.
	 * R,G,B
	 */
	--accent: 50, 131, 207;

	/*
	 * Chat message variables
	 */
	--message-padding: 10px; /* Spacing in the messages. MUST END IN px | DEFAULT: 10px */
	--message-spacing: 10px; /* Spacing around the messages. MUST END IN px | DEFAULT: 10px */

	/*
	 * Dark Mode variables
	 */
	--dark-bg-hue: 218; /* The HUE of the background. | DEFAULT: 218 */
	--dark-bg-saturation: 15%; /* The SATURATION of the background. | DEFAULT: 15% */
	--dark-bg-lightness: 11%; /* The LIGHTNESS of the background | DEFAULT: 11% */

	/*
	 * Light Mode variables
	 */
	--light-bg-hue: 200; /* The HUE of the background. | DEFAULT: 200 */
	--light-bg-saturation: 12%; /* The SATURATION of the background. | DEFAULT: 12% */
	--light-bg-lightness: 100%; /* The LIGHTNESS of the background | DEFAULT: 100% */

	/*
	 * To use a custom font. Visit https://fonts.google.com and select one to your liking.
	 * Now just follow this tutorial: https://imgur.com/a/CNbw7xC
	 */
	--font: 'Inter';
}
