@font-face {
	font-family: LexendDeca;
	font-weight: normal;
	src: url(https://gmstatic.co/fonts/LexendDeca-Regular.ttf);
}

@font-face {
	font-family: LexendDeca;
	font-weight: bold;
	src: url(https://gmstatic.co/fonts/LexendDeca-Bold.ttf);
}

* {
	margin: 0;
	padding: 0;
	font-family: LexendDeca;
}

a {
	text-decoration: none;
	color: var(--accentColor);
}

input[type=text], input[type=password], select {
	font-size: 1.1em;
	padding: 0.4em 0.6em;
	display: block;
	margin-top: 0.2em;
}

.fileEditor {
	display: flex;
	flex-direction: row;
	gap: 0.5em;
	align-items: center;
	margin-bottom: 0.8em;
}

.fileEditor > img {
	height: 60px;
	width: auto;
}

.fileEditor > .input_container {
	margin-bottom: 0px;
}

.fileEditor input[type=file] {
	display: block;
}

input, select {
	border: 1px solid #cccccc;
	border-radius: 5px;
}

input[type=checkbox] {
	accent-color: var(--accentColor);
}

input:not([type=checkbox]):not([type=radio]) {
	min-width: 300px;
	width: 100%;
}

input:focus {
	border-color: var(--accentColor);
	outline: 0.5px solid var(--accentColor);
}

input[type=submit], a.button, button {
	border-radius: 5px;
	display: inline-block;
	border: none;
	font-size: 1.1em;
	padding: 0.5em;
	background: var(--accentColor);
	color: white;
	cursor: pointer;
}

input[type=submit].small, a.button.small, button.small {
	min-width: 0px;
	display: inline-block;
	width: auto;
	font-size: 0.9em;
}

input[type=submit].danger, a.button.danger, button.danger {
	background: #D62D40;
}

input[type=submit].secondary, a.button.secondary, button.secondary {
	background: lightgray;
	color: var(--accentColor);
}

:focus {
	outline: none;
}

div.input_container {
	margin-bottom: 0.8em;
}

div.radio_container {
	margin-bottom: 0.8em;
}

div.radio_container > .options {
	display: flex;
	flex-direction: row;
	gap: 1em;
	font-size: 0.9em;
	justify-content: flex-start;
}

div.radio_container > .options > .option {
	display: flex;
	flex-direction: row;
	gap: 0.2em;
}

.error {
	color: rgba(255, 0, 0, 1);
	background: rgba(255, 0, 0, 0.3);
	border: 1px solid rgba(255, 0, 0, 1);
	border-radius: 5px;
	margin: 1em 0px 0.2em 0px; 
	padding: 0.8em 1em;
	display: block;
}

table {
	width: 100%;
	border-collapse: collapse;
	margin: 1em 0px;
}

th, td {
	text-align: left;
	padding: 0.2em;
}

th {
	background: lightgray;
}

th:first-child {
	border-top-left-radius: 5px;
}

th:last-child {
	border-top-right-radius: 5px;
}

tr:not(:first-child) {
	border-top: 1px solid lightgray;
}