html {
	font-size: 14px;
	position: relative;
	min-height: 100%;
}

@media (min-width: 768px) {
	html {
		font-size: 16px;
	}
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
	box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

body {
	background-color: #1c1e22;
	margin: 0;
	/* ensures body is at least full viewport tall so short pages have footer at bottom and can vertically center content if desired */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.navbar .nav-link {
	height: 100%;
	white-space: nowrap;
}

.navbar-brand {
}

@media (min-height:700px) and (min-width:700px) {
	header {
		position: sticky;
		top: 0;
		z-index: 99;
	}
}

.form-control {
	text-align: left;
}

.star {
	color: darkgoldenrod;
}

.nowrap {
	white-space: nowrap;
}

.header-home {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

	.header-home .patch {
		flex: 1 0 0;
	}

		.header-home .patch > img {
		}

	.header-home .title {
		flex: 10 0 10em;
		font-weight: 700;
		font-size: 2.1rem; /* this size seems to work well for phone landscape */
		margin: 5px 0;
	}

@media (min-width:1200px) {
	.header-home .title {
		font-size: 3.2rem; /* this size works well on desktop */
	}
}

.header-home .edition {
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	white-space: nowrap;
	vertical-align: middle;
	font-size: 2rem;
	font-weight: 300;
}

@media print {
	body {
		background-color: white;
		color: black;
		min-height: unset;
	}
}


/* for table on RoleAssignments.cshtml */
table#users td {
	vertical-align: middle;
}

	table#users td.status div.challenges {
		vertical-align: middle;
		display: inline-flex;
		align-items: center;
		column-gap: 0.1em;
	}

	table#users td.status div.state {
		display: grid;
		justify-items: center;
	}

		table#users td.status div.state span:first-child {
			line-height: 1;
		}

		table#users td.status div.state span:last-child {
			font-size: x-small;
		}

.choices__input {
	color: #212529 !important; /* Bootstrap default text color */
	background-color: #fff !important; /* Ensure background is white */
}

.choices__list--dropdown .picklist-col {
	display: inline-block;
	vertical-align: middle;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-right: 0.5em;
}

.choices__list--dropdown .picklist-name {
	width: 32%;
	font-weight: 500;
	text-align: left;
}

.choices__list--dropdown .picklist-road {
	width: 28%;
	color: #666;
	font-size: 0.95em;
	text-align: center;
}

.choices__list--dropdown .picklist-email {
	width: 38%;
	color: #888;
	font-size: 0.95em;
	text-align: right;
}

.choices__placeholder {
	font-weight: bold;
	color: black;
}