/*Custom style sheet for Certified Document*/

.clay-font{
    font-family: arial,Gadget,sans-serif;
}
.clay_header_1{
    color: grey;
    font-size: 22px;
    display: block;
    letter-spacing: 4px;
    padding-left: 10px;
    padding-bottom: 3px;
    /*display: inline-block;*/
}

.clay_header_1 a{
    color: white;
    font-size:x-large;

}
.clay_header_2{
    color: grey;
    font-size: 16px;
    display: block;
    padding-left: 10px;
    padding-bottom: 3px;
    /*display: inline-block;*/
}
.clay_header_2 a{
    color: lightblue;
    font-size:large;

}

.clay_header_3{
    color: grey;
    font-size: 18px;
    display: block;
    padding-left: 10px;
    /*display: inline-block;*/
}
.clay_header_3 a{
    color: black;
    font-size:large;

}

.clay-user_action{
    padding-top: 100px;
    padding-left: 500px;
    display: block;
}

.clay_image_button{
    /*border:thin solid grey ;*/
    padding: 3px 30px 10px 3px;
    color: darkslategrey ;
    font-size: 16px;
    letter-spacing: 4px;
}

.clay_image_button:hover{
    background-color: darkgray;
    color:white;
}

.clay-panel-header-color{
    background-color: #85e085;
    text-shadow:none;
    border-radius: initial;
}

.clay-sidebar{
    padding-left: 0px;
    padding-top: 10px;
    height: -webkit-calc(100vh);
    height: -moz-calc(100vh);
    height: calc(110vh);
    /*background-color: lightgrey;*/
    background: linear-gradient(to top, rgba(255,255,255,0) 30%,lightgrey 50%);
}

.clay-sidebar-sidemenu >a:hover{
    background-color: lightgray;
    color: black;
}


.clay-sidebar-sidemenu:hover{
    background-color: lightgray;
}

.clay-logo-gradient {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 0;
    left: 0;
    height: 300px;
    background: none;
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 30%, lightgrey 50%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,rgba(255,255,255,0)), color-stop(50%,lightgrey));
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 30%,lightgrey 50%);
    background: -o-linear-gradient(left, rgba(255,255,255,0) 30%,lightgrey 50%);
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 30%,lightgrey 50%);
    background: linear-gradient(to right, rgba(255,255,255,0) 30%,lightgrey 50%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
}

.navbar-top-login > li >a{
    padding-top: 0px !important;
    font-size: 9px !important;
}

.navbar-top-login > li > a:before {
    content: none !important;
}
/*
    Jul-26-2017 - added style for type='file'
                  made the input box responsive
*/
/*input[type="file"] {
    display: none;
}*/
.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
    width: 100%;
}

.custom-panel-body-color{
    background-color: lightgrey;
}

#pdf-viewer {
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.1);
	overflow: auto;
}

.pdf-page-canvas {
	display: block;
	/*margin: 5px auto;*/
	width: 100%;
	border: 1px solid rgba(0, 0, 0, 0);
}



.pagination {
	display: inline-block;
	padding-left: 0;
	margin: 20px 0;
	border-radius: 4px;
}

	.pagination > li {
		display: inline;
	}

		.pagination > li > a,
		.pagination > li > span {
			position: relative;
			float: left;
			padding: 6px 12px;
			margin-left: -1px;
			line-height: 1.42857143;
			color: #337ab7;
			text-decoration: none;
			background-color: #fff;
			border: 1px solid #ddd;
		}

		.pagination > li:first-child > a,
		.pagination > li:first-child > span {
			margin-left: 0;
			border-top-left-radius: 4px;
			border-bottom-left-radius: 4px;
		}

		.pagination > li:last-child > a,
		.pagination > li:last-child > span {
			border-top-right-radius: 4px;
			border-bottom-right-radius: 4px;
		}

		.pagination > li > a:hover,
		.pagination > li > span:hover,
		.pagination > li > a:focus,
		.pagination > li > span:focus {
			z-index: 2;
			color: #23527c;
			background-color: #eee;
			border-color: #ddd;
		}

	.pagination > .active > a,
	.pagination > .active > span,
	.pagination > .active > a:hover,
	.pagination > .active > span:hover,
	.pagination > .active > a:focus,
	.pagination > .active > span:focus {
		z-index: 3;
		color: #fff;
		cursor: default;
		background-color: #337ab7;
		border-color: #337ab7;
	}

	.pagination > .disabled > span,
	.pagination > .disabled > span:hover,
	.pagination > .disabled > span:focus,
	.pagination > .disabled > a,
	.pagination > .disabled > a:hover,
	.pagination > .disabled > a:focus {
		color: #383838;
		cursor: not-allowed;
		background-color: #fff;
		border-color: #ddd;
	}

.pagination-lg > li > a,
.pagination-lg > li > span {
	padding: 10px 16px;
	font-size: 18px;
	line-height: 1.3333333;
}

.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}

.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}

.pagination-sm > li > a,
.pagination-sm > li > span {
	padding: 5px 10px;
	font-size: 12px;
	line-height: 1.5;
}

.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

.no-close .ui-dialog-titlebar-close {
	display: none
}

.ui-dialog-titlebar-close {
	border: none;
	background: transparent;
}

.ui-dialog-titlebar-close::before {
	content: "×";
	font-size: 20px;
	font-weight: bold;
	line-height: 20px;
	color: #333;
}



/* Hovering for verification tabs */
.hover-tabs .nav-link {
	transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.hover-tabs .nav-link:hover {
	background-color: #e9ecef;
	box-shadow: inset 0 0 0 2px #0056b3;
}

.hover-tabs .nav-link:focus,
.hover-tabs .nav-link:focus-visible {
	outline: 3px solid #0056b3;
	outline-offset: 2px;
	background-color: #e9ecef;
}

.hover-tabs .nav-link.active {
	background-color: #0056b3;
	color: #ffffff;
}

/* Tables for audit, courts and or search */
table.SearchTable {
	font-size: 12px;
	line-height: 1.5;
}

table.SearchTable th, table.SearchTable td {
	font-size: 12px;
	padding: 10px;
}

table.SearchTable .align-middle {
	font-size: 12px;
}

table.SearchTable .g-font-weight-300 {
	font-weight: normal;
}

table.SearchTable .g-font-weight-300.g-color-black {
	font-size: 12px;
}
/* No record found for searches*/
.search-warning-bg {
	background-color: white !important;
	border-color: #6e0909 !important;
	padding: 0.71429rem 1.07143rem;
	padding: .75rem 1.25rem;
	margin-bottom: 0;
	border-bottom: 1px solid rgba(0,0,0,.125)
}	
.search-warning {
	color: #863104 !important;
}

.search-warning:focus {
	color: #863104 !important;
}
/* Red Alert Text*/
.red-alert {
	color: #9E0000;
}

/* Red Alert Background */
.red-alert-bg {
	background-color: #9E0000 !important;
}

/* Default Green Background */
.green-bg {
	background-color: #26735D !important;
}

/* Default Green Background */
.green-txt {
	color: #26735D !important;
}

/* Hovering for search tabs */
.hover-search .nav-link {
	transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.hover-search .nav-link:active {
	box-shadow: inset 0 0 0 2px #0056b3;
	background-color: white;
	color: #383838;
}

.hover-search .nav-link:focus, .hover-search .nav-link:hover {
	box-shadow: inset 0 0 0 2px #0056b3;
	background-color: rgba(255, 255, 255, 0.75);
	color: #383838;
}

.hover-search .nav-link:hover:active,
.hover-search .nav-link:focus:active {
	background-color: white !important;
}

/* OR/VR Details Panel */
details-display {
	font-size: 12px;
	line-height: 1.5;
}
table.details-display th, table.details-display td {
	font-size: 12px;
	padding: 10px;
}

/* Order Official Records Dropdown - doesn't invert on dropdown as the way the menu 
	is structued deactivates the css if the cursor is moved off of the dropdown. 
	Switching the dropdown to a proper css dropdown menu could help solve this issue. 
*/
.u-btn-dropdown-select {
	color: #fff;
	background-color: #26735D;
	border-color: #fff;
}

.u-btn-dropdown-select:hover,
.u-btn-dropdown-select.active,
.u-btn-dropdown-select.focus,
.terms-dropdown-toggle:focus {
	background-color: #1D5847;
	border-color: #fff;
}
 /* highlight on keyboard navigation */
.terms-dropdown-toggle:focus-visible,
.u-btn-dropdown-select:focus-visible {
	outline: 2px solid #0d6efd !important; 
	outline-offset: 2px !important;
	}


.btn-group .terms-dropdown-toggle:active,
.btn-group.open .terms-dropdown-toggle {
	outline: 0;
}

.btn-group > .btn + .terms-dropdown-toggle {
	padding: 0 8px;
}

.btn-group > .btn-lg + .terms-dropdown-toggle {
	padding: 0 12px;
}

.terms-dropdown-toggle:focus {
	outline: 1px;
}

/* Terms and Conditions - doesn't invert when disabled */
.u-btn-terms-conditions {
	color: #fff;
	background-color: #26735D;
}

.u-btn-terms-conditions:hover, .u-btn-terms-conditions.active {
	border-color: #26735D;
	color: #26735D !important;
	background-color: #FFF;
	outline: 3px solid #26735D;
}

.u-btn-terms-conditions:hover, .u-btn-terms-conditions:focus, .u-btn-terms-conditions.active {
	border-color: #26735D;
	color: #26735D !important;
	background-color: #FFF;
	outline: 3px solid #26735D;
}

.u-btn-terms-conditions.g-btn-hover-reset:hover, .u-btn-terms-conditions.g-btn-hover-reset.active {
	border-color: #26735D;
	color: #26735D !important;
	background-color: #FFF;
	outline: 3px solid #26735D;
}

.u-btn-terms-conditions:disabled {
	color: #fff !important;
	background-color: #26735D;
	border-color: #26735D;
	cursor: not-allowed;
	outline: none;
}

.u-btn-terms-conditions:disabled:hover,
.u-btn-terms-conditions:disabled.active,
.u-btn-terms-conditions:disabled:focus {
	color: #fff !important;
	background-color: #26735D;
	border-color: #26735D;
	outline: none;
}

/* Registered User Login Button*/
.u-btn-ru-login {
	color: #fff;
	background-color: #9E5700;
}

.u-btn-ru-login:hover, .u-btn-ru-login:focus, .u-btn-ru-login.active {
	border-color: #9E5700;
	color: #9E5700 !important;
	background-color: #FFF;
	outline: 3px solid #9E5700;
}

.u-btn-ru-login.g-btn-hover-reset:hover, .u-btn-ru-login.g-btn-hover-reset.active {
	border-color: #9E5700;
	color: #9E5700 !important;
	background-color: #FFF;
	outline: 3px solid #9E5700;
}
/* Verify button */
.btn-verify {
	line-height: 1.4;
	padding: 0.57143rem 1.42857rem;
	font-size: 1.07143rem;
	color: #fff;
	background-color: #26735D;
}
.btn-verify:hover, .btn-verify:focus, .btn-verify.active {
	border-color: #26735D;
	color: #26735D !important;
	background-color: #FFF;
	outline: 1px solid #26735D;
}

/* Receipt lookup button on homepage */
.btn-lookup {
	background-color: #9E5700;
}

.btn-lookup:hover, .btn-lookup:focus, .btn-lookup.active {
	border-color: #9E5700;
	color: #9E5700 !important;
	background-color: #FFF;
	outline: 2px solid #9E5700;
}

/* Submit button on receipt lookup*/
.btn-lookup-submit {
	color: #fff;
	background-color: #26735D;
}

.btn-lookup-submit:hover, .btn-lookup-submit:focus, .btn-lookup-submit.active {
	border-color: #26735D;
	color: #26735D !important;
	background-color: #FFF;
	outline: 2px solid #26735D;
}

/* No text decoration - used for dashboards*/
.text-decoration-none, .text-decoration-none:hover, .text-decoration-none:focus, .text-decoration-none.active {
	text-decoration: none !important;
}
/* underline - used for verification result */
.text-decoration-underline {
	text-decoration: underline !important;
}
	/* underline - used for verification result */
.text-decoration-underline:hover, .text-decoration-underline:focus, .text-decoration-underline.active {
	text-decoration: underline !important;
	border-bottom: 3px double;
}
/* underline - used for navigation on banner */
.text-decoration-underline-hover {
	text-decoration: none !important;
}
/* underline - used for navigation on banner */
.text-decoration-underline-hover:hover, .text-decoration-underline-hover:focus, .text-decoration-underline-hover.active {
	text-decoration: underline !important;
	text-underline-offset: 2px;
}

.u-btn-order-confirmation {
	color: #fff;
	background-color: #26735D;
	border-radius: 4px;
	border-color: #26735D;
}

.u-btn-order-confirmation:hover, .u-btn-order-confirmation:focus, .u-btn-order-confirmation.active {
	border-color: #26735D;
	color: #26735D !important;
	background-color: #FFF;
	outline: 1px solid #26735D;
}
.certified-doc-loader-hidden {
	opacity: 0;
	transition: opacity 0.2s ease;
}

.certified-doc-loader {
	width: 50%;
	display: block;
	margin: 0 auto;
	transition: opacity 0.4s ease;
}

.homepage-contact-us-btn {
	background-color: rgba(255, 255, 255, 0.2) !important;
	color: #fff !important;
	border-color: #FFF !important;
}

.homepage-contact-us-btn:hover, .homepage-contact-us-btn:focus, .homepage-contact-us-btn.active {
	border-color: #5E308D !important;
	color: #5E308D !important;
	background-color: #FFF !important;
}
.homepage-email-us-btn {
	background-color: rgba(255, 255, 255, 0.2) !important;
	color: #fff !important;
	border-color: #FFF !important;
}

.homepage-email-us-btn:hover, .homepage-email-us-btn:focus, .homepage-email-us-btn.active {
	border-color: #10564C !important;
	color: #10564C !important;
	background-color: #FFF !important;
}
.homepage-faq-btn {
	background-color: rgba(255, 255, 255, 0.2) !important;
	color: #fff !important;
	border-color: #FFF !important;
}

.homepage-faq-btn:hover, .homepage-faq-btn:focus, .homepage-faq-btn.active {
	border-color: #15547E !important;
	color: #15547E !important;
	background-color: #FFF !important;
}

/* Blue outlline for text field */
.txt-field-blue-outline:active, .txt-field-blue-outline:focus {
	box-shadow: 0 0 0 2px #FFF !important;
	border: 2px solid #0618ff !important;
}
.txt-field-blue-outline:hover {
	box-shadow: 0 0 0 2px #FFF !important;
	border: 2px solid #590CFA !important;
}

.txt-field-blue-outline-focus-only:focus {
	box-shadow: 0 0 0 1px #FFF !important;
	border: 1px solid #0618ff !important;
}

/* Checkbox on Select County page*/
.visually-hidden-input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

#idTermsAgreed:focus-visible + .u-check-icon-checkbox-v6 {
	box-shadow: 0 0 0 2px #FFF;
	outline: 2px solid #007bff;
}

/* For login page */
.visually-hidden-input:focus-visible + .u-check-icon-checkbox-v6 {
	outline: 2px solid #0d6efd;
	outline-offset: 2px;
}

/* Online Dashboard*/

/*background transition*/
.dashboard-card-blue-bg-hover,
dashboard-card-green-bg-hover,
dashboard-card-purple-bg-hover,
dashboard-card-bluegrey-bg-hover,
dashboard-card-light-blue-bg-hover,
dashboard-card-light-green-bg-hover,
dashboard-card-light-purple-bg-hover,
dashboard-card-light-red-bg-hover {
	transition: background-color 0.2s ease, border-color 0.2s ease;
}
.dashboard-card-blue-bg-hover:hover,
.dashboard-card-blue-bg-hover:focus,
.dashboard-card-blue-bg-hover:focus-within,
.dashboard-card-blue-bg-hover:active {
	background-color: #15547E;
	border-color: #15547E;
}
.dashboard-card-light-blue-bg-hover:hover,
.dashboard-card-light-blue-bg-hover:focus,
.dashboard-card-light-blue-bg-hover:focus-within,
.dashboard-card-light-blue-bg-hover:active {
	background-color: #14586B;
	border-color: #14586B;
}
.dashboard-card-green-bg-hover:hover,
.dashboard-card-green-bg-hover:focus,
.dashboard-card-green-bg-hover:focus-within,
.dashboard-card-green-bg-hover:active {
	background-color: #26735D;
	border-color: #26735D;
}
.dashboard-card-light-green-bg-hover:hover,
.dashboard-card-light-green-bg-hover:focus,
.dashboard-card-light-green-bg-hover:focus-within,
.dashboard-card-light-green-bg-hover:active {
	background-color: #416D1C;
	border-color: #416D1C;
}
.dashboard-card-purple-bg-hover:hover,
.dashboard-card-purple-bg-hover:focus,
.dashboard-card-purple-bg-hover:focus-within,
.dashboard-card-purple-bg-hover:active {
	background-color: #2D1650;
	border-color: #2D1650;
}
.dashboard-card-light-purple-bg-hover:hover,
.dashboard-card-light-purple-bg-hover:focus,
.dashboard-card-light-purple-bg-hover:focus-within,
.dashboard-card-light-purple-bg-hover:active {
	background-color: #491650;
	border-color: #491650;
}
.dashboard-card-bluegrey-bg-hover:hover,
.dashboard-card-bluegrey-bg-hover:focus,
.dashboard-card-bluegrey-bg-hover:focus-within,
.dashboard-card-bluegrey-bg-hover:active {
	background-color: #2C6581;
	border-color: #2C6581;
}
.dashboard-card-light-red-bg-hover:hover,
.dashboard-card-light-red-bg-hover:focus,
.dashboard-card-light-red-bg-hover:focus-within,
.dashboard-card-light-red-bg-hover:active {
	background-color: #8D4D2A;
	border-color: #8D4D2A;
}

/* removes link outline inside card */
.dashboard-card-blue-bg-hover a:focus-visible,
.dashboard-card-light-blue-bg-hover a:focus-visible,
.dashboard-card-green-bg-hover a:focus-visible,
.dashboard-card-light-green-bg-hover a:focus-visible,
.dashboard-card-purple-bg-hover a:focus-visible,
.dashboard-card-light-purple-bg-hover a:focus-visible,
.dashboard-card-bluegrey-bg-hover a:focus-visible,
.dashboard-card-light-red-bg-hover a:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px #007bff;
}

/* text transition */
.dashboard-card-white-txt-hover {
	transition: color 0.2s ease !important;
}

/* change text to white */
.dashboard-card-white-txt-hover:hover *,
.dashboard-card-white-txt-hover:focus *,
.dashboard-card-white-txt-hover:active * {
	color: #fff !important;
	transition: color 0.2s ease !important;
}

/* formatting for elements inside u block */
.u-block-hover:hover .dashboard-card-white-txt-hover,
.u-block-hover:focus .dashboard-card-white-txt-hover,
.u-block-hover:focus-within .dashboard-card-white-txt-hover,
.u-block-hover:active .dashboard-card-white-txt-hover {
	color: #fff !important;
	transition: color 0.2s ease !important;
}
/* formatting for elements inside icon block */
.u-icon-block--hover:hover .dashboard-card-white-txt-hover,
.u-icon-block--hover:focus .dashboard-card-white-txt-hover,
.u-icon-block--hover:focus-within .dashboard-card-white-txt-hover,
.u-icon-block--hover:active .dashboard-card-white-txt-hover {
	color: #fff;
	transition: color 0.2s ease !important;
}

/* formatting for paragraphs and elements inside card */
.dashboard-card-blue-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-blue-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-blue-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-light-blue-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-light-blue-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-light-blue-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-green-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-green-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-green-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-light-green-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-light-green-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-light-green-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-purple-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-purple-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-purple-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-light-purple-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-light-purple-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-light-purple-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-bluegrey-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-bluegrey-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-bluegrey-bg-hover:focus-within .g-font-weight-600,
.dashboard-card-light-red-bg-hover:focus-within .dashboard-card-white-txt-hover,
.dashboard-card-light-red-bg-hover:focus-within .g-color-gray-dark-v5,
.dashboard-card-light-red-bg-hover:focus-within .g-font-weight-600 {
	color: #fff !important;
	transition: color 0.2s ease !important;
}
	/* used in ORlistview for keyboard navigation on the returned table results */
	.detail-view-btn {
		background: none; 
		border: none;
		padding: 0; 
		margin: 0; 
		cursor: pointer; 
		color: inherit; 
		font: inherit; 
	}

	.detail-view-btn:focus { /*  focus */
		outline: 2px solid #0618ff;
		outline-offset: 2px;
	}

	.detail-view-btn:hover i {
		color: #0618ff; /* hover  */
	}

	.detail-view-btn:active i {
		color: #0F3C61; /*  active  */
	}

	/* Courts button (available, VOR, Confidential, etc. */
	.courts-view-image-btn {
		border: none;
		outline: none;
		box-shadow: none;
	}
	.courts-view-image-btn:focus {
		outline: 2px solid #0618ff;
		outline-offset: 2px;
	}

	.courts-select-chckbx:focus,
	.courts-select-chckbx:focus-within {
		outline: 2px solid #0618ff;
		outline-offset: 2px;
	}

.accordion-option-selected:hover,
.accordion-option-selected:focus,
.accordion-option-selected:focus-visible {
	outline: 3px solid #007bff;
	outline-offset: 2px;
	background-color: #f0f8ff;
	color: #000;
	text-decoration: none;
}

/* For clerk dashboard */

/**/
[class*="dashboard-card-"][class*="-bg-hover"] {
	transition: background-color 0.2s ease, border-color 0.2s ease;
	border-radius: 0.5rem;
}

/* Hover and focus for achor */
a:hover [class*="dashboard-card-"][class*="-bg-hover"],
a:focus [class*="dashboard-card-"][class*="-bg-hover"],
a:focus-visible [class*="dashboard-card-"][class*="-bg-hover"],
a:active [class*="dashboard-card-"][class*="-bg-hover"] {
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* color themes*/
a:hover .dashboard-card-blue-bg-hover,
a:focus .dashboard-card-blue-bg-hover,
a:focus-visible .dashboard-card-blue-bg-hover {
	background-color: #15547E;
	border-color: #15547E;
}

a:hover .dashboard-card-light-blue-bg-hover,
a:focus .dashboard-card-light-blue-bg-hover,
a:focus-visible .dashboard-card-light-blue-bg-hover {
	background-color: #14586B;
	border-color: #14586B;
}

a:hover .dashboard-card-green-bg-hover,
a:focus .dashboard-card-green-bg-hover,
a:focus-visible .dashboard-card-green-bg-hover {
	background-color: #26735D;
	border-color: #26735D;
}

a:hover .dashboard-card-light-green-bg-hover,
a:focus .dashboard-card-light-green-bg-hover,
a:focus-visible .dashboard-card-light-green-bg-hover {
	background-color: #416D1C;
	border-color: #416D1C;
}

a:hover .dashboard-card-purple-bg-hover,
a:focus .dashboard-card-purple-bg-hover,
a:focus-visible .dashboard-card-purple-bg-hover {
	background-color: #2D1650;
	border-color: #2D1650;
}

a:hover .dashboard-card-light-purple-bg-hover,
a:focus .dashboard-card-light-purple-bg-hover,
a:focus-visible .dashboard-card-light-purple-bg-hover {
	background-color: #491650;
	border-color: #491650;
}

a:hover .dashboard-card-bluegrey-bg-hover,
a:focus .dashboard-card-bluegrey-bg-hover,
a:focus-visible .dashboard-card-bluegrey-bg-hover {
	background-color: #2C6581;
	border-color: #2C6581;
}

a:hover .dashboard-card-light-red-bg-hover,
a:focus .dashboard-card-light-red-bg-hover,
a:focus-visible .dashboard-card-light-red-bg-hover {
	background-color: #8D4D2A;
	border-color: #8D4D2A;
}

.dashboard-card-white-txt-hover {
	transition: color 0.2s ease;
}

a:hover .dashboard-card-white-txt-hover *,
a:focus .dashboard-card-white-txt-hover *,
a:focus-visible .dashboard-card-white-txt-hover * {
	color: #fff !important;
}

.u-block-hover:hover .dashboard-card-white-txt-hover,
.u-block-hover:focus-within .dashboard-card-white-txt-hover,
.u-icon-block--hover:hover .dashboard-card-white-txt-hover,
.u-icon-block--hover:focus-within .dashboard-card-white-txt-hover {
	color: #fff !important;
}

a:focus-visible [class*="dashboard-card-"][class*="-bg-hover"] {
	outline: none; 
	box-shadow: 0 0 0 3px #007bff;
}
a [class*="dashboard-card-"] {
	transition: all 0.2s ease;
}

/* Stripe Credit Card Element Formatting */
#card-element {
	border: 1px solid #ccc;
	padding: 12px;
	border-radius: 4px;
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

	#card-element.StripeElement--focus {
		border-color: #007bff;
		box-shadow: 0 0 0 3px rgba(0,123,255,0.4);
	}

	#card-element.StripeElement--invalid {
		border-color: #dc3545;
		box-shadow: 0 0 0 3px rgba(220,53,69,0.3);
	}

	.alert:has(#card-element:focus),
	.alert:has(.StripeElement--focus) {
		box-shadow: 0 0 0 3px rgba(0,123,255,0.3);
	}

	/* Audit Trails Grid */

.grid-focusable:focus {
	outline: 2px solid #005fcc; 
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}

.grid-form-control:focus {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}
.grid-button:focus {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}
.grid-dropdown-toggle:focus {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}
.grid-dropdown-menu a:focus,
.grid-dropdown-menu button:focus {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
	background-color: rgba(0, 95, 204, 0.1);
}
.grid-form-group:focus-within {
	outline: 2px dashed #005fcc;
	outline-offset: 2px;
}
.grid-select:focus {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}


	.grid-view-btn:focus { 
		outline: 2px solid #0618ff;
		outline-offset: 2px;
	}

	.grid-view-btn:hover i {
		color: #0618ff; 
	}

	.grid-view-btn:active i {
		color: #0F3C61; 
	}


.u-btn-warning {
	color: #fff !important;
	background-color: #8D360B;
}


.u-btn-warning:hover, .u-btn-warning:focus, .u-btn-warning.active {
	border-color: #8D360B;
	color: #8D360B !important;
	background-color: #FFF;
	outline: 3px solid #8D360B;
}