/* default margin */
html, body {
	margin: 0;
	padding: 0;
}

/* section font size */
h1 { font-size: 25px; }

/* subsection font size */
h2 { font-size: 20px; }

/* subsubsection font size */
h3 {
	font-size: .9rem;
	padding-bottom: 6px;
}

/* navbar fix */
body { padding-left: 48px; }

/* font */
html { font-family: "Inter", sans-serif; }

/* color */
:root, html, body {
	background-color: var(--background);
	color: var(--foreground);
}

/* link fix */
a {
	color: var(--text);
	text-decoration: none;
}

/* centering misschien */
.CenteredPageInner { text-align: center; }
.CenteredPageInner > * { text-align: left; }

/* line height reset */
h1, h2, h3, p, b, i, span, td, th, li {
	margin: 0;
	line-height: 1.2;
}

/* table groottes met percentages werkt nu */
table { table-layout: fixed; }

/* table styles */
td, th { padding: 4px; }

input {
	color: var(--foreground);
	background-color: transparent;
	font-family: inherit;
	border: 0;
	font-size: 1rem; /* why? */
}

input::placeholder {
	font-style: italic;
	opacity: 1;
	color: var(--gray-600);
}

/* remove chrome's ugly :focus outline */
:focus { outline: none; }

/* scroll balken */
::-webkit-scrollbar { width: 0 !important; }

/* material-ui default state */
svg.MuiSvgIcon-root { transition: none !important; }

.logo .betaBadge { bottom: -9px; }
.logo .betaBadge .background { fill: var(--accent); }
.logo .betaBadge .foreground { fill: var(--gray-900); }
html.dark .logo .betaBadge .foreground { fill: var(--foreground); }