:root {
	color-scheme: light dark;
	--appBackground: #F5F7FB;
	--appSurface: #FFFFFF;
	--appSurfaceAlt: #EDF4FF;
	--appTextPrimary: #131722;
	--appTextSecondary: #60708A;
	--appBorder: rgba(29, 53, 89, 0.10);
	--appShadow: 0 14px 32px rgba(20, 36, 61, 0.07);
}

html, body {
	width: 100%;
	height: 100%;
	min-height: 100% !important;
	background-color: var(--appBackground);
	color: var(--appTextPrimary);
}

body {
	transition: background-color 0.2s ease, color 0.2s ease;
}

@media (prefers-color-scheme: dark) {
	:root {
		--appBackground: #0F1A2E;
		--appSurface: #16233A;
		--appSurfaceAlt: #1A2942;
		--appTextPrimary: rgba(230, 237, 248, 0.94);
		--appTextSecondary: rgba(167, 183, 209, 0.84);
		--appBorder: rgba(118, 140, 176, 0.22);
		--appShadow: 0 18px 44px rgba(4, 10, 20, 0.32);
	}
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition: background-color 5000s ease-in-out 0s;
}

.Centered {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.Toolbar {
	height: 43px;
	box-shadow: var(--mud-elevation-4);
	border-bottom: 1px solid var(--appBorder);
}

	.Toolbar.Light {
		background-color: var(--appSurfaceAlt);
	}

	.Toolbar.Dark {
		background-color: var(--appSurfaceAlt);
	}

.mud-layout,
.mud-main-content {
	background-color: var(--appBackground);
}

.mud-drawer,
.mud-paper {
	box-shadow: var(--appShadow);
}

.mud-appbar,
.mud-drawer,
.mud-paper {
	backdrop-filter: saturate(1.05);
}

.mud-button-root,
.mud-chip-root,
.mud-input-control {
	transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.mud-button-root {
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: none;
	border-radius: 8px;
}

.mud-button-filled-primary,
.mud-button-filled-secondary {
	box-shadow: 0 10px 22px rgba(15, 26, 46, 0.12);
}

.mud-button-outlined {
	border-width: 1px;
}

.mud-chip-root {
	font-weight: 600;
	border-radius: 999px;
}

.mud-input-control .mud-input-outlined-border {
	stroke-width: 1.25;
}

.mud-input-control.mud-input-focused .mud-input-outlined-border {
	stroke-width: 1.75;
}

.apexcharts-tooltip {
	color: #111111;
}

.TouchScroll {
	overflow: auto; /* enables scrolling */
	-webkit-overflow-scrolling: touch; /* smooth touch scrolling */
}

.TouchScroll::-webkit-scrollbar {
	display: none; /* Chrome / Safari / Edge */
}