/*
	This CSS file matches the color scheme from MudBlazor to Bootstrap when utilized for authentication.
	The file remains available at all times for demonstration purposes,
	but it is exclusively employed in the 'App.razor' component when authentication is enabled.
*/

.btn-primary {
	text-transform: uppercase;
	--bs-btn-bg: var(--mud-palette-primary) !important;
	--bs-btn-hover-bg: var(--mud-palette-primary-darken) !important;
}

.nav-pills {
	--bs-nav-pills-link-active-bg: var(--mud-palette-primary) !important;
}

.nav {
	--bs-nav-link-color: var(--mud-palette-primary) !important;
	--bs-nav-link-hover-color: var(--mud-palette-primary-darken) !important;
}

.my-custom-class {
	backdrop-filter: blur(10px);
}

.btn-depositos-vehiculares-close {
	margin: 10px 0;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
}

.mud-card-header {
	padding: 4px 10px;
	background-color: var(--mud-palette-primary-lighten);
	color: var(--mud-palette-primary-text);
}

.mud-card-content {
	padding: 5px 10px 10px 10px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.custom-card-header {
	padding: 5px 10px 2px 0px;
}

.grid-view {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	gap: 35px;
	overflow-y: scroll;
	height: 70vh;
	padding: 5px 5px 25px 5px;
	place-items: center;
	justify-content: center;
}

.grid-view-scroll-x {
	display: flex;
	gap: 35px;
	overflow-x: auto;
	padding: 5px 5px 10px 5px;
	position: relative;
	width: 74vw;
	white-space: nowrap;
}

.card-datos-vehiculo {
	display: inline-block;
	float: none;
	width: 241px;
}

.incident-card {
	width: 350px;
}

.bg-aliceblue {
	background-color: aliceblue !important;
}

bg-white {
	background-color: white !important;
}

.mud-icon-button {
	padding: 8px !important;
}

.vehicles-type .mud-chart {
	transform: translateY(-25px) !important;
}
.mud-input-control.mud-input-control-margin-dense {
	margin: 0;
}

.mud-paper-outlined {
	border: 0;
}