.mud-dialog .mud-dialog-actions {
	padding: 8px 24px;
}

.base {
	transition: 1s linear all;
}

.highlight {
	background-color: yellow;
	transition: none;
}

.highlight-updated {
	background-color: #fff3cd; /* A light yellow for highlighting */
	transition: background-color 0.5s ease-in-out; /* Optional: adds a smooth transition */
}

.wide-dialog {
	max-width: 65vw !important;
	width: 65vw !important;
}

.wide-dialog .mud-dialog-content {
	max-height: 80vh;
}

/* VR Global Styles - Applied site-wide */
.vr-workflow {
	font-family: 'Lato', sans-serif;
}

/* Page title styles */
.vr-workflow .vr-page-title {
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 700;
}

/* Keep typography consistent with VR workflow pages */
.vr-workflow .mud-typography {
	font-size: 0.78rem !important;
}

/* Button styles - Global VR button styling */
.mud-button-filled.mud-button-filled-primary {
	background-color: #534AB7;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	letter-spacing: 0.08em;
}

.mud-button-filled.mud-button-filled-primary:hover {
	background-color: #3C3489;
}

.mud-button-filled.mud-button-filled-secondary {
	background-color: #5a5ec0 !important;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	letter-spacing: 0.08em;
}

.mud-button-filled.mud-button-filled-secondary:hover {
	background-color: #3d418f !important;
}

.mud-button-outlined.mud-button-outlined-primary {
	border-color: #534AB7 !important;
	color: #534AB7 !important;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	letter-spacing: 0.08em;
}

.mud-button-outlined.mud-button-outlined-primary:hover {
	background-color: rgba(83, 74, 183, 0.08);
}

/* Text box and dropdown wrapper styles (vr-pill-input) */
.vr-pill-input .mud-input-root,
.vr-pill-input .mud-input {
	background-color: #e8e9ff;
	color: #303056;
	border-radius: 8px;
	box-shadow: none;
	border-bottom: none;
}

.vr-pill-input .mud-input-slot {
	min-height: 20px;
	display: flex;
	align-items: center;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
	padding-left: 8px !important;
	padding-right: 8px !important;
}

/* Keep floating labels the same smaller size whether inline or above the field */
.vr-pill-input .mud-input-label,
.vr-pill-input .mud-input-label-text {
	font-size: 0.88rem !important;
	padding-left: 3px;
}

/* Extra nudge specifically for input-control labels, which are absolutely positioned */
.vr-pill-input .mud-input-label-inputcontrol {
	margin-left: 10px !important;
}

/* When label floats above the field, make it a bit larger for readability */
.vr-pill-input .mud-input-label.mud-shrink,
.vr-pill-input .mud-input-label-text.mud-shrink {
	font-size: 1.05rem !important;
}

.vr-pill-input .mud-input.mud-input-underline {
	box-shadow: none !important;
	border-bottom: none !important;
}

.vr-pill-input .mud-input.mud-input-underline::before,
.vr-pill-input .mud-input.mud-input-underline::after {
	border-bottom: none !important;
}

/* Search card styles */
.vr-search-card {
	border-radius: 16px;
	padding: 0;
	overflow: hidden;
	background-color: #ffffff;
	border: 1px solid #d0d4e8;
}

.vr-search-card .vr-card-header {
	background-color: #534AB7;
	padding: 10px 20px;
	color: #ffffff;
	font-family: 'Montserrat', sans-serif;
}

.vr-search-card .vr-card-title {
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
}

.vr-search-card .vr-header-grid {
	margin-top: 4px;
	margin-bottom: 4px;
	padding: 0 16px;
}

.vr-search-card .vr-header-grid > .mud-grid-item {
	padding-top: 4px;
	padding-bottom: 4px;
}

/* Card styles */
.vr-card {
	border-radius: 16px;
	padding: 0;
	overflow: hidden;
	background-color: #ffffff;
	border: 1px solid #d0d4e8;
}

.vr-card-header {
	background-color: #534AB7;
	padding: 10px 20px;
	color: #ffffff;
	font-family: 'Montserrat', sans-serif;
}

.vr-header-actions {
	display: flex;
	gap: 8px;
}

.vr-header-actions .mud-button {
	background-color: #7c5cf4 !important;
	color: #ffffff !important;
}

.vr-card-title {
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
}

.vr-results-table .mud-table-head {
	background-color: #e3e7fb;
}

.vr-results-table .mud-table-head th {
	color: #303056;
	font-weight: 700;
	font-size: 0.78rem;
	text-transform: uppercase;
	font-family: 'Montserrat', sans-serif;
}

.vr-results-table .mud-table-body td {
	font-family: 'Lato', sans-serif;
	font-size: 0.85rem;
}

.vr-card .mud-table-container {
	margin: 0;
}

.vr-card .mud-table {
	margin: 0;
}

/* Status chip styles */
.mud-chip.vr-chip-status {
	min-width: 95px;
	font-weight: 500;
}

.mud-chip.vr-chip-new {
	background-color: #D7CCC8 !important;
	color: #3E2723 !important;
}

.mud-chip.vr-chip-in-progress {
	background-color: #90CAF9 !important;
	color: #0D47A1 !important;
}

.mud-chip.vr-chip-ready-for-review {
	background-color: #B2DFDB !important;
	color: #004D40 !important;
}

.mud-chip.vr-chip-complete {
	background-color: #22C55E !important;
	color: #064E3B !important;
}

.mud-chip.vr-chip-error {
	background-color: #F48FB1 !important;
	color: #880E4F !important;
}

.mud-icon.vr-icon-valid {
	color: #22C55E;
}

.mud-icon.vr-icon-invalid {
	color: #DC2626;
}

.mud-chip.vr-chip-status-wide {
	min-width: 275px;
}

.mud-chip.vr-chip-status .vr-chip-refresh-icon {
	color: inherit !important;
}

.mud-chip.vr-chip-status .vr-chip-status-icon {
	color: inherit !important;
	margin-right: 4px;
}

/* AddressSearch button override for smaller size */
.vr-search-button {
	min-height: 28px !important;
	height: 28px !important;
	padding: 0 10px !important;
	font-size: 0.7rem !important;
	line-height: 1 !important;
}

/* VAM button styling */
.vam-button {
	text-transform: uppercase;
	font-size: 0.8rem;
	font-weight: 500;
}

/* Chevron-style tabs — nuke every border/shadow inside the tab bar for workflow pages */
.vr-workflow .vr-step-tabs .mud-tabs-tabbar,
.vr-workflow .vr-step-tabs .mud-tabs-tabbar *,
.vr-workflow .vr-step-tabs .mud-tabs-tabbar *::before,
.vr-workflow .vr-step-tabs .mud-tabs-tabbar *::after {
	border: 0 none transparent !important;
	box-shadow: none !important;
	outline: none !important;
}

.vr-workflow .vr-step-tabs .mud-tabs-tabbar {
	min-height: 0;
	background-color: #e8f5e9 !important;
}

.vr-workflow .vr-step-tabs .mud-tabs-tabbar-inner {
	padding: 0;
	display: flex !important;
	width: 100%;
	background-color: #e8f5e9 !important;
}

.vr-workflow .vr-step-tabs .mud-tabs-tabbar-wrapper {
	display: flex !important;
	gap: 0 !important;
}

.vr-workflow .vr-step-tabs .mud-tabs-tabbar-wrapper > .d-inline-block {
	flex: 1 1 0% !important;
	display: flex !important;
	width: auto !important;
}

.vr-workflow .vr-step-tabs .mud-tabs-tabbar-wrapper > .d-inline-block > .mud-tab {
	width: 100% !important;
}

/* Base tab: light green, no arrow */
.vr-workflow .vr-step-tab {
	position: relative;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	text-transform: none !important;
	font-weight: 500 !important;
	font-size: 0.875rem !important;
	min-width: 0 !important;
	height: 44px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start;
	background-color: #e8f5e9 !important;
	color: #2e7d32 !important;
	border: none !important;
	box-shadow: none !important;
}

.vr-workflow .vr-step-tab-inner {
	display: flex;
	align-items: center;
	padding-left: 20px;
	padding-right: 38px;
}

.vr-workflow .vr-step-number {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background-color: rgba(46, 125, 50, 0.2);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
	font-size: 0.8rem;
	font-weight: 600;
	color: #2e7d32;
}

/* Active tab number badge - white background for better contrast */
.vr-workflow .vr-step-tab.active .vr-step-number {
	background-color: rgba(255, 255, 255, 0.9);
	color: #388e3c;
}

/* Completed tab number badge - white background for better contrast */
.vr-workflow .vr-step-tab.completed .vr-step-number {
	background-color: rgba(255, 255, 255, 0.9);
	color: #2e7d32;
}

.vr-workflow .vr-step-label {
	white-space: nowrap;
	text-transform: uppercase;
}

/* Completed before another completed tab: solid dark green chevron */
.vr-workflow .vr-step-tab.completed.next-completed {
	margin-left: 1px !important;
	background:
		linear-gradient(to right, #2e7d32, #2e7d32) right center / 2px 100% no-repeat,
		linear-gradient(to top right, transparent 48%, #2e7d32 52%) right top / 18px 50.5% no-repeat,
		linear-gradient(to bottom right, transparent 48%, #2e7d32 52%) right bottom / 18px 50.5% no-repeat,
		#2e7d32 !important;
	color: #ffffff !important;
}

/* Disabled tab: grayed out */
.vr-workflow .vr-step-tab.disabled {
	background-color: #e8f5e9 !important;
	color: #9ca3af !important;
	opacity: 0.5;
	pointer-events: none;
}

.vr-workflow .vr-step-tab.disabled .vr-step-number {
	background-color: rgba(156, 163, 175, 0.3);
}

/* Completed before the active tab: solid dark green chevron */
.vr-workflow .vr-step-tab.completed.next-active {
	margin-left: 1px !important;
	background:
		linear-gradient(to right, #2e7d32, #2e7d32) right center / 2px 100% no-repeat,
		linear-gradient(to top right, transparent 48%, #2e7d32 52%) right top / 18px 50.5% no-repeat,
		linear-gradient(to bottom right, transparent 48%, #2e7d32 52%) right bottom / 18px 50.5% no-repeat,
		#2e7d32 !important;
	color: #ffffff !important;
}

/* Completed before a future tab (fallback): corners = light green */
.vr-workflow .vr-step-tab.completed.next-future {
	background:
		linear-gradient(to right, #e8f5e9, #e8f5e9) right center / 2px 100% no-repeat,
		linear-gradient(to top right, transparent 48%, #e8f5e9 52%) right top / 18px 50.5% no-repeat,
		linear-gradient(to bottom right, transparent 48%, #e8f5e9 52%) right bottom / 18px 50.5% no-repeat,
		#2e7d32 !important;
	color: #ffffff !important;
}

/* Active tab: use medium green, corners always = default light green (next is always future) */
.vr-workflow .vr-step-tab.active {
	background: #388e3c !important;
	clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%);
	margin-left: -1px;
	color: #ffffff !important;
}

/* Ensure the MudTabs root itself has no bottom border on workflow pages */
.vr-workflow .vr-step-tabs.mud-tabs {
	border: none !important;
	border-bottom: none !important;
	box-shadow: none !important;
}

/* Hide default MudTabs underline/slider for workflow tab sets */
.vr-workflow .vr-step-tabs .mud-tab-slider {
	background-color: transparent !important;
	height: 0 !important;
	display: none !important;
}

/* Chevron tabs full width */
.vr-chevron-full-width .vr-step-tabs .mud-tabs-tabbar-wrapper {
	width: 100%;
}

/* Center text in chevron tabs */
.vr-chevron-full-width .vr-step-tab {
	justify-content: center !important;
}

/* Change summary cards alignment */
.vr-change-summary-cards {
	display: flex !important;
	align-items: stretch !important;
	gap: 16px;
}

.vr-change-summary-cards > .mud-paper {
	display: flex !important;
	flex-direction: column !important;
	flex: 1 1 0 !important;
}

.vr-change-summary-cards > .mud-paper > .mud-card-content {
	display: flex !important;
	flex-direction: column !important;
	flex-grow: 1 !important;
}

.vr-change-summary-cards .vr-card-button-container {
	margin-top: auto !important;
}

.side-by-side-review {
	display: grid !important;
	grid-template-rows: auto minmax(0, 1fr);
	height: 85vh;
	background-color: #ffffff;
}

.side-by-side-map-area {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	min-height: 0;
}

.side-by-side-map-pane {
	display: grid !important;
	grid-template-rows: auto minmax(0, 1fr);
	min-height: 0;
	width: auto;
	background-color: #ffffff;
}

.side-by-side-map-card {
	min-height: 0;
	height: 100%;
}

.side-by-side-review:fullscreen,
.side-by-side-map-pane:fullscreen {
	height: 100vh;
	width: 100vw;
	padding: 16px !important;
	background-color: #ffffff;
}

.side-by-side-map-pane:fullscreen {
	display: grid !important;
	grid-template-rows: auto minmax(0, 1fr);
}