/* Body */
body {
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #efefef;
}

/* Appbar */
.appbar {
	background-color: #121212;
}

/* Base Mud Card */
.mud-card {
	background-color: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px) contrast(100%);
	-webkit-backdrop-filter: blur(5px) contrast(100%);
	color: black;
	padding: 2%;
	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
	border-radius: 5px;
	margin-bottom: 10px;
}

/* Highlihted Mud Card */
.highlighted-card {
	border: 1px solid #A6A6A6;
}

/* Base Mud Divider */
.mud-divider {
	border-color: black;
	height: 100%
}

/* Base Mud Button */
.mud-button {
	color: white;
	font-weight: 600;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 30px;
	padding-right: 30px;
	border-radius: 10px;
	border-color: rgba(0, 0, 0, 0.60);
	background-color: #306BD1;
	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 100%;
	text-transform: none;
	text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
}

	.mud-button:hover {
		color: white;
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 30px;
		padding-right: 30px;
		border-radius: 10px;
		border-color: rgba(0, 0, 0, 0.60);
		background-color: #4a7bcf;
		width: 100%;
		height: 100%;
	}

	.mud-button:disabled {
		color: black;
		opacity: 0.85;
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 30px;
		padding-right: 30px;
		border-radius: 10px;
		border-color: rgba(0, 0, 0, 0.60);
		background-color: white;
		width: 100%;
		height: 100%;
		text-shadow: none;
	}

/* Denser Mud Button */
.mud-button-dense {
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
}

	.mud-button-dense:hover {
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.mud-button-dense:disabled {
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
	}

/* Mud Button Fit Content */
.mud-button-fit-content {
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	width: fit-content;
	height: fit-content;
}

	.mud-button-fit-content:hover {
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		width: fit-content;
		height: fit-content;
	}

	.mud-button-fit-content:disabled {
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		width: fit-content;
		height: fit-content;
	}

/* Colored Buttons - Preset Mud Colors */
.colored-button {
	opacity: 1;
	color: black;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 25px;
	background-color: rgba(0, 0, 0, 0.02);
	width: 100%;
	height: 100%;
	font-weight: bold;
	box-shadow: none;
	border: 1px solid black;
	transition: background-color 0.5s ease, opacity 0.3s ease;
	text-shadow: none;
}

	.colored-button:hover {
		color: black;
		opacity: 0.85;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		border-radius: 25px;
		background-color: rgba(0, 0, 0, 0.15);
		width: 100%;
		height: 100%;
		text-shadow: none;
	}

	.colored-button:disabled {
		opacity: 0.55;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		border-radius: 25px;
		width: 100%;
		height: 100%;
		text-shadow: none;
	}

.colored-button-error {
	opacity: 1;
	color: white;
	transition: opacity 0.5s ease, background-color 0.5s ease;
	background-color: #f64e62;
	border: none;
	text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
}

	.colored-button-error:hover {
		color: white;
		background-color: #f64e62;
		text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
	}

.colored-button-success {
	opacity: 1;
	color: white;
	transition: opacity 0.5s ease, background-color 0.5s ease;
	background-color: #0bba83;
	border: none;
	text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
}

	.colored-button-success:hover {
		color: white;
		background-color: #0bba83;
		text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
	}

.colored-button-info {
	opacity: 1;
	transition: background-color 0.3s ease;
	color: white;
	background-color: #306BD1;
	border: none;
	text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
}

	.colored-button-info:hover {
		opacity: 1;
		color: white;
		background-color: #4a7bcf;
		text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
	}

.colored-button-warning {
	opacity: 1;
	color: white;
	transition: background-color 0.5s ease;
	background-color: #ff9800;
	border: none;
	text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
}

	.colored-button-warning:hover {
		color: white;
		background-color: #ff9800;
		text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
	}

/* Inline Button - No Background */
.inline-button {
	background-color: transparent;
	color: black;
	padding: 5px;
	box-shadow: none;
	text-shadow: none;
}

	.inline-button:hover {
		background-color: rgba(0, 0, 0, 0.05);
		color: black;
		border-radius: 10px;
		padding: 5px;
	}

/* Base Icon Button */
.mud-icon-button {
	color: black;
	box-shadow: none;
	text-shadow: none;
}

/* Toggle Icon Button */
.toggle-button {
	color: black;
	padding: 0px;
	box-shadow: none;
	text-shadow: none;
}

/* Appbar Button */
.appbar-button {
	background-color: transparent;
	color: #F2F2F2;
	box-shadow: none;
}

	.appbar-button:hover {
		background-color: rgba(255, 255, 255, 0.25);
		border-radius: 10px;
	}

/* Mud Floating Stack - Bottom Right Pinned */
.mud-floating-stack {
	position: fixed;
	bottom: 16px;
	right: 16px;
	z-index: 1000;
}

/* Default Fab Button */
.mud-fab {
	border-radius: 50%;
	box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
}

/* Default Mud Timeline Item Dot */
.mud-timeline-item-dot {
	background-color: #306BD1;
	color: white;
}

/* Mud Timeline Stepper */
.mud-timeline-stepper {
	width: 100%;
	height: 100%;
}

/* Base Mud Stepper Label */
.mud-step-label-content {
	color: black !important;
}

/* Base Mud Stepper Button */
.mud-stepper .mud-button {
	width: 150px;
	margin: 5px;
	color: white;
}

	.mud-stepper .mud-button:hover {
		width: 150px;
		margin: 5px;
		background-color: #4a7bcf;
	}

/* Container WIth Border */
.bordered-container {
	border: 1px solid #A6A6A6;
	background-color: rgba(255, 255, 255, 0.95);
	color: black;
	padding: 25px;
	border-radius: 1px;
	backdrop-filter: blur(15px);
	-webkit-backdrop-filter: blur(15px);
}

/* Base Mud Dialog */
.mud-dialog {
	background-color: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	color: black;
	width: 100%;
	border-radius: 10px;
	border-color: rgba(255, 255, 255, 0.30);
	border-width: 1px;
}

/* Base Mud Input Boxes */
.mud-input {
	color: black;
	background-color: white;
	border-bottom: 1px #A6A6A6 solid;
}

/* Base Mud Input Outlined Boxes */
.mud-input-outlined-border {
	border-color: #A6A6A6 !important;
}

/* Mud Text Field Outlined Variant Dense Version*/
.mud-input-outlined-dense .mud-input-outlined {
	height: 45px;
}

/* Mud Text Field Filled Variant */
.mud-input-filled {
	height: 45px;
	padding-bottom: 15px;
}

/* Mud Text Field Filled Variant WWith Label */
.mud-input-filled-with-label {
	height: 55px;
	padding-bottom: 0px;
}

/* Mud Text Field Text Variant */
.mud-input-text {
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 10px;
	padding-right: 10px;
	background-color: white;
}

/* Mud Text Field Label */
.mud-input-label-text {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
	padding-left: 10px !important;
	padding-right: 10px !important;
}

/* Mud Numeric Text Field Spinner Buttons */
.mud-input-numeric-spin .mud-button {
	width: fit-content;
	color: black;
	background-color: transparent;
	box-shadow: none;
}

	.mud-input-numeric-spin .mud-button:hover {
		background-color: whitesmoke;
	}

/* Mud List and Mud Select */
.mud-list {
	color: black;
	background-color: white;
}

/* Mud Select Dropdown Transparent with blur */
.mud-select-popover {
	background-color: rgba(255, 255, 255, 0.55);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	color: black;
	border-radius: 0px;
}

/* Mud Select Dropdown Item */
.mud-select-item {
	border: 1px solid rgba(0, 0, 0, 0.5);
}

/* Mud Data Grid Select */
.mud-data-grid-select .mud-input-slot {
	cursor: pointer;
}

/* Mud Data Grid Select Drop Down */
.mud-data-grid-select-popover {
	color: black;
	background-color: ghostwhite;
	border: none;
}

/* Mud Data Grid Select Data Grid */
.mud-data-grid-select-data-grid {
	border: none !important;
	color: black;
}

/* Mud Items View Row Cell */
.mud-data-grid-select-data-grid-cell {
	color: black;
	cursor: pointer;
}

/* Mud Data Grid */
.mud-table {
	background-color: rgba(255, 255, 255, 0.50);
	border-radius: 5px;
	overflow-y: auto;
	border: 1px solid rgba(0, 0, 0, 0.5);
}

/* Mud Table Sticky Header*/
/*.mud-table-sticky-header .mud-table-head .mud-table-cell {
	background-color: whitesmoke !important;
}*/

/* Mud Table Cell */
/*.mud-table-cell {
	color: black !important;
}*/

/* Mud Table Column Header */
.mud-items-view-row-header-cell {
	color: black;
	font-weight: bold;
}

/* Mud Items View Row */
.mud-items-view-row {
	border-right-width: 1px;
	border-color: rgba(0, 0, 0, 0.2);
}

/* Mud Items View Row Cell */
.mud-items-view-row-cell {
	color: black;
}

/* Mud Data Grid Column Settings Panel Buttons */
.mud-data-grid-columns-panel .mud-button {
	color: white;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top: 15px;
	margin-bottom: 15px;
}

/* Mud Data Grid Column Filter Popup */
.column-filter-popup {
	width: 400px;
}

	/* Mud Data Grid Column Filter Menu TextBox */
	.column-filter-popup .mud-input {
		color: black;
		padding: 10px;
	}

	/* Mud Data Grid Column Filter Simple Buttons */
	.column-filter-popup .mud-button {
		color: #F2F2F2;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		margin-right: 5px;
		margin-left: 5px;
		height: fit-content;
		width: 50%;
	}

		.column-filter-popup .mud-button:hover {
			color: #F2F2F2;
			padding-top: 5px;
			padding-bottom: 5px;
			padding-left: 10px;
			padding-right: 10px;
			margin-right: 5px;
			margin-left: 5px;
			height: fit-content;
			border-color: rgba(255, 255, 255, 0.60);
			background-color: #4a7bcf;
			width: 50%;
		}

/* Mud Data Grid Column Simple Filters Panel TextBox */
.filters-panel .mud-input {
	color: black;
	padding: 10px;
}

/* Mud Data Grid Column Simple Filters Panel Buttons */
.filters-panel .mud-button {
	color: #F2F2F2;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 5px;
	margin-left: 5px;
	height: fit-content;
	width: 99%;
}

/* Mud Selection List */
.mud-selection-list {
	background-color: white;
	color: black;
	width: 100%;
	overflow-y: auto;
	border: 1px solid #A6A6A6;
	border-radius: 10px;
}

/* Mud Selection List Group Header */
.mud-selection-list-group-header {
	background-color: rgba(255, 255, 255, 0.55);
	border-bottom: 1px solid #A6A6A6;
	align-items: center;
	justify-content: center;
	min-height: 45px;
}

/* Mud Selection List Item */
.mud-selection-list-item {
	border-bottom: 1px solid #A6A6A6;
	align-items: center;
	justify-content: center;
	min-height: 45px;
}

/* Mud CheckBox Lite */
.mud-checkbox-lite {
	width: 30px;
	height: 30px;
	color: black;
	border: 1px solid black;
	border-radius: 6px;
	background-color: rgba(255, 255, 255, 0.80);
	padding-top: 16px;
	display: flex;
	text-align: center;
	transition: background-color 0.3s;
}

	.mud-checkbox-lite:hover {
		background-color: rgba(255, 255, 255, 0.10);
	}

	.mud-checkbox-lite .mud-icon-size-medium {
		font-size: 1.55rem;
	}

.mud-checkbox-lite-icon {
	transition: opacity 0.1s ease-in-out;
}

/* Base Mud Date Picker's Toolbar Buttons */
.mud-picker-datepicker-toolbar .mud-button {
	background-color: transparent;
	color: black;
	padding: 5px;
	box-shadow: none;
}

/* Mud Date Picket Toolbar */
.mud-picker-datepicker-toolbar {
	background-color: whitesmoke !important;
}

/* Mud Date Picker Calendar */
.mud-picker-calendar-content {
	background-color: whitesmoke;
	color: black;
}

	.mud-picker-calendar-content .mud-day-label {
		color: black !important;
	}

/* Base Mud Date Picker Today's Date */
.mud-day.mud-current {
	color: var(--mud-palette-text-primary) !important;
}

/* Base Mud Date Picker Selected Date */
.mud-day.mud-selected {
	background-color: #306BD1 !important;
	color: #F2F2F2 !important;
}

/* Mud Time Picker Content */
.mud-picker-content {
	background-color: whitesmoke;
}

/* Mud Time Picker Toolbar */
.mud-picker-timepicker-toolbar {
	background-color: whitesmoke !important;
	color: black !important;
}

/* Mud Time Picker Toolbar Button */
.mud-timepicker-button {
	background-color: transparent;
	color: black !important;
	padding: 10px !important;
	box-shadow: none;
}

	.mud-timepicker-button:hover {
		background-color: transparent;
		color: black;
		padding: 10px;
		box-shadow: none;
	}

/* Mud Time Picker Text Pointer Thumb */
.mud-picker-time-clock-pointer-thumb {
	background-color: transparent !important;
}

/* Mud Time Slot Picker Calendar */
.mud-time-slot-picker {
	width: 100%;
}

/* Mud Time Slot Picker Header*/
.mud-time-slot-picker-header {
	width: 100%;
}

/* Mud Time Slot Picker Pinned To Top */
.mud-time-slot-picker-header-pinned {
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 1000;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #d3d3d3;
}

/* Mud Time Slot Picket Body */
.mud-time-slot-picker-body {
	overflow-y: auto;
	background-color: rgba(255, 255, 255, 0.45);
	padding: 15px;
	border: 1px solid #A6A6A6;
	border-radius: 10px;
}

/* Mud Time Slot Picker Slot */
.mud-time-slot-picker-slot {
	opacity: 1;
	color: black;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 25px;
	background-color: rgba(0, 0, 0, 0.02);
	width: 120px;
	height: 100%;
	font-weight: bold;
	box-shadow: none;
	border: 1px solid #A6A6A6;
	transition: background-color 0.3s ease;
	text-shadow: none;
}

	.mud-time-slot-picker-slot:hover {
		color: black;
		opacity: 0.85;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 10px;
		padding-right: 10px;
		border-radius: 25px;
		background-color: rgba(0, 0, 0, 0.15);
		width: 120px;
		height: 100%;
		text-shadow: none;
	}

/* Mud Time Slot Picker Disabled Slot */
.mud-time-slot-picker-slot-disabled {
	opacity: 0;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 25px;
	width: 120px;
}

/* Mud Tabs Tab bar*/
.mud-tabs-tabbar {
	background-color: transparent;
}

/* Mud Nav Menu */
.mud-navmenu {
	background-color: rgba(255, 255, 255, 0.75);
	height: 100%;
	color: black;
}

/* Container Pinned At The Bottom */
.page-footer-pinned {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100vw;
	padding: 8px;
	padding-top: 10px;
	border-top: 1px solid black;
	color: black;
	background-color: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(15px);
	-webkit-backdrop-filter: blur(15px);
}

/* Mud Paper That Sticks On Scroll */
.mud-paper-sticky {
	position: -webkit-sticky;
	position: sticky;
	top: 55px;
	border-radius: 20px;
	background-color: transparent;
}

/* PDF Viewer */
.pdf-viewer {
	background-color: rgba(255, 255, 255, 0.80);
	border-radius: 5px;
}

.pdf-viewer-toolbar {
	width: 100%;
	justify-content: center;
	align-items: center;
}

.pdf-viewer-container {
	background-color: transparent;
	width: 100%;
	height: 100vh;
	overflow: auto;
	display: flex;
	justify-content: center;
	align-items: center;
}

.pdf-container {
	max-height: 100%;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

	.pdf-container canvas {
		margin: 10px 0;
		align-items: center;
	}

.pdf-viewer-button {
	background-color: transparent;
	color: black;
	box-shadow: none;
	text-shadow: none;
}

	.pdf-viewer-button:hover {
		color: black;
		background-color: rgba(0, 0, 0, 0.10);
		border-radius: 10px;
		text-shadow: none;
	}

/* Signature Pad */
.signature-pad {
	width: 100%;
	background-color: white;
	border-radius: 20px;
}

/* Attachment Carousel */
.attachment-carousel {
	height: 45em;
	border-radius: 8px;
	background-color: #0c1210;
}

.attachment-media {
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	background-color: transparent;
}

/* Allow scrolling down on mobile within swipe areas */
.mud-swipearea {
	touch-action: pan-y;
}

/* Force Center Content */
.flex-center {
	display: flex;
	justify-content: center;
}

/* Page Banner */
.page-banner-image {
	height: fit-content;
	max-height: 15em;
	width: 100%;
}

/* The following 3 are for the loading spinner in index.html which shows while the blazor app loads */
.loading-container {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100%;
}

.spinner {
	border: 15px solid rgba(0, 0, 0, 0.1);
	border-top: 15px solid floralwhite;
	border-radius: 50%;
	width: 100px;
	height: 100px;
	animation: spin 1s linear infinite;
}

.javascript-disabled-message {
	color: #f64e62;
	text-align: center;
	width: 90%;
	padding: 20px;
	font-family: sans-serif;
	background-color: rgba(255, 230, 230, 0.2);
	border-radius: 5px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	margin: 20px;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}
body {
}