:root {
	--mobilityTechBlue: #1c78e3;
}

html {
	font-size: 14px;
}

@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;
}

html {
	height: 100%;
	/*
	position: relative;
	min-height: 100%;
	*/
}

p {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	/*
	margin-bottom: 60px;
	*/
}

input[data-tri-state-checkbox][readonly] {
	accent-color: gray;
	opacity: 0.7;
	cursor: not-allowed;
}


input[data-tri-state-checkbox][readonly]:not(:checked):not(:indeterminate) {
	background-color: initial;
	border: 1px solid #999;
}



.layoutDiv {
	flex: 1 0 auto;
}

.generalPanel + h1,
.generalPanel + h2,
.generalPanel + h3,
.generalPanel + h4,
.generalPanel + h5,
.generalPanel + h6 {
	margin-top: 0.35em;
}


/*
h1,
h2,
h3,
h4,
h5,
h6 {
	color: #808080;
}
	*/

.fileInputPrompt {
	margin-top: 4pt;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
	color: var(--bs-secondary-color);
	text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
	text-align: start;
}


.nav-item {
	border: 1px solid rgba(0, 0, 0, 0);
	border-radius: 5px;
}

	.nav-item:hover {
		border: 1px solid gray;
		border-radius: 5px;
	}


.nav-item-centred {
	text-align: center;
}

.evenMarginPs p {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}

.paddedTD {
	padding: 0.6em;
}

.hiddenOnLoad {
	display: none;
}

.hidden {
	display: none;
}

input[readonly],
textarea[readonly] {
	background-color: #e9ecef;
	cursor: not-allowed;
}

.row label {
	margin-top: 0.5em;
}

.row .form-floating label {
	margin-top: 0em;
}

/* ============================================
   Heading with Left Button Pattern
   ============================================ */

.traqs-aspcore-pagetitle {
	position: relative;
}

	.traqs-aspcore-pagetitle .btn-left {
		position: absolute;
		left: -3.5rem; /* 56px to the left of the heading */
		top: 50%;
		transform: translateY(-50%);
	}

		/* Icon-only button variant */
		.traqs-aspcore-pagetitle .btn-left.btn-icon {
			width: 2.5rem;
			height: 2.5rem;
			padding: 0;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			border-radius: 0.375rem;
		}

		/* Small button variant */
		.traqs-aspcore-pagetitle .btn-left.btn-sm {
			left: -2.5rem;
			width: 2rem;
			height: 2rem;
			font-size: 0.875rem;
		}

/* Responsive: move button inline on tablets and below */
@media (max-width: 992px) {
	.traqs-aspcore-pagetitle .btn-left {
		position: static;
		transform: none;
		margin-right: 0.5rem;
		display: inline-flex;
		vertical-align: middle;
	}
}

/* Print: hide navigation buttons */
@media print {
	.traqs-aspcore-pagetitle .btn-left {
		display: none;
	}
}

.noBottomPadding {
	padding-bottom: 0;
}

.noTopPadding {
	padding-top: 0;
}

.marginAbove {
	margin-top: 1em;
}

.explanatoryNote {
	font-size: 80%;
}



.requestIDOnErrorPage {
	position: fixed;
	bottom: 0px;
}

.responseSummaryLabel {
	margin-bottom: 0;
	font-weight: bold;
	font-size: 80%;
}

.responseSummaryText {
	font-style: italic;
	font-size: 80%;
	margin-bottom: 0;
}

.previousResponseUserMesssage {
	font-size: 80%;
	margin-bottom: 0;
	margin-left: 2em;
	margin-top: 0.25em;
}

button.indexDataGroupDisplayNameBtn {
	width: 15em;
	height: 3.2em;
	background-color: #b88100;
	border: #b88100 thin;
	border-radius: 5px;
	font-weight: bold;
	color: white;
}

span.indexDataGroupDescription {
}

span.indexDataGroupActions {
	font-size: 80%;
}


.inlineBlockTextControl {
	display: inline-block;
	width: 20em;
}

a.asButton {
	appearance: button;
	display: inline-block;
	border: #b88100 thin;
	border-radius: 5px;
	font-weight: bold;
	text-decoration: none;
	color: white;
	text-align: center;
	vertical-align: middle !important;
	align-content: center;
	cursor: pointer;
}


.indent5em {
	text-indent: 5em;
}

.indent2em {
	text-indent: 2em;
}


a.indexDataGroupBtn,
a.indexAnalysisBtn,
a.selectRegistrationTypeBtn,
a.generalNavBtn,
a.asButtonFull {
	appearance: button;
	display: inline-block;
	height: 3.2em;
	border: #b88100 thin;
	border-radius: 5px;
	font-weight: bold;
	text-decoration: none;
	color: white;
	text-align: center;
	vertical-align: middle !important;
	align-content: center;
	cursor: pointer;
	/* Add box-shadow to match button appearance */
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
	/* Ensure consistent positioning with buttons */
	line-height: 3.2em;
	padding: 0;
	/* Match button border style */
	border-style: solid;
	border-width: 1px;
}

.buttonAsLink {
	border: none;
	background: none;
}

a.indexDataGroupBtn {
	background-color: #b88100;
	width: 15em;
}

a.indexAnalysisBtn {
	background-color: #0303d4;
	width: 7em;
}

a.selectRegistrationTypeBtn {
	background-color: lightblue;
	width: 15em;
}

div.generalNavPanel {
	margin: 2em 0 2em 0;
}

div.generalNarrowButtonPanel {
	margin: 5px 0 5px 0;
}

a.generalNavBtn {
	background-color: darkgoldenrod;
	width: 11em;
}

	a.generalNavBtn.wide {
		width: 20em;
	}

button.hover-button,
a.hover-button {
	color: #e8e8e8;
}

	button.hover-button:has(:hover),
	a.hover-button:has(:hover),
	a.hover-button-alwaysOn {
		color: black;
	}


	button.hover-button[disabled],
	a.hover-button[disabled] {
		color: #c8c8c8;
	}

button.hover-button-stronger,
a.hover-button-stronger {
	color: #989898;
}

.largeIcon {
	font-size: 20pt;
}



.data-entry-form {
}

	.data-entry-form label {
	}


.dataEntryPanel {
	padding: 0.7em;
	border: solid thin #bababa;
	border-radius: 5px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

	.dataEntryPanel + .dataEntryPanel {
	}


.questionArea {
}

.questionSubArea {
	padding: 1em;
	padding-top: 0.25em;
}

.responseText {
	font-weight: bold;
}

.responseLabel {
	/*
	font-weight: bold;
	*/
}

label.generalLabel {
	font-size: 85%;
	color: rgb(38, 38, 38);
}

ul.dataEntryCheckboxList {
	list-style: none; /* Remove bullets */
	padding-left: 0; /* Remove default padding */
	margin: 0; /* Remove default margin */
}
	/* Each LI item */
	ul.dataEntryCheckboxList li {
		display: flex;
		align-items: center;
		gap: 0.5rem; /* Space between checkbox and label */
		margin-bottom: 0.5rem;
		padding: 0.25rem 0.5rem;
		border-radius: 4px;
		transition: background-color 0.2s ease, box-shadow 0.2s ease;
	}
		/* Checkbox styling */
		ul.dataEntryCheckboxList li input[type="checkbox"] {
			flex-shrink: 0; /* Prevent checkbox from shrinking */
			width: 1.2rem;
			height: 1.2rem;
			cursor: pointer;
		}
		/* Label styling */
		ul.dataEntryCheckboxList li label {
			cursor: pointer;
			user-select: none; /* Prevent text selection on click */
		}
		/* Hover effect */
		ul.dataEntryCheckboxList li:hover {
			background-color: #f0f4f8;
		}
		/* Focus effect for accessibility */
		ul.dataEntryCheckboxList li input[type="checkbox"]:focus + label {
			outline: 2px solid #007bff;
			outline-offset: 2px;
		}
		/* Optional: remove margin from last LI */
		ul.dataEntryCheckboxList li:last-child {
			margin-bottom: 0;
		}

.buttonPanel {
	padding: 0.25em;
	padding-bottom: 0.5em;
}

div.inplaceEditor {
	padding: 0.25em;
	padding-bottom: 0.5em;
	background-color: #f8f8f8;
	border: solid 1px #d0d0d0;
	border-radius: 5px;
}

.dataEntrySaveBtnsPanelContainer {
	margin-top: 1em;
	position: relative;
	text-align: center;
}

.dataEntrySaveBtnsPanel {
	margin: 0 auto;
	display: inline-block;
}

.dataEntrySaveBtnsPanelTopRowItem, .dataEntrySaveBtnsPanelBottomRowItem {
	display: inline-block;
	width: 10em;
	text-align: center;
	padding: 0.25em;
	padding-bottom: 0.5em;
}

.dataEntryButton {
	width: 9em;
	height: 3.2em;
	border-radius: 6px;
	color: white;
	font-weight: bold;
	/* Add consistent shadow for all dataEntryButtons */
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
	/* Ensure consistent vertical alignment */
	vertical-align: middle;
	/* For anchor tags styled as buttons */
	display: inline-block;
	line-height: 3.2em;
	text-align: center;
	text-decoration: none;
	/* Consistent border */
	border-style: solid;
	border-width: 1px;
	/* Remove any default padding that might cause misalignment */
	padding: 0;
	/* Consistent box-sizing */
	box-sizing: border-box;
}

	.dataEntryButton.submitButton {
		background-color: blue;
		border-color: blue;
	}

		.dataEntryButton.submitButton[disabled] {
			background-color: lightblue;
			border-color: lightblue;
		}

	.dataEntryButton.saveProgressButton {
		background-color: green;
		border-color: green;
	}

	.dataEntryButton.editButton {
		background-color: darkgoldenrod;
		border-color: darkgoldenrod;
	}

	.dataEntryButton.backButton {
		background-color: grey;
		border-color: darkgray;
	}

	.dataEntryButton.deleteButton {
		background-color: indianred;
		border-color: indianred;
	}
/* Hover effect for anchor tags styled as buttons */
a.dataEntryButton:hover {
	filter: brightness(0.9);
	text-decoration: none;
}
/* Active/pressed state for anchor tags */
a.dataEntryButton:active {
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
	transform: translateY(1px);
}


.dataEntryButton.smallButton {
	width: 6em;
	height: 2em;
}

.roQuestionArea {
	background-color: #f0f0f0;
	padding: 0.5em;
	border-radius: 5px;
}

.previousResponseArea {
	border: 2px solid lightblue;
	border-radius: 6px;
	margin-top: 0.5em;
	padding: 0.5em;
	background-color: #f8f8f8;
}

div[data-optionsothertext] input[type='text'] {
	width: 30em;
}


table.dataEntityList {
}


	table.dataEntityList td,
	table.dataEntityList th {
		padding: 0.5em;
	}

.impactLevelRadiosSectionRow {
}

	.impactLevelRadiosSectionRow + .impactLevelRadiosSectionRow {
		border-top: 1px dotted black;
	}

.impactLevelRadiosSectionCell {
	display: inline-block;
	vertical-align: top;
	padding: 0.25em;
}

.impactLevelRadiosSectionCellHeadingAndDescription {
	width: 300px;
}


.impactLevelRadiosSectionRow .radioGroupHeading {
	font-variant: small-caps;
	font-weight: bold;
}

.impactLevelRadiosSectionRow .radioGroupDescription {
	font-style: italic;
}

.analysisOuterContainer {
	width: 100%;
	display: flex;
	justify-content: center;
}

.analysisTreeMapContainer {
	width: 700px;
}

.analysisPieChartContainer {
	width: 400px;
}


.sortControlsPanel,
.generalPanel,
.generalPanelWithTopAndBottomMargin,
.generalPanelWithAllPadding {
	border: 1px #d0d0d0 solid;
	border-radius: 5px;
	padding: 0.25em;
}

.generalPanelWithTopAndBottomMargin {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}

.generalPanelWithAllPadding {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
	padding: 1.0em;
}

.generalBorderlessPanel {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.smallPadding {
	padding: 0.5em;
}

.mediumPadding {
	padding: 1.0em;
}

.largePadding {
	padding: 1.5em;
}

.buttonBar {
	background-color: #f8f8f8;
	border: 1px gray solid;
	border-radius: 5px;
	padding: 0.25em;
}

.form-group-section {
	padding-top: 0.25em;
	padding-bottom: 0.25em;
}

	.form-group-section + .form-group-section {
		padding-top: 0;
	}

.DigSolInstanceDisplayInnerCoreContainer {
	border: 2px solid lightblue;
	border-radius: 6px;
	margin-top: 0.5em;
	padding: 0.5em;
	background-color: #f8f8f8;
	margin-bottom: 1em;
}

.DigSolInstanceDisplayInnerCore {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.digSolInstanceUpdateButtonContainer {
	margin-top: 0.5em;
}

.digSolInstanceNewResponseArea {
	margin-top: 0.5em;
}
/*
	Fading in and out
*/
.htmxFadeIn.htmx-added {
	opacity: 0;
}

.htmxFadeIn {
	opacity: 1;
	transition: opacity 800ms ease-out;
}

.htmxFadeOut.htmx-swapping {
	opacity: 0;
	transition: opacity 500ms ease-out;
}


.selectRegistrationTypeRow {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.vendorDataSummaryDisplayBlock-noResponse,
.vendorDataSummaryDisplayBlock-no,
.vendorDataSummaryDisplayBlock-minor,
.vendorDataSummaryDisplayBlock-moderate,
.vendorDataSummaryDisplayBlock-major,
.vendorDataSummaryDisplayBlock-IANoResponse,
.vendorDataSummaryDisplayBlock-IATrue,
.vendorDataSummaryDisplayBlock-IAFalse {
	width: 2em;
	height: 2.5em;
	text-align: center;
	border: solid 1.5px #abac7f;
	margin: auto;
}


:root {
	--colorForNoResponse: #e0e0e0;
	--colorForNothing: white;
	--colorForMinor: #fae7b2;
	--colorForModerate: #d9b653;
	--colorForMajor: #9a7305;
}

.vendorDataSummaryDisplayBlock-IANoResponse,
.vendorDataSummaryDisplayBlock-noResponse {
	border-color: var(--colorForNoResponse);
}

.vendorDataSummaryDisplayBlock-IATrue {
	background-color: lawngreen;
}

.vendorDataSummaryDisplayBlock-IAFalse,
.vendorDataSummaryDisplayBlock-no {
	background-color: var(--colorForNothing);
}

.vendorDataSummaryDisplayBlock-minor {
	background-color: var(--colorForMinor);
}

.vendorDataSummaryDisplayBlock-moderate {
	background-color: var(--colorForModerate);
}

.vendorDataSummaryDisplayBlock-major {
	background-color: var(--colorForMajor);
}

	.vendorDataSummaryDisplayBlock-major.textInside {
		color: white;
	}

	.vendorDataSummaryDisplayBlock-noResponse.textInside,
	.vendorDataSummaryDisplayBlock-minor.textInside,
	.vendorDataSummaryDisplayBlock-moderate.textInside,
	.vendorDataSummaryDisplayBlock-major.textInside {
		border-radius: 7px;
		padding-left: 0.5em;
		padding-top: 4px;
	}


.vendorDataSummaryKey {
	background-color: #f0f0f0;
}

.vendorDataSummaryKey-no {
	color: var(--colorForNothing);
}

.vendorDataSummaryKey-minor {
	color: var(--colorForMinor);
}

.vendorDataSummaryKey-moderate {
	color: var(--colorForModerate);
}

.vendorDataSummaryKey-major {
	color: var(--colorForMajor);
}


/*=============These are for the new layout with varying width blocks=====================*/
.vendorDataSummaryDisplayBlock-noResponse,
.vendorDataSummaryDisplayBlock-no,
.vendorDataSummaryDisplayBlock-minor,
.vendorDataSummaryDisplayBlock-moderate,
.vendorDataSummaryDisplayBlock-major {
	margin-left: 0;
}


.vendorDataSummaryDisplayBlock-noResponse {
	border: none;
}

.vendorDataSummaryDisplayBlock-no {
	width: 0px;
}

.vendorDataSummaryDisplayBlock-minor {
	width: 33.33%;
}

.vendorDataSummaryDisplayBlock-moderate {
	width: 66.66%;
}

.vendorDataSummaryDisplayBlock-major {
	width: 100%;
}
/*=========================================================================================*/


.vendorSolutionTable,
.vendorDeletedSolutionTable {
	table-layout: fixed;
	width: 100%;
	cursor: default;
}

	.vendorSolutionTable th,
	.vendorSolutionTable td {
		font-size: 9pt;
		padding-left: 6px;
		padding-right: 6px;
	}

	.vendorDeletedSolutionTable th,
	.vendorDeletedSolutionTable td,
	.vendorSolutionTable th,
	.vendorSolutionTable td {
		text-align: center;
	}

	.vendorSolutionTable div.solutionName a.asButton {
		font-size: 16pt;
	}

.vendor-summary-table {
	table-layout: inherit;
	width: 100%;
}

.vendorSolutionTable .improvementHeading {
	font-size: 100%;
}

.vendorSolutionTable .solutionNameHeading,
.vendorDeletedSolutionTable .solutionNameHeading {
	font-size: 18pt;
	text-align: left;
}

.vendorSolutionTable .solutionNameHeading {
	height: 170px;
}

.vendorDeletedSolutionTable {
	margin-top: 3em;
}

	.vendorDeletedSolutionTable .solutionNameHeading {
		height: 20px;
	}

	.vendorDeletedSolutionTable div,
	.vendorSolutionTable div {
		text-align: left;
	}

		.vendorSolutionTable div.solutionName {
			font-size: 12pt;
			overflow: clip;
			text-wrap: nowrap;
		}

.vendorSolutionTable thead tr:nth-child(2) {
}

	.vendorSolutionTable thead tr:nth-child(2) th {
		vertical-align: bottom;
	}

		.vendorSolutionTable thead tr:nth-child(2) th div {
		}

.vendorSolutionTable .impactReceiverTitle {
	font-size: clamp(0.3rem, 0.9vw, 0.8rem); /* screen: fluid */
}

@media print {
	.vendorSolutionTable .impactReceiverTitle {
		font-size: 5pt; /* print: fixed, physical unit */
	}
}


.vendorDeletedSolutionTable col.solution-col,
.vendorSolutionTable col.solution-col {
	width: calc(100% * 9 / 27);
}

.vendorSolutionTable col.impact-col {
	width: calc(100% * 2 / 27);
}

.vendorSolutionTable col.improvement-col {
	width: calc(100% * 1 / 27);
}

.vendorSolutionTable .impactBanner {
	background-color: #d9dcc1;
}

.vendorSolutionTable .improvementBanner {
	background-color: #bdd9d6;
}




.keywordsQuestionText,
.focusAreasQuestionText {
	margin-bottom: 0;
}

div.vendor-solution-uses,
div.vendor-solution-focusAreas,
div.vendor-solution-keywords {
	border: solid 1px #e0e0e0;
	border-radius: 5px;
	padding: 0.25em;
	margin-bottom: 0.5em;
}

	div.vendor-solution-uses .use,
	div.vendor-solution-focusAreas .focusArea,
	div.vendor-solution-keywords .keyword,
	div.vendor-solution-processes .triggeringFunction {
		background-color: #e8f0f0;
		border-radius: 5px;
		padding-left: 0.35em;
		padding-right: 0.25em;
		padding-bottom: 3px;
		margin-right: 0.35em;
		font-size: 90%;
	}

.MTIVendorSolutionEdit li.solutionUse {
	list-style-type: none;
}


.rotate90NoWrap,
.rotate90 {
	transform-origin: 1em 0.5em;
	transform: translate(0.5em, -0.5em) rotate(-75deg);
	--overflow: clip;
}

.rotate90NoWrap {
	white-space: nowrap;
}

tr.noSolutionsListedMessage p {
	padding: 2em;
}

tbody tr.noSolutionsListedMessage:not(:only-child) {
	display: none;
}

.youAreLoggedInAs {
	font-size: 10pt;
	/*	width: 11em;		*/
	text-align: center;
	word-wrap: normal;
}


.dimText {
	color: #a0a0a0;
}

.invisibleText {
	color: white;
}

.MTIVendorSolutionEdit h3 {
	font-weight: bold;
	font-size: 16pt;
}

.highlightedFocusArea {
	font-weight: bold;
}




.userSearchResultTable {
	font-size: 80%;
}

.vendor-solution-new-focusArea .form-floating {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}


.vendor-solution-urls table {
	width: 100%;
}

.vendor-solution-urls th {
	width: 33.33%;
}

.vendor-solution-urls td input.nameInput {
	width: 90%;
}


.vendor-solution-urls td input.urlInput {
	width: calc(99% - 40px);
}

.vendor-solution-urls td input.descriptionInput {
	width: 99%;
}


.digSolFunctionsGroup {
}

	.digSolFunctionsGroup li li {
		list-style: none;
	}

.digSolFunctionsGroupDisplayName {
	font-size: 105%;
	font-weight: bold;
}



/* Sticky button container - appears at bottom of viewport when page is long */
.floatingButtonContainer {
	position: sticky;
	bottom: 0;
	z-index: 1000;
	background-color: white;
	padding: 10px;
	box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
}



input[type=checkbox]:disabled {
	cursor: not-allowed;
}


.corporateViewIcon {
	text-align: right;
}

.corporateViewIconElement {
	display: inline-block;
	vertical-align: middle;
}

.VendorDataPreviewForCorporates {
	.generalPanel + .generalPanel {
		margin-top: 1em;
	}
}

.triggeringFunctionGroup {
	display: inline-block;
	border: 1px #e0e0e0 solid;
	border-radius: 5px;
	padding-bottom: 2px;
	padding-left: 0.5em;
}


.paragraphsOfUserText {
	color: var(--mobilityTechBlue);
	border: 1px #f0f0f0 solid;
	border-radius: 5px;
	padding: 0.25em;
}

.userResponse {
	color: var(--mobilityTechBlue);
}

.vendorDataSummaryKey,
.impactReceiversAccessKey {
	position: absolute;
	margin-top: 20px;
}

	.vendorDataSummaryKey td,
	.impactReceiversAccessKey td {
		text-align: left;
	}

.impactReceiverSummaryBarArea {
	width: 100%;
	border: solid 1.5px #abac7f;
}



.imageInList {
	height: 50px;
}


/*		STATUS MESSAGE
*/

.status-message {
	padding: 0.75rem 1rem;
	border-radius: 4px;
	animation: flashGreen 2s ease-out;
}

@keyframes flashGreen {
	0% {
		background-color: transparent;
	}

	20% {
		background-color: #47e46b; /* green */
	}

	100% {
		background-color: transparent;
	}
}



.userSuppliedImagesAwaitingApprovalTable {
}

.userSuppliedImagesAwaitingApprovalTable td {
	padding: 1em;
	text-align: center;
	border-bottom: 1px black solid;
}


/* ========== PUT THESE LAST ==================   */

.borderless {
	border: none;
}

.backgroundless {
	background: none;
}

.extraPadding {
	padding: 1em;
}

/*
	This hides the navigations buttons and login/logout stuff when the page is printed (e.g. to PDF).
*/
@media print {
	.hideOnPrint {
		display: none !important;
	}
}