@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body {
    background-image: url(https://beta.evgauge.co.in/assets/media/auth/bg_signin.jpg) !important;
}


/* Custom Style  End */

.switch {
	display: inline-block;
	font-size: 1.1rem; }
	.switch input:empty {
			margin-left: -999px;
			height: 0;
			width: 0;
			overflow: hidden;
			position: absolute;
			opacity: 0; }
	.switch input:empty ~ span {
			display: inline-block;
			position: relative;
			float: left;
			width: 1px;
			text-indent: 0;
			cursor: pointer;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none; }
	.switch input:empty ~ span:before,
	.switch input:empty ~ span:after {
			position: absolute;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-align: center;
			-ms-flex-align: center;
			align-items: center;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			top: 0;
			bottom: 0;
			left: 0;
			content: ' ';
			-webkit-transition: all 100ms ease-in;
			transition: all 100ms ease-in; }
	.switch input[disabled] {
			cursor: not-allowed; }
			.switch input[disabled] ~ span:after,
			.switch input[disabled] ~ span:before {
					cursor: not-allowed;
					opacity: 0.5; }
	.switch.switch-icon input:checked ~ span:after {
			font-family: Ki;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			line-height: 1;
			text-decoration: inherit;
			text-rendering: optimizeLegibility;
			text-transform: none;
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-smoothing: antialiased;
			content: "";
			line-height: 0; }

.switch input:empty ~ span {
	margin: 2px 0;
	height: 30px;
	width: 57px;
	border-radius: 15px; }

.switch input:empty ~ span:before,
.switch input:empty ~ span:after {
	width: 54px;
	border-radius: 15px; }

.switch input:empty ~ span:after {
	height: 24px;
	width: 24px;
	top: 3px;
	bottom: 3px;
	margin-left: 3px;
	font-size: 0.65em;
	text-align: center;
	vertical-align: middle; }

.switch input:checked ~ span:after {
	margin-left: 26px; }

.switch.switch-sm input:empty ~ span {
	margin: 2px 0;
	height: 24px;
	width: 40px;
	border-radius: 12px; }

.switch.switch-sm input:empty ~ span:before,
.switch.switch-sm input:empty ~ span:after {
	width: 38px;
	border-radius: 12px; }

.switch.switch-sm input:empty ~ span:after {
	height: 20px;
	width: 20px;
	top: 2px;
	bottom: 2px;
	margin-left: 2px;
	font-size: 0.55em;
	text-align: center;
	vertical-align: middle; }

.switch.switch-sm input:checked ~ span:after {
	margin-left: 16px; }

.switch.switch-lg input:empty ~ span {
	margin: 2px 0;
	height: 40px;
	width: 75px;
	border-radius: 20px; }

.switch.switch-lg input:empty ~ span:before,
.switch.switch-lg input:empty ~ span:after {
	width: 72px;
	border-radius: 20px; }

.switch.switch-lg input:empty ~ span:after {
	height: 34px;
	width: 34px;
	top: 3px;
	bottom: 3px;
	margin-left: 3px;
	font-size: 0.75em;
	text-align: center;
	vertical-align: middle; }

.switch.switch-lg input:checked ~ span:after {
	margin-left: 34px; }

.form-group.row .switch {
	margin-top: 0.15rem; }
	.form-group.row .switch.switch-sm {
			margin-top: 0.3rem; }
	.form-group.row .switch.switch-lg {
			margin-top: 0rem;
			position: relative;
			top: -0.3rem; }

.switch input:empty ~ span:before {
	background-color: #ECF0F3; }

.switch input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch input:checked ~ span:before {
	background-color: #ECF0F3; }

.switch input:checked ~ span:after {
	opacity: 1;
	color: #ffffff;
	background-color: #3699FF; }

.switch.switch-primary:not(.switch-outline) input:empty ~ span:before {
	background-color: #3699FF; }

.switch.switch-primary:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-primary:not(.switch-outline) input:checked ~ span:before {
	background-color: #3699FF; }

.switch.switch-primary:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #3699FF;
	background-color: #ffffff; }

.switch.switch-outline.switch-primary input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-primary input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-primary input:checked ~ span:before {
	border: 2px solid #3699FF;
	background-color: transparent; }

.switch.switch-outline.switch-primary input:checked ~ span:after {
	color: #ffffff;
	background-color: #3699FF; }

.switch.switch-secondary:not(.switch-outline) input:empty ~ span:before {
	background-color: #E5EAEE; }

.switch.switch-secondary:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-secondary:not(.switch-outline) input:checked ~ span:before {
	background-color: #E5EAEE; }

.switch.switch-secondary:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #E5EAEE;
	background-color: #ffffff; }

.switch.switch-outline.switch-secondary input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-secondary input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-secondary input:checked ~ span:before {
	border: 2px solid #E5EAEE;
	background-color: transparent; }

.switch.switch-outline.switch-secondary input:checked ~ span:after {
	color: #ffffff;
	background-color: #E5EAEE; }

.switch.switch-success:not(.switch-outline) input:empty ~ span:before {
	background-color: #1BC5BD; }

.switch.switch-success:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-success:not(.switch-outline) input:checked ~ span:before {
	background-color: #1BC5BD; }

.switch.switch-success:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #1BC5BD;
	background-color: #ffffff; }

.switch.switch-outline.switch-success input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-success input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-success input:checked ~ span:before {
	border: 2px solid #1BC5BD;
	background-color: transparent; }

.switch.switch-outline.switch-success input:checked ~ span:after {
	color: #ffffff;
	background-color: #1BC5BD; }

.switch.switch-info:not(.switch-outline) input:empty ~ span:before {
	background-color: #8950FC; }

.switch.switch-info:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-info:not(.switch-outline) input:checked ~ span:before {
	background-color: #8950FC; }

.switch.switch-info:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #8950FC;
	background-color: #ffffff; }

.switch.switch-outline.switch-info input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-info input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-info input:checked ~ span:before {
	border: 2px solid #8950FC;
	background-color: transparent; }

.switch.switch-outline.switch-info input:checked ~ span:after {
	color: #ffffff;
	background-color: #8950FC; }

.switch.switch-warning:not(.switch-outline) input:empty ~ span:before {
	background-color: #FFA800; }

.switch.switch-warning:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-warning:not(.switch-outline) input:checked ~ span:before {
	background-color: #FFA800; }

.switch.switch-warning:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #FFA800;
	background-color: #ffffff; }

.switch.switch-outline.switch-warning input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-warning input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-warning input:checked ~ span:before {
	border: 2px solid #FFA800;
	background-color: transparent; }

.switch.switch-outline.switch-warning input:checked ~ span:after {
	color: #ffffff;
	background-color: #FFA800; }

.switch.switch-danger:not(.switch-outline) input:empty ~ span:before {
	background-color: #F64E60; }

.switch.switch-danger:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-danger:not(.switch-outline) input:checked ~ span:before {
	background-color: #F64E60; }

.switch.switch-danger:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #F64E60;
	background-color: #ffffff; }

.switch.switch-outline.switch-danger input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-danger input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-danger input:checked ~ span:before {
	border: 2px solid #F64E60;
	background-color: transparent; }

.switch.switch-outline.switch-danger input:checked ~ span:after {
	color: #ffffff;
	background-color: #F64E60; }

.switch.switch-light:not(.switch-outline) input:empty ~ span:before {
	background-color: #F3F6F9; }

.switch.switch-light:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-light:not(.switch-outline) input:checked ~ span:before {
	background-color: #F3F6F9; }

.switch.switch-light:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #F3F6F9;
	background-color: #ffffff; }

.switch.switch-outline.switch-light input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-light input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-light input:checked ~ span:before {
	border: 2px solid #F3F6F9;
	background-color: transparent; }

.switch.switch-outline.switch-light input:checked ~ span:after {
	color: #ffffff;
	background-color: #F3F6F9; }

.switch.switch-dark:not(.switch-outline) input:empty ~ span:before {
	background-color: #212121; }

.switch.switch-dark:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-dark:not(.switch-outline) input:checked ~ span:before {
	background-color: #212121; }

.switch.switch-dark:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #212121;
	background-color: #ffffff; }

.switch.switch-outline.switch-dark input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-dark input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-dark input:checked ~ span:before {
	border: 2px solid #212121;
	background-color: transparent; }

.switch.switch-outline.switch-dark input:checked ~ span:after {
	color: #ffffff;
	background-color: #212121; }

.switch.switch-white:not(.switch-outline) input:empty ~ span:before {
	background-color: #ffffff; }

.switch.switch-white:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-white:not(.switch-outline) input:checked ~ span:before {
	background-color: #ffffff; }

.switch.switch-white:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #ffffff;
	background-color: #ffffff; }

.switch.switch-outline.switch-white input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-white input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-white input:checked ~ span:before {
	border: 2px solid #ffffff;
	background-color: transparent; }

.switch.switch-outline.switch-white input:checked ~ span:after {
	color: #ffffff;
	background-color: #ffffff; }

.switch.switch-dark-75:not(.switch-outline) input:empty ~ span:before {
	background-color: #464E5F; }

.switch.switch-dark-75:not(.switch-outline) input:empty ~ span:after {
	background-color: #ffffff;
	opacity: 0.7; }

.switch.switch-dark-75:not(.switch-outline) input:checked ~ span:before {
	background-color: #464E5F; }

.switch.switch-dark-75:not(.switch-outline) input:checked ~ span:after {
	opacity: 1;
	color: #464E5F;
	background-color: #ffffff; }

.switch.switch-outline.switch-dark-75 input:empty ~ span:before {
	border: 2px solid #ECF0F3;
	background-color: transparent; }

.switch.switch-outline.switch-dark-75 input:empty ~ span:after {
	background-color: #ECF0F3; }

.switch.switch-outline.switch-dark-75 input:checked ~ span:before {
	border: 2px solid #464E5F;
	background-color: transparent; }

.switch.switch-outline.switch-dark-75 input:checked ~ span:after {
	color: #ffffff;
	background-color: #464E5F; 
}
.label {
	padding: 0;
	margin: 0;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	height: 20px;
	width: 20px;
	border-radius: 50%;
	font-size: 0.8rem;
	background-color: #ECF0F3;
	color: #464E5F;
	font-weight: 400;
	height: 20px;
	width: 20px;
	font-size: 0.8rem; }
	.label.label-primary {
			color: #FFFFFF;
			background-color: #3699FF; }
	.label.label-outline-primary {
			background-color: transparent;
			color: #3699FF;
			border: 1px solid #3699FF; }
			.label.label-outline-primary.label-outline-2x {
					border: 2px solid #3699FF; }
	.label.label-light-primary {
			color: #3699FF;
			background-color: #E1F0FF; }
	.label.label-secondary {
			color: #464E5F;
			background-color: #E5EAEE; }
	.label.label-outline-secondary {
			background-color: transparent;
			color: #464E5F;
			border: 1px solid #E5EAEE; }
			.label.label-outline-secondary.label-outline-2x {
					border: 2px solid #E5EAEE; }
	.label.label-light-secondary {
			color: #E5EAEE;
			background-color: #ECF0F3; }
	.label.label-success {
			color: #ffffff;
			background-color: #1BC5BD; }
	.label.label-outline-success {
			background-color: transparent;
			color: #1BC5BD;
			border: 1px solid #1BC5BD; }
			.label.label-outline-success.label-outline-2x {
					border: 2px solid #1BC5BD; }
	.label.label-light-success {
			color: #1BC5BD;
			background-color: #C9F7F5; }
	.label.label-info {
			color: #ffffff;
			background-color: #8950FC; }
	.label.label-outline-info {
			background-color: transparent;
			color: #8950FC;
			border: 1px solid #8950FC; }
			.label.label-outline-info.label-outline-2x {
					border: 2px solid #8950FC; }
	.label.label-light-info {
			color: #8950FC;
			background-color: #EEE5FF; }
	.label.label-warning {
			color: #ffffff;
			background-color: #FFA800; }
	.label.label-outline-warning {
			background-color: transparent;
			color: #FFA800;
			border: 1px solid #FFA800; }
			.label.label-outline-warning.label-outline-2x {
					border: 2px solid #FFA800; }
	.label.label-light-warning {
			color: #FFA800;
			background-color: #FFF4DE; }
	.label.label-danger {
			color: #ffffff;
			background-color: #F64E60; }
	.label.label-outline-danger {
			background-color: transparent;
			color: #F64E60;
			border: 1px solid #F64E60; }
			.label.label-outline-danger.label-outline-2x {
					border: 2px solid #F64E60; }
	.label.label-light-danger {
			color: #F64E60;
			background-color: #FFE2E5; }
	.label.label-light {
			color: #80808F;
			background-color: #F3F6F9; }
	.label.label-outline-light {
			background-color: transparent;
			color: #464E5F;
			border: 1px solid #F3F6F9; }
			.label.label-outline-light.label-outline-2x {
					border: 2px solid #F3F6F9; }
	.label.label-light-light {
			color: #F3F6F9;
			background-color: #F3F6F9; }
	.label.label-dark {
			color: #ffffff;
			background-color: #212121; }
	.label.label-outline-dark {
			background-color: transparent;
			color: #212121;
			border: 1px solid #212121; }
			.label.label-outline-dark.label-outline-2x {
					border: 2px solid #212121; }
	.label.label-light-dark {
			color: #212121;
			background-color: #D6D6E0; }
	.label.label-white {
			color: #464E5F;
			background-color: #ffffff; }
	.label.label-outline-white {
			background-color: transparent;
			color: #ffffff;
			border: 1px solid #ffffff; }
			.label.label-outline-white.label-outline-2x {
					border: 2px solid #ffffff; }
	.label.label-light-white {
			color: #ffffff;
			background-color: #ffffff; }
	.label.label-dark-75 {
			color: #ffffff;
			background-color: #464E5F; }
	.label.label-outline-dark-75 {
			background-color: transparent;
			color: #464E5F;
			border: 1px solid #464E5F; }
			.label.label-outline-dark-75.label-outline-2x {
					border: 2px solid #464E5F; }
	.label.label-light-dark-75 {
			color: #464E5F;
			background-color: #E5EAEE; }
	.label.label-inline {
			width: auto;
			padding: 0.15rem 0.75rem;
			border-radius: 0.42rem; }
			.label.label-inline.label-md {
					padding: 0.8rem 0.6rem; }
			.label.label-inline.label-lg {
					padding: 0.9rem 0.75rem; }
			.label.label-inline.label-xl {
					padding: 1rem 0.85rem; }
	.label.label-pill {
			border-radius: 2rem; }
	.label.label-rounded {
			border-radius: 0.42rem; }
	.label.label-square {
			border-radius: 0; }
	.label.label-dot {
			display: inline-block;
			font-size: 0 !important;
			vertical-align: middle;
			text-align: center; }
	.label.label-inline {
			width: auto; }
	.label.label-dot {
			line-height: 6px;
			min-height: 6px;
			min-width: 6px;
			height: 6px;
			width: 6px; }
	.label.label-sm {
			height: 16px;
			width: 16px;
			font-size: 0.75rem; }
			.label.label-sm.label-inline {
					width: auto; }
			.label.label-sm.label-dot {
					line-height: 4px;
					min-height: 4px;
					min-width: 4px;
					height: 4px;
					width: 4px; }
	.label.label-lg {
			height: 24px;
			width: 24px;
			font-size: 0.9rem; }
			.label.label-lg.label-inline {
					width: auto; }
			.label.label-lg.label-dot {
					line-height: 8px;
					min-height: 8px;
					min-width: 8px;
					height: 8px;
					width: 8px; }
	.label.label-xl {
			height: 28px;
			width: 28px;
			font-size: 1.1rem; }
			.label.label-xl.label-inline {
					width: auto; }
			.label.label-xl.label-dot {
					line-height: 10px;
					min-height: 10px;
					min-width: 10px;
					height: 10px;
					width: 10px; }

div#kt_app_root .d-flex.flex-center.w-lg-50.pt-15.pt-lg-0.px-10 {
    align-items: flex-start;
    padding-top: 33px !important;
    justify-content: flex-start;
}
div#kt_app_root a.mb-7.login-logo img {
    max-width: 360px;
}
.login-right-sec h2.text-white.fw-normal.m-0 {
    font-size: 18px !important;
}
.follow_us {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.follow_us ul {
    display: flex;
    list-style: none;
    gap: 10px;
    align-items: center;
    margin-left: 0px;
    padding-left: 0px;
    margin-bottom: 0px;
    width: 100%;
    justify-content: flex-end;
}


.dashboard_flex {
    display: flex;
    padding: 20px 0px;
    gap: 20px;
}

.customer_flex{
background: #fff;
    border-radius: 10px;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
.customer_details .info {
    width: calc(50% - 5px);
    text-align: center;
}

.dashboard_flex .customer_flex {
    width: 35%;
	padding: 20px;
}

.dashboard_flex .device {
    width: 30%;
    /* background: #fff; */
    border-radius: 10px;
    padding: 20px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
.live_alarms {
    /* background: #fff; */
    width: 33%;
    border-radius: 10px;
    padding: 20px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}

.customer_details .info {
    width: calc(50% - 5px);
    text-align: center;
    /* background: #f8f8f8; */
    /* border: 1px solid #000; */
    border-radius: 5px;
    padding: 10px;
}

.customer_details .info .d-flex.text-center.flex-column.my-7 {
    margin: 0px !important;
    margin-top: 16px !important;
}

.dashboard_flex h3 {
    margin-bottom: 10px;
}


.notification {
  overflow: hidden;
  border-radius: 0.5rem;
  width: 100%;
  padding: 1rem;
  /* background: #ffffff; */
  pointer-events: auto;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
margin-bottom:10px;
}

.notification-inner {
  display: flex;
  align-items: flex-start;
}

.notification-icon {
  flex-shrink: 0;
}

.icon {
  width: 1.5rem;
  height: 1.5rem;
  color: #34d399;
}

.notification-text {
  padding-top: 0.125rem;
  margin-left: 0.75rem;
  flex: 1 1 0%;
  width: 0;
}

.title {
  font-size: 18px;
  line-height: 1.5rem;
  font-weight: 500;
  color: #fff;
}

.subtitle {
  margin-top: 0.25rem;
  font-size: 14px;
  line-height: 1.25rem;
  color: #6b7280;
margin-bottom:0px;
}

.notification-action {
  display: flex;
  margin-left: 1rem;
  flex-shrink: 0;
}

button {
  display: inline-flex;
  border-radius: 0.375rem;
  color: #9ca3af;
  border: none;
  /* background-color: #ffffff; */
  cursor: pointer;
}
button:hover {
  color: #6b7280;
}

.x-icon {
  width: 1.25rem;
  height: 1.25rem;
}


div#kt_app_main {
    /* background: #f5f5f5; */
}

.not_sec{
	overflow-y: scroll;
    max-height: 375px;
}
.term_customer ul {
    list-style: none;
    display: flex;
    gap: 10px;
    justify-content: flex-start;
}

.term_customer ul li a {
    color: #fff !important;
}
.login-card-inner {
    padding-bottom: 0px !important;
}
.follow_us ul li svg path {
    fill: #fff;
}
.follow_us ul {
    position: absolute;
    bottom: 15px;
    right: 20px;
}
.login-card {
    position: relative;
}


/* new dashboard dec*/


div#kt_app_main {
    background: #000;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar
Specificity: (0,2,0)
 {
    background-color: #1C1C1C;
}
[data-bs-theme=dark] .theme-light-show {
    display: block !important;
    height: 35px !important;
}
div#\#kt_app_sidebar_menu .menu-item.here.show a.menu-link.active {
    background: #00BE59;
    padding: 12px;
}

.menu-item.px-5.my-1.main_head {
    padding-left: 0px !important;
}

.menu-item.px-5.my-1.main_head h1 {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 10px;
}
.main_head img {
    width: 22px;
}

body,h1,h2,h3,h4,h5,h6,p{
font-family: "Poppins", sans-serif !important;
}


.main_dash_two_box .customer_details {
    background: #1C1C1C;
    padding: 20px;
    border-radius: 16px;
}
.main_dash_two_box .box_comm {
    background: #2D2D2D;
    backdrop-filter: blur(60px);
    padding: 15px;
    border-radius: 8px;
    flex: 1;
}
.cust_flex_box {
    display: flex;
    justify-content: space-between;
    gap: 15px;
}

.main_dash_two_box .box_comm h5 {
    margin-top: 12px;
    margin-bottom: 12px;
    font-weight: 500;
}

.main_dash_two_box .box_comm h3 {
    margin-bottom: 0px;
    font-size: 15px;
    font-weight: 500;
}
.main_dash_two_box .box_comm img {
    width: 45px;
}
.cust_flex_box {
    margin-top: 15px;
}
.main_dash_two_box .customer_details > h3 {
    font-size: 16px;
}



.not_sec {
    padding: 0px !important;
}
h4.live_alarm {
    padding: 20px;
    padding-bottom: 0px;
    font-size: 16px;
}
.notification-action button {
    background: transparent;
    padding: 0px;
    color: #fff;
}
.notification-text p.title {
    font-size: 16px;
margin-bottom: 5px;
}
.notification {
    box-shadow: none;
}

.notification-text p.subtitle {
    color: #fff;
    font-size: 14px;
    line-height: normal;
    font-weight: 300;
}
.table_dashboard {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.table_dashboard input.form-control.form-control-solid.w-250px.ps-12 {
    background: #fff !important;
}

button.btn.btn-light-primary.me-3 {
    border: 1px solid #fff !important;
    background: transparent;
    color: #fff;
}
.ki-filter .path2:before {
    content: "\ec3f";
    position: absolute;
    left: 0;
    opacity: 1;
    color: #fff;
}
.table_dashboard .card-toolbar i.ki-duotone.ki-filter.fs-2 {
    color: #fff;
}

.device_details {
    background: #1C1C1C;
    padding: 20px;
    border-radius: 16px;
    margin-top: 20px;
}

div#kt_header_search i.ki-outline {
    color: #fff;
}
.app-navbar .app-navbar-item i.ki-outline.ki-notification-status {
    color: #fff;
}

div#kt_header_user_menu_toggle .cursor-pointer.symbol {
    background: #fff !important;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    opacity: 1;
}
div#fixMeDetectBox {
    display: none;
}
div#kt_app_sidebar_logo.active_sidebar img.h-25px.app-sidebar-logo-default.theme-light-show {
    display: none !important;
}
img.h-20px.app-sidebar-logo-minimize {
    height: 30px !important;
}



video#background-video {
    position: absolute;
    width: 100%;
    z-index: -1;
    height: -webkit-fill-available;
    object-fit: cover;
}

body#kt_body.bgi-no-repeat {
    position: relative;
}
/* body#kt_body.bgi-no-repeat:after {
    content: '';
    position: absolute;
    background: #0000001c;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
} */


.dashboard_form {
    justify-content: flex-start !important;
}

.login-card {
    padding: 30px !important;
}
.dashboard_logo img {
    width: 210px;
}

.login-card-inner {
    padding-right: 0px !important;
    padding-left: 0px !important;
}
.login-card {
    width: 500px !important;
}
.term_customer {
    margin-bottom: 30px;
}
.term_customer ul {
    padding-left: 0px;
}

.dashboard_logo {
    text-align: center;
    margin-bottom: 35px;
}


/*  users -1 */ 

.icon_flex_box {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}
.card-body.d-flex.flex-center.flex-column.py-9.px-5.ribbon.ribbon-clip.ribbon-left {
    padding: 10px !important;
}
.id_and_active a.card.card-custom {
    border: none;
}

.id_and_active .symbol.py-1.px-3.symbol-2by3 {
    padding: 0px !important;
}
.id_and_active span.fs-2x.text-success {
    font-size: 16px !important;
    color: #fff !important;
    font-weight: 600;
}
.id_and_active .ribbon-target {
    background: #00BE59;
    border-radius: 40px;
    text-transform: capitalize;
    font-style: italic;
    padding: 0px 10px;
    width: fit-content;
}
.id_and_active a.card.card-custom {
    margin-bottom: 5px;
}
.icon_flex_box .nav-icon svg {
    width: 60px;
    height: 60px;
}
.sub_id_txt {
    width: 100%;
    margin-top: 20px;
}
.sub_id_txt p.text-gray-400.fw-semibold.fs-5.mt-1.mb-7 {
    color: #fff !important;
    font-weight: 500 !important;
    font-style: italic;
}
.boxes_new_design {
    flex-wrap: wrap;
    gap: 10px;
}
.boxes_new_design .border.border-gray-300.border-dashed.rounded.text-center {
    width: calc(50% - 5px) !important;
    min-width: calc(50% - 5px) !important;
    margin-right: 0px !important;
    margin-bottom: 0px !important;
}


.boxes_new_design .border.border-gray-300 {
    border: 2px solid #fff !important;
    border-radius: 8px !important;
}
.create_date,.assign_date {
    text-align: left !important;
}

.ribbon-left .fw-semibold.text-gray-400 {
    margin-top: 10px;
    color: #fff !important;
}

.ribbon-left .fs-6.text-gray-800.fw-bold {
    color: #fff !important;
    font-style: italic;
    font-weight: 300 !important;
}

.km_data {
    text-align: left;
    position: absolute;
    bottom: 8px;
}
.daily_km {
    position: relative;
}
.battery_level span.fw-bold.fs-6 {
    font-size: 20px !important;
    line-height: normal !important;
}
.battery_level .fw-semibold.text-gray-400 {
    margin-top: 0px !important;
    font-style: italic;
}

.km_data .fw-semibold.text-gray-400 {
    margin-top: 0px;
    color: #FFE427 !important;
}

.device_status .fw-semibold.text-gray-400 {
    margin-top: 0px;
    margin-right: 0px;
    position: relative;
    right: -10px;
}



.toggle-button-cover {
  display: table-cell;
  position: relative;
  width: 100px;
  box-sizing: border-box;
}

.button-cover {
  border-radius: 4px;
}

/* .device_status .button-cover:before {
  counter-increment: button-counter;
  content: counter(button-counter);
  position: absolute;
  right: 0;
  bottom: 0;
  color: #d7e3e3;
  font-size: 12px;
  line-height: 1;
  padding: 5px;
} */

.button-cover,
.knobs,
.device_status .layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.device_status .button {
  position: relative;
  top: 50%;
  width: 60px;
  height: 35px;
  margin: -20px auto 0 auto;
  overflow: hidden;
}

.device_status .button.r,
.device_status .button.r .layer {
  border-radius: 100px;
}

.device_status .button.b2 {
  border-radius: 2px;
}

.device_status .checkbox {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}

.knobs {
  z-index: 2;
}

.device_status .layer {
  width: 100%;
  background-color: #ebf7fc;
  transition: 0.3s ease all;
  z-index: 1;
}

/* Button 1 */
#button-1 .knobs:before {
    content: "ON";
    position: absolute;
    top: 2px;
    left: 4px;
    width: 30px;
    height: 30px;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
    padding: 9px 4px;
    background-color: #03a9f4;
    border-radius: 50%;
    transition: 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15) all;
    display: flex;
    align-items: center;
    justify-content: center;
}

#button-1 .checkbox:checked + .knobs:before {
    content: "OFF";
    left: 25px;
    background-color: #f44336;
}

#button-1 .checkbox:checked ~ .layer {
    background-color: #ffffff;
}

#button-1 .knobs,
#button-1 .knobs:before,
#button-1 .layer {
  transition: 0.3s ease all;
}

.device_status {
    width: 100%;
    justify-content: flex-end;
    margin-top: 10px;
    margin-bottom: 5px !important;
}
div#app-cover {
    position: relative;
    right: -10px;
}

ul.breadcrumb li{
    color: #fff !important;
}
ul.breadcrumb li span{
  background-color: #fff;
}

.flex_box_three .flex_comm {
    background: #1C1C1C;
}
.device_main_flex .flex_box_three {
    display: flex;
    gap: 20px;
}
.flex_box_three .flex_comm {
    background: #1C1C1C;
    border-radius: 16px;
    padding: 10px;
    flex: 1;
}

.cd_ad_flex {
    display: flex;
}

.id_active a.text-gray-800 {
    font-size: 16px !important;
    color: #fff !important;
    font-weight: 600;
}
.id_active span.badge.badge-primary.me-auto {
    background: #00BE59;
    border-radius: 40px;
    text-transform: capitalize;
    font-style: italic;
    padding: 5px 10px;
    width: fit-content;
    font-size: 13px;
}
.id_active {
    display: flex;
    align-items: center;
}
.id_data span.badge.badge-light-primary {
    font-size: 15px !important;
    color: #fff !important;
    font-weight: 500 !important;
    background: transparent;
    padding: 0px;
    display: block;
    text-align: left;
    margin: 6px 0px;
}

.d-flex.flex-wrap.fw-semibold.mb-4.fs-5.text-gray-400 {
    color: #fff !important;
    font-style: italic;
    font-size: 13px !important;
    margin: 6px 0px !important;
}


.flex_comm.id .d-flex.flex-wrap.fw-semibold.mb-4.fs-5.text-gray-400 {
    color: #fff !important;
    font-style: italic;
    font-size: 13px !important;
    margin: 8px 0px !important;
    border-bottom: 1px solid !important;
    margin-left: -10px !important;
    margin-right: -10px !important;
    padding-left: 10px;
    padding-bottom: 10px;
}
.date_email_data .me-6 {
    margin-right: 0px !important;
    border: none !important;
    background: #2D2D2D;
	padding: 7px !important;
}
.cd_ad_flex {
    display: flex;
    gap: 10px;
}
.flex_cm {
    display: flex;
    align-items: center;
    gap: 8px;
}
.flex_cm .fw-semibold.fs-6.text-gray-400 {
    color: #fff !important;
    font-size: 14px !important;
}
.date_txt {
    font-style: italic;
    font-size: 13px;
}
.cd_box, .ad_box {
    flex: 1;
}
.flex_cm svg {
    width: 45px;
    height: 45px;
}
.data_txt .fs-4.fw-bold {
    font-size: 12px !important;
}
.dstatus {
    margin-top: 10px !important;
    display: flex;
}
.flex_box_three .flex_comm h5 {
    font-weight: 400;
}



.monitor_control_sec {
    padding-left: 30px;
    padding-right: 30px;
}
.mc_box {
    margin-top: 40px;
}
.mc_box ul {
    list-style: none;
    margin: 0px;
    background: #fff;
    display: inline-flex;
    padding: 3px;
    border-radius: 100px;
}
.mc_box li a{
    border-radius: 100px;
    padding: 10px;
    color: #000;
    font-size: 15px;
    padding: 10px 20px;
    font-weight: 500;
}
.mc_box li.active a{
    background: #00BE59;
    color: #fff !important;
}
.batt_st_flex {
    background: #1C1C1C;
    border-radius: 8px;
    padding: 12px 20px;
    display: flex;
justify-content: space-between;
}
.battery_ststus {
    margin-top: 25px;
}

.battery_graph {
    display: flex;
    gap: 15px;
    text-align: center;
    align-items: center;
}
.battery_main .batt_details p {
    margin-bottom: 5px;
    font-size: 14px;
}
.battery_main .batt_details p span {
    color: #00BE59;
    font-weight: 600;
}
.battery_main .batt_icon {
    margin-bottom: 10px;
}
.battery_alaram_main .batt_icon_flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.battery_alaram_main {
    background: #2D2D2D;
    padding: 10px;
    border-radius: 10px;
    width: 27%;
    text-align: center;
}
.battery_graph .graph_details p {
    margin-bottom: 0px;
    margin-top: 15px;
    font-size: 15px;
}
.battery_alaram_main p {
    margin-bottom: 0px;
    display: flex;
    align-items: center;
    gap: 5px;
}
.alaram_data {
    margin-top: 25px;
}
.battery_crnt_ststus {
    background: #1C1C1C;
    margin-top: 25px;
    padding: 20px;
    border-radius: 8px;
}
.stts_types_flex {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.cmn_sts {
    background: #000000;
    display: flex;
    align-items: center;
    padding: 10px;
    justify-content: space-between;
    width: calc(33% - 10px);
}
.cmn_sts p {
    margin-bottom: 0px;
    font-size: 14px;
    font-weight: 500;
}
.cmn_sts p:last-child {
    color: #00BE59;
}
.status_point p span {
    width: 10px;
    height: 10px;
    background: #00BE59;
    display: inline-block;
    border-radius: 50%;
}
.status_point p {
    display: flex;
    align-items: center;
    gap: 7px;
}

.battery_voltage {
    background: #1C1C1C;
    padding: 20px;
    border-radius: 10px;
    margin-top: 25px;
}

.volts_head ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.volts_head ul li {
    font-size: 15px;
    font-weight: 500;
}
.battery_graphs_flexs {
    margin-top: 25px;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}
.battry_icons {
    width: calc(10% - 3px);
}
.mc_box li a {
    color: #000;
}
.mc_box ul li {
    display: inline-flex;
}


.tab_sec_main .tab {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.tab_sec_main .tab button {
    background-color: inherit;
    outline: none;
    cursor: pointer;
    padding: 8px 15px;
    transition: 0.3s;
    font-size: 13px;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 100px;
}

.tab_sec_main .tab button:hover {
  background-color: #fff;
  color:#000;
}

.tab_sec_main .tab button.active {
    background-color: #FFFFFF;
    color: #000;
}

.tab_sec_main .tabcontent {
  display: none;
  color: #fff;
}


.admin_flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 30px;
    padding-right: 30px;
}
.admin_flex div#kt_app_toolbar_container {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.admin_flex h1.page-heading.d-flex.text-dark.fw-bold.fs-3.flex-column.justify-content-center.my-0 {
    display: none !important;
}
.support_box .d-flex.mb-4 {
    margin-bottom: 0px !important;
}
.support_box button.btn.btn-sm.btn-danger {
    background: #0C914B;
    font-style: italic;
    border: 1px solid #fff !important;
}

.support_box button.btn.btn-sm.btn-icon.btn-bg-light.btn-active-color-primary {
    border: 1px solid #fff !important;
    background: transparent !important;
border-radius: 4px;
}
.support_box button.btn.btn-sm.btn-icon.btn-bg-light.btn-active-color-primary i {
    color: #fff;
}

button.hc_box.btn.btn-sm {
    border: 1px solid #fff !important;
    font-style: italic;
    font-size: 13px;
    font-weight: 500;
border-radius: 4px;
margin-left: 5px;
    margin-right: 5px;
}

div.tabcontent {
    margin-top: 30px;
}
.tab_sec_main .tab {
    margin-top: 30px;
}
div.tabcontent .card-body.border-top.p-9 {
    padding: 20px !important;
}

div.tabcontent label {
    font-size: 16px !important;
    border-left: 2px solid #00BE59;
    border-radius: 2px;
    display: flex;
    align-items: center;
}
div.tabcontent .form-group.row.mt-4.br-1 > .col-3 {
    text-align: center;
}


div.tabcontent  .form-group.row.mt-4.br-1 > .col-3 input.form-control {
    margin-top: 4px;
    border: 1px solid #fff;
}


.battery_main .battery {
     position: relative;
     width: 148px;
     height: 60px;
     border: 1px solid #00be59;
     border-radius: 4px;
     padding: 6px;
     box-sizing: border-box;
 }
 .battery_main .battery:after {
     content: "";
     position: absolute;
     right: -11px;
     top: 18px;
     width: 10px;
     height: 25px;
     border: 1px solid #00be59;
     border-left: 0px;
 }
 div#batteryFill {
     height: 100%;
     width: 40%;
     background: #00ff66;
     border-radius: 0;
     transition: width 0.4s ease;
 }
 
 div#batteryText {
     position: absolute;
     inset: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #ffffff;
     font-weight: 600;
     font-size: 16px;
     pointer-events: none;
     white-space: nowrap;
 }
/*  .gauge {
   width: 320px;
   height: 220px;
 } */
 
 .gauge .dxg-range.dxg-background-range {
   fill: url(#gradientGauge);
 }
 
 /* Needle styling */
 .gauge .dxg-value-indicator path {
   transform: scale(1.15) translate(0, -5px);
   transform-origin: center;
 }
 
 /* Center hole */
 .gauge .dxg-spindle-hole {
   fill: #26323a;
 }

.battery_graph svg text {
    fill: #fff !important;
    font-size: 15px !important;
}

.battery_graph .gauge svg {
    width: 190px !important;
height: 190px !important;
}
.batt_st_flex {
    gap: 15px;
    align-items: stretch;
}


.battery_main {
    display: flex;
    flex-direction: column;
    justify-content: center;
}