/* contenitore di tutto il layout*/
div[ML_LayOut_Section=Full_LayOut_Container] {
	height: 100dvh;
	width: 100vw;
}


.ML_LayOut_Container {
	display: grid;
	grid-template-rows: 64px min-content 1fr;
	grid-auto-flow: row;
	grid-template-areas: "Header_Top" "Header_Middle" "MainContent";
	height: 100svh;
	background-color: var(--background);
}

/*********************************************/


.Header_Top {
	grid-area: Header_Top;
	background-color: var(--header-color);
	display: grid;
	grid-template-columns: min-content 1fr min-content min-content;
	grid-template-rows: 1fr;
	gap: 20px;
	grid-auto-flow: row;
	grid-template-areas: "Logo Menu_Lev1 Command_Top Avatar";
	height: 100%;
	padding: 8px 12px;
	z-index: 1;
	border-bottom: 1px solid var(--border-color)
}

	.Header_Top .Logo {
		grid-area: Logo;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.Header_Top .MenuLev1 {
		grid-area: Menu_Lev1;
		display: flex;
		width: 100%;
		justify-content: flex-end;
		gap: 20px;
	}

		.Header_Top .MenuLev1 [ml_pagecontrol_key=Btn_System] {
			/*			margin-left: auto;*/
		}

		.Header_Top .MenuLev1 .Button {
			border-radius: 8px;
			text-wrap: nowrap;
			padding-inline: 10px;
		}

		.Header_Top .MenuLev1 .WebsiteSelector {
			margin-right: auto;
		}

			/*Per rimuovere le icone che durante il caricamento restano li, il king del css*/
			.Header_Top .MenuLev1 .WebsiteSelector [ML_PageControl_Type=Icon]:has(+span:empty),
			.Header_Top .MenuLev1 .WebsiteSelector span:empty + [ML_PageControl_Type=Icon] {
				display: none
			}

			.Header_Top .MenuLev1 .WebsiteSelector .WebsiteSelector_Selected .Company_Selected {
				font-size: 13px;
				/*				font-style: italic;*/
			}

			.Header_Top .MenuLev1 .WebsiteSelector .WebsiteSelector_Selected .Website_Selected {
				font-weight: bold;
			}

			.Header_Top .MenuLev1 .WebsiteSelector .WebsiteSelector_Selected > * {
				max-width: 320px;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.Header_Top .MenuLev1 .WebsiteSelector[ML_Status=None] .WebsiteSelector_Selected {
				display: none;
			}

			.Header_Top .MenuLev1 .WebsiteSelector [ML_PageControl_Key=MyCompanies_Select] {
				font-size: 13px;
				font-style: italic;
			}

			.Header_Top .MenuLev1 .WebsiteSelector[ML_Status=Selected] .WebsiteSelector_Select {
				display: none;
			}


/* Libro Contenitore e Siti */
.MenuCompaniesWebsites {
	min-width: 500px;
}

	.MenuCompaniesWebsites > [ml_pagecontrol_type=CONTENT] {
		display: grid;
		grid-template-rows: min-content 1fr;
	}

	.MenuCompaniesWebsites .SearchBar {
		padding: 0 10px 10px 10px;
		border-bottom: 1px solid var(--border-color);
	}

	.MenuCompaniesWebsites .List {
		background-color: var(--background);
		padding: 7px;
		border-bottom-left-radius: 21px;
		border-bottom-right-radius: 21px;
	}

		.MenuCompaniesWebsites .List [ml_pagecontrol_type=HEADER] {
			background-color: transparent;
		}

		.MenuCompaniesWebsites .List .Companies {
			display: flex;
			height: min(300px, 95vh);
			gap: 8px;
			overflow: hidden scroll;
			flex-direction: column;
			padding: 5px 0px;
		}

			.MenuCompaniesWebsites .List .Companies .Company {
				margin-inline: 10px;
				padding: 12px;
				background-color: var(--content-color);
				border: 1px solid var(--border-color);
				border-radius: 16px;
				transition: all ease-in-out 0.2s;
				outline: 2px solid transparent;
			}

				.MenuCompaniesWebsites .List .Companies .Company .CompanyTitle {
					display: flex;
					justify-content: space-between;
					align-items: center;
				}

				.MenuCompaniesWebsites .List .Companies .Company:hover {
					border-color: var(--primary);
				}

				.MenuCompaniesWebsites .List .Companies .Company.Selected {
					border-color: var(--primary);
					outline-color: var(--primary);
				}


				.MenuCompaniesWebsites .List .Companies .Company .Websites {
					border-radius: 16px;
				}

					.MenuCompaniesWebsites .List .Companies .Company .Websites:has(.Website) {
						padding: 2px;
					}

					.MenuCompaniesWebsites .List .Companies .Company .Websites .Website {
						display: flex;
						cursor: pointer;
						padding: 2px;
						position: relative;
						justify-content: space-between;
						align-items: center;
					}

						.MenuCompaniesWebsites .List .Companies .Company .Websites .Website:hover {
							color: var(--primary)
						}

						.MenuCompaniesWebsites .List .Companies .Company .Websites .Website::after {
							position: absolute;
							content: " ";
							background: radial-gradient(circle, var(--primary) 92%, var(--trasparent) );
							bottom: 2px;
							left: 0;
							height: 2px;
							width: 0%;
							transition: 300ms ease-in-out;
						}

						.MenuCompaniesWebsites .List .Companies .Company .Websites .Website:hover::after {
							width: 100%;
							right: 0;
						}

						.MenuCompaniesWebsites .List .Companies .Company .Websites .Website.Selected {
							color: var(--primary);
							font-weight: bold;
						}

			.MenuCompaniesWebsites .List .Companies [ml_pagecontrol_key=Template] {
				display: none !important;
			}

.Header_Top .Command_Top {
	grid-area: Command_Top;
	display: flex;
}

	.Header_Top .Command_Top .TwoColumns_Container {
		overflow: unset;
	}

		.Header_Top .Command_Top .TwoColumns_Container [ML_PageControl_Type=GENERIC_BOX] {
			display: flex;
			align-items: center;
			height: 100%;
		}

	.Header_Top .Command_Top [ML_PageControl_Key=Btn_Notifications] {
		position: relative;
		width: 40px;
		height: 40px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

		.Header_Top .Command_Top [ML_PageControl_Key=Btn_Notifications] .Counter {
			position: absolute;
			background-color: var(--button-text-color);
			border-radius: 50%;
			width: 23px;
			height: 24px;
			top: -7px;
			right: -6px;
			color: var(--content-color);
			font-size: smaller;
		}

		.Header_Top .Command_Top [ML_PageControl_Key=Btn_Notifications] [ML_PageControl_Type=Icon] {
			font-size: 26px
		}

[ML_PageControl_WrapperKey=NOTIFICATIONS_List] {
	max-width: 500px;
	/*test*/
	overflow-wrap: anywhere;
}

	[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow {
		display: flex;
		flex-direction: column;
		gap: 5px;
	}

		[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow.Error {
			--title-color: var(--error);
		}


		[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow.Warning {
			--title-color: var(--warning);
		}


		[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow.Info {
			--title-color: var(--info);
		}

		[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow .NotificationTitle {
			font-size: 17px;
			color: var(--title-color);
		}


		[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow .NotificationDescription {
			font-size: small;
			color: var(--text-500);
		}

		[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow .Actions {
			display: flex;
			gap: 12px;
			padding-inline: 5px;
			justify-content: flex-end;
		}

			[ML_PageControl_WrapperKey=NOTIFICATIONS_List] .NotificationRow .Actions .statusLabel {
				display: block;
				color: var(--primary);
				margin: 2px 8px 0px 0px;
				cursor: pointer;
			}

/*   */
.Header_Top .Avatar {
	grid-area: Avatar;
	display: flex;
	align-items: center;
	justify-content: center;
}

	.Header_Top .Avatar .AvatarContainer {
		cursor: pointer;
		padding: 4px;
		transition: all 0.5s ease-in-out;
		width: 48px;
		height: 48px;
	}

.AvatarContainer {
}

	.AvatarContainer .Avatar {
		--avatar-size: 40px;
		object-fit: cover;
		display: flex;
		height: var(--avatar-size);
		width: var(--avatar-size);
		border-radius: 50%;
	}

		.AvatarContainer .Avatar.Square {
			border-radius: 5px;
		}

[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div {
	display: grid;
	grid-template-rows: 80px repeat(5, 1fr);
}

	[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div {
		display: grid;
		grid-template-columns: 80px 1fr;
		padding: 6px;
		min-height: 52px;
	}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div:not(:has([ML_PageControl_Key*=Selector])) {
			cursor: pointer;
		}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div:not(:last-child) {
			border-bottom: 1px solid var(--border-color);
		}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div:not(:first-child) {
			padding-right: 36px;
		}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div:hover:not(:first-child) {
			background-color: var(--text-50);
		}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div > div:first-child {
			align-content: center;
			text-align: center;
			font-size: 19px;
		}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div > div:last-child {
			align-content: center;
		}

		[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div > div[ML_PageControl_Key*=Selector] {
			display: flex;
			padding: 2px 3px;
			width: fit-content;
			border: 1px solid var(--primary);
			border-radius: 30px;
			gap: 2px;
		}

			[ML_PageControl_WrapperKey=AVATAR_Container] [ml_pagecontrol_type=CONTENT] > div > div > div[ML_PageControl_Key*=Selector] > div {
				display: flex !important;
				width: unset;
			}

.MenuContainer, .Header_Middle:has( .MenuLev2_Item ) {
	background-color: var(--header-color);
	gap: 5px;
	height: 100%;
	border-bottom: 1px solid var(--border-color);
	box-shadow: 0px 10px 15px -7px rgba(0,0,0,0.2);
}

.Header_Middle {
	grid-area: Header_Middle;
	display: grid;
	grid-template-columns: 1fr max-content min-content;
	grid-template-rows: 1fr;
	grid-auto-flow: row;
	grid-template-areas: "Menu_Lev2 Message_Middle Command_Middle";
	/*	z-index: 1;*/
}

:is(.Header_Middle, .MenuContainer ) .MenuLev2 {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 14px;
	padding-inline: 20px;
}

.Header_Middle .MenuLev2 {
	grid-area: Menu_Lev2;
}

/*meno di 48 non va bene per il paolo box*/
/*paolo del paolo box ritiene che 42 vadano bene*/
.MenuContainer .MenuLev2 {
	justify-content: center;
	height: 48px;
}

:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item {
	height: 100%;
	align-content: center;
	border-bottom: 2px solid var(--trasparent);
	padding-inline: 15px;
	color: var(--secondary-600);
	cursor: pointer;
	font-size: 16px;
	text-wrap: nowrap;
	transition: all 0.5s ease;
	user-select: none;
	min-height: 48px;
}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item [ML_PageControl_Type=Icon] {
		display: none;
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item:hover {
		color: var(--primary);
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item.Active {
		color: var(--primary);
		font-weight: bold;
		border-color: var(--primary);
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item[ml_pagecontrol_navigator_key="|"] {
		padding: 0;
		pointer-events: none;
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item.VisibleOnlyOnMobile {
		display: none;
	}

.Header_Middle .Message_Middle {
	grid-area: Message_Middle;
	display: flex;
	align-items: center;
}

	.Header_Middle .Message_Middle [ML_PageControl_Key=Btn_PendingChanges] {
		position: relative;
		width: 40px;
		height: 40px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

		.Header_Middle .Message_Middle [ML_PageControl_Key=Btn_PendingChanges] .Counter {
			position: absolute;
			background-color: var(--button-text-color);
			border-radius: 50%;
			width: 21px;
			height: 21px;
			top: -3px;
			right: -6px;
			color: var(--content-color);
			font-size: 14px;
		}

		.Header_Middle .Message_Middle [ML_PageControl_Key=Btn_PendingChanges] [ML_PageControl_Type=Icon] {
			font-size: 26px
		}

.Header_Middle .Command_Middle {
	margin: auto;
}

	.Header_Middle .Command_Middle > .ActionsContainer {
		height: 100%;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 10px;
		padding-inline: 15px;
	}

		.Header_Middle .Command_Middle > .ActionsContainer .Button {
			padding-inline: 12px;
		}

			.Header_Middle .Command_Middle > .ActionsContainer .Button[ML_PageControl_Key=Btn_StopPreview] {
				z-index: 9999999999;
				transform: scale(1.3);
				position: fixed;
				top: 25px;
				right: 25px;
			}

.MainContent {
	grid-area: MainContent;
	background-color: var(--background);
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: min-content 1fr;
	grid-auto-flow: row;
	grid-template-areas: "Message_Main"
		"MainContainer_External";
	height: calc(100dvh - 48px - 64px );
}

	.MainContent .Message_Main {
		grid-area: Message_Main;
		height: min-content;
		background-color: var(--background-200);
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

		.MainContent .Message_Main [ml_pagecontrol_key=MESSAGE_MAIN_Container] {
			width: 100%
		}

		.MainContent .Message_Main .aspNetHidden + div:not(.aspNetHidden) {
			padding: 8px;
			display: flex;
			width: 100%;
			align-items: center;
			justify-content: space-between;
			gap: 10px;
		}

		.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] {
			width: 100%;
		}

			.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body]:has([ML_PageControl_Key=Step]) {
				display: flex;
				justify-content: center;
				gap: 5px;
				width: fit-content;
				position: relative;
			}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body]:has([ML_PageControl_Key=Step])::after {
					content: ' ';
					position: absolute;
					top: 50%;
					left: 0;
					border-top: 1px solid var(--background-400);
					background: var(--background-400);
					width: 100%;
					transform: translateY(-50%);
				}

			.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step] {
				display: flex;
				justify-content: center;
				align-items: center;
				border-radius: 99999px;
				gap: 5px;
				z-index: 1;
				background: var(--background);
				min-width: 41px;
				min-height: 41px;
			}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step]:not([ML_Status=Todo]) [ML_PageControl_Type=Icon] {
					font-size: 20px;
				}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step]:not([ML_Status=Todo]) :not([ML_PageControl_Type=Icon]) {
					display: none;
				}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step][ML_Status=Todo] [ML_PageControl_Type=Icon] {
					font-size: 25px;
				}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step][ML_Status=Done] {
					border: 2px solid var(--success);
					color: var(--success);
				}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step][ML_Status=Todo] {
					border: 2px solid var(--warning);
					color: var(--warning);
					padding-inline: 15px;
				}

				.MainContent .Message_Main div[ML_PageControl_Key=Message_Main_Body] [ML_PageControl_Key=Step][ML_Status=Next] {
					border: 2px solid var(--background-400);
					color: var(--background-400);
				}

		.MainContent .Message_Main div [ML_PageControl_Key=Message_Main_Commmands] {
			min-width: 60px;
			padding: 8px;
			display: flex;
			gap: 5px;
		}

		.MainContent .Message_Main div .Button span {
			color: inherit;
		}

	.MainContent .MainContainer_External {
		grid-area: MainContainer_External;
		display: grid;
		grid-template-columns: min-content 1fr;
		grid-template-areas: "Menu_Lev3 MainContainer";
		height: inherit;
	}

		.MainContent .MainContainer_External .MenuLev3_Container {
			grid-area: Menu_Lev3;
			width: 210px;
			margin: 10px 10px 10px 0;
			/*			display: grid;*/
			/*			grid-template-columns: auto;*/
			/*			grid-template-rows: 230px 1fr min-content;*/
			/*			grid-row-gap: 10px;*/
			display: flex;
			/*			align-items: center;*/
			flex-direction: column;
			justify-content: center;
		}

			.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3 {
				display: flex;
				flex-direction: column;
				margin-bottom: auto;
				margin-top: -50px;
			}

			.MainContent .MainContainer_External .MenuLev3_Container .SelectorContainer {
				/* height: 210px; */
				display: flex;
				flex-direction: column;
				justify-content: center;
				margin-bottom: auto;
			}

				.MainContent .MainContainer_External .MenuLev3_Container .SelectorContainer .MenuLev3_Selector {
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-top: 50px;
					padding: 16px 20px;
					background-color: var(--content-color);
					border: 2px solid var(--primary);
					border-left-width: 0;
					border-top-right-radius: 25px;
					border-bottom-right-radius: 25px;
					color: var(--primary);
					cursor: pointer;
					font-size: 16px;
					transition: all ease-in-out 0.2s;
				}

					.MainContent .MainContainer_External .MenuLev3_Container .SelectorContainer .MenuLev3_Selector + .MenuLev3_Selector {
						margin-top: 12px;
					}

					.MainContent .MainContainer_External .MenuLev3_Container .SelectorContainer .MenuLev3_Selector:hover {
						animation-duration: 2.5s !important;
						transition: all ease-in-out 0.2s;
						transform: scale(1.1);
						background-color: var(--accent-200);
						font-weight: bold;
					}

			.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3 .MenuLev3_Item {
				color: var(--secondary-400);
				border: 1px solid var(--trasparent);
				border-left-width: 0;
				border-top-right-radius: 25px;
				border-bottom-right-radius: 25px;
				cursor: pointer;
				padding: 10px 20px;
				gap: 20px;
				font-size: 16px;
				display: grid;
				grid-template-columns: 24px 1fr;
				align-items: center;
			}

				.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3 .MenuLev3_Item:hover {
					color: var(--primary);
					background-color: var(--accent-100);
				}

				.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3 .MenuLev3_Item.Active {
					color: var(--primary);
					font-weight: bold;
					border-color: var(--primary-600);
					background-color: var(--accent-200);
				}

			.MainContent .MainContainer_External .MenuLev3_Container .SignUp {
				position: fixed;
				bottom: 0;
				left: 0;
				margin: 10px;
				z-index: 10;
			}

			.MainContent .MainContainer_External .MenuLev3_Container:not(:has(div > div)) {
				width: 0;
			}

		.MainContent .MainContainer_External .MainContainer {
			grid-area: MainContainer;
			display: flex;
			justify-content: center;
			height: inherit;
		}

.SignUpContainer {
	position: fixed;
	bottom: 60px;
	left: 25px;
	padding: 25px;
	background: var(--accent-200);
	border-radius: 8px;
	box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
	display: flex;
	flex-direction: column;
	gap: 15px;
}

/* contenitore di campi, dove viene impostato il numero di colonne che voglio avere */
[ML_PageContainer_Type=EntityFields_ContainerGroup] {
	width: 100%;
	--min-column-width: 11rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(var(--min-column-width), 1fr));
	grid-auto-flow: row dense;
}

	[ML_PageContainer_Type=EntityFields_ContainerGroup]:has(.EntityFields_ContainerGroup_Label) {
		margin-top: 50px;
		position: relative;
	}

	[ML_PageContainer_Type=EntityFields_ContainerGroup] .EntityFields_ContainerGroup_Label {
		position: absolute;
		color: var(--primary);
		top: -27px;
		left: 5px;
		transition: all ease-in-out 0.2s;
	}

	[ML_PageContainer_Type=EntityFields_ContainerGroup]:hover .EntityFields_ContainerGroup_Label {
		/*Paolo: un po' aggressivo 1.1*/
		scale: 1.05;
		font-weight: 600;
	}


	[ML_PageContainer_Type=EntityFields_ContainerGroup][ML_PageContainer_Pragma=ColumnsFixed] {
		--nr-columns: 1;
		grid-template-columns: repeat(var(--nr-columns), 1fr);
	}

		[ML_PageContainer_Type=EntityFields_ContainerGroup][ML_PageContainer_Pragma=ColumnsFixed][ML_PageContainer_Columns="1"] {
			--nr-columns: 1;
		}

		[ML_PageContainer_Type=EntityFields_ContainerGroup][ML_PageContainer_Pragma=ColumnsFixed][ML_PageContainer_Columns="2"] {
			--nr-columns: 2;
		}

		[ML_PageContainer_Type=EntityFields_ContainerGroup][ML_PageContainer_Pragma=ColumnsFixed][ML_PageContainer_Columns="3"] {
			--nr-columns: 3;
		}

		[ML_PageContainer_Type=EntityFields_ContainerGroup][ML_PageContainer_Pragma=ColumnsFixed][ML_PageContainer_Columns="4"] {
			--nr-columns: 4;
		}


	[ML_PageContainer_Type=EntityFields_ContainerGroup] [ML_PageControl_Key=EntityField_Container] {
		grid-column: span 2
	}

		[ML_PageContainer_Type=EntityFields_ContainerGroup] [ML_PageControl_Key=EntityField_Container].Half {
			grid-column: span 1
		}

		[ML_PageContainer_Type=EntityFields_ContainerGroup] [ML_PageControl_Key=EntityField_Container].Double {
			grid-column: span 4;
		}

		[ML_PageContainer_Type=EntityFields_ContainerGroup] [ML_PageControl_Key=EntityField_Container].Triple {
			grid-column: span 6;
		}

		[ML_PageContainer_Type=EntityFields_ContainerGroup] [ML_PageControl_Key=EntityField_Container].Full {
			grid-column: 1 / -1;
		}

.ML-FORMTABLE-Container {
	container-type: inline-size;
	container-name: small;
}

@container small (width < 480px) {
	.ML-FORMTABLE-Container [ML_PageContainer_Type=EntityFields_ContainerGroup] {
		grid-auto-flow: row;
	}
}



/*
	Contenitore colonna singola
*/

.SingleColumn_ExternalContainer {
	height: 100%;
	width: 100%;
	justify-content: center;
	display: flex;
	/*	overflow: auto;*/
}

.SingleColumn_Internal {
	width: 100%;
	margin: 24px;
	margin-right: 0px;
	padding-right: 24px;
	overflow-y: auto;
}

	.SingleColumn_Internal:has(> [ml_pagecontrol_type=GENERIC_BOX]) {
		max-width: 1440px;
	}

/*
	Contenitore due colonne vista normale 100% su una riga
*/


.TwoColumns_Container {
	display: flex;
	justify-content: center;
	height: 100%;
	width: 100%;
	overflow: auto;
	--right-width: min(75%,1150px);
}

	.TwoColumns_Container > div {
		width: 100%
	}

	.TwoColumns_Container .LeftContainer {
		display: flex;
		flex-direction: column;
		gap: 25px;
	}

		.TwoColumns_Container .LeftContainer > :not(:has(*)) {
			display: none;
		}

		.TwoColumns_Container .LeftContainer:has(.Card_Container) {
			max-width: unset;
		}

	.TwoColumns_Container .SideContainer {
		position: fixed;
		right: 0%;
		top: 0px;
		height: 100%;
		width: 100%;
		z-index: 10;
		box-shadow: -40px 0px 50px 0px rgba(0,0,0,0.1);
		display: none;
	}

		.TwoColumns_Container .SideContainer .Space {
			position: fixed;
			width: 100vw;
			height: 100dvh;
			background-color: var(--background-100);
			opacity: 0.8;
			cursor: pointer;
		}

		.TwoColumns_Container .SideContainer .Content {
			position: fixed;
			top: 0px;
			right: -100%;
			z-index: 12;
			background-color: var(--content-color);
			box-shadow: -40px 0px 50px 0px rgba(0,0,0,0.1);
			height: 100%;
			min-width: var(--right-width);
			overflow-y: auto;
			max-width: 85%;
		}

	.TwoColumns_Container .RightContainer .Content:has(+ .ContentTwin.TwinOpened) {
		min-width: unset;
		max-width: unset;
		width: 50%;
	}

	.TwoColumns_Container .RightContainer .ContentTwin {
		position: fixed;
		top: 0px;
		left: -100%;
		z-index: 12;
		background-color: var(--content-color);
		box-shadow: -40px 0px 50px 0px rgba(0,0,0,0.1);
		height: 100%;
		width: 50%;
	}

	.TwoColumns_Container .ExtraContainer {
		z-index: 11;
	}

.MainContainer > .TwoColumns_Container > .LeftContainer {
	margin: 24px;
	margin-right: 2px;
	padding-right: 22px;
	overflow-y: auto;
}

[ml_pagecontrol_key=Btn_BackHome],
[ml_pagecontrol_key=Btn_BackWizard] {
	margin-right: auto;
}

/*--------------------------- Media Queries ----------------------------------- */
/*
	Da 1440 in giù
	@media only screen and (max-width: 1440px)

	Da 1250 in giù
	@media only screen and (max-width: 1250px)

	Da 1140 in giù
	@media only screen and (max-width: 1140px)

	Da 1024 in giù
	@media only screen and (max-width: 1024px)

	Da 900 in giù
	@media only screen and (max-width: 900px)

	Da 768 in giù
	@media only screen and (max-width: 768px)
*/
/*------------------------------------------------------------------------------- */
/* Da 1440 in giù*/
@media only screen and (max-width: 1440px) {
}

/* Da 1250 in giù*/
@media only screen and (max-width: 1250px) {

	.TwoColumns_Container {
		height: unset;
		/*il male sulla terra rappresentato in una riga*/
		/*		flex-direction: column;*/
		justify-content: flex-start;
		/*		--right-width: min(90%,1150px);*/
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 {
		gap: 0px;
	}

	.TwoColumns_Container {
		--right-width: 80%;
	}

	.Header_Top .MenuLev1 .WebsiteSelector .WebsiteSelector_Selected > * {
		max-width: 260px;
	}
}

/* Da 1140 in giù*/
@media only screen and (max-width: 1140px) {

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 .MenuLev2_Item {
		font-size: 14px;
	}

	.MenuContainer, .Header_Middle:has( .MenuLev2_Item ) {
		gap: 0px;
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 {
		padding-inline: 10px;
	}
}


/* Da 1024 in giù*/
@media only screen and (max-width: 1024px) {

	.Header_Top [ML_PageControl_Key=Logo] {
		display: none;
	}

	.Header_Top .MenuLev1 {
		justify-content: center
	}

		.Header_Top .MenuLev1 [ml_pagecontrol_key=Btn_CookiePedia] span:not([ML_PageControl_Type=Icon]) {
			display: none;
		}

	.Header_Middle .MenuLev2 {
		gap: 2px;
	}

	.MainContent .MainContainer_External {
		grid-area: MainContainer_External;
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: calc(100% - 43px) 43px;
		grid-template-areas: "MainContainer" "Menu_Lev3";
	}

		.MainContent .MainContainer_External:not(:has(.MenuLev3_Container > div > div)) {
			grid-template-rows: 100%;
			grid-template-areas: "MainContainer";
		}

		.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3:has(div) {
			position: fixed;
			bottom: 0;
			left: 0;
			display: flex;
			width: 100%;
			justify-content: center;
			flex-direction: row;
			padding: 5px 0 0;
			background-color: var(--background);
			border-top: 1px solid var(--border-color);
			z-index: 1;
		}

		.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3 .MenuLev3_Item {
			border: 1px solid var(--trasparent);
			border-bottom-width: 0;
			border-top-left-radius: 25px;
			border-bottom-right-radius: 0;
			display: flex;
			align-items: center;
		}

			.MainContent .MainContainer_External .MenuLev3_Container .MenuLev3 .MenuLev3_Item span:not([ML_PageControl_Type=Icon]) {
				display: none;
			}

		.MainContent .MainContainer_External .MainContainer {
			height: 100%;
		}

	.MainSide_Top_Top {
		grid-template-columns: 55px auto fit-content(40%);
		grid-template-areas: "MainSide_Top_Top_Burger MainSide_Top_Top_CurrentPage MainSide_Top_Top_Icons";
	}

	.MainSide_Top_Top_Logo {
		display: none;
	}

	[ML_PageControl_Type=PageSubTitle] {
		display: none;
	}

	.TwoColumns_Internal {
		overflow-y: initial;
	}

	/* rendo visibile il tasto chiudi dettaglio nel form*/
	.TwoColumns_Container .Button[ML_PageControl_Attributes=FormCommand][ML_PageControl_Key=CommandClose] {
		display: inline-flex;
	}

	.TwoColumns_Internal[ML_PageControl_Key=LeftContainer] {
		width: 100%;
		max-width: unset;
	}

	.TwoColumns_Container {
		--right-width: 90%;
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 {
		padding-right: 0px;
	}

	.Header_Middle .Command_Middle > .ActionsContainer {
		padding-left: 5px;
		gap: 5px;
	}
}


/* Da 900 in giù*/
@media only screen and (max-width: 900px) {

	.Header_Middle .MenuLev2 .MenuLev2_Item [ML_PageControl_Type=Icon] {
		display: block;
	}

	.Header_Middle .MenuLev2 .MenuLev2_Item [ml_pagecontrol_resource_key] {
		display: none;
	}

	:is(.Header_Middle, .MenuContainer ) .MenuLev2 {
		gap: 8px;
	}

	.TwoColumns_Container {
		--right-width: 100%;
	}
}

/* Da 768 in giù*/
@media only screen and (max-width: 768px) {

	.ExtraContainer {
		width: 100%;
		min-width: unset;
	}

	.TwoColumns_Container .RightContainer .RightContainer_Content {
		width: 100%
	}
}