/*@import "./breadcrumb.css";*/

h1 {
	font-size: 2.25em;
	font-weight: 400;
}

h2, h3 {
	font-size: 1.5em;
}

.header-subtext {
	margin: 0;
	font-size: 0.875em;
	color: var(--light-grey2);
}

.header-buttons {
	display: flex;
	align-items: center;
	column-gap: 0.625em;
	margin-top: 1.25em;
}

p {
	margin: 0;
}

a, a:visited {
	cursor: pointer;
	color: var(--blue);
}

[hidden] {
	visibility: hidden !important;
}

hr.dotted {
	border: none;
	border-top: 1px dotted var(--light-grey2);
}

.arrow-link {
	--arrow-link-color: var(--blue);
	color: var(--blue);
	font-weight: 700;
	display: flex;
	align-items: center;
	column-gap: 0.625em;
}

a.arrow-link:visited {
	color: var(--blue);
}

.arrow-link::after {
	--size: 0.75em;
	content: '';
	background-image: url('../../img/arrow-right-blue.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: var(--size);
	height: var(--size);
}

.text-soft {
	color: var(--light-grey3);
}

.a-link {
	color: var(--blue);
	font-weight: 700;
}

.relative {
	position: relative;
}

.clickable, [onclick] {
	cursor: pointer;
	user-select: none;
}

.hidden {
	display: none !important;
}

.col-cards {
	display: flex;
	flex-direction: column;
	row-gap: var(--card-gap);
}

.status-text {
	display: inline-flex;
	align-items: center;
	column-gap: 0.5em;
	color: var(--status-color);
}

	/*.status-text::before {
		display: block;
		content: '';
		--size: 0.75em;
		width: var(--size);
		height: var(--size);
		border-radius: calc(var(--size) / 2);
		background-color: var(--status-color);
	}*/

.status-text-small::before {
	--size: 0.25em;
}

.status-text-info {
	--status-color: var(--light-blue);
}

.status-text-warning {
	--status-color: var(--amber);
}

.status-text-success {
	--status-color: var(--green);
}

form {
	width: 100%;
}

svg.icon-fill path {
	fill: var(--icon-fill, #000);
}

svg.icon-stroke path, svg.icon-stroke circle {
	stroke: var(--icon-fill, #000);
}

svg .fill {
	fill: var(--icon-fill, #000);
}

svg .stroke {
	stroke: var(--icon-fill, #000);
}

dl.row {
	margin-top: 0;
}

	dl.row > * {
		margin: 0;
		margin-bottom: 0.5em;
	}

dd {
	margin-bottom: 0;
}

#loading-message {
	margin-bottom: 1em;
	text-align: center;
}

.popout-dropdown-menu {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

	.popout-dropdown-menu .circle-background {
		display: flex;
		background-color: var(--light-grey2);
		height: 1.875em;
		width: 1.875em;
		border-radius: 100%;
		justify-content: center;
		align-items: center;
	}

.popout-dropdown-menu-override {
	padding: 0.25em 0 0 0;
}

/* BOOTSTRAP CUSTOM */

:root {
	--bs-border-color: var(--light-grey2);
	--bs-info: var(--light-blue);
	--bs-light: var(--light-grey1);
	--bs-danger: var(--red);
}

ul.nav {
	margin-top: 0.75em;
}

li.nav-item:not(:last-of-type) {
	margin-bottom: 0.75em;
}

.nav-link {
	padding: 0.5em 0.5em;
	display: flex;
	align-items: center;
	column-gap: 0.625em;
}

	a.nav-link:focus, a.nav-link:hover {
		color: var(--white);
		opacity: 0.75;
	}

	a.nav-link.active {
		--nav-icon-color: var(--black);
		font-weight: 700;
	}

	.nav-link svg {
		--icon-fill: var(--black);
		--size: 1.5em;
		width: var(--size);
		height: var(--size);
	}

.container, .container-fluid {
	padding: 0;
}

.row {
	--bs-gutter-x: var(--card-gap);
	--bs-gutter-y: var(--card-gap);
}

	.row:not(:last-of-type) {
		margin-bottom: var(--card-gap);
	}

.card {
	border-radius: 0.5em;
	border: 1px solid var(--light-grey2);
/*	overflow: hidden;*/
}

.card .card {
	border-radius: 0.25em;
}

.card-header {
	padding: 1em 0 0.75em;
	margin: 0 1em;
	background-color: var(--white);
	border-bottom: 1px solid var(--light-grey2);
}

.card-header-borderless {
	border: none;
}

.card-body {
	padding: 1em;
	position: initial;
}

.card-header + .card-body {
	padding: 1.25em 1em 1em;
}

.card-header-borderless + .card-body {
	padding-top: 0;
}

.card .card.card-body {
	padding: 1.875em 2em;
}

.card .card-body.card-body-slim {
	padding: 1.25em 1em;
}

.card.card-body.card-single {
	height: 4.875em;
	padding: 0 2em;
	justify-content: center;
}

.card-footer {
	padding: 0 2em 2em;
	border: none;
	background-color: #fff;
}

.list-group {
	--bs-list-group-border-radius: 0;
	border-bottom: 1px solid var(--light-grey2);
}

.list-group-item {
	--bs-list-group-item-padding-y: 1.25em;
	--bs-list-group-item-padding-x: 1em;
	--bs-list-group-color: var(--color);
	border: none;
	border-top: 1px solid var(--light-grey2);
}

	.list-group-item:nth-child(even) {
		background-color: var(--light-grey3);
	}

	.list-group-item + .list-group-item {
		border-top-width: 1px;
	}

.list-item-heading {
	font-size: 1em;
}

.grey-required {
	color: var(--dark-grey);
	font-weight: normal;
}

.red-required {
	color: var(--red);
}

.side-padding {
	padding: 0 2em;
}

.form-check {
	margin-bottom: 0 !important;
}

a.no-link-style {
	color: var(--black);
	width: 100%;
	display: block;
}


.no-survey-results {
	margin: 3em;
}

.no-survey-results svg {
	--size: 3em;
	width: var(--size);
	height: var(--size);
}

.no-survey-results svg path {
	stroke: var(--dark-grey);
}

.no-survey-results h2 {
	margin: 0.5em;
}

.no-survey-results p {
	margin-bottom: 2em;
}



#env {
	display: flex;
	position: fixed;
	right: 0;
	height: 100%;
	align-items: center;
	opacity: 0.75;
}

#env span {
	padding: 0.75em 0.25em 0.75em 0.25em;
	font-weight: 500;
	color: #fff;
	writing-mode: vertical-lr;
	border-radius: 0.6em 0 0 0.6em;
	background-color: var(--green);
}

#env span.staging {
	background-color: var(--amber);
}

#scroll-btn {
	display: flex; /* Hidden until we've scrolled far enough - see JS file scroll-button.js */
	justify-content: center;
	align-items: center;
	position: fixed;
	bottom: 2.5em;
	right: 2.5em;
	width: 2.5em;
	height: 2.5em;
	background-color: var(--white);
	border: var(--light-grey3);
	border-radius: 0.5em;
	cursor: pointer;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	transition: opacity 0.3s ease;
	opacity: 0;
	pointer-events: none;
}



@media(min-width: 641px) {
	.card-header {
		padding: 2em 0 1.875em;
		margin: 0 2em;
	}

	.card-header + .card-body {
		padding: 1.25em 2em 2em;
	}

	.card-body {
		padding: 2em;
		position: initial;
	}
}

.file-label {
	cursor: pointer;
}

.placeholder-container {
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid var(--light-grey2);
	border-radius: 0.5em;
	height: 9em;
	aspect-ratio: 1/1;
}

.placeholder-container > img {
	width: 3em;
}

@media (min-width: 1500px) {
	.placeholder-container {
		height: 18.75em;
	}
}

.page-section {
	border-radius: 0.5em;
}
.page-section .section-header {
	background-color: var(--light-grey2);
	padding: 1.25em 2.375em 1.25em 2em;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top-left-radius: 0.5em;
	border-top-right-radius: 0.5em;
}
.page-section-open .section-header {

}
.page-section-closed .section-header {
	border-radius: 0.5em;
}
.page-section .section-header-white {
	background-color: transparent;
}
.page-section .section-body {
	padding: 1.25em 2em 1.875em;
	display: flex;
	flex-direction: column;
	row-gap: 1em;
	height: auto;
}
.page-section-orange {
	border-color: var(--orange);
}
.page-section-orange .section-header {
	background-color: var(--orange);
}

.page-section-orange .button-grey {
	background-color: var(--orange);
	border-color: var(--orange);
}
.page-section-orange .chevron-icon path {
	stroke: var(--black);
}

.page-section-orange .padlock-icon path {
	stroke: var(--black);
	fill: var(--black);
}

.page-section-orange .question-group-banner {
	color: var(--black);
}

.question-group-banner {
	color: var(--dark-grey);
}