@tailwind base;

@layer base {

	:root {

		color-scheme: light;

		--theme-bg: #eff1f5;

		--theme-link: #df8e1d;

		--theme-text: #4c4f69;

		--theme-accent: #7287fd;

		--theme-accent-2: #7287fd;

		--theme-quote: #7287fd;

		--theme-menu-bg: rgb(250 250 250 / 0.85);

	}

	:root.dark {

		color-scheme: dark;

		--theme-bg: #1e1e2e;

		--theme-link: #f38ba8;

		--theme-text: #cdd6f4;

		--theme-accent: #a6e3a1;

		--theme-accent-2: #74c7ec;

		--theme-quote: #a6e3a1;

		--theme-menu-bg: rgb(46, 52, 64 / 0.85);

	}

	html {

		@apply h-full scroll-smooth border-t-2 border-textColor;

	}

	html body {

		@apply mx-auto flex h-full max-w-3xl flex-col bg-bgColor px-8 pt-16 font-mono text-sm font-normal text-textColor antialiased;

	}

}

@tailwind components;

@tailwind utilities;