:root {
	/* client variables */
	/* client colors */
	--color-primary-red: #bf3b3b !important;
	--color-primary-blue: #164373 !important;
	--color-primary-brightblue: #1585ad !important;
	--color-secondary-lightblue: #c7e2f6 !important;
	--color-secondary-lightblue-transparent: #c7e2f696 !important;
	--color-primary-normal: var(--color-primary-red) !important;
	--color-primary-light: #bf3b3b5e !important;
	--color-background-gray: #f9f9f9 !important;
	/* client font */
	--font-size: 16px !important;
	--font-size-h2: 18px !important;
	--font-family-pri: "Montserrat", sans-serif !important;
	--font-family-alt: "Literata", serif !important;
	--font-family: var(--font-family-pri) !important;
	--font-family-label: var(--font-family-pri) !important;
	--font-family-h2: var(--font-family-pri) !important;
	--font-weight-title: 600 !important;
	--font-weight-h1: 600 !important;
	--font-color-h1: var(--color-primary-blue) !important;
	--font-color-h3: var(--color-primary-blue) !important;
	/* Other */
	--border-color: var(--color-primary-brightblue) !important;
	--border-color-focus: var(--color-primary-blue) !important;
}

/*
    General Elements/Classes
*/
html,
body {
	font-family: var(--font-family);
	letter-spacing: -0.25px;
}

html,
body {
	width: 100%;
	/* height: 100%; */
	margin: 0px;
	padding: 0px;
	overflow-x: hidden;
}

h1,
.h1 {
	font-size: var(--font-size-h1);
	line-height: var(--font-lineheight-h1);
	color: var(--font-color-h1);
	font-weight: var(--font-weight-h1);
	font-family: var(--font-family-h1);
}

h2,
.h2 {
	font-size: var(--font-size-h2);
	line-height: var(--font-lineheight-h2);
	color: var(--font-color-h2);
	font-weight: var(--font-weight-h2);
	font-family: var(--font-family-h2);
	text-transform: uppercase;
}

h3,
.h3 {
	font-size: var(--font-size-h3);
	line-height: var(--font-lineheight-h3);
	color: var(--font-color-h3);
	font-weight: var(--font-weight-h3);
	font-family: var(--font-family-h3);
	text-transform: capitalize;
}

h4,
.h4 {
	font-size: var(--font-size-h4);
	line-height: var(--font-lineheight-h4);
	color: var(--font-color-h4);
	font-weight: var(--font-weight-h4);
	font-family: var(--font-family-h4);
}

.title-text {
	font-weight: var(--font-weight-title);
	color: var(--color-primary-blue);
}

a {
	color: var(--color-primary-blue);
	font-weight: 400;
	text-decoration: underline;
	&:visited {
		text-decoration: underline;
		color: var(--color-primary-brightblue);
	}

	&:hover {
		text-decoration: underline;
		color: var(--color-primary-brightblue);
	}
}

.divider::before {
	background-color: var(--color-gray-dark);
}

.section-header:after {
	background-color: var(--color-primary-brightblue);
}

.horizontal-divider {
	border-color: var(--border-color);
}

.vertical-divider {
	border-color: var(--border-color);
}

.fiviControl.fiviTextBox label.DefaultLabelClass {
	font-family: var(--font-family-label);
}

.header-container .page-text-large {
	color: black;
	text-align: center;
}

/*
    Layout
*/
.layout {
	background-color: var(--background-color);
}

/*
    Header Styling
*/
header {
	box-shadow: none;
	background-color: #fff;
	border-bottom: 1px solid var(--border-color);
}

.header-top-bar {
	background: var(--color-primary-blue) !important;
	height: 41px;
	display: flex;
	width: 220%;
	margin: 0;
}

.header-logo {
	height: 71px;
	margin-right: 12px;
}

.header-logo-container {
	display: flex;
}

@media all and (max-device-width: 992px), all and (max-width: 992px) {
	header .layout-container {
		flex-direction: column;
		justify-content: flex-start !important;
	}

	header .layout-container > a {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.header-top-bar {
		height: 52px;
	}
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.header-logo {
		width: 200px;
	}

	.header-logo-container {
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
	}
}

/*
    Main styling
*/
main > .layout-container {
	border: 1px solid var(--border-color);
	background-color: white;
	border-radius: 5px;
}

/*
    footer styling
*/
footer {
	background-color: #f8f6f1;
	border-top: 1px solid var(--border-color);
	position: relative;
	padding: 0;
	color: var(--color-primary-blue);
	font-size: 16px;
	line-height: 25.6px;
}

.footer-social {
	background: var(--color-primary-brightblue);
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.footer-social > a > img {
	width: 25px;
	margin: 0 5px;
}

.footer-social a:hover img {
	filter: brightness(0) saturate(100%) invert(88%) sepia(11%) saturate(520%) hue-rotate(180deg) opacity(0.6);
}

.footer-social a:last-child img {
	width: 35px;
}

.footer-main,
.footer-copyright-trust {
	background: #f8f6f1;
}

footer > .layout-container {
	font-size: var(--font-size);
}

footer .h1,
footer .h2,
footer .h3,
footer .h4 {
	color: var(--color-white-normal);
	font-weight: 500;
}

footer .page-text {
	color: var(--color-white-normal);
}

footer a,
footer a:hover,
footer a:visited {
	color: var(--color-primary-blue);
	text-decoration: underline;
}

footer a:hover,
footer a:visited {
	color: var(--color-primary-red);
}

.footer-copyright a {
	text-decoration: none;
}

.footer-seo p {
	display: flex;
	justify-content: center;
	padding: 2em 6em 0em 6em;
	text-align: center;
}

.footer-columns-table {
	display: flex;
	justify-content: space-between;
	margin: 2em 6em;
}

footer ul {
	list-style-type: none;
	padding-left: 0;
	margin-top: 0;
}

.footer-column {
	line-height: 25.6px;
}

.apps-content .list-unstyled {
	display: flex;
	flex-direction: column;
	li {
		padding: 0;
		margin: 0;
	}
}

.trigger {
	color: var(--color-primary-red);
	font-weight: 700;
	padding-bottom: 10px;
	font-size: 18px;
}

.footer-copyright-trust {
	display: flex;
	justify-content: space-between;
	margin: 2em 6em;
}

.footer-copyright {
	line-height: 25.6px;
}

/* Reset and base styles */
footer,
ul {
	margin: 0;
	padding: 0;
}

/* Flex container for the list */
.footer-copyright ul {
	list-style: none;
	display: flex;
	gap: 1em;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

/* Each list item */
.footer-copyright ul li {
	position: relative;
	padding-right: 1em;
	/* room for the line */
}

/* The vertical line except after the last item */
.footer-copyright ul li:not(:last-child)::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	height: 12px;
	/* height of the vertical line */
	width: 0.5px;
	/* thickness */
	background-color: var(--color-primary-blue);
}

.footer-trust {
	display: flex;
	justify-content: center;
}

.ncua {
	width: 163px;
}

.ehl {
	width: 68;
}

.icon-row {
	display: flex;
}

.list-unstyled {
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
}

.footer-trust ul li {
	/* display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 8px; */
	gap: 1em;
}

.nmls-list-item {
	padding-right: 1em;
}

.apps-mobile {
	display: none;
}

.footer-application-number {
	display: flex;
	justify-content: center;
	border-top: 1px solid var(--color-primary-blue);
	font-weight: 500;
	padding: 8px 0 15px 0;
	.fiviLabelContainer {
		padding-left: 5px;
	}
}

@media all and (max-device-width: 991px), all and (max-width: 991px) {
	footer {
		font-size: 14px;
	}

	.footer-columns-table {
		flex-direction: column;
		.footer-column {
			padding: 1em;
		}
	}

	.footer-column.apps {
		display: none;
	}

	.apps-mobile {
		display: flex;
		justify-content: center;
		.list-unstyled {
			display: flex;
			flex-direction: row;
		}

		.list-unstyled li {
			padding: 0 0.5em;
		}

		li img {
			height: 33px;
		}
	}

	.footer-copyright-trust,
	.footer-copyright {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		justify-items: center;
		.flex-row {
			display: flex;
			justify-content: center;
		}
	}

	.footer-trust .list-unstyled {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.footer-trust .list-unstyled li {
		text-align: center;
	}

	.footer-trust .icon-row {
		display: flex;
		justify-content: center;
		gap: 1rem;
		/* Space between icons */
	}

	.footer-application-number {
		padding-bottom: 30px;
	}
}

/*
    loader
*/
.loader {
	border-color: #d3d3d3;
	border-top-color: var(--color-primary-blue);
}

#proveWorking .loader,
.loading .loader {
	border-top-color: var(--color-primary-blue) !important;
}

.loader-container .loader {
	border-top-color: var(--color-primary-blue);
}

/*
    input
*/
input.form-control,
select.form-control {
	font-size: var(--font-size-input);
	font-weight: var(--font-weight-input);
	line-height: var(--font-lineheight-input);
	color: var(--font-color-input);
	font-family: var(--font-family-input);
	border: 1px solid var(--border-color);
	background-color: white;
	&:focus,
	&:active,
	&:hover {
		border: 2px solid var(--border-color-focus) !important;
		color: var(--font-color-label-focus);
	}
}

/*
    Sliders
*/
label.DefaultCBLabelClass,
input.DefaultRBControlClassV3 + label {
	&:before {
		background-color: #fff;
		border: 1px solid var(--color-gray-light);
	}

	&:after {
		background-color: var(--color-black-light);
		border-color: var(--border-color);
	}
}

input.DefaultCBControlClassV3:checked + label.DefaultCBLabelClass,
input.DefaultRBControlClassV3:checked + label {
	&:before {
		background-color: var(--color-secondary-lightblue-transparent);
		border-color: var(--color-primary-brightblue);
	}

	&:after {
		background-color: var(--color-primary-brightblue);
		border-color: var(--color-primary-brightblue);
	}
}

/*
    buttons
*/
button {
	text-transform: capitalize;
}

.button-primary,
.NextButton,
.defaultnextbutton {
	background-color: var(--color-primary-blue) !important;
	color: white !important;
	border: 2px solid var(--color-primary-blue) !important;
	border-radius: 5px !important;
	font-weight: 600 !important;
	&:visited {
		color: white;
	}

	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		border-radius: 5px !important;
		text-decoration: none;
		color: white;
	}
}

.NextButton {
	padding: var(--gap-vertical-25) var(--gap-horizontal-200);
	line-height: 18px;
	box-shadow: none;
	text-decoration: none;
}

.button-other {
	background-color: #fff;
	color: var(--color-primary-blue) !important;
	border: 1px solid var(--color-primary-blue) !important;
	border-radius: 5px;
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		background-color: var(--color-primary-blue) !important;
		color: var(--color-white-normal) !important;
		border-color: var(--color-primary-blue);
	}
}

.page-StatusCenterLoginPage .button-link,
.button-link-alt {
	font-weight: 600;
	color: var(--color-primary-blue);
}

.V3StatusCenterTableClass .button-other {
	background: #fff;
	color: var(--color-primary-blue);
	transition: none;
	border-color: var(--color-primary-blue);
	text-transform: capitalize;
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		background: var(--color-primary-blue);
		color: #fff;
		border-color: var(--color-primary-blue);
	}
}

.button-link,
.button-link-alt {
	background-color: transparent;
	border: 2px solid transparent;
	text-decoration: underline;
	color: var(--color-primary-blue) !important;
	font-weight: 600;
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		color: var(--color-primary-brightblue) !important;
		transition: none;
	}
}

.fiviIndividualHyperlinkList {
	& button {
		background: none;
		text-transform: capitalize;
		color: var(--color-primary-blue);
		font-weight: 600;
	}
}

.fiviLinkButton {
	background: var(--color-primary-blue);
	color: #fff;
	text-transform: capitalize;
	border-radius: 5px;
	border: 2px solid var(--color-primary-blue);
	padding: 4px 5px;
}

.fiviIndividualIncome > div {
	& .fiviIndividualIncomeRemoveButtonContainer:has(> button) {
		& > button {
			background-color: transparent;
			font-weight: 600;
			align-items: center;
			color: var(--color-primary-blue);
			text-decoration: underline;
		}
	}
}

/*
    Default Page
*/
.page-Default-Content .thumbnail {
	border-color: var(--border-color);
	color: var(--color-primary-blue);
	&:hover,
	&:active,
	&:focus {
		background-color: var(--color-secondary-lightblue-transparent);
	}
}

.thumbnail-img {
	color: var(--color-primary-blue);
}

.page-Default-Content .button-link {
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		color: var(--color-primary-blue);
		transition: none;
	}
}

/*
    Journey Bars
*/
/* bar at top on mobile devices*/
.fiviProgressBar:has(> #progBar) {
	border-bottom-color: var(--border-color);
}

#progBar .progress-bar-inner {
	background-color: var(--color-primary-normal);
}

/* left hand side on desktop */
#pbJourneyBar {
	display: flex;
	background-color: var(--color-secondary-normal);
	& > table {
		background-color: var(--background-color);
	}
}

#pbJourneyBar tr > td > span {
	font-size: calc(var(--font-size) - 2px);
	color: var(--color-gray-light);
}

#pbJourneyBar tr > td:before {
	font-size: calc(var(--font-size) - 2px);
	color: var(--color-gray-light);
}

#pbJourneyBar tr > td:after {
	font-size: calc(var(--font-size) - 2px);
	color: var(--color-gray-light);
}

#pbJourneyBar tr > td.current-group > span,
#pbJourneyBar tr > td.current-group:before {
	color: var(--color-primary-normal);
	font-weight: bold;
}

#pbJourneyBar tr > td.current-group:after {
	color: var(--font-color);
}

#pbJourneyBar tr > td:nth-of-type(1):after {
	content: "Help us try to find your information for the fastest, smoothest experience possible!";
}

#pbJourneyBar tr > td:nth-of-type(2):after {
	content: "Select or review your choices.";
}

#pbJourneyBar tr > td:nth-of-type(3):after {
	content: "Provide a little more information based on the accounts and services you selected.";
}

#pbJourneyBar tr > td:nth-of-type(4):after {
	content: "Let's make sure we've dotted our i's and crossed our t's.";
}

#pbJourneyBar tr > td:nth-of-type(5):after {
	content: "You have many options for your first deposit. Select the one that works for you!";
}

main:has(.no-funding-required:not([style*="display"])) {
	& #pbJourneyBar tr > td:nth-of-type(5):after {
		content: "You can now submit your application.";
	}
}

/* the one at the top on desktop */
.progress-container-main > .fiviProgressBar:has(> #pbJourneyBarMain) {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

#pbJourneyBarMain {
	width: 100%;
}

#pbJourneyBarMain table {
	border-bottom-color: var(--border-color);
}

#pbJourneyBarMain tr > td.journey-bar-group {
	& > span {
		& > span {
			/*journey title text*/
			font-size: calc(var(--font-size-h1) + 2px);
			font-weight: var(--font-weight-h1);
			color: var(--color-primary-blue);
		}
	}

	& > span:before {
		/* the # in #/5 */
		font-size: 20px;
		font-weight: 800;
		font-family: var(--font-family-alt);
		color: var(--color-primary-normal);
	}

	& > span:after {
		/* the /5 */
		font-size: 20px;
		font-family: var(--font-family-alt);
		color: #8d93b2;
		width: 21px;
	}

	&:after {
		/* the circle around */
		border-color: var(--color-black-light);
	}
}

/* TruStage */

/* TruStage */

.TruStageProductPanel {
	background: #f7faff;
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0, 32, 91, 0.08);
	padding: 24px;
	margin-bottom: 32px;
	border: 1px solid #e0e8f4;
	max-width: 850px;
}

.TruStageOfferPanel {
	background: #fff;
	border: 1px solid #dde6ef;
	border-radius: 6px;
	margin: 16px 0;
	padding: 18px 20px 16px 20px;
	transition: box-shadow 0.2s;
}

.TruStageOfferPanelClass-wrapper {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.TruStageProductName {
	font-size: 1.2rem;
	font-weight: 700;
	color: #18447e;
	margin-bottom: 4px;
}

.TruStageInsuranceProductName {
	font-size: 1.1rem;
	font-weight: 600;
	color: #2b66a1;
	margin-bottom: 20px;
}

.TruStageHeadline {
	font-weight: 600;
	padding-bottom: 8px;
}

.fiviTruStageLoanShortDescriptionClass {
	line-height: 1.3;
	p {
		margin-top: 10px;
	}
}

.TruStageLoanProductAnswerClass {
	display: flex;
	gap: 20px;
	padding: 12px 0 6px 0;
	font-size: 1rem;
	margin-bottom: 8px;
	vertical-align: top;
}

.TruStageLoanProductAnswerClass input.DefaultRBControlClassV3 + label {
	align-items: flex-start;
}

.TruStageLongDescription {
	margin: 12px 0 8px 0;
	font-size: 1rem;
	color: #31415a;
	line-height: 1.45;
}

.TruStageLongDescription ul {
	margin-left: 2em;
	padding-left: 1.5em;
	list-style-type: disc;
}

.TruStageFormProductNameClass {
	background: transparent;
	color: var(--color-primary-blue);
	border: none;
	cursor: pointer;
	font-size: 1rem;
	margin-top: 20 !important;
	text-decoration: underline;
	font-weight: 500;
}

.TruStageFormProductNameClass:hover {
	color: var(--color-primary-brightblue);
}

.TruStageMoreInfo {
	margin-top: 10 !important;
	margin-bottom: 20 !important;
}

/* 
    Prove 
*/
.prove-new .prove-user-img-container {
	background-color: var(--color-primary-normal);
	border-color: var(--color-primary-normal);
	color: white;
}

/* Navigation */
@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.navigation-other-container {
		align-items: center;
	}
}

/* Disclosures  */
.fiviDisclosureList {
	& .DisclosureLinkV3 {
		color: var(--color-primary-blue);
		text-decoration: underline;
		font-weight: 500;
		text-transform: capitalize;
		&:hover {
			color: var(--color-primary-brightblue);
		}
	}
}

.disclosure-loan-statements {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--gap-vertical) var(--gap-horizontal);
	border: 1px solid var(--border-color);
	border-radius: 5px;
	padding: var(--gap-horizontal-75);
	width: 100%;
	.page-text {
		padding: 5px 0;
	}

	.horizontal-divider {
		margin-top: 1em;
	}
}

.pnlBackupWithholding {
	background: var(--color-background-gray);
}

/* Funding */
.fiviProductFundingItem > .fiviFundingInput > label::after {
	color: var(--color-primary-brightblue);
}

.submit-section .section-header {
	text-transform: inherit;
}

.submit-section .flex-column > ul {
	padding: 0 2em;
}

.ach-container button {
	background: var(--color-primary-blue);
	padding: var(--gap-vertical-25) var(--gap-horizontal-200);
	color: white;
	border: 2px solid var(--color-primary-blue);
	border-radius: 5px;
	font-size: 15px;
	line-height: 18px;
	font-weight: 400;
	box-shadow: none;
	text-decoration: none;
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		background: var(--color-primary-red);
		border-color: var(--color-primary-red);
		text-decoration: none;
		color: white;
	}

	&:disabled {
		opacity: 0.5;
	}
}

.fund-now-selector-container .fiviCheckBox,
.funding-method-container .fiviRadioButton {
	& .DefaultLabelClass,
	& .DefaultCBLabelClass {
		border: 1px solid var(--color-primary-blue);
		color: var(--color-primary-blue);
	}

	& .DefaultLabelClass:hover,
	& .DefaultLabelClass:active,
	& .DefaultLabelClass:focus,
	& input:checked + .DefaultLabelClass,
	& .DefaultCBLabelClass:hover,
	& .DefaultCBLabelClass:active,
	& .DefaultCBLabelClass:focus,
	& input:checked + .DefaultCBLabelClass {
		background-color: var(--color-primary-blue);
	}
}

/* Approved */

.page-Approved ul ul li {
	margin-left: 2em;
}

/* Status Center  */

.V3StatusCenterLogin .btn-default {
	background-color: var(--color-primary-blue) !important;
	color: white !important;
	border: 2px solid var(--color-primary-blue) !important;
	border-radius: 5px !important;
	font-weight: 600 !important;
	text-shadow: none;
	box-shadow: none;
	&:visited {
		color: white;
	}

	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		border-radius: 5px !important;
		text-decoration: none;
		color: white;
	}
}

.V3StatusCenterLogin .fiviLinkButton {
	background-color: var(--color-primary-blue) !important;
	color: white !important;
	border: 2px solid var(--color-primary-blue) !important;
	border-radius: 5px !important;
	font-weight: 600 !important;
	&:visited {
		color: white;
	}

	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		border-radius: 5px !important;
		text-decoration: none;
		color: white;
	}
}

.page-StatusCenter {
	input.btn-link.fiviLinkButton,
	button.btn.btn-link.fiviLinkButton,
	.LinkClass {
		border: none !important;
		text-decoration: underline;
		color: var(--color-primary-blue);
		text-transform: capitalize;
		background: none;

		&:visited {
			text-decoration: underline;
			color: var(--color-primary-brightblue);
		}

		&:hover {
			text-decoration: underline;
			color: var(--color-primary-brightblue);
		}

		&:focus {
			outline: none !important;
		}
		&:focus-visible {
			outline: 2px solid var(--color-primary-blue);
			outline-offset: 0;
			width: fit-content;
		}
	}
}

.page-StatusCenter input.btn-default {
	background-color: white !important;
	color: var(--color-primary-blue) !important;
	border: 2px solid var(--color-primary-blue) !important;
	border-radius: 5px !important;
	font-weight: 600 !important;
	text-shadow: none;
	box-shadow: none;
	width: 60%;
	text-transform: capitalize;
	white-space: normal;
	word-break: break-word;

	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		border-radius: 5px !important;
		text-decoration: none;
		color: white !important;
		background-color: var(--color-primary-blue) !important;
	}
}

.page-statuscenter .V3SummaryControl .container-fluid > div > .task {
	text-decoration: none;
}

.page-statuscenter .task .V3SummaryButtons {
	background: #fff !important;
	border: 2px solid var(--color-primary-blue) !important;
	color: var(--color-primary-blue) !important;
	font-weight: 600;
	text-shadow: none;
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		background-color: var(--color-primary-blue) !important;
		border: 2px solid var(--color-primary-blue) !important;
		color: #fff !important;
	}
}

.page-statuscenter .V3SummaryControl .container-fluid > div > .task > .task-icon {
	fill: var(--color-primary-blue);
}

.page-statuscenter .V3SummaryControl .container-fluid > div > .task .task-title {
	color: var(--color-primary-blue);
}

.page-statuscenter article .task:hover {
	background-color: var(--color-secondary-lightblue-transparent);
	color: #000;
}

.page-statuscenter .V3SummaryHeader > #topNav > ul > .nav-item > a {
	color: var(--color-primary-blue) !important;
	fill: var(--color-primary-blue) !important;
	text-decoration: none;
	&:hover {
		color: var(--color-primary-brightblue) !important;
		fill: var(--color-primary-brightblue) !important;
		text-decoration: underline;
	}
}

.page-statuscenter .V3SummaryHeader > #topNav > ul > .nav-item.active > a {
	color: var(--color-primary-brightblue) !important;
	fill: var(--color-primary-brightblue) !important;
}

.page-statuscenter .V3SummaryHeader > #topNav > ul > .nav-item .badge {
	background-color: var(--color-primary-red);
}

.page-StatusCenter {
	.button-link {
		text-decoration: none;
		transition: none;
	}

	.button-link:hover {
		text-decoration: underline;
	}
}

.page-statuscenter .fiviDocumentList .V3StatusCenterTableClass tbody tr td:before {
	margin-top: 15px !important;
	text-align: center;
}

.page-statuscenter fiviDocumentList .V3StatusCenterTableClass tbody tr td:first-child,
.V3StatusCenterTableClass tbody tr td:last-child {
	border-top: none !important;
}

.page-statuscenter .fiviDocumentList .V3StatusCenterTableClass .btn-default {
	background: #fff;
	border: 1px solid var(--color-primary-blue);
	color: var(--color-primary-blue);
	text-shadow: none;
	font-weight: 600;
	&:hover {
		background: var(--color-primary-blue);
		color: #fff;
	}
}

/* Check order temp fix*/

.fiviCheckOrderOptions {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-75);
	& > div:has(select) {
		display: block !important;
	}

	.fiviBtnContainer {
		text-align: center;
	}
}

/* General Table Overrides */
.V3StatusCenterTableClass {
	width: 100%;
	margin: 0;
	border: 1px solid var(--color-gray-dark);
	box-shadow: none;
}

.V3StatusCenterTableClass > tbody,
.V3StatusCenterTableClass > thead {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.fV3StatusCenterTableClass > tbody > tr,
.V3StatusCenterTableClass > thead > tr {
	display: flex;
	flex-wrap: nowrap;
	position: relative;
	padding: 0 var(--column-spacer);
	border: none;
	border-bottom: 1px solid black;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}

.V3StatusCenterTableClass th,
.V3StatusCenterTableClass td {
	width: 100%;
	padding: var(--gap-horizontal) 0 !important;
	background-color: transparent !important;
	text-align: center;
}

/* Documents */

header:has(#nav-docs.active) + article table.V3StatusCenterTableClass td:first-child {
	border-top: none !important;
}

@media screen and (min-width: 801px) {
	header:has(#nav-docs.active) + article table.V3StatusCenterTableClass tr td {
		border: none;
	}
}

@media screen and (max-width: 801px) {
	header:has(#nav-docs.active) + article table.V3StatusCenterTableClass td > div span:has(.fiviFileUpload) {
		padding-bottom: 1rem;
	}

	/* Remove bootstrap padding for table */
	.V3StatusCenterTableClass > tbody > tr {
		padding: 0 !important;
	}
}

/* Mobile styles */
@media screen and (max-width: 992px) {
	/* Base table styles */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass {
		width: 100%;
		border-collapse: collapse;
		table-layout: auto;
		font-size: 1rem;
		border: 1px solid var(--color-gray-dark);
		/* border-radius: 5px; */
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass thead,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tbody,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass th,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tr {
		display: block;
		width: 100%;
		justify-content: center !important;
		text-align: center !important;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass thead {
		display: none;
	}

	/* Separate table rows  */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tr:not(header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tr:first-child) {
		border-top: 1px solid black;
		margin: 0;
		padding: 0.5rem 0;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td {
		border: none;
		padding: 0.5rem 1rem;
		position: relative;
		text-align: left;
		border-top: 1px solid rgb(221, 221, 221) !important;
		padding: 0.5rem 1rem;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:first-child {
		border-top: none !important;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td::before {
		display: block;
		font-weight: bold;
		color: #333;
		margin-bottom: 0.25rem;
		font-size: var(--font-size-h3);
		line-height: var(--font-lineheight-h4);
		color: var(--font-color-h4);
		font-weight: 600;
		font-family: var(--font-family-h4);
		text-decoration: underline;
	}

	/* Custom labels per column */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:nth-of-type(1)::before {
		content: "Application Name";
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:nth-of-type(2)::before {
		content: "Date Started";
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:nth-of-type(3)::before {
		content: "Status";
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass input.button-link {
		text-align: center;
	}

	/* Striping override (optional) */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass.table-striped > tbody > tr:nth-child(odd) > td,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass.table-striped > tbody > tr:nth-child(odd) > th {
		background: none;
	}

	.V3StatusCenterTableClass:has(.V3MessagesHeaderClass) tbody tr td:first-child {
		border-bottom: none !important;
	}
}

/* Messages*/

header:has(#nav-messages.active) + article span {
	display: inline-block !important;
	text-align: center;
}

header:has(#nav-messages.active) + article .fiviBtnContainer {
	padding: 1em 0;
}

header:has(#nav-messages.active) + article span.button-link {
	min-width: auto;
}

/* Base styles for table on larger screens */
header:has(#nav-messages.active) + article table.V3StatusCenterTableClass {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--color-gray-dark);
	/* border-radius: 5px; */
}

/* Mobile-friendly styles */
@media screen and (max-width: 992px) {
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass thead {
		display: none; /* Hide headers on small screens */
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass tbody,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass tr,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td {
		display: block;
		width: 100%;
		text-align: center !important;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass tr,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tr,
	header:has(#nav-docs.active) + article table.V3StatusCenterTableClass tr {
		margin: 1rem 0;
		/* padding: 0.5rem; */
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td {
		padding: 0.5rem;
		text-align: center;
		position: relative;
		border-top: none;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass th.hidden-sm.hidden-xs,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td.hidden-sm.hidden-xs {
		display: table-cell !important;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td.hidden-sm.hidden-xs {
		text-align: center !important;
		display: block !important;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td::before {
		display: block;
		font-weight: bold;
		color: #333;
		margin-bottom: 0.25rem;
		font-size: var(--font-size-h3);
		line-height: var(--font-lineheight-h4);
		color: var(--font-color-h4);
		font-weight: 600;
		font-family: var(--font-family-h4);
		text-decoration: underline;
	}

	/* Labels using nth-child to mimic headers */
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td:nth-child(1)::before {
		content: "Application:";
		font-weight: 600;
		display: block;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td:nth-child(2)::before {
		content: "Subject:";
		font-weight: 600;
		display: block;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td:nth-child(3)::before {
		content: "Date:";
		font-weight: 600;
		display: block;
	}

	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass.table-striped > tbody > tr:nth-child(odd) > td,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass.table-striped > tbody > tr:nth-child(odd) > th {
		background: none;
	}
}

@media screen and (min-width: 990px) {
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass th,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass th {
		border-bottom: 1px solid black !important;
	}

	/* Base table layout fix */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass {
		display: table !important;
		width: 100% !important;
		border-collapse: collapse !important;
		table-layout: fixed !important;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass thead,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass thead,
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tbody,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass tbody {
		display: table-row-group !important;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass tr,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass tr {
		display: table-row !important;
	}

	/* Header cells */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td {
		display: table-cell !important;
		font-weight: bold;
		background-color: #f0f0f0;
		border-bottom: 2px solid black !important;
		padding: 0.75rem;
		text-align: center;
	}

	/* Body cells */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td {
		display: table-cell !important;
		text-align: center;
		padding: 0.75rem;
		border-bottom: 1px solid #ccc;
		vertical-align: middle;
		word-break: break-word;
	}

	/* Column widths */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:nth-child(1),
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td:nth-child(1),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td:nth-child(1),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td:nth-child(1) {
		width: 40%;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:nth-child(2),
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td:nth-child(2),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td:nth-child(2),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td:nth-child(2) {
		width: 30%;
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass td:nth-child(3),
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td:nth-child(3),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass td:nth-child(3),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass .V3MessagesHeaderClass td:nth-child(3) {
		width: 30%;
	}

	/* Zebra striping */
	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass.table-striped tbody tr:nth-child(odd),
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass.table-striped tbody tr:nth-child(odd) {
		/* background-color: #f9f9f9 !important; */
	}

	header:has(#nav-apps.active) + article table.V3StatusCenterTableClass.table-striped tbody tr td,
	header:has(#nav-messages.active) + article table.V3StatusCenterTableClass.table-striped tbody tr td {
		background-color: transparent !important;
	}
}

/* Check Order */

.fiviCheckOrder button {
	margin-top: 1em;
	background-color: #fff;
	color: var(--color-primary-blue);
	border: 1px solid var(--color-primary-blue);
	border-radius: 5px;
	max-width: var(--fiviInput-width);
	min-width: var(--fiviInput-width-half);
	width: fit-content !important;
	padding: var(--gap-vertical-50) var(--gap-horizontal-150);
	text-transform: capitalize;
	&:hover:not(:disabled),
	&:active:not(:disabled),
	&:focus:not(:disabled) {
		background-color: var(--color-primary-blue);
		color: var(--color-white-normal);
		border-color: var(--color-primary-blue);
	}
}

.pnlAutoDeduct {
	width: 100%;
}
