@font-face {
	font-family: 'Pretendard';
	src: url("/pretendard.ttf");
}

@font-face {
	font-family: 'PretendardMedium';
	src: url('/PretendardMedium.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'PretendardSemiBold';
	src: url('/PretendardSemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'PretendardExtraBold';
	src: url('/PretendardExtraBold.woff2') format('woff2');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}


@font-face {
	font-family: 'Glyphicons Halflings';
	src: url('../fonts/glyphicons-halflings-regular.eot');
	src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

.glyphicon {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: 'Glyphicons Halflings';
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}

.glyphicon-chevron-up:before {
	content: "\e113";
}

.glyphicon-chevron-down:before {
	content: "\e114";
}



:root {
	--body-bg: #FAFAFA;
	--bg-outer-section: #ffffff;
	--bg-light: #ffffff;
	--bg-secondary: #ffffff;
	--bg-btn-checked: #00C6C10D;
	--inner-cards-bg: #ffffff;
	--bg-search: #FAFAFA;
	--header-bg: #ffffff;
	--btn-color: #2764DE;
	--divider-vertical: #F0F0F0;
	--txt-primary-color: #2764DE;
	--borderClr: #f0f0f0;
	--Color-interactive-Default: #2764DE;
	--btn-bg: #2764DE;
	--form-control-bg: #ffffff;
	--Color-bg-primary: rgba(41, 41, 41, 1);
	--Color-stroke-strokeSubtle: rgba(110, 110, 110, 1);
	--input-color-light: #8B8B8B;
	--input-bg-dark: #fff;
	--input-bg-light: #ffffff;
	--input-border: #2764DE;
	--time-placeholder-bg: #ffffff;
	--nav-text: #2764DE;
	--checkbox-bg: #2764DE;
	--btn-color: #2764DE;
	--btn-border: #2764DE;
	--btn-bg-datatable-paginate: lightgray;
	--btn-color-datatable-paginate: #2764DE;
	--btn-primary-active: #2764DE;
	--btn-primary-text-active: #FAFAFA;
	--readonly: rgb(122 122 122 / 18%) !important;
	--bg-time-button: #2764DE1A;
	--label-color: #0A0A0A;
	--error-alert-color: #E54552;
	--chart-bg-light: #FAFAFA;
	--text-color: #000000;
	--text-color-apx-tooltip: #000000;
	--Color-btn-Active-light: #2764DE;
	--btn-color-darktheme: #2764DE;
	--btn-color-primary: #2764DE;
	--btn-color-toggletheme: #2764DE;
	--background-light: #ffffff;
	--background-light-selected: #f0f0f0;
	--Color-interactive-Default: #2A4EA8;
	--border-light-white: #f0f0f0;
	--text-light: #FAFAFA;
	--border-color-blue: #2764DE;
	--border-navbar: #2764DE;
	--font-label24: 24px;
	--form-switch-bg: #A9A9A9;
	--color-white-dark: #000000;
	--color-white-light: #ffffff;
	--color-skyblue-info: #55D3CF;
	--color-darkskyblue: #2A4EA8;
	--color-light-gray-bg: #FAFAFA;
	--color-muted: #8B8B8B;
	--toggle-button-bg-inactive: #d1c5c5;
	--toggle-checked-color: #bdbdbd;
	--grid-action: #404040;
	--form-control-border: #DCDCDC;
	--form-control-border-search:#DCDCDC;
	--border-gray: #525252;
	--disabled-pagin: #525252;
	--form-input-disabled: #e9ecef;
	--tabel-border: #F0F0F0;
	--modal-bg-light: #ffffff;
	--border-select: #DCDCDC;
	--tbl-border: #f0f0f0;
	--tbl-header-bg: #f0f0f0;
	--tbl-header-bgcard: #f0f0f0;
	--tbl-head-border: #DCDCDC;
	--tbl-odd-strip: #FAFAFA;
	--tbl-header-text: #0A0A0A;
	--tbl-text: #000;
	--bg-lightselected: #e6e6e6;
	--paginate_button-text-color: #505050;
	--paginate_button-bg: #ffffff;
	/* Spacing element variables */
	--Spacingspacing-200: 16px;
	--Sizeradiusr8: 8px;
	--Spacingspacing-150: 12px;
	--Spacingspacing-300: 24px;
	--Spacingspacing-050: 4px;
	--Spacingspacing-400: 32px;
	--Spacingspacing-100: 8px;
	--gap-spacing-24: 24px;
	--gap-spacing-200: 16px;
	--Radiuscorner-radius-050: 4px;
	--Radiuscorner-radius-100: 8px;
	--selected-date-bg: #2764DE;
	--selected-date-color: #000000;
	--clock-svg-filter: invert(0);
	--svg-filter: none;
	--bg-hover: #FAFAFA;
	--chip-container: #ffffff;
	--text-color-theme-toggle: #2764DE;
	--bg-color-theme-toogle: #2764DE;
	--bg-dropdown-color-toggle: #fafafa;
	--chart-axis-text: #000000;
	--chart-bar-bg: #2764DE;
	--chart-bars: #2764DE;
	--chart-tooltip-bg-color: #ffffff;
	--chart-tooltip-text-color: #0A0A0A;
	--selected-row: #2764DE1A;
	--text-color-link: #2764DE;
	--table-row-color: #0A0A0A;
	--scrollbar-stack: #fafafa;
	--bg-dt-length: #ffffff;
	--calc-info: #9f9d9e;
	--text-color-userprofile: #000000;
	--drawItem-label: #8B8B8B;
	--form-selectarrow_down: url(/down_arrow_select) !important;
	--bsdropdown-color: #212529;
	--active-text: #2764DE;
	--loader-fade-bg: #f2f2f27d;
	--Discharge-bg: #fd8b1c75;
	--Charge-bg: #69d01638;
	--line-color:#000;
	--event-summary:#8B8B8B;
	--annotations-text-color:#000000;
	--annotations-bg-color:#ffffff;
	/* Program Type colors */
	--protyp-REC-bg:#FEEDEA;
   --protyp-DR-bg:#FEEBFF;
   --protyp-VPPETG-bg:#F1FCE8;
   --protyp-EA-bg: #EBF9FF;
   --protyp-CUR-bg: #F0EAFE;
   --protyp-default:#d3d3d3;
   --annotations-bg-opacity:0.6;

   --charge-annotations-bg:#cdf4d3;
   --discharge-annotation-bg: #ffcdc2b0;

   /* --charge-annotations-bg:#2764DE4D;
   --discharge-annotation-bg:#8B8B8B; */

   --line-color1:#021C77;

   --line-color2:#C015F7;
   --line-color3:#37B637;
 /* --line-color3:#37B637; */
   
	--choices-list-selected-bg:#e6f0ff;
	--choices-list-selected-text:#000000;

	--filter-darklight:invert(1);
	--checkbox-border:#8B8B8B;
	--btn-over:#2046B6;
	--new-text:#505050;
	--new-search:#fafafa;
	--badge-color:#8b8b8b;
	--table-new-border-color:#f0f0f0;
	--table-new-border-color-header:#DCDCDC;

}

.dark-theme {
	--body-bg: #191919;
	--bg-outer-section: #292929;
	--bg-black: #FAFAFA;
	--bg-light: #292929;
	--bg-secondary: #292929;
	--bg-btn-checked: #00C6C11A;
	--inner-cards-bg: #353535;
	--icon-filter: invert(1);
	--bg-search: #292929;
	--header-bg: #292929;
	--text-color-apx-tooltip: #292929;
	--text-color: #bfbfbf;
	--btn-color: #fff;
	--txt-primary-color: #00C6C1;
	--borderClr: #353535;
	--divider-vertical: #6e6e6e;
	--Color-interactive-Default: #7EE2DE;
	--btn-bg: #9f9d9e;
	--form-control-bg: #353535;
	--portalThemeColor: #ffffff !important;
	--Color-bg-primary: rgba(41, 41, 41, 1);
	--Color-stroke-strokeSubtle: rgba(110, 110, 110, 1);
	--form-control-border: #525252;
	--form-control-border-search: #a6a6a640 ;
	--time-placeholder-bg: #353535;
	--nav-text: #7EE2DE;
	--border-navbar: #7EE2DE;
	--calc-info: #7EE2DE;
	--background-light: #353535;
	--background-light-selected: #353535;
	--Spacingspacing-200: 16px;
	--Spacingspacing-300: 24px;
	--color-white-dark: #ffffff;
	--Radiuscorner-radius-100: 8px;
	--checkbox-bg: #00C6C1;
	--input-color-light: #ffffff;
	--input-bg-dark: #353535;
	--input-border: #7EE2DE;
	--btn-color-toggletheme: #00c6c1;
	--text-color-link: #00c6c1;
	--btn-color-primary: #00c6c1;
	--btn-border: #00c6c1;
	--btn-bg-datatable-paginate: #191919;
	--btn-color-datatable-paginate: #7EE2DE;
	--Color-interactive-Active: #00C6C1;
	--btn-color: #00C6C1;
	--label-color: #fff;
	--border-color-blue: #00c6c1;
	--border-select: #525252;
	/* padding spacing var */
	--Spacingspacing-050: 4px;
	--Spacingspacing-400: 32px;
	--Spacingspacing-300: 24px;
	/* form controls var */
	--btn-primary-active: #00c6c1;
	--btn-primary-text-active: #fff;
	--error-alert-color: #E54552;
	--readonly: #ebebeb !important;
	--tbl-border: #6E6E6E;
	--tbl-header-bg: #353535;
	--tbl-header-bgcard: #191919;
	--tbl-head-border: #DCDCDC;
	--tbl-odd-strip: #FAFAFA;
	--tbl-header-text: #FAFAFA;
	--color-muted: #FAFAFA;
	--tbl-text: #fafafa;
	--color-darkskyblue: #2A4EA8;
	--modal-bg-light: #292929;
	--paginate_button-bg: #191919;
	--paginate_button-text-color: #FAFAFA;
	--bg-lightselected: #353535;
	--selected-date-bg: #00c6c1;
	--selected-date-color: #353535;
	--btn-color-darktheme: #00c6c1;
	--border-light-white: #353535;
	--bg-time-button: #00C6C11A;
	--svg-filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(154deg) brightness(118%) contrast(119%);
	--clock-svg-filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(154deg) brightness(118%) contrast(119%);
	--text-color-theme-toggle: #00c6c1;
	--bg-color-theme-toogle: #00c6c1;
	--bg-dropdown-color-toggle: #353535;
	--chip-container: #252525;
	--bg-hover: #353535;
	--chart-bars: #2D7ACC;
	--form-bg-color: #292929;
	/* Chart */
	--chart-axis-text: #ffffff !important;
	--chart-bar-bg: #00c6c1;
	--chart-tooltip-bg-color: #0A0A0A;
	--chart-tooltip-text-color: #8B8B8B;
	--tabel-border: #6E6E6E;
	--text-color-userprofile: #fafafa;
	--selected-row: #001A36;
	--table-row-color: #ffffff;
	--bg-dt-length: #191919;
	--scrollbar-stack: #353535;
	--dark-tbl-odd-strip: #353535;
	--drawItem-label: #8B8B8B;
	--disabled-pagin: #fafafa;
	--form-selectarrow_down: url(/down_arrow_select) !important;
	--form-input-disabled: #5a5a5a;
	--active-text: #00c6c1;
	--bsdropdown-color: #fafafa;
	--loader-fade-bg: rgb(78 78 78 / 60%);
	--annotations-text-color:#ffffff;
	--annotations-bg-color:#000000;
	--annotations-bg-opacity:0.2;
	--Discharge-bg: #712026;  
		  --Charge-bg: #2e6304;
	/* --Discharge-bg:#8B8B8B;
	--Charge-bg:#0095D599; */

	--line-color:#fff;
	--event-summary:#ffffff;
	/* Program Type Color */

	  --protyp-REC-bg:#00000040;
    --protyp-DR-bg:#00000040;
  	 --protyp-VPPETG-bg:#00000040;
  	 --protyp-EA-bg: #00000040;
  	 --protyp-CUR-bg: #00000040;
  	 --protyp-default:#00000040;

	 /* --charge-annotations-bg:#712025d5;
   --discharge-annotation-bg:#6ad0163f; */

   /* --charge-annotations-bg:#0095D599;
   --discharge-annotation-bg:#8B8B8B; */

 --charge-annotations-bg:#69D016;
   --discharge-annotation-bg:#FD2F40;  
   

    --line-color1:#00C6C1;
	 --line-color2:#C015F7;
   --line-color3:#37B637;

   	--choices-list-selected-bg:#272727;;
	--choices-list-selected-text:#ffffff;

	--filter-darklight:invert(0);
	--checkbox-border:#8B8B8B;
	--btn-over:#00c6c1;
	--new-text: #bfbfbf;
	--new-search:#353535;
	--badge-color:#8b8b8b;
	--table-new-border-color:#505050;
	--table-new-border-color-header:#505050;
}

body {
	background-color: var(--body-bg) !important;
	color: var(--text-color) !important;
	font-family: 'Pretendard' !important;
	height: Calc(100% - 100px);

}



body.loading {
	visibility: hidden;
	/* Hide content while loading */
}

.fixed-top.navbar-dark {
	background-color: var(--header-bg) !important;
}

textarea {
	resize: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
label,
.ms-DetailsRow-cell,
.ms-DetailsHeader-cellName {
	color: var(--text-color) !important;
}

p {
	font-family: "Pretendard" !important;
	font-size: 14px;
	margin: 0 !important;
	padding: 0;
}

h1,
h2,
h3,
h4,
p {
	margin: 0;
	padding: 0;
}

.font-12 {
	font-size: 12px !important;
}

.font-14 {
	font-size: 14px !important;
}

.font-16 {
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
}

.font-18 {
	font-size: 18px !important;
}

.font-20 {
	font-size: 20px !important;
}

.font-22 {
	font-size: 22px !important;
}

.font-24 {
	font-size: 24px !important;
}

.font-26 {
	font-size: 26px !important;
}

.font-semi {
	font-family: 'PretendardSemiBold' !important;
	font-weight: 600;
}


.mb-3 {
	margin-bottom: 24px !important;
}

.mt-48 {
	margin-top: 48px !important;
}

.mb-24 {
	margin-bottom: 24px;
}

.mt-24 {
	margin-top: 24px;
}

.mb-16 {
	margin-bottom: 16px;
}

.mb-35 {
	margin-bottom: 35px !important;
}

.mr-55 {
	margin-right: 55px !important;
}

.mt-56 {
	margin-top: 56px !important;
}

.mr-3 {
	margin-right: 20px;
}

.mb-32 {
	margin-bottom: 32px;
}

.mt-93 {
	margin-top: 93px;
}

.mt-60 {
	margin-top: 60px;
}

.p-24 {
	padding: 24px;
}

.pt-24 {
	padding-top: 24px;
}

.pb-24 {
	padding-bottom: 24px;
}

.p-20 {
	padding: 20px;
}


.w-500 {
	font-weight: 500;
}

.gap-20 {
	gap: 20px;
}

.gap-10 {
	gap: 10px !important;
	display: flex;
}

.gap-6 {
	gap: 6px;
}

.gap-r-8 {
	gap: 8px 0px;

}

.popup-title h3 {
	color: var(--tbl-header-text);
	text-align: center;
	font-family: 'Pretendard';
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: 24px;
	letter-spacing: 0.2px;
}


label,
.form-label {
	font-size: 12px;
	font-family: 'Pretendard' !important;
	margin-bottom: 6px;
	color: var(--label-color);
	line-height: 16px;
}

.fixed-top.navbar .menu-bar>.navbar-nav>li>a {
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	font-family: 'Pretendard' !important;
}

.fixed-top.navbar .menu-bar>.navbar-nav>.divider-vertical {
	border-right: 1px solid var(--divider-vertical) !important;
	border-left: 1px solid var(--divider-vertical) !important;
}

a,
.pointer {
	font-family: 'Pretendard' !important;
	cursor: pointer !important;
}

.fixed-top.navbar .menu-bar>.navbar-nav>li>a {}


h2 {
	font-size: 1.2rem !important;
}


h1,
h2,
h3,
h4,
h5,
h6,
label,
.ms-DetailsRow-cell,
.ms-DetailsHeader-cellName {
	color: var(--text-color) !important;
	font-family: 'PretendardSemiBold' !important;
}

p {
	font-family: 'Pretendard';
	color: var(--text-color) !important;
}

h3 {
	margin-top: 0 !important;
}

.dbr-bg {
	padding: 20px !important;
	gap: var(--Spacingspacing-200);
	border-radius: var(--Radiuscorner-radius-100);
	opacity: 0px;
}

.navbar-dark .navbar-nav>li>a:hover,
.navbar-dark .navbar-nav>li.dropdown>a:hover,
.navbar-dark .navbar-nav>li>a {
	color: var(--text-color) !important;
}

.fixed-top.navbar-dark {
	height: 60px;
	padding: 0;
}

.navbar-brand a img {
	width: 92px;
	height: 26px;
	padding: 0px;
	gap: 10px;
	opacity: 0px;
	margin: 0 !important;
}


.fixed-top.navbar .menu-bar>.navbar-nav>li>a {
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 18px !important;
	letter-spacing: 0.20000000298023224px;
	font-family: 'PretendardSemiBold' !important;
	text-align: left;

}

.fixed-top .navbar-brand {
	gap: 20px;
}

#navbar .dropdown-menu {
	background-color: var(--body-bg);
}

.crmEntityFormView,
.entitylist,
.modal-content,
.popover-content {
	color: var(--text-color) !important;
	border: 1px solid var(--border-light-white) !important;
}

.modal-content {
	background-color: var(--modal-bg-light) !important;
	border-radius: 16px;
}

a {
	color: var(--text-color) !important;
}


.crmEntityFormView,
.entitylist,
.modal-content,
.popover-content {
	border: var(--border) !important;
}

.show.dropdown-menu>li>a:hover {
	background-color: var(--body-bg) !important;
	color: var(--text-color) !important;
}


.btn-theme-primary {
	padding: 12px 16px 12px 16px !important;
	gap: 4px !important;
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
	background-color: var(--btn-primary-active) !important;
	font-size: 14px !important;
	line-height: 18px;
	font-weight: 500 !important;
	text-align: center !important;
	color: var(--btn-primary-text-active) !important;
	font-family: 'Pretendard' !important;

}
.btn-theme-primary:hover{background-color: var(--btn-over)!important;}

.btn-primary {
	border: var(--btn-color-toggletheme) !important;
	padding: 8px 24px 8px 24px !important;
	gap: 4px !important;
	border-radius: var(--Radiuscorner-radius-100) !important;
	border: 1px !important;
	opacity: 0px !important;
	background-color: var(--btn-primary-active) !important;
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	font-weight: 400 !important;
	line-height: 24px !important;
	text-align: center !important;
	color: var(--btn-primary-text-active) !important;
}


[type=reset],
[type=submit] {
	border: 1px solid var(--border-color-blue) !important;
}


[type=reset],
[type=submit] {
	float: inline-end !important;
}

.ms-SearchBox {
	border: 1px solid lightgray;
}

.ms-SearchBox-iconContainer,
.iconContainer-229 {
	color: var() !important;
}

.ms-ContextualMenu-linkContent span {
	color: var(--color-white-dark) !important;
}

.ms-ContextualMenu-list {
	border: 1px solid #d3d3d347 !important;
}

.ms-SearchBox-field,
.field-232 {
	color: var(--color-white-dark) !important;
}

.ms-SearchBox-icon,
.icon-233 {
	color: var(--color-white-dark) !important;
}

.clearButton-231 .ms-Button-icon {
	color: var(--color-white-dark) !important;
}


.form-control,
select {
	background-color: var(--form-control-bg) !important;
	color: var(--text-color) !important;
}

.choices__inner{
		background-color: var(--form-control-bg) !important;
		border: 1px solid var(--form-control-border-search) !important;
}

.choices__list--dropdown {
 background-color: var(--form-control-bg) !important;
 box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
		border: 1px solid var(--form-control-border-search) !important;
}

/* Target each option/item in the dropdown */
.choices__item--choice {
 background-color: var(--form-control-bg) !important;
	/* border: 1px solid var(--form-control-border-search) !important; */

		box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

/* Highlighted/active option on hover or keyboard nav */
.choices__item--choice.is-highlighted {
  background-color: var(--form-control-bg) !important;
	/* border: 1px solid var(--form-control-border-search) !important; */
}

/* Optional: style selected items (for multi-select) */
.choices__list--multiple .choices__item {
  background-color: var(--form-control-bg) !important;
	/* border: 1px solid var(--form-control-border-search) !important; */
}

.choices__list--multiple .choices__item {
  border: none!important;
  background-color: transparent; /* Optional: make bg transparent */
  /* padding: 4px 8px; Optional: adjust spacing */
  /* margin: 2px; */
  /* color: #fff; Adjust text color as needed */
}
/* Hide default Choices.js arrow */
.choices[data-type*="select-one"]::after {
  display: none;
}

.choices__list--dropdown .choices__item--highlighted{
	background-color: var(--form-bg-color) !important;
  color: var(--text-color) !important;
}

/* Add custom dropdown icon */
.choices[data-type*="select-one"] {
  position: relative;
}

.choices[data-type*="select-one"] .choices__inner::after {
	content: "";
	position: absolute;
	top: 45%;
	right: 1rem;
	transform: translateY(-50%) rotate(45deg);
	width: 6px;
	height: 6px;
	pointer-events: none;
	border-right: 1px solid var(--text-color);
	border-bottom: 1px solid var(--text-color);
	pointer-events: none;
	width: 8PX;
	height: 8PX;
}

select {
	gap: var(--Spacingspacing-050);
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px;
}

.toggle-button {
	-webkit-appearance: none;
	outline: none;
	width: 20px;
	height: 10px;
	background-color: var(--toggle-button-bg-inactive);
	border-radius: 50px;
	position: relative;
	transition: .4s;
}

.toggle-button:before {
	content: "";
	position: absolute;
	height: 10px;
	width: 10px;
	border-radius: 50px;
	top: 0;
	bottom: 0;
	background-color: var(--toggle-checked-color);
	transition: .4s;
}

.toggle-button:checked {
	background-color: var(--toggle-checked-color);
}

.toggle-button:checked:before {
	transform: translate(100%);
	background-color: #212121;
	transition: .4s;
}



.entity-grid .view-grid {
	height: 60vh;
}


.dropdown-menu {
	background-color: var(--body-bg) !important;
}


.alert-danger {
	--bs-alert-color: #af7e83;
	--bs-alert-bg: #f8d7da;
	--bs-alert-border-color: #f5c2c7;
	background-color: #f8d7da !important;
	padding: 0.5rem;
}

.validation-summary ul {
	margin-bottom: 0 !important;
}

.alert-error ul li {
	color: red;
	font-size: 14px !important;
}

.ms-modal,
.is-open {
	box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
	background-color: var(--background-light) !important;

}

#ModalFocusTrapZone6 {
	width: 50vw !important;
}

.crmEntityFormView .actions {
	border-top: 0px !important;
}

.crmEntityFormView .tab-title {
	border-bottom: 0px !important;
}


.ms-ContextualMenu-checkmarkIcon,
.ms-ContextualMenu-icon {
	color: var(--color-white-dark) !important;
}

.ms-DetailsList-headerWrapper,
.ms-FocusZone,
.css-195,
.ms-DetailsHeader,
.root-227 {
	background-color: var(--bg-secondary) !important;
}

.tab-title {
	visibility: hidden !important;
}


/* Track */
::-webkit-scrollbar-track {
	background: var(--scrollbar-stack);
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #949494;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #949494 !important;
}

h1.siteTitle,
.custom-sitetitle {
    display: block !important;
    color: var(--color-white-dark);
    font-size: 15px;
    margin: 0;
    padding: 6px 1rem;
}

h1.siteTitle,
.fixed-top.navbar-dark .navbar-brand a h1.siteTitle,
.fixed-top.navbar-dark .navbar-brand a h1.siteTitle>span {
	display: inline;
	vertical-align: inherit !important;
	color: #000000;

	font-weight: 400;
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	 
}

.navbar-brand img {
	vertical-align: middle !important;
}

.fixed-top.navbar .navbar-collapse {
	z-index: 999;
	background-color: var(--header-bg) !important;
}

.navbar-toggler {
	background-color: var(--bg-light) !important;
}

.fixed-top.navbar .menu-bar>.navbar-nav>li>a {
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);

}



input .form-control,
select .form-control {
	margin-top: 0.3rem !important;
	/* height: 48px; */
}

.message span {
	color: #ff0000 !important;
}

.ms-Dialog-title {
	color: var(--color-white-dark) !important;
}

.ms-Modal-scrollableContent {
	padding: 1rem;
}

/* table CSS */
.customeTable .entitylist {
	border: none;
	background: var(--bg-secondary);
	color: var(--color-white-dark);
}

.customeTable .table {
	border: 1px solid var(--tbl-border);
	color: var(--color-white-dark) !important;
}

.customeTable .table a {
	color: var(--color-white-dark) !important;
}

/* .customeTable .table>:not(caption)>*>* {
	border-bottom-width: 0px;
	font-size: 14px;
} */

.customeTable .table th {
	border: 1px solid var(--tbl-border);
}

tbody,
td,
tfoot,
th,
thead,
tr {
	/* border: 0; */
}


tr {
	border-color: var(--tbl-border) !important;
}

/* .table{
	border: 1px solid var(--tbl-border)!important;
} */

/* .table-striped>tbody>tr:nth-of-type(odd) {
	background-color: var(----tbl-odd-strip)!important;
} */

/* tr:nth-of-type(odd)>* {
    background-color: rgb(255 255 255 / 5%) !important;
} */

.dataTable tbody>tr:nth-of-type(even) {
	background-color: var(--dark-tbl-odd-strip) !important;
}


.table>tbody {
	vertical-align: middle !important;
}


thead {
	background-color: var(--tbl-header-bg) !important;
	color: var(--text-color) !important;
	/* border: 1px solid var(--tbl-head-border)!important; */
	height: 40px;
	padding: var(--Spacingspacing-300) var(--Spacingspacing-200) var(--Spacingspacing-300) var(--Spacingspacing-200);
	gap: var(--Spacingspacing-none);
	border: 1px 1px 1px 0px;
	opacity: 0px;

}

/* .table-striped tbody tr:nth-of-type(even) {

	background-color: var(--bg-secondary) !important;
} */

/* .table-striped tbody tr:nth-of-type(odd) {
	background-color: var(--header-bg) !important;
} */

/* tr:nth-of-type(odd)>* {
	background-color: var(--bs-table-striped-bg)!important;
} */

tr,
td {
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	gap: 8px !important;
	opacity: 0px;
}

/* tbl */


.text-success {
	background-color: #37B637 !important;
}

.bg-info {
	color: var(--color-white-light) !important;
	background-color: #00C6C1 !important;
	border: 0;
	padding: 0.5rem;
	vertical-align: middle;
	margin: 0;
}

.fa-pen {
	color: var(--color-skyblue-info);
	padding-right: 1.5rem;
}

/* .page-item.active .page-link {
	z-index: 3;
	color: var(--color-white-dark);
	background-color: var(--background-light);
	border-color: var(--background-light);
} */

.page-item.disabled .page-link {
	color: var(--color-white-dark);
	pointer-events: none;
	background-color: var(--background-light);
	border-color: var(--background-light);
}

.form-check-input {
	border-color: var(--color-skyblue-info);
	background: transparent;
}

/* .table>:not(caption)>*>* {
	padding: 1rem .5rem;
	color: var(--color-white-dark) !important;
} */



/* Datatable CSS */
table.dataTable tbody tr {
	background-color: transparent !important;
	/* vertical-align: top; */
}




input,
select,
.multi-select-button {
	background-color: var(--input-bg-dark) !important;
	color: var(--text-color);
	font-family: 'Pretendard' !important;
}


.dataTables_wrapper .dataTables_length {
	/* margin-bottom: 2rem; */
	color: lightgray !important;
}

.dataTables_wrapper .dataTables_info {
	color: var(--input-color-light) !important;
	font-size: 14px;
	font-family: 'Pretendard';
	font-weight: 500;
}


.dataTables_wrapper .dataTables_paginate .paginate_button.current {
	background: var(--btn-bg-datatable-paginate) !important;
	color: var(--btn-color-datatable-paginate) !important;
	border: var(--color-white-light) !important;
}


table.dataTable thead .sorting {
	padding: 1rem 1rem;
}

table.dataTable {
	gap: 0px;
	border-radius: 8px 0px 0px 0px;
	border: 1px 0px 0px 0px;
	opacity: 0px;

}

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper {
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	text-align: left;
}

/* #siteList_length label select,
#program-list_length label select,
#site-list_length label select,
#dataTable_wrapper label select,
#EventListTable_wrapper label select,
#ProgramListTable_wrapper label select ,
#MappedSiteList_wrapper label select,
#tblMappingSiteList_wrapper label select,
#sitelevelperformance_wrapper label select,#PastEventListTable_length  label select, */
.dt-length select,
.dataTables_length select {
	/* padding: 4px; */
	gap: 4px;
	opacity: 0px;
	background-color: var(--bg-dt-length) !important;
	width: 75px;
	height: 38px;
	border-radius: 8px;
	text-align: center;
	display: inline;
	color: var(--nav-text);
	margin-right: 4px;
}


#tblUserList_wrapper label select,
#tblUserGroupList_wrapper label select,
#tblUserGroupMapping_wrapper label select,
#user-list_wrapper label select,
#resourcegrouplist_wrapper label select,
#tblSiteList_wrapper label select,
#tblResourceGroup_wrapper label select,
#tblSiteToResourceGroupMapping_wrapper label select,
#tblUserGroupResourceGroupMapping_wrapper label select,
#siteList_wrapper label select,
#tblLeapEvent_wrapper label select {
	padding: 4px;
	gap: 4px;
	opacity: 0px;
	border-radius: 8px;
	border: 1px solid #DCDCDC !important;
	background-color: var(--bg-light) !important;
	width: auto;
	height: 38px;
	border-radius: 8px;
	text-align: center;
}

#siteList_filter label input[type="search"],
#dataTable_filter label input[type="search"],
#program-list label input[type="search"],
#site-list label input[type="search"],
#site-list_filter label input[type="search"],
#program-list_filter label input[type="search"],
#PastEventListTable_filter input[type="search"],
#sitelevelperformance_filter input[type="search"],
#tblLeapEvent_filter input[type="search"] {
	border-radius: 8px !important;
	/* border: 1px solid #F0F0F0 !important; */
	opacity: 0px !important;
	height: 40px !important;
	width: 265px !important;
	margin-bottom: 0.5rem;
}

#tblUserList_filter input[type="search"],
#tblUserGroupList_filter input[type="search"],
#tblUserGroupMapping_filter input[type="search"],
#user-list_filter [type="search"],
#resourcegrouplist_filter [type="search"],
#tblMappingSiteList_filter input[type="search"],
#tblSiteList_filter input[type="search"],
#tblResourceGroup_filter input[type="search"],
#tblUserGroupResourceGroupMapping_filter input[type="search"],
#tblSiteToResourceGroupMapping_filter input[type="search"] {
	border-radius: 8px !important;
	border: 1px solid #F0F0F0 !important;
	opacity: 0px !important;
	height: 40px !important;
	width: 165px !important;

}


/* tabs */
/* outer sction */

.outer-container {
	padding: var(--Spacingspacing-200);
	gap: 0px;
	background-color: var(--bg-light) !important;
	border-radius: var(--Radiuscorner-radius-100);
	justify: space-between;
	opacity: 0px;
}

/* Active tab */

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	padding: 4px 24px 4px 24px !important;
	gap: 4px;
	border-radius: var(--Radiuscorner-radius-100) !important;
	border: 1px solid var(--border-navbar) !important;
	opacity: 0px !important;
	background: var(--bg-light) !important;
}

.nav-item a {
	color: var(--text-color) !important;
}


.nav-tabs {
	padding: 12px 8px 12px 8px !important;
	gap: 4px !important;
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
}

.nav-tabs .nav-link {
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 20px !important;
	text-align: center !important;
	color: var(--text-color) !important;
	border: none !important;
}


/* Tabs next-previous */
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	padding: 1rem;
	gap: 4px;
	opacity: 0px !important;
	background: transparent !important;
	border-top: 4px solid var(--border-navbar) !important;
	border-left: 0 !important;
	border-right: 0 !important;
	border-bottom: 0 !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
	margin: 0 1rem;
}

a.active.nav-link[role="tab"] {
	color: var(--Color-btn-Active-light);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	text-align: left;
}

/* .nav-tabs .nav-link{
    gap: 4px;
    opacity: 0px !important;
    background: transparent !important;
    border-top: 4px solid #A9A9A9 !important;
    border-bottom: 0;
    border-radius: 0!important;
  } */

/*  */





.ms-Dialog-button--close {
	border: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
	padding: 4px 8px 4px 8px !important;
	gap: 4px;
	/* background-color: var(--bg-light)!important; */
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
	/* color: var( --txt-primary-color)!important; */
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
	color: var(--txt-primary-color) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
	padding: 4px 8px 4px 8px !important;
	gap: 4px;
	/* background-color: var(--bg-light)!important; */
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
	color: var(--txt-primary-color) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
	padding: 4px 8px 4px 8px !important;
	gap: 4px;
	/* background-color: var(--bg-light) !important; */
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
	color: var(--txt-primary-color) !important;
}

.paginate_button {
	color: #fff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
	color: #fff !important;
}

/* .paginate_button.previous{
	background-color: #000;
} */

table.dataTable thead .sorting_asc {
	/* background-image: url(/arrowup.svg) !important; */
	/* background-position-x: center;
    padding: 1rem; */
}

table.dataTable thead .sorting_desc {
	/* background-image: url(/ic_arrow_down.png) !important; */
	/* background-position-x: center;
    padding: 1rem; */
}

table.dataTable thead .sorting {
	/* background-image: url(/ic_arrow_down.png) !important; */
	/* background-position-x: center;
    padding: 1rem; */
}

.ms-SearchBox-iconContainer,
.iconContainer-229 {
	color: var(--color-white-dark) !important;
}

.ms-SearchBox-field,
.field-232 {
	color: var(--color-white-dark) !important;
}

.ms-SearchBox-icon,
.iconContainer-229 {
	color: var(--color-white-dark) !important;
}

.clearButton-231 .ms-Button-icon {
	color: var(--color-white-dark) !important;
}

::placeholder {
	color: var(--placeholder-text-color-dark) !important;

}

::-ms-input-placeholder {
	/* Edge 12 -18 */
	color: var(--placeholder-text-color-dark) !important;
}



/* Power page portal- Form CSS */

/* Form Action Button */
.crmEntityFormView .actions {
	float: right;
	clear: both;
}


/* input.form-control {
	gap: var(--Spacingspacing-050);
	opacity: 0px;
	background: var(--header-bg) !important;
	 
} */
input.form-control {
	border: 1px solid var(--borderClr);
}

#ValidationSummaryEntityFormControl_EntityFormView span,
#ValidationSummaryEntityFormControl_EntityFormView ul li a {
	color: var(--error-alert-color) !important;
}



.crmEntityFormView label {
	background-color: transparent !important;
	font-size: var(--font-label24);
	font-weight: 600;
	line-height: 20px;
	text-align: left;
}

iframe {
	height: 64vh;
}



/* Absolute Center Spinner */
.loading {
	position: fixed;
	z-index: 999;
	overflow: show;
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 50px;
	height: 50px;
}

/* Transparent Overlay */
.loading:before {
	content: '';
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.5);
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
	/* hide "loading..." text */
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
}

.loading:not(:required):after {
	content: '';
	display: block;
	font-size: 10px;
	width: 50px;
	height: 50px;
	margin-top: -0.5em;

	border: 15px solid var(--color-darkskyblue);
	border-radius: 100%;
	border-bottom-color: transparent;
	-webkit-animation: spinner 1s linear 0s infinite;
	animation: spinner 1s linear 0s infinite;


}

/* Animation */

@-webkit-keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-moz-keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-o-keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}


.columnBlockLayout {
	margin-top: 0px !important;
	margin-bottom: var(--Spacingspacing-300) !important;
}

.sectionBlockLayout .container-fluid {
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}


.paginate_button.current:hover {
	color: var(--color-white-dark) !important;
}


a[aria-label="Profile"] {
	display: none !important;
}

.ms-Dialog-button--close {
	position: absolute !important;
	right: 1rem !important;
	top: 0px !important;
}

.ms-Dropdown-title,
.ms-Suggestions-none,
.css-266,
.root-264 {
	color: var(--color-white-dark) !important;
}

.ms-Dropdown:hover,
.ms-BasePicker-text {
	border: 1px solid var(--btn-border) !important;
}

.ms-Dropdown-title {
	/* filter: invert(1); */
	filter: invert(0) !important;
	background: transparent !important;
	color: white !important;
	border: 1px solid var(--btn-border);
}

.ms-Dropdown-caretDownWrapper .caretDownWrapper-305 {
	filter: invert(1) !important;
}

button[name="Delete"] {
	background: var(--Color-btn-Active-light) !important;
	padding: 8px 24px 8px 24px !important;
	gap: 4px !important;
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
	color: var(--text-light) !important;
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	font-weight: 600 !important;
	line-height: 24px !important;
	text-align: center;
}


button[name="Cancel"] {
	padding: 8px 24px 8px 24px;
	gap: 4px;
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px;
	border: 1px solid var(--btn-border);
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	font-weight: 600 !important;
	line-height: 24px !important;
}


.ms-DetailsHeader-filterChevron,
.ms-Icon {
	color: var(--color-white-dark) !important;
}


div[role="presentation"] span {
	color: var(--color-white-dark) !important;
}

.modal-header,
.modal-footer {
	border-bottom: none !important;
	border-top: none !important;
}



.modal-footer button {
	padding: 8px 24px;
	gap: 4px !important;
	border-radius: var(--Radiuscorner-radius-100);
	opacity: 0px;

}

.dt-empty {
	color: lightgrey;
}

.btn-theme-secondary,
.btn-default {
	padding: 8px 16px 8px 16px !important;
	gap: 4px !important;
	border-radius: var(--Radiuscorner-radius-100);
	opacity: 0px !important;
	color: var(--btn-color) !important;
	font-size: 14px;
}

.btn-theme-secondary {
	/* padding-left: 0!important; */
}

.btn-default:hover {
	color: var(--btn-color) !important;
	background-color: transparent !important;
	border-radius: var(--Radiuscorner-radius-100);
	border: none !important;
}

.badge {
	float: none !important;
}


.daterangepicker {

	background-color: var(--background-light) !important;

	border: 1px solid var(--background-light) !important;
}


.daterangepicker .ranges li.active {
	background-color: var(--border-color-blue) !important;
	color: var(--background-light) !important;
}


.daterangepicker .calendar-table {
	border: 1px solid var(--background-light) !important;
	border-radius: 4px;
	background-color: var(--background-light) !important;
}

.daterangepicker .ranges li:hover {
	background-color: var(--border-color-blue) !important;
	color: black !important;
	font-weight: bold !important;
}


.btn-close {
	opacity: 1 !important;
	background: transparent !important;
}


.ms-Dialog-main {
	background-color: transparent !important;
}


.view-loading {
	justify-content: center;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	font-size: xx-large;
}


.form-group select,
.form-group input[type="text"],
.form-group input[type="number"],
.form-group input[type="date"],
.multi-select-container .form-control {
	border-radius: var(--Radiuscorner-radius-100);
	background-color: var(--header-bg);
}



input[type=checkbox]:checked {
	background-color: var(--btn-color) !important;
	color: var(--color-white-dark) !important;
	/* background-color: #00C6C1!important;
	color: #00C6C1!important; */
	accent-color: var(--checkbox-bg) !important;
}

input[type="checkbox"]:not(:checked) {
	border: 1px solid var(--border-color-blue);
}


input[type='checkbox']:after {
	box-shadow: none !important;
}


table.dataTable {
	font-size: 12px !important;
	font-weight: 400 !important;
	letter-spacing: 0.20000000298023224px;
	text-align: left;
	vertical-align: middle;
}


.datatable-title {
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
	text-align: left;
}

.card {
	box-shadow: none !important;
	padding: var(--Spacingspacing-050) var(--Spacingspacing-100) !important;
	gap: 0px;
	border-radius: var(--Radiuscorner-radius-100) !important;
	opacity: 0px !important;
	border: 1px solid #F0F0F0 !important;
}

.progress-bar {
	background-color: var(--color-darkskyblue) !important;
}

/* /* program-dashboard CSS  25-9-2024 */

.pro-dashboard-outer {
	width: 100%;
	height: 100%;
	padding-left: 9px;
	padding-right: 24px;
	justify-content: space-between;
	align-items: center;
	display: inline-flex
}

.action-section {
	padding-bottom: var(--Spacingspacing-300);
	padding-top: var(--Spacingspacing-300);
}


.btn-theme-action {
	padding: 8px 24px 8px 24px;
	gap: 4px;
	border-radius: 10px;
	opacity: 0px;
	margin-left: var(--gap-spacing-200);
	margin-right: var(--gap-spacing-200);
}


.breadcrumb {
	text-transform: capitalize !important;
}

.breadcrumb>li a {
	color: var(--txt-primary-color) !important;
	padding: 0 !important;
	text-transform: capitalize;
	font-weight: 400 !important;
	word-wrap: break-word !important;
}

.breadcrumb>li a:hover {
	color: var(--txt-primary-color) !important;
}

.breadcrumb>.active {
	color: var(--txt-primary-color) !important;
	word-wrap: break-word !important;
}


.card-3 {
	background-color: var(--bg-light);
	gap: 0px;
	border-radius: var(--Radiuscorner-radius-100);
	opacity: 0px;
	padding: var(--Spacingspacing-050) var(--Spacingspacing-100);
	box-shadow: 0px 1px 4px 0px #DCDCDC;

}


/* .card-title {
	padding: 8px;
} */

.card-value {
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 4px;
	padding-bottom: 4px;
	height: 40px;
}

.border-btn {
	border: var(--border-color-blue);
	border-radius: var(--Radiuscorner-radius-050);
}

.tooltipContainer .apexcharts-tooltip {
	color: var(--color-white-dark) !important;
}

.tooltipContainer .apexcharts-tooltip .apexcharts-tooltip-series-group.active {
	background-color: var(--color-white-dark) !important;
	color: var(--text-color-apx-tooltip) !important;
}

/* #ui-datepicker-div {
	background: black;
	color: white;
} */

/* .ui-datepicker .ui-datepicker-title {
	background: rgb(0, 0, 0);
	color: white;
} */

.border-primary {
	border-color: #00C6C1;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
	/* border: 1px solid #202020; */
	/* background: var(--color-white-light); */
	font-weight: 400;
	/* color: #555; */
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
	font-weight: bold;
}


.daterangepicker td.in-range {
	background-color: var(--border-color-blue);
	color: var(--color-white-light);
	font-weight: bold;
}



.gap-24 {
	margin-right: var(--Spacingspacing-200);
}

.img-input {
	position: relative;
	width: 240px;
}

.img-input input {
	border: none;
	background: var(--color-white-dark) !important;
	display: block;
	width: 100%;
	box-sizing: border-box;
}

.img-input img {
	position: absolute;
	top: 2px;
	left: 5px;
}

.chart-action {
	padding: var(--Spacingspacing-150) !important;
	gap: 4px !important;
	border-radius: var(--Sizeradiusr8) !important;
	border: 1px solid #F0F0F0 !important;
	opacity: 0px !important;

}

.chart-action-outer {
	padding: var(--Spacingspacing-100);
	gap: 0px;
	justify: space-between;
	opacity: 0px;
}

.text-light {
	color: var(--text-light);
}

/* .apexcharts-svg {
	background-color: var(--chart-bg-light) !important;
} */

.db-outer-gap {
	/* margin: var(--Spacingspacing-300); */
	margin-left: 80px;
	margin-right: 80px;
	margin-top: 90px;
}

.bottom-spacing-300 {
	margin-bottom: 24px;
}

.mt-16 {
	margin-top: 16px;
}

.mb-16 {
	margin-bottom: 16px;
}

.card-label {
	padding-top: 0.5rem !important;
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	font-weight: 600 !important;
	line-height: 20px !important;
	letter-spacing: 0.20000000298023224px;
	text-align: left;

}


.card-summary {
	padding-top: var(--Spacingspacing-050);
	padding-bottom: var(--Spacingspacing-100);
}

.event-card:hover {
	border: 1px solid var(--input-border);
}

.event-process {
	background-color: var(--color-light-gray-bg);
	margin-top: 2rem;
	/* padding: var(--Spacingspacing-400) var(--Spacingspacing-300) var(--Spacingspacing-400) var(--Spacingspacing-300); */
	gap: 24px;
	border-radius: var(--Radiuscorner-radius-100);
	opacity: 0px;
	box-shadow: 0px 1px 4px 0px #FFFFFF26;
}

.form-subtitle {
	font-size: 18px;
	font-weight: 600;
	line-height: 24px;
	text-align: left;
	margin-bottom: 24px;
}


.font-10 {
	font-size: 10px;
}

.form-lable {
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
	text-align: left;
	margin-bottom: var(--Spacingspacing-050);
}


.form-action-mtb {
	padding: var(--Spacingspacing-400) var(--Spacingspacing-300);
	margin-top: var(--gap-spacing-24);
}

/* input[type="time"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-calendar-picker-indicator {
	filter: invert(48%) sepia(13%) saturate(3207%) hue-rotate(130deg) brightness(95%) contrast(80%) !important;
} */

/* input:focus {
	background: transparent !important;
} */


a[title="Redeem invitation"] {
	display: none !important;
}

.login-heading-section {
	border-bottom: none !important;
}

.btn-line {
	margin: 1rem !important;
}

.content-container #content .nav {
	border-bottom: none !important;
}

#MappedSiteList_filter label input[type="search"],
#EventListTable_wrapper label input[type="search"],
#ProgramListTable_filter label input[type="search"] {
	padding: 6px !important;
	border-radius: 8px !important;
	margin-bottom: 0.5rem;
	border: none;
	background-color: var(--bg-search) !important;
}

input[type="search"]:focus-visible {
	outline: 1px solid gray !important;
}

a.nav-link[role="tab"]:not(.active) {
	font-weight: 400;
	font-size: 14px;
	padding: 4px 24px 4px 24px !important;
}

td a {
	color: var(--text-color-link) !important;
	text-decoration: underline !important;
	cursor: pointer !important;
	/* font-size: 12px; */
}

.form-switch .form-check-input {
	background-color: var(--color-darkskyblue);
}

.form-switch .form-check-input {
	width: 2.5rem !important;
	margin-left: -3.5em !important;
	background-position: left center;
	border-radius: 2em;
	height: 20px !important;
	/* border: 0 !important; */
}

.form-switch .form-check-input:checked {
	background-repeat: no-repeat;
	background-color: var(--btn-color-primary) !important;
	/* border-color: var(--btn-color-primary) !important; */
}

.form-switch .form-check-input {
	background-repeat: no-repeat;
	background-color: #fff !important;
	/* border-color: #ccc !important; */
}

.border-qprimary {
	border: 1px solid var(--border-color-blue) !important;
	background-color: transparent;
}

.form-check-input:focus {
	box-shadow: none;
}

.form-switch {
	margin-top: 10px;
	margin-left: 15px;
}

.form-switch>input {
	background-color: var(--form-switch-bg) !important;
}

/* .table>:not(caption)>*>* {
	color: var(--color-white-dark) !important;
} */

.crmEntityFormView .cell .field-label {
	/* font-size: 16px !important; */
	font-size: clamp(14px, 1vw, 16px);
	margin-bottom: 5px;
}

/* .ui-timepicker {
	background-color: var(--color-white-light) !important;
}

.ui-timepicker-standard {
	border: none !important;
	background-color: var(--color-white-light) !important;
} */


/* table.dataTable {
	border-collapse: collapse !important;
	border: 1px solid #F0F0F0 !important;
    border-radius: 4px;
} */

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
	color: var(--text-color) !important;
	font-weight: bold !important;
}

.bg-card {
	border: 1px solid var(--tbl-border) !important;
}

.bg-card,
.card-header {
	background-color: var(--header-bg) !important;
}

label.required:after {
	content: " *";
	color: red;
}

.btn-group>.btn-check:checked+.btn {
	background-color: var(--border-color-blue);
	color: #fff !important;
}

.crmEntityFormView .cell div.table-info.required label:after {
	content: "*";
	color: red;
}

.ui-menu-item:hover {
	/* background-color: var(--color-white-light) !important; */
	/* color: var(--text-color) !important; */
}

.ui-corner-all {
	/* background-color: var(--background-light)!important; */
}


#chart {
	margin-bottom: 2rem;
}

#programdates {
	font-weight: normal;
	font-family: 'Pretendard';
}

#ContentContainer_MainContent_MainContent_SecureRegister .col-lg-6:first {
	display: none !important;
}

label.required:after {
	content: " *" !important;
	color: red;
}

.crmEntityFormView .cell div.table-info.required label:after {
	content: "*" !important;
	color: red;
}

/* table.dataTable thead th,
table.dataTable thead td {
	border-bottom: 1px solid var(--tbl-border) !important;
} */

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
	cursor: not-allowed !important;
	color: #959595 !important;
}

.ms-Button,
.ms-Button--default {
	background-color: var(--btn-primary-active) !important;
	color: var(--text-light) !important;
}

.ms-Icon {
	color: var(--bg-light) !important;
}

.ms-Overlay {
	background-color: var(--bg-light) !important
}

a[aria-current="page"],
.nav-item .active {
	border-bottom: 3px solid var(--border-navbar) !important;
	border-radius: 0 !important;
	color: var(--nav-text) !important;
	cursor: pointer !important;
}

a[aria-expanded="true"] {
	border-bottom: 3px solid var(--color-darkskyblue) !important;
	border-radius: 0 !important;
}

a[aria-label="Home"] {
	display: none !important;
	visibility: hidden !important;
}

.modal-fullscreen {

	width: 70vw;
	max-width: none;
	height: 100%;
	margin: auto;
}

#privateModeText {
	display: none !important;
}

.nav-pills .nav-link {
	/* color: black!important; */
	font-weight: bold;
}

.title-portal {
	margin-top: 0.5rem;
	margin-left: 0.5rem;
	/* margin-top: 1rem; */
	font-size: 16px;
	font-weight: 600;
	/* line-height: 20px; */
	letter-spacing: 0.20000000298023224px;
	text-align: left;


}

.custom-container {
	margin-left: 80px !important;
	margin-right: 80px !important;
	/* margin-left: 80px!important;
	margin-right: 80px!important; */
	padding: 0 !important;
}

.btn-tbl-action {
	border-radius: 12px;
	height: 36px;
	width: 36px;
	padding: 0px !important;
	margin-right: 10px;
}

.btn-edit {
	border: 1px solid #00C6C1;
	color: #00C6C1;
}

.btn-dlt {
	border: 1px solid #FD2F40;
	color: #FD2F40;
}

.btn-create {
	border: 1px solid var(--border-color-blue) !important;
	color: var(--btn-color-primary) !important;
	font-size: 14px;
	font-weight: 500;
	line-height: 18px;
	letter-spacing: 0.20000000298023224px;
	font-family: 'Pretendard' !important;
	;
	padding: 12px 16px !important;
	    border-radius: var(--Radiuscorner-radius-100) !important;
}
.btn-create:hover{background-color:rgba(39, 100, 222, 0.05) ;}

/* .btn-create:hover{
	border:1px solid var(--border-color-blue);
	color: var(--btn-color-primary)!important;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	letter-spacing: 0.20000000298023224px;
	font-family: 'Pretendard'!important;
	padding: 8px 16px!important;;
} */


table.dataTable tbody th,
table.dataTable tbody td {

	gap: 0px !important;
	border: 0px 0px 1px 0px !important;
	opacity: 0px;
	font-size: 12px;
	font-weight: 400;
	/* line-height: 29px; */
	letter-spacing: 0.20000000298023224px;
	text-align: left;


}

tr th {

	vertical-align: middle !important;
}

/* 
.fa-caret-down,.fa-caret-up , .fa{
	color: #000000!important;
	background-color: #00C6C1!important;
} */


/* .expand-label ,.fa,.datetimepickerclass{
	background-color: red!important;
}

[attr="decrementHours"],c.icons.down{
	background-color: red!important;
}

.bootstrap-datetimepicker-widget{
	background-color: #bbbbbb!important;
	color: red!important;
} 

  */

/* .bootstrap-datetimepicker-widget {
 top: 0;
left: 0;
width: 670px;
padding: 4px;
margin-top: 1px;
z-index: 99999;
border-radius: 4px; 
}
 */



.bootstrap-datetimepicker-widget .dropdown-menu {
	background-color: var(--background-light) !important;

}

.bootstrap-datetimepicker-widget table td {
	color: var(--text-color);
}


.bootstrap-datetimepicker-widget table td span.active {
	background-color: var(--Color-btn-Active-light);
	color: #000000;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}



/* .bootstrap-datetimepicker-widget td span{
	background-color: rgb(255, 255, 255) !important;
	 
	width: 100px;
	height: 100px !important;
	color: #000000 !important;
	width:100% !important;
}   */

/* .background {color: red}
 
.bootstrap-datetimepicker-widget .btn.btn-default .fa-caret-up {
    color: #FF0000; 
}   */

/* .bootstrap-datetimepicker-widget .btn.btn-default .glyphicon-chevron-down {
    color: #ff00d4; 
} */



/* .bootstrap-datetimepicker-widget .btn{
	background-color:#FF0000!important;
}

.bootstrap-datetimepicker-widget .btn .fa-chevron-down {
    color: #FF0000!important;
	 
	background: green!important;
}

.fa-caret-down{
	color: #000000!important;
} */

.text-secondary-btn {
	color: #00C6C1 !important;
}


.btn-outline-primary {
	border: 1px solid var(--border-color-blue) !important;
	color: var(--text-color);
}

.icon-green {
	color: #37B637;
}

.icon-red {
	color: #FD2F40;
}

.ms-n5 {
	margin-left: -40px;
}

.float-end {
	float: right !important;
	/* width: 157px; */
	white-space: nowrap;
	margin: 0 2rem;
	line-height: 2;
}

.progress {
	margin-top: 1rem;
	height: 2rem;
}

.icon-green {
	color: #37B637;
}

.icon-red {
	color: #FD2F40;
}

.mr-right {
	margin-right: 0.5rem;
}

.navbar {
	height: 60px;
	padding: 0px 0px 0px;

}

/*  */
/* .fixed-top.navbar-dark {
    background-color: #000000!important;
}
.fixed-top.navbar .menu-bar > .navbar-nav > .divider-vertical {
    border-left: 1px solid #F0F0F0 !important;
} */
/* sagar */
.productionGride {
	background-color: #444;
	padding: 10px 15px;
	border-radius: 5px;
	color: #fff;
}

.productionGride h1 {
	font-size: 14px !important;
	color: #fff;
}

.font-14 {
	font-size: 14px;
}

.GroupBtn {
	margin: 0;
	padding: 0px;
}

.GroupBtn li {
	list-style: none;
	float: left;
}

.nav-pills.GroupBtn .nav-link.active,
.nav-pills.GroupBtn .show>.nav-link {
	background-color: transparent;
	border: 1px solid green;
	color: green;
	border-radius: 5px;
	font-size: 12px;
	margin-right: 5px;
	padding: 1px 5px;
}

.nav-pills.GroupBtn .nav-link {
	background-color: transparent;
	border: 1px solid #fff;
	color: #fff;
	border-radius: 5px;
	font-size: 12px;
	margin-right: 5px;
	padding: 1px 5px;
}

h1.Unit {
	font-size: 20px !important;
}

h1.Unit span {
	font-size: 14px !important;
}

.clear {
	clear: both;
}

.legend {
	gap: 10px
}

.legend p {
	font-size: 12px;
	margin-bottom: 0PX;
}

.green {
	background-color: #6bd618;
}

.yellow {
	background-color: #ffe33c;
}


.card-title {
	margin-bottom: 1.5rem !important;
}

.mr-t-14 {
	margin-top: 14rem;
}

.ml-3 {
	margin-left: 5px;
}


/* .apexcharts-yaxis text{
  fill: #fff!important;
} */
/* 
.apexcharts-legend-text{
  color: #fff!important;
} */

/* #chartContainer .apexcharts-tooltip {
  color: #ffffff;
} */

/* #chartContainer .apexcharts-tooltip .apexcharts-tooltip-series-group.active {
  background: #000000 !important;
} */


.btn-tooltip-bat1 {
	top: 9rem;
	position: absolute;
	left: 3rem;
}

.btn-tooltip-bat2 {
	position: absolute;
	top: 12rem;
	left: 3rem;
}

.btn-tooltip-pv {
	position: absolute;
	right: 1rem;
	top: 8rem;
}

.btn-tooltip-grid {
	position: absolute;
	bottom: -1rem;
	left: 3rem;
}

.btn-tooltip-Site {
	position: absolute;
	bottom: -1rem;
	right: 1rem;
}

.btn-tooltip-inverter {
	position: absolute;
	right: 44rem;
	top: 17rem;

}

/* select[multiple], select[size] {
    width: 20vw!important;
} */



.navbar-dark .navbar-nav>li>a[aria-current="page"] {
	border-bottom: 3px solid var(--border-navbar) !important;
	border-radius: 0 !important;
	color: var(--nav-text) !important;
}

/* .btn-primary{
	background-color: var(--btn-bg)!important;
	border-color: var(--border-color-blue)!important;
	color: #ffffff!important;
	
} */

.h-wp {
	overflow-x: auto;
	overflow-y: auto;
	height: 620px;
	border-radius: 0;
}


a {
	cursor: pointer !important;
}

.form-w-70 {
	width: 70%;
	margin: auto;
}



.link-page {
	font-size: 12px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0.20000000298023224px;
	text-align: left;
	text-decoration: underline;
	cursor: pointer;
}

.btn,
a,
.link-page {
	cursor: pointer;
}

.dt-info {
	font-size: 14px !important;
	font-weight: 500;
	font-family: 'Pretendard' !important;
	line-height: 18px;
	letter-spacing: 0.20000000298023224px;
	color: var(--new-text) !important;
}


/* .pagination button  {
	color: #555!important;
	background-color: #fff!important; 
	border-radius:0px!important;
 }
  .page-item.active .page-link{
	 background-color: #00C6C10D !important;
	 border-color: #00C6C1 !important;
	 color: #00c6c1 !important;}
 
	
	 #EventListTable ~ .row{justify-content: center;
		 align-items: center;    padding: 10px;}
		 #EventListTable ~ .row {
			 justify-content: center;
			 align-items: center;
			 padding: 10px;
		 }
		 .pagination{margin-bottom: 0;}
		 div.dt-container .dt-paging .dt-paging-button:hover{border: transparent!important;background: none!important;background-color: transparent!important;}

		 .card-body span {
			color: #000!important;
		} */

div.dt-container .dt-paging .dt-paging-button.disabled {
	cursor: default;
	color: #8B8B8B !important;
	border: 1px solid transparent;
	box-shadow: none;
	/* width: 11.79px;
		height: 5.44px; */
}


.dt-paging-button.current {
	border-radius: 8px !important;
	border: 1px solid #00C6C1 !important;
	opacity: 0px;
	text-align: center;
	padding: 8px 12px;
	color: #00C6C1 !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 18px;
	letter-spacing: 0.20000000298023224px;
	text-align: center;
}

/* .dt-paging{
			display: flex;
			justify-content: end;
		} */

/* .dt-length label{
		color: #8B8B8B !important;
	    font-size: 14px;
    	font-weight: 500;
    	line-height: 18px;
    	letter-spacing: 0.20000000298023224px;
    	text-align: center;
    	padding: 0 0.5rem;
		} */



.bootstrap-datetimepicker-widget table td {
	/* height: 14px; */
	line-height: 4px;
	/* width:14px; */
}

/* .bootstrap-datetimepicker-widget table td.day {
			height: 10px!important;
			line-height: 10px!important;
			width: 10px!important;
			background-color: #00C6C1;
		} */

/* .bootstrap-datetimepicker-widget table td span {
			display: inline-block;
			height: 14px!important;
			line-height: 14px!important;
			margin: 2px 1.5px!important;
			cursor: pointer;
			border-radius: 4px;
		 
			
		} */
/* 
		.dt-length label{
			color: #8B8B8B !important;
			font-size: 14px;
			font-weight: 500;
			line-height: 18px;
			letter-spacing: 0.20000000298023224px;
			text-align: center;
			padding: 0 0.5rem;
			 
			} */



.bootstrap-datetimepicker-widget table td {
	/* height: 14px; */
	line-height: 4px;
	/* width:14px; */
	/* background-color: #cfcdcd; */
}

/* .bootstrap-datetimepicker-widget table td.day {
				height: 10px!important;
				line-height: 1px!important;
				width: 10px!important;
				background-color: #00C6C1;
			} */

/* .bootstrap-datetimepicker-widget table td span {
				display: inline-block;
				width: auto!important;
				height: 14px!important;
				line-height:  4px!important;
				margin: 2px 1.5px!important;
				cursor: pointer;
				border-radius: 4px;
				background-color: pink;
			 
				
			} */
/* .bootstrap-datetimepicker-widget td{
				padding: 0!important;
				margin: 0px!important;
				width: 10px !important;
				height: 10px !important;
				background-color: #af7e83!important;
			} */
/* 
			.bootstrap-datetimepicker-widget td span{
				background-color: pink !important;
				width: 10px;
				height: 10px !important;
				color: #000000 !important;
				width:100% !important;
			}  */
.grid-actions {
	border-bottom: 1px solid #ffffff !important;
}

.btn-default {
	padding: 9px 20px !important;
	border-color: #ccc !important;
	border: none !important;
}

table {
	--bs-table-striped-color: #ffffff;
	width: 100% !important;
}

.button2:hover {
	color: #FFFFFF;
	background-color: #ffffff !important;
	border-color: #000000 !important;
}

/* .dataTables_wrapper{
					height: 80vh;
					overflow-y: auto;
					overflow-x: hidden;
				} */

.modal-fullscreen {
	width: 97vw !important;
	max-width: none;
	height: 100% !important;
	margin: 4rem auto !important;
}

/* table.dataTable thead th{
					padding: 2px 15px 12px 17px !important;
				} */

/* .dataTables_wrapper .dataTables_filter{
					padding: 0 1rem
					;
				} */

.dataTables_length label,
.dataTables_filter label {
	color: #8B8B8B !important;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
}

.dataTables_length select {
	border: 1px solid #8B8B8B !important;

	border-radius: 4px !important;
}

.dropdown-item.active {
	background-color: var(--bg-search) !important;
}


.modal-fullscreen .modal-content {
	height: auto !important;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
	border-bottom: 1px solid #f1f1f1 !important;
	display: flex;
}

.nav-pills .nav-link.active {
	background-color: #ffffff !important;
}

.page-title {
	padding: 1rem;
	font-size: 16px;
}

/* 
						  ::placeholder {
							color: lightgray!important;
							opacity: 1;  
						  }
						  
						  ::-ms-input-placeholder {  
							color: lightgray!important;
						  }

						  option:not(:first-of-type) {
							color: #495057!important;
						  } */


.btn-mr {
	margin-right: 1rem;
	margin-top: 1rem;
}

.dataTables_wrapper .dataTables_filter input {
	margin-left: 1px !important;
}

/* div.dt-container .dt-search input {
							border: 1px solid #cacaca!important;} */



.pagination>li>a {
	background-color: transparent !important;
	width: auto !important;
	height: auto !important;
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover {
	background-color: #ffffff !important;
}

.view-loading {
	position: absolute !important;
	/* left: 50%!important; */
	top: 50%;
	z-index: 1000 !important;
	height: auto !important;
	width: auto !important;
	font-size: 20px !important;

}

table.dataTable.nowrap td {
	white-space: normal !important;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
	color: inherit !important;
}




/* .form-control readonly:focus {
								background-color: #e9ecef!important;} */

/* input:read-only {
									background-color:var(--readonly)!important;
									color: var(--text-color)!important;
								  } */


/* program type colors */
.protyp-REC {
	/* background-color: #FEEDEA; */
	 background-color: var(--protyp-REC-bg);
	color: #F16B54;
}

.protyp-DR {
	/* background-color: #FEEBFF; */
	background-color: var(--protyp-DR-bg);
	color: #D14ED8;
}

.protyp-VPPETG {
	/* background-color: #F1FCE8; */
	background-color: var(--protyp-VPPETG-bg);
	color: #68D017;
}

.protyp-EA {
	/* background-color: #EBF9FF; */
	background-color: var(--protyp-EA-bg);
	color: #0095D5;
}

.protyp-CUR {
	/* background-color: #F0EAFE; */
	background-color: var(--protyp-CUR-bg);
	color: #8A5BEA;
}

.protyp-default {
	/* background-color: #d3d3d3; */
	background-color: var(--protyp-default);
	color: gray;
}

#pro_type {
	padding: 4px;
	gap: 10px;
	border-radius: 4px;
	opacity: 0px;
	font-size: 12px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0.20000000298023224px;
	text-align: center;
	text-transform: capitalize;
	/* white-space: nowrap; */
}

.back-breadcrumb {
	height: 12px;
	margin-top: 0.4rem;
	padding: 0px;
	margin-right: 0.5rem;
	filter: var(--icon-filter);
}

div.dt-container .dt-search input {
	border: 1px solid #aaa;
	border-radius: 3px;
	padding: 5px;
	background-color: transparent;
	color: inherit;
	margin-left: 3px;
	background-color: var(--bg-search) !important;
	padding: 7px 8px !important;
	border-radius: 8px !important;
}

/* table.dataTable thead th, table.dataTable tfoot th {
    font-weight: 400!important;
	color: #0A0A0A!important;
} */

.loaderBg {
	top: 0;
	left: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	position: fixed;
	width: 100%;
	z-index: 9999;
	/* background-color: rgb(78 78 78 / 60%); */
	background-color: var(--loader-fade-bg);
}

.hide-loader {
	display: none;
}

.show-loader {
	display: block;
}

.fa-spinner {
	padding: 0.2rem;
}

.mr-1rem {
	margin-right: 1.5rem;
}


/* table.dataTable tbody th,
table.dataTable tbody td {
	border: 0px;
} */

.dataTable tbody td {
	height: 48px;
}

.dataTables_wrapper .row .col-sm-4 {
	padding-top: 0.5rem;
}

.dataTables_wrapper .dataTables_info {
	clear: both;
	float: none !important;
	padding-top: 0 !important;
	text-align: center !important;
}

table.dataTable thead th {
	/* padding: 8px !important; */
}

/* table.dataTable {
		table-layout: fixed !important;;
		width: 100% !important;;
	} */

/* .dataTables_wrapper {
		width: 100%;
		overflow: hidden;
	} */

.dataTables_scroll {
	width: 100%;
	overflow-x: hidden;
}

/* .dataTables_scroll {
		overflow-y: auto; 
		height: 50vh;  
	} */

.gap-24 {
	gap: 24px;
}

.font-14 {
	font-size: 14px;
}

.line-h-24 {
	line-height: 24px;
}



/* #startTime input[type="time"]:invalid:before,
#endTime input[type="time"]:invalid:before {
	content: 'Select';
	color: #9d9d9d;
	background: var(--time-placeholder-bg);
	position: absolute;
} */

/* #endTime input[type="time"]:invalid:before{
		content: 'Select';
		color: #9d9d9d;
		background: #fff;
		position: absolute;
	} */

.defSelected {
	color: lightgray;
}

/* .daterangepicker {
		top: 101px !important;
	} */





/* new */

.qCard {
	border-radius: 8px;
	border: 1px solid var(--borderClr);
	padding: 20px;
	background: var(--inner-cards-bg);
}

.qBtn-newProgram {
	position: absolute;
	z-index: 999;
	margin-right: 0px;
	right: 20px;
	top: 64px;
}


table.dataTable>thead>tr>th {
	background-color: var(--tbl-header-bg) !important;
	font-weight: 400;
	color: var(--tbl-header-text);
}

div.dt-container.dt-empty-footer tbody>tr:last-child>* {
	border-bottom: 1px solid var(--border-light-white) !important;
}

table.dataTable thead>tr>th.dt-orderable-asc:hover,
table.dataTable thead>tr>th.dt-orderable-desc:hover,
table.dataTable thead>tr>td.dt-orderable-asc:hover,
table.dataTable thead>tr>td.dt-orderable-desc:hover {
	outline: none !important
}

.tableParent {
	/* border: 1px solid var(--tbl-border); */
	border-radius: 8px;
}

.table> :not(:last-child)> :last-child>* {
	border-bottom-color: #f0f0f0;
}

.qTable.table>:not(caption)>*>* {
	padding: 8px;
	font-family: 'Pretendard';
	font-size: 12px;
	border-bottom: 1px solid var(--tbl-border);
}

.dark-theme .table td {
	color: var(--tbl-text);
	text-align: left;
	background: initial !important;
}

#program-list_filter {
	margin-right: 155px;
}

.width-440 {
	width: 440px;
}

/* Multiselect */



.multi-select-container {
	display: inline-block;
	position: relative;
}

.multi-select-menu {
	position: absolute;
	left: 0;
	top: 0.8em;
	z-index: 1;
	float: left;
	min-width: 100%;
	background: inherit;
margin: 1.6em 0;
	border: 1px solid #ccc;
    box-shadow: 0 1px 3px rgb(0 0 0 / 14%);
	display: none;
}

.multi-select-menuitem {
	display: block;
	font-size: 0.875em;
	padding: 0.6em 1em 0.6em 30px;
	white-space: nowrap;
}

.multi-select-legend {
	font-size: 0.875em;
	font-weight: bold;
	padding-left: 10px;
}

.multi-select-legend+.multi-select-menuitem {
	padding-top: 0.25rem;
}

.multi-select-menuitem+.multi-select-menuitem {
	padding-top: 0;
}

.multi-select-presets {
	border-bottom: 1px solid #ddd;
}

.multi-select-menuitem input {
	position: absolute;
	margin-top: 0.25em;
	margin-left: -20px;
}

.multi-select-button {
	display: inline-block;
	cursor: default;
	display: inline-block;
	cursor: default;
	white-space: nowrap;
	text-overflow: ellipsis;
	width: 100% !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.multi-select-button:after {
	content: "";
	position: absolute;
	top: 45%;
	right: 1rem;
	transform: translateY(-50%) rotate(45deg);
	width: 6px;
	height: 6px;
	pointer-events: none;
	border-right: 1px solid var(--text-color);
	border-bottom: 1px solid var(--text-color);
	pointer-events: none;
	width: 8PX;
	height: 8PX;
}

.multi-select-container--open .multi-select-menu {
	display: block;
}

.multi-select-container--open .multi-select-button:after {
	content: "";
	position: absolute;
	top: 45%;
	right: 1rem;
	transform: translateY(-50%) rotate(45deg);
	width: 6px;
	height: 6px;
	pointer-events: none;
	border-right: 1px solid var(--text-color);
	border-bottom: 1px solid var(--text-color);
	pointer-events: none;
	width: 8PX;
	height: 8PX;
}

.multi-select-container--positioned .multi-select-menu {
	box-sizing: border-box;
}

.multi-select-container--positioned .multi-select-menu label {
	white-space: normal;
}


.p-24 {
	padding: 24px;
}

.popup-header {
	font-size: 20px;
	font-family: 'PretendardSemiBold' !important;
	color: var(--text-color);
	margin: 0;
	text-align: center;
	margin-bottom: 24px;
}

tbody tr>.sorting_1 {
	background-color: transparent !important;
}

.paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	color: var(--paginate_button-text-color) !important;
}


input::-webkit-input-placeholder {
	/* Chrome, Safari, Opera */
	color: #8B8B8B !important;
	font-weight: normal !important;
}

input::-moz-placeholder {
	/* Firefox 19+ */
	color: #8B8B8B !important;
	font-weight: normal !important;
}

input:-ms-input-placeholder {
	/* IE 10+ */
	color: #8B8B8B !important;
	font-weight: normal !important;
}

input::-ms-input-placeholder {
	/* Microsoft Edge */
	color: #8B8B8B !important;
	font-weight: normal !important;
}

/* scrollbar */
::-webkit-scrollbar {
	width: 6px;
	height: 6px;
}

::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.3);
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(255, 255, 255, 0.3);
}



.multi-select-container {
	min-height: calc(1.5em + .5rem + 2px) !important;
	padding: 0.4rem .8rem 0 !important;
	font-size: inherit !important;
	border-radius: .25rem !important;
	border: 1px solid var(--form-control-border);
}

input,
select {
	/* height: 42px; */
	border: 1px solid var(--form-control-border) !important;
}
input[type="checkbox"] {border: 1px solid var(--checkbox-border)!important ;border-radius: 4px; width: 20px!important; height: 20px!important;}

#programdates {
	border: 1px solid var(--form-control-border) !important;
}


.daterangepicker td.active,
.daterangepicker td.active:hover {
	background-color: var(--selected-date-bg) !important;
	color: var(--selected-date-color) !important;

}

.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {

	background-color: transparent !important;
}

footer {
	display: none !important;
}

table.dataTable.no-footer {
	border-bottom: none !important;
}

.badge-add {
	border: 1px solid var(--color-darkskyblue) !important;
	color: var(--color-white-dark) !important;
	font-size: 12px;
	font-weight: normal !important;
}

/* table.table.dataTable> :not(caption)>*>* {
	border-color: #F0F0F0;
	border-bottom: 1px solid var(--border-light-white);
} */

.chips-container {
	display: grid;
	flex-wrap: wrap;
	width: 100%;
	margin: auto;
	overflow: auto;
	background-color: var(--chip-container);
}

.chip {
	display: flex;
	align-items: center;
	padding: 14px 16px;
	opacity: 0px;
	font-size: 14px;
	/* color: #000000; */
	width: 100% !important;
}



.close-icon {
	cursor: pointer;
	margin-left: auto;
	font-weight: bold;
	color: #8b8b8b;
	text-align: center;
	/* background: #ffffffb8; */
	padding: 0;
}


.count {
	color: var(--txt-primary-color) !important;
}


.fa-calendar,
.fa-clock-o {
	color: #DCDCDC !important;
	/* padding-right: 1rem; */
}

#btnDownload,
#btnDownloadAlerts,
#btnFilter {
	background-color: transparent !important;
	padding: 0px !important;
}

.time-details {
	color: #0A0A0A;
	font-size: 10px;
	font-family: 'Pretendard';
	font-weight: 400;
	line-height: 14px;
	letter-spacing: 0.20px;
	word-wrap: break-word
}

.tbl-selected-section {
	height: calc(100vh - 345px);
	overflow: auto;
}

.switch-toggle {
	background-repeat: no-repeat;
	background-color: rgb(0, 198, 193);
	border-top-color: rgb(0, 198, 193);
	border-right-color: rgb(0, 198, 193);
	border-bottom-color: rgb(0, 198, 193);
	border-left-color: rgb(0, 198, 193);
}

hr {
	margin: 1rem 0;
	color: rgb(187 187 187) !important
}

.coursor-none {
	cursor: none !important;
}

.pointer-none {
	pointer-events: none;
}


.user-profile {
	font-size: 20px;
	display: inline-flex;
	padding: 0 6px;
	color: gray;
}

table.dataTable.order-column.stripe tbody tr.odd>.sorting_1 {
	background-color: transparent !important;
}

.activeBtn {
	border-color: var(--border-color-blue);
	background-color: var(--bg-time-button);
	color: var(--btn-color);
}


.productionBtn {
	flex: 1 1 auto !important;
	padding: 6px 12px 6px 12px !important;
	gap: 4px !important;
	border-radius: var(--Sizeradiusr8) !important;
	border: 1px #F0F0F0 solid;
	opacity: 0px !important;
}

.productionBtn .activeBtn {
	border: 1px solid var(--border-color-blue);
}


.event-summary {
	padding: 4px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 10px;
	border-radius: 4px;
	border-color: var(--border-color-blue);
	background-color: var(--bg-time-button);
	color: var(--btn-color);
	font-size: 14px!important;
	font-style: normal!important;
	font-weight: 400!important;
	line-height: 16px!important;
	letter-spacing: 0.2px;
	width: max-content;
}

.event-summary-past {
	color:  var(--event-summary);
}

/* .datetime-container {
    position: absolute;  
	height: auto!important;
} */


.modal-header .btn-close {
	display: none !important;
}

.text-qprimary {
	color: var(--Color-interactive-Default) !important;
}

.breadcrumb>.active {

	font-weight: normal !important;
}

.dt-length label {
	color: #8b8b8b !important
}


.selectedbg-light {
	background-color: var(--bg-lightselected);
}

.page-content {
	margin-top: 110px !important;
}

#currentDate,
#currentTime {
	font-size: 10px;
	color: var(--text-color);
}

.bg-lightgray {
	/* background-color: #292929; */
	background-color: var(--background-light-selected);
	border: 1px solid var(--border-light-white);
}

.dt-type-numeric {
	text-align: left !important;
}

.text-center-lastcol {
	text-align: center !important;
}


.btnCustome {
	width: 240px;
	/* border: 1px solid #DCDCDC!important; */
	border-radius: 8px;
	padding: 8px 8px;
	text-align: left;
	color: var(--text-color);
}

.bg-outer-section {
	background-color: var(--bg-outer-section);
}

.apexcharts-treemap-rect {
	stroke: transparent !important;
}

.dt-search input#dt-search-0 {
	background-color: var(--bg-search) !important;
	padding: 7px 8px !important;
	border-radius: 8px !important;
}

.form-switch .form-check-input:checked {
	background-repeat: no-repeat;
	background-color: var(--btn-bg);
	border-color: var(--border-color-blue) !important;
}

.pagination button {
	color: var(--paginate_button-text-color) !important;
	background-color: var(--paginate_button-bg) !important;
	border-radius: 0px !important;
	border: none !important;
	font-weight: 400;
	font-size: 14px;
}


div.dt-container .dt-paging .ellipsis {
	padding: 5px 14px !important;
	line-height: 25px !important;
	vertical-align: middle;
}

.form-select:disabled {
	background-color: var(--form-input-disabled) !important;
	cursor: not-allowed;
}

.btn-close {
	text-shadow: none !important;
}

.viewLink {
	color: var(--txt-primary-color) !important;
	font-family: 'Pretendard';
	text-decoration: underline !important;
}

.tInfo {
	color: var(--txt-primary-color) !important;
}

.user-icon {
	color: var(--nav-text);
}

.checkbox-label {
	background-color: var(--btn-color-darktheme);
}


td .eye {
	filter: var(--svg-filter);
}
.imgClr {
	filter: var(--svg-filter);
}

.page-item.active .page-link {
	background-color: transparent !important;
	border-color: var(--border-color-blue) !important;
	color: var(--nav-text) !important;
	border-width: 1px !important;
	border-style: solid !important;
	border-radius: 8px !important;
    padding: 8px;
    width: 34px;
    height: 34px;
    vertical-align: middle;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
	background-color: var(--text-color-theme-toggle);
}

.bropdownTime .fa-chevron-up,
.bropdownTime .fa-chevron-down,
.bropdownDate .fa-chevron-right,
.bropdownDate .fa-chevron-left {
	color: var(--text-color-theme-toggle);
}

.bropdownTime .btn-primary {
	background-color: var(--bg-color-theme-toogle);
}

.bootstrap-datetimepicker-widget table td.today:before {
	border-bottom-color: var(--btn-border);
}

.bropdownTime .btn:hover {
	color: var(--text-color-theme-toggle);
	background-color: transparent;
	border-color: transparent;
}

.bootstrap-datetimepicker-widget table td.today:before {
	border-bottom-color: var(--btn-border);
}

.nav>li>a:hover,
.nav>li>a:focus {
	background-color: var(--body-bg) !important;
}

.nav>li>a:hover,
.nav>li>a:focus {
	background-color: var(--bg-hover) !important;
}

.primaryColor {
	color: var(--text-color-theme-toggle) !important
}

/* Media query for dark mode */
/* @media (prefers-color-scheme: dark) {
	.dark-mode .apexcharts-text {
	  fill: #fff;
	}
	.apexcharts-text{
		color: red!important;
	}
	.dark-mode .apexcharts-tooltip,
	.dark-mode .apexcharts-tooltip-title {
	  background-color: #333 !important;
	  color: #fff !important;
	  border: 1px solid #555 !important;
	}
	.dark-mode .apexcharts-legend-text {
	  color: #fff !important;
	  border: 1px solid #555 !important;
	}
  } */


/* Chart Tooltip styling */
.apexcharts-tooltip {
	background-color: var(--chart-tooltip-bg-color) !important;
	color: var(--chart-tooltip-text-color) !important;
}

table.dataTable.display>tbody>tr.selected {
	background-color: var(--selected-row) !important;
}

table.dataTable>tbody>tr.selected>* {
	color: var(--table-row-color) !important
}


.viewDetails {
	width: 100%;
	border-radius: 8px;
	border: 1px solid var(--border-color-blue);
	color: var(--text-color-theme-toggle) !important;
	margin-top: 15px;
}

.timeLineBtnActive {
	border: 1px solid var(--border-color-blue) !important;
	background-color: var(--bg-btn-checked);
	color: var(--text-color-theme-toggle) !important;
}

.timeLineBtn {
	border: 1px solid #DCDCDC;
	color: var(--text-color);
}

.realTimeHeader {
	background: var(--tbl-header-bgcard) !important;
}

.legendColor {
	color: #8B8B8B !important;
}

.timeLineBtn:hover {
	border: 1px solid var(--border-color-blue);
}

div.dt-container .dt-search input {
	/* margin-left: 0px !important; */
	background-color: var(--bg-search) !important;
	border: 1px solid var(--form-control-border) !important;
}

.btnMgt {
	border-radius: 4px !important;
	border: 1px solid var(--form-control-border) !important;
}

.dt-info {
	text-align: center !important;
}

.dt-length label {
	text-transform: capitalize;
}

.page-item.disabled .page-link {
	color: #6c757d !important;
	pointer-events: none !important;
}

.btnCustome {
	border: 1px solid var(--border-select) !important;

}

.btnMgt img {
	filter: var(--icon-filter);
}

body.dark-theme .dropdown {
	background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zZWFyY2guY3NzIj4KPHBhdGggZD0iTTE1IDMuNUwyMy42MDEgNi40MTgtLjY4M2wwLjMwNTggOC4xNDA4TDE1IDMuNXoiIHN0eWxlPSJmaWxsOiM2ZGEwODQiLz4KPC9zdmc+Cg==') no-repeat;
	background-size: 16px 16px;
	background-position: right 10px center;
}

.ThemeButton {
	border-radius: 8px;
	border: 1px solid lightgray;
	width: 25px;
	height: 25px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}

/* #sun-toggle {
  							padding: 6px 6px;
    						border-radius: 8px;
    						border: 1px solid #625c5c;
						  }
			
						  #moon-toggle {
							padding: 6px;
							border-radius: 8px;
							border: 1px solid lightgray;
						  } */


div.dt-container .dt-paging .dt-paging-button.disabled,
div.dt-container .dt-paging .dt-paging-button.disabled:hover,
div.dt-container .dt-paging .dt-paging-button.disabled:active {
	cursor: not-allowed !important;
	color: var(--disabled-pagin) !important;
}

.calc-info img {
	cursor: pointer !important;
	position: absolute;
	top: 293px!important;
	filter: var(--svg-filter);
	margin: -10px !important;
	height: 12px;
        width: auto;
}

.svg-filter {
	filter: var(--svg-filter);
}

input[type="time"]::-webkit-calendar-picker-indicator,
.btn-create span img,
.text-qprimary img {
	filter: var(--clock-svg-filter);
}

.crmEntityFormView {
	background-color: var(--form-bg-color) !important;
}

.profile-info .card-body,
.list-group-item {
	background-color: var(--form-bg-color) !important;
	color: var(--text-color)
}

.outspaceContainer {
	background-color: var(--body-bg) !important;
}

.apexcharts-legend-series {
	color: var(--text-color) !important;
}

.text-muted,
.legendColor {
	color: var(--color-muted) !important;
}

.energy-flow-img {
	filter: invert(1);
}

.img-filter {
	filter: var(--icon-filter);
}

.apexcharts-legend-text,
/* .apexcharts-yaxis-title-text, */
/* .apexcharts-text , */
.apexcharts-xaxis-title
{
	fill: var(--text-color) !important;
	color: var(--text-color) !important;
	font-family: 'Pretendard' !important;
	text-transform: capitalize;
	font-size: 14px;
}

 
 
.apexcharts-text 
{
	fill: var(--text-color) !important;
	color: var(--text-color) !important;
	font-family: 'Pretendard' !important;
	font-size: 14px;
}


input[type="date"],
#fromDate,
#toDate,
#fromDateDemand,
#toDateDemand,
#fromDateYield,
#toDateYield {
	text-transform: uppercase !important;

}

input[type="date"]::-webkit-calendar-picker-indicator {
	cursor: pointer;
	border-radius: 4px;
	margin-right: 2px;
	opacity: 0.6;
	filter: invert(0.8);
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
	opacity: 1
}


/* .form-select{
						background-image: var(--form-selectarrow_down)!important;
					  }

					  */


.txt-primary {
	color: var(--text-color-theme-toggle);
}



.profile-toggle {
	color: var(--text-color-userprofile);
}

.txt-muted {
	color: var(--text-color-userprofile);
}

.dropdown-menu-end li a {
	margin-left: 0px !important
}



/* .table>thead {
	border: 1px solid var(--tabel-border) !important;
} */

/* div.dt-container.dt-empty-footer .dt-scroll-body,
.dataTables_scroll {
	border: 1px solid var(--tabel-border) !important;
} */

a:not(.btn):hover {
	text-decoration: none !important;
}

/* hr:not([size]) {
														margin: 9px!important;
													} */

.divideHr {
	margin-top: 24px !important;
	margin-bottom: 24px !important;
}

.profile-settings li {
	padding: 0.3rem;
}

.profile-settings li a i {
	padding: 0rem 0.4rem;
}

.dropdown-menu>.active>a {
	padding: 5px 18px !important;
	;
	border: 1px solid rgba(20, 80, 192, 0.04) !important;
	border-radius: 8px !important;
	;
	background: #2764de12 !important;
}

textarea {
	border: 1px solid var(--form-control-border) !important;
}



.fa-calendar,.fa-clock-o {
	cursor: pointer !important;
}




.bootstrap-datetimepicker-widget table th.prev::after {
	content: "previous"
}

.bootstrap-datetimepicker-widget table th.next::after {
	content: "next"
}

.program-list_paginate span .paginate_button {
	color: #f0f0f0 !important;
}

/* .badge {
																											background-color: transparent!important;
																										} */

.badge-past, .badge-active {
	color: var(--badge-color);
}

#customDateRangePicker {
	width: 100%;
}

/* #performanceAlertChart foreignObject{
												display: none!important;
											} */

table.dataTable>tbody>tr.selected:hover .siteIdPrimaryKey,
table.dataTable>tbody>tr.selected:hover td {
	color: #fff !important;
}

.selected .siteIdPrimaryKey:hover {
	color: #fff !important;
}

/* .badge {
												background-color: transparent!important;
											} */

#EventListTable tr:not(.group) td:first-child {
	text-indent: 1.5rem;
	background-color: #fafafa;
	font-weight: 500;
	/* text-align: right; */
}

.spin-div-loader {
	width: auto;
	height: 50px;
	animation-name: spin;
	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	margin: 0 0.3rem;
}

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

	to {
		transform: rotate(360deg);
	}
}




div.dt-container .dt-paging .dt-paging-button {
	padding: inherit !important;
}

.units {
	color: var(--text-color);
}

/* table.dataTable>tbody>tr>td {
												padding: 5px!important;
											}   */

td a {
	font-size: 12px;
}

.pointer {
	color: var(--bsdropdown-color) !important;
}

input.required:invalid {
	border-color: red;
}

.float-left {
	float: left;
}

.link-visit {
	color: var(--active-text);
}


.border {
	border: #7c7c7c !important;
}



.text-wrap {
	word-wrap: break-word;
}

/* CSS for Large content columns in table */

.ellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 200px;
}

.ellipsissmall{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 150px;
}


.ellipsisLarge {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 300px;
}

#alertDataTable,
#alertData,
#siteDataTable {
	table-layout: fixed;
	width: 100%;
}

.navbar-dark .navbar-nav>li>a:focus {
	border: none !important;
	outline: none;
}

.apexcharts-xaxistooltip-bottom {
	display: none !important;
}


/* .dt-search{
	width: 320px!important;
	float: right!important;
} */

/* .dataTables_wrapper .dataTables_filter input::-webkit-search-cancel-button {
	-webkit-appearance: button !important;
	-moz-appearance: button !important; 
  } */


  .form-control::placeholder {
    color: #9d9d9d !important;}


	.cursor {
		cursor: pointer!important;
	}

	.productionBtn:hover {
		background-color: var(--btn-color);
	}

	.form-select{cursor: pointer;}


	 table.dataTable>tbody>tr>td {
		padding: 8px 11px;
	}

	.table>:not(caption)>*>* {
		border-bottom-width: 0!important;
	}

	.bootstrap-datetimepicker-widget.dropdown-menu  {
		width: auto!important;
		z-index: 999!important;
	}

	.time-icon {
		background-image: url('/time.svg');
		background-repeat: no-repeat;
		background-position: right 10px center;
		background-size: 16px 16px;
		padding-right: 30px;  
	  }

		 



  #battery_status i{
	vertical-align: middle;
  }

  .total-event{
	 color: var(--text-color);
  }

  div.dt-container .dt-paging .dt-paging-button:hover {
	background: inherit!important;
  }

.actionbtn:disabled{
	/* background: lightgrey; */
    color: gray !important;
    border: 1px solid gray !important;
    cursor: not-allowed!important;
}

.actionbtn:disabled span img{
	filter: grayscale(1);
}

 .btn-delete-disabled:disabled{
	opacity: 0.4!important;
	 cursor: not-allowed;
  pointer-events: all !important;
 }

 .not-allowed{
	cursor: not-allowed!important;
 }

 
#ErrorModel1{
  z-index: 99999;
  background-color: rgb(0 0 0 / 24%) !important;
}

#ErrorModel2 {
  z-index: 99999;
  background-color: rgb(0 0 0 / 24%) !important;
}

.button-disabled img, input:disabled {
  cursor: not-allowed !important;
  pointer-events: all!important;
}

 

/* Rounded corners for the table header */
/* .dataTable thead th:first-child {
  border-top-left-radius: 10px!important;
 
} */

/* .dataTable thead th:last-child {
  border-top-right-radius: 10px!important;
  
} */


.dt-scroll-body{
	 border-bottom-left-radius: 10px!important;
	  border-bottom-right-radius: 10px!important;
}
 
/* .dataTable thead th{
 border-color: var(--tabel-border)!important;
 
} */

 
.dataTables_wrapper .dataTables_paginate {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.dataTable thead{
	 border-bottom-left-radius: 10px!important;
	  border-bottom-right-radius: 10px!important;
	   border-color:var(--tabel-border)!important;
}


 
.dataTables_wrapper .dataTables_paginate a {
  border-radius: 5px;  
}

 
 

 
div.dt-container.dt-empty-footer .dt-scroll-body,div.dt-container .dt-scroll-body {
	border: 1px solid var(--tabel-border)!important;
}

.dt-scroll-headInner{
    border: 1px solid var(--tabel-border)!important;
    border-top-right-radius: 8px!important;
    border-top-left-radius: 8px!important;
    border-bottom: 0!important;
}


.EventListTable_wrapper div:last-child{
	border: 1px solid var(--tabel-border)!important;
}


 table.dataTable > tbody > tr:last-child td {
  border-bottom: none !important;
}

.db-outer-gap{
  padding-bottom: 1rem;
}

.dt-scroll-head{
	border-radius: 0px!important;
}

.realTimeHeader{
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}

.datatable {
  border-collapse: separate!important;
  border-spacing: 0;
  border-radius: 8px;
}

.dt-scroll-headInner{
    box-sizing: border-box!important;
}

.dark-theme .choices__item--selectable:focus-visible {
  
   background-color: var(--form-control-bg)!important;
   /* color: var(--text-color)!important; */
}

.choices__list--dropdown .choices__item--highlighted {
  background-color: var(--form-control-bg)!important;
  /* color: var(--text-color)!important; */
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
    background-color: var(--form-control-bg)!important;
  /* color: var(--text-color)!important; */
}

.choices.is-open.is-flipped.is-focused .choices__inner {
  background-color: var(--form-control-bg)!important;
 /* color: var(--text-color)!important; */
}

 
  input.form-control.account-form-control[readonly] {
    background-color: var(--form-input-disabled)!important;
}


.choices__list--dropdown .choices__item--selectable.is-highlighted {
  background-color: var(--form-control-bg)!important;
 /* color: var(--text-color)!important; */
}

.choices__list--dropdown .choices__item--selectable:hover,
.choices__list--dropdown .choices__item--selectable.is-highlighted {
 background-color: var(--form-control-bg)!important;
 /* color: var(--text-color)!important; */
}


 /* Highlight the selected item */
    .choices__list--dropdown .choices__item[data-value].is-selected {
        background-color: var(--choices-list-selected-bg) !important;
		color: var(--choices-list-selected-text) !important;
        font-weight: bold !important;
    }

    /* Prevent hover from overriding the selected highlight */
    .choices__list--dropdown .choices__item[data-value].is-selected:hover {
      background-color: var(--choices-list-selected-bg) !important;
		color: var(--choices-list-selected-text) !important;
        font-weight: bold !important;
    }
input:-webkit-autofill {
	transition: background-color 5000s ease-in-out 0s;
	-webkit-text-fill-color: var(--choices-list-selected-text) !important;
	box-shadow: 0 0 0px 1000px transparent inset;
	background-color: var(--choices-list-selected-bg) !important;
}


.choices__inner {
	border: 1px solid var(--form-control-border) !important;
	border-radius: var(--Radiuscorner-radius-100) !important;
}

.choices__placeholder {
	opacity: 1 !important;
	font-size: 16px !important;
}

.choices[data-type*=select-one] .choices__inner {
    padding-bottom: 0px!important;
    padding-top: 6px!important;
}

.choices__list--single {
    display: inline-block;
    padding: 0px 16px 0px 4px!important;
    width: 100%;
    line-height: 28px;
}

.choices__list--dropdown .choices__item--selectable,
.choices__list[aria-expanded] .choices__item--selectable {
	padding-right: 0px !important;
}


.choices.is-focused {
  border-color: #86b7fe!important;/* Bootstrap primary border */
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25)!important; /* Bootstrap focus ring */
}

.choices{
	border-radius: var(--Radiuscorner-radius-100)!important;
}



.fixed-top.navbar .navbar-collapse {
	padding-top: 0px;
	/* overflow: hidden; */
}

.navbar-toggler-icon {
	filter: var(--filter-darklight) !important;
}

.theme-toggle-container{
	margin-top: 12px;
	margin-left: 15px;
}
#realTimeValueDiv{display: flex; overflow-x: auto; white-space-collapse: collapse; text-wrap-mode: nowrap;}
.tableBottomcountText{justify-content: center; align-items: center;}
.tableBottompagination{justify-content: end; align-items: center;}

.choices__list--single .choices__item {
    width: 100%;
    overflow: hidden;
    padding-right: 7px !important;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#EventListTable_wrapper .dt-search{
  width: 208px!important; /* or auto/100% as needed */
  box-sizing: border-box!important;
  -webkit-appearance: none!important;
}
.mlr-104{
        margin-left: 84px;
          margin-right: 84px;
      }
	  #siteList_wrapper #dt-search-0{width: 15%!important;    float: right;
    margin-bottom: 5px;}



.multi-select-container:focus,
.multi-select-container.is-focused {
  border-color: #86b7fe!important;
  outline: 0!important;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25)!important
}


.navbar-dark .navbar-toggler {
    border: 1px solid var(--border-navbar)!important;
}

 .dt-info#siteDataTable_info{text-align: center!important;}
/* 
.modal-body{
	word-wrap: break-word;
} */
#user-list {
    width: 100% !important; /* Ensure table stretches */
    min-width: 800px;       /* Force horizontal scroll if narrow screen */
}

.user-list_wrapper {
    overflow-x: auto;       /* Enable scroll in wrapper */
}
html[dir=ltr] li a {
    margin-left: 0px;
}
.dark-theme .form-select {
  appearance: none;
  padding-right: 2.25rem;

  /* set arrow to white explicitly */
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23ffffff' d='M143 352.3c-4.7 0-9.4-1.8-13-5.4L7 224.9c-7.2-7.2-7.2-18.8 0-26s18.8-7.2 26 0L143 308.1 287 198.9c7.2-7.2 18.8-7.2 26 0s7.2 18.8 0 26L156 346.9c-3.6 3.6-8.3 5.4-13 5.4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size:0.7rem;
}

@media screen and (max-width: 1280px) and (max-height: 800px) {
	.d-flex-row span {
		font-size: medium;
	}

	.qBtn-newProgram {
		top: 56px;
	}
}

@media (max-width: 1566px) {
	.dataTable tbody td {
		height: auto;
	}

	 

	.calc-info img {
		cursor: pointer !important;
		position: absolute;
		top: 293px!important;
		filter: var(--svg-filter);
		margin: -10px !important;
		height: 12px;
        width: auto;
	}



	.form-w-70 {
		width: 80% !important;
		margin: auto;
	}

	.qBtn-newProgram {
		top: 66px!important;
	}


	.h-wp {
		height: 583px;
	}
}
@media (max-width: 1199px) and (orientation: portrait) { 



	.custom-container {
		margin-left: 10px !important;
		margin-right: 10px !important;
	}

	.fixed-top.navbar .navbar-collapse {
		box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
		padding: 1rem;
	}


		button.navbar-toggler {
    margin-right: 15px;
 
}

.weblinks ul .dropdown-menu{
border: 1px solid #414141!important;}

.toggle-menu-align{
	margin-bottom: 1rem;
	display: flex;
    justify-content: space-between;
    width: 100%;
	padding: 0.5rem;
}
    .ThemeButton {
        width: 50px;
        height: 40px;
        border: 1px solid var(--border-navbar) !important;
    }
	    #moon-toggle, #sun-toggle {
        font-size: 20px;
    }
	    .theme-toggle-container {
        position: absolute;
        top: 4px;
        right: 107px;
    }
	.tableBottomcountText{justify-content: end; align-items: center;}
	.tableBottompagination{justify-content: center; align-items: center;}
	.custom-sitetitle {
        position: absolute;
        top: 12px;
        left: 141px;
    }
	.db-outer-gap {
    /* margin: var(--Spacingspacing-300); */
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 90px;
}
.alertCheckbox:checked::before {
    top: -12px;
    left: -5px;
}

}
@media screen and (max-width: 1199px) and (orientation: landscape) {
	.custom-container {
		margin-left: 10px !important;
		margin-right: 10px !important;
	}

	.fixed-top.navbar .navbar-collapse {
		box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
		padding: 1rem;
	}


		button.navbar-toggler {
    margin-right: 15px;
 
}

.weblinks ul .dropdown-menu{
border: 1px solid #414141!important;}

.toggle-menu-align{
	margin-bottom: 1rem;
	display: flex;
    justify-content: space-between;
    width: 100%;
	padding: 0.5rem;
}
    .ThemeButton {
        width: 50px;
        height: 40px;
        border: 1px solid var(--border-navbar) !important;
    }
	    #moon-toggle, #sun-toggle {
        font-size: 20px;
    }
	    .theme-toggle-container {
        position: absolute;
        top: 4px;
        right: 107px;
    }
	.tableBottomcountText{justify-content: end; align-items: center;}
	.tableBottompagination{justify-content: center; align-items: center;}
	.custom-sitetitle {
        position: absolute;
        top: 12px;
        left: 141px;
    }
	.db-outer-gap {
    /* margin: var(--Spacingspacing-300); */
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 90px;
}
.openAlertSummeryTable .dt-search{right: 275px;}
.alertCheckbox:checked::before {
    top: -12px;
    left: -5px;
}
}
/* Media query start here */
@media (min-width: 1025px) and (max-width: 1280px) {
  
#allSitesDivId .dt-search {
	right: 80px!important;
	top: -70px!important;
}
  /* #alertDataTable_wrapper .dt-search{   
    right: 280px;} */
	#allAlertsDivId.alertSearchDataTable .dt-search{right: 70px;}
	#alertDataTable_wrapper .dt-search{
		        right: 285px;
	}
}

@media (min-width: 600px) and (max-width: 1024px) {
  /* Styles for all tablets */
.col-sm-6{
		margin-bottom: 24px;
	}

	.calc-info img {
		cursor: pointer !important;
		position: inherit;}

		/* .dt-search {
			width: 25%;
		} */
	div.table-responsive > div.dt-container > div.row > div[class^=col-]:last-child {
    display: flex!important;
    justify-content: center!important;
}

.dt-container{
	margin-top: 3rem;
}

#allSitesDivId .dt-search {
	right: 152px!important;
	top: -115px!important;
}
.db-outer-gap {
        margin-left: 20px !important;
        margin-right: 20px !important;
        margin-top:90 !important;
    }
	#siteDataTable_wrapper .dt-scroll-body {
    height: calc(100vh - 640px)!important
  }
  .dt-info#siteDataTable_info{text-align: end!important;}
  #navbar-show .dropdown{    padding: 10px 0px;
    border-bottom: 1px solid var(--divider-vertical);}
	    .theme-toggle-container {
        position: absolute;
        top: 4px;
        right: 107px;
    }
	.ThemeButton {    
    width: 50px;
    height: 40px;    border: 1px solid var(--border-navbar) !important;}
	#moon-toggle,#sun-toggle{font-size: 20px;}
	#alertDataTable_wrapper .dt-search{   
    top: -60px;
    right: 25px;width: 250px;}
	#allAlertsDivId.alertSearchDataTable .dt-search{   
    top: -109px;
    right: 70px;width: 250px;}
	.alertSearchDataTable .dt-paging nav{    justify-content: center;}
	#allAlertsDivId.alertPassCurrent .dt-search{    width: 40%;
    top: -55px;
    right: 0px;}
	.btnCustome::after {
    top: 20px!important; 
}
	.consumptionDrop .btnCustome::after {
    top: 28px!important; 
}
.tab-content .dt-paging nav {
    display: flex;
    justify-content: center!important;
}
.user-list_wrapper {
        overflow-x: scroll; /* Tablet view scroll */
    }

	.tableBottomcountText{justify-content: end; align-items: center;}
	.tableBottompagination{justify-content: center; align-items: center;}
#tblAccountList_wrapper .dt-column-order{
	right: 35px!important;
}
#program-list_wrapper .dt-search {
    margin-bottom: 8px;
    width: 100%;
    float: right;
    margin-right: 0;
    margin-top: 21px;
}
#EventListTable_wrapper .dt-search{width: 100%!important;}
.d-filter-pos{right: 2.6rem!important;}
#ProgramListTable_wrapper .dt-search, #tblLeapEvent_wrapper .dt-search, #sitelevelperformance_wrapper .dt-search, #performance_placeholder_wrapper .dt-search{width: 100%;}
#sitereport_wrapper .dt-search input{width: 93.6%!important;}
#site-list_wrapper .dt-search input,#mapped-site-list_wrapper .dt-search input{width: 100%!important;}
.mlr-104{margin-left: 0px;margin-right: 0px;}
#siteList_wrapper #dt-search-0{width: 100%!important;}
    .custom-sitetitle {
        position: absolute;
        top: 12px;
        left: 141px;
    }
}