﻿/*WrappperContainer*/
[ML_PageControl_WrapperKey="WIDGETS_Container"] {
	width: 100%;
	height: 100%;
	min-width: 180px;
}

	/*SC Content*/
	[ML_PageControl_WrapperKey="WIDGETS_Container"] [ml_pagecontrol_type="CONTENT"] {
		display: flex;
		flex-direction: column;
		height: calc(100% - 43px);
	}

	[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		gap: 5px;
		margin-bottom: 5px;
	}

		[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Controllers"] {
			display: flex;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: flex-start;
			gap: 5px;
		}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Controllers"] [ML_PageControl_Key="WIDGET_Filter_Controller"] {
				background-color: var(--background-color-site-secondary);
				border-radius: 5px;
				padding: 5px;
			}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Controllers"] [ML_PageControl_Key="WIDGET_Filter_Controller"]:hover {
					background-color: var(--border-color-container);
					border-radius: 5px;
					padding: 5px;
					color: white;
					cursor: pointer;
				}

					[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Controllers"] [ML_PageControl_Key="WIDGET_Filter_Controller"]:hover span {
						color: white;
						cursor: pointer;
					}

		[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Sensors"] {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: flex-end;
			gap: 5px;
		}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Sensors"] [ML_PageControl_Key="WIDGET_Filter_Sensor"] {
				background-color: var(--background-color-site-secondary);
				border-radius: 5px;
				padding: 5px;
				min-width: 35px;
				display: flex;
				justify-content: center;
				align-items: center;
			}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Sensors"] [ML_PageControl_Key="WIDGET_Filter_Sensor"]:hover {
					background-color: var(--border-color-container);
					border-radius: 5px;
					padding: 5px;
					color: white;
					cursor: pointer;
				}

					[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Sensors"] [ML_PageControl_Key="WIDGET_Filter_Sensor"]:hover span {
						color: white;
						cursor: pointer;
					}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_FiltersTable"] [ML_PageControl_Key="WIDGET_Filters_Sensors"] [ML_PageControl_Key="WIDGET_Filter_Sensor"] [ML_PageControl_Key=WIDGET_Sensor_Icon] {
					font-size: 20px;
				}

	[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGETS_Container_Internal"] {
		padding: 5px !important;
		display: flex;
		flex-direction: row;
		white-space: nowrap;
		flex-wrap: wrap;
		justify-content: space-between;
		overflow-y: auto;
		height: 100%;
		align-items: flex-start;
	}

	/*Widget*/
	[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] {
		border: 4px solid var(--border-color-container);
		margin: 3px;
		display: flex;
		border-radius: 5px;
		align-items: center;
		width: 49%;
		padding: 3px;
		background-color: var(--background-color-site-secondary);
		min-width: 330px;
		min-height: 145px;
		flex-direction: column;
		justify-content: flex-end;
	}

		[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Top"] {
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			width: 100%;
			flex-wrap: wrap;
		}


		[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] {
			min-width: 150px;
			width: 49%;
			display: flex;
			align-items: center;
			justify-content: space-evenly;
			white-space: nowrap;
		}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Info"] {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				padding: 3px;
				width: 49%;
				gap: 8px;
			}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Info"] span[ML_PageControl_Key=WIDGET_Info_Name] {
					font-size: 25px;
					white-space: normal;
					text-align: center;
					font-weight: bold;
					line-height: 1;
				}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Info"] span[ML_PageControl_Key=WIDGET_Info_Icon] {
					font-size: 40px;
					margin-top: 5px;
				}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Values"] {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				padding: 3px;
				width: 49%;
			}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Values"] [ML_PageControl_Key="WIDGET_Actual"] {
					display: flex;
					flex-direction: row;
					justify-content: center;
					align-items: baseline;
				}

					[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Values"] [ML_PageControl_Key="WIDGET_Actual"] [ML_PageControl_Key="WIDGET_ActualValue"] {
						font-size: 40px;
						font-weight: bold;
					}

					[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Values"] [ML_PageControl_Key="WIDGET_Actual"] [ML_PageControl_Key="WIDGET_ActualUnit"] {
						font-size: 18px;
						font-weight: bold;
					}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Left"] [ML_PageControl_Key="WIDGET_Left_Values"] [ML_PageControl_Key="WIDGET_DateTime"] {
					display: flex;
					align-items: center;
					justify-content: center;
				}

		[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] {
			min-width: 150px;
			width: 49%;
			display: flex;
			align-items: center;
			justify-content: space-evenly;
			white-space: nowrap;
		}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: flex-end;
				padding: 3px;
				width: 100%;
			}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] div {
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					align-items: center;
					width: 100%;
				}

				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] [ML_PageControl_Key="WIDGET_Info_Max_Value"],
				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] [ML_PageControl_Key="WIDGET_Info_Avg_Value"],
				[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] [ML_PageControl_Key="WIDGET_Info_Min_Value"] {
					margin-left: 3px;
					font-weight: bold;
				}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Values"][ML_PageControl_Key="WIDGET_Info_Diff"] {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: flex-end;
			}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Values"] [ML_PageControl_Key="WIDGET_Diff_Value"] {
				font-weight: bold;
			}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] [ML_PageControl_Key="WIDGET_Info_Max_Time"],
			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Statistic"] [ML_PageControl_Key="WIDGET_Info_Min_Time"],
			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Values"] [ML_PageControl_Key="WIDGET_Diff_Time"] {
				font-size: 11px;
				margin-left: 3px;
			}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Right"] [ML_PageControl_Key="WIDGET_Right_Values"] {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: flex-end;
				padding: 3px;
				width: 100%;
			}

		[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Bot"] {
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			width: 100%;
			gap: 5px;
		}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Bot"] [ML_PageControl_Key="WIDGET_ControllerModelName"] {
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 12px;
				width: 100%;
				font-weight: bold;
				flex-direction: row;
				background-color: var(--background-color-container-form-header);
				border-radius: 5px;
			}

			[ML_PageControl_WrapperKey="WIDGETS_Container"] [ML_PageControl_Key="WIDGET_Container"] [ML_PageControl_Key="WIDGET_InfoContainer_Bot"] [ML_PageControl_Key="WIDGET_ControllerName"] {
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 12px;
				width: 100%;
				font-weight: bold;
				flex-direction: row;
				background-color: var(--background-color-container-form-header);
				border-radius: 5px;
			}

.filterSelected {
	background-color: var(--background-color-container-list-selected) !important;
}
