@tailwind base;
@tailwind components;
@tailwind utilities;

body {
	user-select: none;
	margin: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
		"Droid Sans", "Helvetica Neue", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	background-color: #f6f7fb;
}

code {
	font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
}

:root {
	--primaryColor: #3e63cb;
	--bgColor: #f6f7fb;
  --headerHeight: 64px;
  --footerHeight: 64px;
  --sideWidth: 200px;
  --rightPadding: 40px;
}

@layer utilities {
	.main-page {
		height: calc(100vh - var(--headerHeight) - var(--footerHeight));
		width: calc(100vw - var(--sideWidth));
		background-color: var(--bgColor);
	}
}