.navbar-brand img {
	width: 182px;
}

body {
	font-family: 'Lato', serif;
}

.asteriskField {
    display: none;
}

h1 {
	font-size: 24px;
}

h2 {
	font-size: 24px;
}

/* Use for {{form|crispy}} to improve spacing between fields */
form > div {
	padding-bottom: 10px;
}

a.badge:hover {
	/* credit: https://www.folkstalk.com/tech/css-hover-darken-color-with-code-examples/ */
    background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
	color: #fafafa!important;
}

table thead {
	position: sticky;
	inset-block-start: 0;
}

tr .material-icons.hide-til-hover {
	visibility: hidden;
	vertical-align: bottom;
}
tr:hover .material-icons.hide-til-hover {
	visibility: visible;
}

@media (prefers-color-scheme: light) {
	.navbar {
		background-color: rgb(248, 249, 250);
	}

	/* Material icons, page link text (prev/cur/next)*/
	.material-icons, .page-link {
		color: #203553;
	}

	/* Navbar material icons */
	.navbar .material-icons {
		color: unset; /* Reset to default */
	}

	.btn,
	button {
		background-color: #203553;
		border-color: #203553;
	}

	.navbar button {
		border: 0;
		background-color: inherit;
		border-color: inherit;
	}

	a.dropdown-item.active {
		background-color: var(--bs-body-color);
	}

	.conditional-opacity.text-warning, .lp-notes.text-warning {
		color: var(--bs-orange)!important;
	}

	.conditional-opacity.text-info {
		color: var(--bs-blue)!important;
	}

	label.btn-outline-secondary {
		background-color: white;
		border-color: rgb(211, 211, 211);
	}

	table thead {
		background-color: white;
	}
}
@media (prefers-color-scheme: dark) {
	.navbar {
		background-color: rgba(250, 250, 250, 0.20);
	}

	/* Material icons, page link text (prev/cur/next)*/
	.material-icons, .page-link, .page-link:hover {
		color: #d3d3d3;
	}

	/* Navbar material icons */
	.navbar .material-icons {
		color: unset; /* Reset to default */
	}

	/* All input buttons to look like page links */
	.btn-primary {
		background-color: rgb(59, 59, 59);
		border-color: rgb(81, 81, 81);
		color: rgb(211, 211, 211);
	}

	.navbar button {
		border: 0;
	}

	.btn-primary:hover {
		background-color: rgba(250, 250, 250, .2);
		border-color: rgba(250, 250, 250, .2);
	}

	.bg-success {
		color: rgb(var(--bs-dark-rgb));
	}

	table thead {
		background-color: var(--bs-gray-900);
	}
}