@charset "utf-8";
/* CSS Document */

/*
//
// SPHP Librairies
// Author: Sebastien Sauvage
// Web: http://www.sebsauvage.com
// Contact: sphp@sebsauvage.com
// 2010-today
//
// NB: calc (var(--xxx) + 2px) -> with space around + because - can be part of CSS names
// CSS border enables 1px dotted lines, whereas width=1px does enable that easily.
*/

.SForm_S_ERRORS				{ background-color:red; color:white; }
.SForm_S_ERRORS .Sblue		{ color:lightblue; }
.SForm_S_WARNINGS			{ background-color:teal; color:white; }
.SForm_S_SUCCESSES			{ background-color:DarkGreen; color:white; }
.SForm_S_SUCCESSES .Sblue	{ color:lightblue; }
.SForm_S_TECHNICALS			{ background-color:darkgray; color:white; } /*{ font-size:x-small;color:gray; }*/

/* #SJQUIDialog */
.ui-dialog.SForm_S_ERRORS 		{ color: black; background-color:white; }
.ui-dialog.SForm_S_WARNINGS		{ color: black; background-color:white; }
.ui-dialog.SForm_S_SUCCESSES 	{ color: black; background-color:white; }
.ui-dialog.SForm_S_TECHNICALS 	{ color: black; background-color:white; }

.ui-dialog.SForm_S_ERRORS .ui-widget-header		{ color: white; background-color:red; background-image: none; }
.ui-dialog.SForm_S_WARNINGS	.ui-widget-header	{ color: white; background-color:teal; background-image: none; }
.ui-dialog.SForm_S_SUCCESSES .ui-widget-header	{ color: white; background-color:DarkGreen; background-image: none; }
.ui-dialog.SForm_S_TECHNICALS .ui-widget-header	{ color: white; background-color:darkgray; background-image: none; }



.Sstrong	{ font-weight:bolder; }
.Ssmall		{ font-size:smaller; }
.Sred		{ color:red; }
.Sgreen		{ color:green; }
.Sblue		{ color:blue; }
.Sgray		{ color:gray; }
.Ssilver	{ color:silver; }

.Stt
{
	font-family:'Courier New', Courier, monospace; /*"Lucida Console", Monaco, monospace*/
}

/* for DataTables dom */
.Sfloatleft		{ float:left; }
.Sfloatright	{ float: right; }
.Sfloatnone		{ float: none; }
.Sclearleft		{ clear: left; }
.Sclearright	{ clear: right; }
.Sclearboth		{ clear: both;}

#SJQUIDialogERROR		{	display: none; }
#SJQUIDialogWARNING 	{	display: none; }
#SJQUIDialogSUCCESS		{	display: none; }
#SJQUIDialogTECHNICAL	{	display: none; }

.SHTMLMenu_TOC
{
	font-size:smaller;
}

.SHTMLMenu_Title
{
	display: none;
}

.SHTMLMenu_SubTitle
{
	font-size:xx-small;
}

.SHTMLMenu_Switch
{
	float: right;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
	margin-bottom: 0px;
	border: 0px;
	padding: 0px;
}

.SHTMLMenu_Switch_TAB
{
}

.SHTMLMenu_Switch_TOC
{
}

.SHTMLMenu_ToMenu
{
	font-size:50%;
}

/* HTML Switch buttons*/
.SHTMLMenu_Switch, .SHTMLMenu_Switch input
{
	font-size: xx-small;
	padding:0px;
	margin-top:0.25em;
}

/*

 SPHP Progress Bar

*/


.SHTMLCSSProgressBarBack
{ 
	background-color: gray;
	border: 1px solid black;
	position:relative;
}

.SHTMLCSSProgressBarText
{ 
	color: white;
	position:absolute;
	top:0;
	left:0;
}


/*
	STables	
*/

table.STable
{
	border: 1px solid black;
	border-collapse: collapse; /* Colle les bordures entre elles */
	margin-left:0px;
	margin-right:0px;
}
table.STable caption/* Titre du tableau */
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: larger;
	color: white;
	background-color: #404040;
	font-weight: bold;
	padding: 0.25em 0em;
	border-width: 1px 1px 0px;
	border-style: solid;
	border-color: black;
}
table.STable th /* Les cellules d'en-tête */
{
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	color: white;
	background-color: darkblue;
	font-weight: bold;
	padding: 0.2em 0.5em;
	border: 1px solid white;
}
table.STable td 
{	
	text-align: center; /* Tous les textes des cellules seront centrés*/
	border: 1px solid black;
	/*font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;*/
	padding: 5px 0px 5px 0px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}


/*
	TabbedPanels
*/


.TabbedPanelsTab {
	background-color: #e4dbae;/*#AFE4E4;*/ /* #DDD; */	/*color: added*/
}
.TabbedPanelsTabHover {
	background-color: #f8f6ec; /* #EAF8F8 #AFE4E3; /* #CCC; */
}
.TabbedPanelsTabSelected {
	background-color: #f8f6ec; /* #EAF8F8 #EEE; */
}
.TabbedPanelsContentGroup {
	background-color: #f8f6ec; /* #EAF8F8 #EEE; */
}
.VTabbedPanels .TabbedPanelsTabGroup {
	background-color: #f8f6ec; /* #EAF8F8 #EEE; */
}
.VTabbedPanels .TabbedPanelsTabSelected {
	background-color: #f8f6ec; /* #EAF8F8 #EEE; */
}


/***************************************************
	SCalendar V=Vertical, H=Horizontal
****************************************************/

:root {
	--SCDayHeight:			18px;	/* 18px */
		--SCDayWeekNumberWidth:	24px;
		--SCDayNameWidth:		18px;
		--SCDayNumberWidth:		36px;
	--SCDay24Width:			160px;
	--SCDay24VHeightFactor:	0.5;

	--SCColor: 				#0F420F;	/* rather dark tone */
	--SCColorHolidays:		#135313;
	--SCColorHolidaysLight:	#1e881e;	
	--SCColorSunday:		#26ab26;
	--SCColorSundayLight:	#3ed33e;
	--SCColorDay:			#b9efb9;	/* S32 M 23 */
	--SCColorDay24:			#caf3ca;	/* 00:00-07:00-21:00-23:59 */

	--SCColorGray:				#282828;
	--SCColorHolidaysGray:		#333333;
	--SCColorHolidaysLightGray:	#545454;
	--SCColorSundayGray:		#686868;
	--SCColorSundayLightGray:	#898989;
	--SCColorDayGray:			#d3d3d3;
	--SCColorDay24Gray:			#eaeaea;
}

/* General style of SCV=SCalendarVertical*/

/* Classes and attributes
With SCDisabled class, one can gray out parts of the calendar but only when applied to atomic SCDayPeriodNum0,1,2... it prevents user selection

SCalendar SCHorizontal SCVerticalDay
SCVMonthWrapper
	SCVMonth
		SCVMonthTitle
		SCVHLine
		SCDay SCVMonthSubTitles
			SCDayTitle
			SCVVLine 
			SCDay24
			SCVVLine SCVVLineThick
			SCDay24
		SCVHLine
		SCVHLineThick
		SCVHLine
		SCDay  SCDayWeekEnd SCDayHolidays SCDisabled    data-SCDayNumber='0'
			SCDayTitle   SCDisabled
				SCDayWeekNumber
				SCDayName
				SCDayNumber
			SCVVLine
			SCDay24 SCDaySub0   SCDisabled
				SCDayPeriodClass SCDayPeriodNum0 SCDayPeriodK168 SCDisabled    id='SCAL_251101_0_0'	// 00:00-07:00
				SCVVLineDotted
				SCDayPeriodClass SCDayPeriodNum1 SCDisabled id=...
					SCDayPeriodText 		// Noel
				SCVVLineDotted
				SCDayPeriodClass SCDayPeriodNum2 SCDisabled id=...
			SCVVLine SCVVLineThick
			SCDay24' SCDaySub1
				...
			SCVVLine
			SCDay24' SCDaySub2
				...
			...
*/
.SCalendar, .SCVerticalDay, .SCHorizontal
	.SCVMonthWrapper,
		.SCVMonth,
			.SCVMonthTitle,
			.SCVHLine,
			/*.SCDay, */  .SCVMonthSubTitles, 
				.SCDayTitle,
				.SCVVLine, .SCVVLineThick
				.SCDay24,
				.SCVVLine,
				.SCDay24,
			.SCVHLine,
			.SCVHLineThick,
			.SCVHLine,
			.SCDay, 				.SCDayWeekEnd, .SCDayHolidays, .SCDisabled,
				.SCDayTitle, 		.SCDisabled,
					.SCDayWeekNumber,
					.SCDayName,
					.SCDayNumber,
				.SCVVLine,
				.SCDay24,		.SCDisabled,
					.SCDayPeriodClass, .SCDayPeriodNum0,		.SCDisabled,
					.SCVVLineDotted,
					.SCDayPeriodClass, .SCDayPeriodNum1,		.SCDisabled,
						.SCDayPeriodText,
					.SCVVLineDotted,	.SCDisabled,
					.SCDayPeriodClass, .SCDayPeriodNum2
{
	border: 0px solid magenta;
	padding: 0px;
	margin: 0px;
	font-size: 16px;
	font-family: Arial, sans-serif;
}


/* Specifics style for SCalendar */
.SCalendar
{
	overflow: auto;
}

	.SCVVLine	/* to draw a vertical solid line */
	{
		display: inline-block;
		height: 100%;
		width: 1px;
		background-color: black;
	}
	.SCVVLineThick	/* to draw a vertical solid line */
	{
		display: inline-block;
		border-top: solid white 1px;
		border-bottom: solid white 1px;
		height: 100%;
		width: 4px;
		background-color: white;
	}
	.SCVVLineDotted	/* to draw a vertical dotted line */
	{
		display: inline-block;
		border-left: 2px dotted gray; /*gray*/
		height: 100%;
		/*background-color: #00000000;*/
	}
	.SCWeekDay0	.SCVVLineDotted	{ background-color: var(--SCColorSundayLight);		}	
	.SCDayHolidays	.SCVVLineDotted	{ background-color: var(--SCColorHolidaysLight);	}
	
	.SCVHLine	/* to draw a vertical solid line */
	{
		display: block;
		border-top: gray solid 1px; /*gray*/
		width: 100%;
	}
	.SCVHLineThick	/* to draw a vertical solid line */
	{
		display:block;
		border-top: white solid 4px; /*gray*/
		width: 100%;
	}

.SCVMonthWrapper
{
	display: inline-block;
}
.SCVMonth
{
	display: inline-block;	/* inline-block for the Month to be displayed from left to right */
	vertical-align: top;	/* because months have different heights */
	margin: 0px 12px 12px 0px;	/* to separate a month from the next one */
/*border: solid black;*/
/*border-width: 1px 1px 1px 1px;*/
}

	/*
		Month Title line
	*/
	.SCVMonthTitle
	{
		display: flex;	/* so will take the full width */
		justify-content: center;	/* Horizontally */
		align-items: center;		/* Vertically */
		
		height: calc(1.5*var(--SCDayHeight));
		color: white;
		background-color: var(--SCColor);
		font-size: larger;
		font-weight: bold;
		text-transform: uppercase;
		border: black solid 1px;
	}
	

	/*
		Generic Day line
	*/
	.SCDay
	{
		display: flex;	/* so will take the full width */
		background-color: magenta;
		height: var(--SCDayHeight);
	}
	
	/*
		Month Subtitle line
	*/
	.SCVMonthSubTitles
	{
		display: flex;
		background-color: black;
		color: white;
		font-weight: bold;
		height: var(--SCDayHeight);
	}
	.SCVMonthSubTitles .SCDayTitle
	{
		background-color: var(--SCColorGray);
	}
	.SCVMonthSubTitles .SCVVLine
	{
		background-color: gray;	
	}
	.SCVMonthSubTitles .SCDay24
	{	
		background-color: transparent;	/* color is given by .SCVMonthSubTitles */
		color: white;
		font-weight: bold;
		align-self: center;
		justify-content: center;	/* Horizontally */
		align-items:stretch;		/* Vertically */
		overflow: visible;
	}
	
	.SCVMonthSep
	{
		display: flex;
		background-color: white;
		height: 4px;
	}
	.SCVMonthSep .SCDayTitle
	{
		background-color: white;
	}
	.SCVMonthSep .SCVVLine
	{
		background-color: white;	
	}
	.SCVMonthSep .SCDay24
	{	
		background-color: transparent;
		color: white;
		font-weight: bold;
		align-self: center;
		justify-content: center;	/* Horizontally */
		align-items:stretch;		/* Vertically */
		overflow: visible;
	}
	
	/*				
		Day line specifics
	*/
	.SCDayTitle
	{
		display: inline-flex;	/* so will take the full width */
		flex-flow: row nowrap;
		justify-content: center;	/* Horizontally */
		align-items:stretch;		/* Vertically */
		width: calc(var(--SCDayWeekNumberWidth) + var(--SCDayNameWidth) + var(--SCDayNumberWidth));	/* in case the block is empty */
		padding: 0;
		background-color: var(--SCColorDay); /*#D8F9D8;*/
	}
			.SCDayWeekNumber
			{
				display: inline-block;
				width: var(--SCDayWeekNumberWidth);
				padding: 0px 0px 0px 2px;
				font-size: x-small;
				text-align: left;
			}
			.SCDayName
			{
				display: inline-block;
				width: var(--SCDayNameWidth);
				text-align: center;
			}
			.SCDayNumber
			{
				display: inline-block;
				width: var(--SCDayNumberWidth);
				text-align: center;
			}
	
	.SCDay24
	{
		position: relative;
		display: inline-flex;	/* so will take the full width */
		flex-flow: row nowrap;
		justify-content: flex-start;	/* Horizontally */
		align-items: flex-start;		/* Vertically */
		text-align: center;
		background-color: var(--SCColorDay24);	/*#D8F9D8;*/
		width: var(--SCDay24Width);
		overflow: hidden;
		white-space: nowrap;	/* to display on a single line, without ~carriage return */
		
		user-select: none;       /* Standard syntax */
	    -webkit-user-select: none; /* Safari */
    	-moz-user-select: none;    /* Firefox */
    	-ms-user-select: none;     /* IE/Edge */
	}
		.SCDayPeriodText
		{
			display: inline-flex;
			justify-content: center;	/* Horizontally */
			align-items:flex-end;		/* Vertically */
			align-self: flex-end;		/* The height is limited to the font height*/
			color: black;
			background-color: transparent;
			overflow: visible;
			white-space: nowrap;	/* to display on a single line, without ~carriage return */
			font-size: calc(var(--SCDayHeight) / 2);

		}
		.SCDayPeriodClass
		{
			display: flex;
			justify-content: center;	/* Horizontally */
			align-self: center;			/* Vertically */
			height: calc(var(--SCDayHeight) - 4px);	/* space around - is important */
			border: 2px solid var(--SCColorDay);
			overflow: visible;
			white-space: nowrap;	/* to display on a single line, without ~carriage return */			
		}
		.SCDayPeriodNum0	{	width: 29%; 	/* 7/24=0.2916... */	}
		.SCDayPeriodNum1	{	width: 58%;		/* 14/24=0.583... */	}
		.SCDayPeriodNum2	{	width: 13%;		/* 3/24=0.125 */		}
	
		/* img */
		.SCDayPeriodClass img
		{
			position:absolute;
			display: block;
			top: 0;
		}
		.SCDayPeriodNum0 img	{	width: 18px;	}
		.SCDayPeriodNum1 img	{	width: 18px;	}
		.SCDayPeriodNum2 img	{	width: 18px;	}

		/*
			Sunday
		*/
		.SCWeekDay0	/* stays after previous definition SCVDayXXX to be higher priority */
		{
			color: white;
			background-color: var(--SCColorSunday);	/*#8FED8F;*/
			font-weight: bold;
		}
		.SCWeekDay0 .SCDayTitle
		{
			background-color: var(--SCColorSunday);
		}
		.SCWeekDay0 .SCDayPeriodClass
		{
			color: magenta;
			background-color: var(--SCColorSundayLight);	/*#8FED8F;*/
			border-color: var(--SCColorSundayLight);	/*#8FED8F;*/
			font-weight: bold;
		}

		/*
			Holidays
		*/
		.SCDayHolidays
		{
			background-color: var(--SCColorHolidays);
		}
		.SCDayHolidays .SCDayTitle
		{
			background-color: var(--SCColorHolidays);
		}
		.SCDayHolidays .SCDayWeekNumber,
		.SCDayHolidays .SCDayName,
		.SCDayHolidays .SCDayNumber
		{
			color: white;
			background-color: var(--SCColorHolidays);
			font-weight: bold;
		}
		.SCDayHolidays .SCDayPeriodClass
		{
			color: white;
			background-color: var(--SCColorHolidaysLight);
			border-color: var(--SCColorHolidaysLight);
			font-weight: bold;
		}
		.SCDayHolidays .SCDayPeriodText
		{
			color: white;
		}
	
	
/*
	Disabled
	One can disable Month, Day, Title, Day24 and down to Period
*/
	
/* SCDisabled: no style perse, only defined when associated with another class */
.SCDisabled
{
	/*background-color: var(--SCColorDayGray);*/ /*#CBCBCB;*/
}
	
/* SCVMonthTitle style */
.SCDisabled .SCVMonthTitle,
.SCDisabled.SCVMonthTitle
{
	background-color: var(--SCColorGray);
}

/* SCVMonthSubTitles style */
	
.SCDisabled .SCVMonthSubTitles,
.SCDisabled.SCVMonthSubTitles,
.SCVMonthSubTitles .SCDisabled
{
	background-color: red;
}

.SCDisabled .SCVMonthSubTitles .SCDayTitle,
.SCDisabled.SCVMonthSubTitles .SCDayTitle,
.SCVMonthSubTitles .SCDisabled.SCDayTitle
{
	background-color: var(--SCColorGray);
}
	
.SCDisabled .SCVMonthSubTitles .SCDay24,
.SCDisabled.SCVMonthSubTitles .SCDay24,
.SCVMonthSubTitles .SCDisabled .SCDay24,
.SCVMonthSubTitles .SCDisabled.SCDay24
{
	color: white;
	background-color: black;
}
	
/* SCDay, SCDay24, SCDayTitle style */
.SCDisabled .SCDay,
.SCDisabled.SCDay,
.SCDay .SCDisabled ,
.SCDisabled .SCDay24,
.SCDisabled.SCDay24,
.SCDay24 .SCDisabled,
.SCDisabled .SCDayTitle,
.SCDisabled.SCDayTitle,
.SCDayTitle .SCDisabled
{
	color: black;
	background-color: var(--SCColorDay24Gray); /*#ECECEC;*/
}
	
/* SCDayPeriodClass style */
.SCDisabled + .SCDayPeriodClass,
.SCDisabled .SCDayPeriodClass,
.SCDisabled.SCDayPeriodClass
{
	background-color: var(--SCColorDay24Gray);
	border: 2px solid var(--SCColorDay24Gray);
}
	
/* SCVVLineDotted style */
.SCDisabled + .SCVVLineDotted,
.SCDisabled .SCVVLineDotted
{
	background-color: var(--SCColorDay24Gray);
}
	
/* Sunday: DayTitle style */
.SCDisabled .SCWeekDay0 .SCDayWeekNumber,
.SCDisabled .SCWeekDay0 .SCDayName,
.SCDisabled .SCWeekDay0 .SCDayNumber,
.SCDisabled .SCWeekDay0 .SCDayTitle,
.SCDisabled.SCWeekDay0 .SCDayWeekNumber,
.SCDisabled.SCWeekDay0 .SCDayName,
.SCDisabled.SCWeekDay0 .SCDayNumber,
.SCDisabled.SCWeekDay0 .SCDayTitle,
.SCWeekDay0 .SCDisabled .SCDayWeekNumber,
.SCWeekDay0 .SCDisabled .SCDayName,
.SCWeekDay0 .SCDisabled .SCDayNumber,
.SCWeekDay0 .SCDisabled .SCDayTitle,
.SCWeekDay0 .SCDisabled.SCDayWeekNumber,
.SCWeekDay0 .SCDisabled.SCDayName,
.SCWeekDay0 .SCDisabled.SCDayNumber,
.SCWeekDay0 .SCDisabled.SCDayTitle
{
	color: white;
	background-color: var(--SCColorSundayGray);	/*#4F4F4F;*/
	font-weight: bold;
}
/* Sunday: Period style */
.SCDisabled .SCWeekDay0 .SCDayPeriodClass,
.SCDisabled.SCWeekDay0 .SCDayPeriodClass,
.SCWeekDay0 .SCDisabled .SCDayPeriodClass,
.SCWeekDay0 .SCDisabled.SCDayPeriodClass
{
	color: white;
	background-color: var(--SCColorSundayLightGray);	/*#4F4F4F;*/
	border: 2px solid var(--SCColorSundayLightGray);
	font-weight: bold;
}
	
/* Sunday: LineDotted style at the right of each Period*/
.SCWeekDay0	.SCDisabled +	.SCVVLineDotted	{ background-color: var(--SCColorSundayGray);	}
.SCWeekDay0	.SCDisabled 		.SCVVLineDotted	{ background-color: var(--SCColorSundayGray);	}
.SCWeekDay0.SCDisabled 			.SCVVLineDotted	{ background-color: var(--SCColorSundayGray);	}
.SCDisabled	.SCWeekDay0		.SCVVLineDotted	{ background-color: var(--SCColorSundayGray);	}

/* Holidays: DayTitle style */
.SCDisabled .SCDayHolidays .SCDayWeekNumber,
.SCDisabled .SCDayHolidays .SCDayName,
.SCDisabled .SCDayHolidays .SCDayNumber,
.SCDisabled .SCDayHolidays .SCDayTitle,
.SCDisabled.SCDayHolidays .SCDayWeekNumber,
.SCDisabled.SCDayHolidays .SCDayName,
.SCDisabled.SCDayHolidays .SCDayNumber,
.SCDisabled.SCDayHolidays .SCDayTitle,
.SCDayHolidays .SCDisabled .SCDayWeekNumber,
.SCDayHolidays .SCDisabled .SCDayName,
.SCDayHolidays .SCDisabled .SCDayNumber,
.SCDayHolidays .SCDisabled .SCDayTitle,
.SCDayHolidays .SCDisabled.SCDayWeekNumber,
.SCDayHolidays .SCDisabled.SCDayName,
.SCDayHolidays .SCDisabled.SCDayNumber,
.SCDayHolidays .SCDisabled.SCDayTitle
{
	color: white;
	background-color: var(--SCColorHolidaysGray);	/*#4F4F4F;*/
	font-weight: bold;
}
/* Holidays: Period style */
.SCDisabled .SCDayHolidays .SCDayPeriodClass,
.SCDisabled.SCDayHolidays .SCDayPeriodClass,
.SCDayHolidays .SCDisabled .SCDayPeriodClass,
.SCDayHolidays .SCDisabled.SCDayPeriodClass
{
	color: white;
	background-color: var(--SCColorHolidaysLightGray);	/*#4F4F4F;*/
	border: 2px solid var(--SCColorHolidaysLightGray);
	font-weight: bold;
}

/* Holidays: LineDotted style */
.SCDayHolidays	.SCDisabled +	.SCVVLineDotted,
.SCDayHolidays	.SCDisabled		.SCVVLineDotted,
.SCDayHolidays.SCDisabled		.SCVVLineDotted,
.SCDisabled	.SCDayHolidays		.SCVVLineDotted
{
	background-color: var(--SCColorHolidaysLightGray);
}

	
	.SCVMonthWrapper.SCHidden,
	.SCDay.SCHidden,
	.SCDay.SCHidden + .SCVHLine
	{
		display: none;
	}
	
/*
	Mode NORMAL
*/
.SCDayPeriodClass.SCDayUP	/* without .SCDayPeriodClass, red is overtaken by ".SCWeekDay0 .SCDayPeriodClass" */
{	background-color: red;	}
	
.SCDisabled .SCDayPeriodClass.SCDayUP,
.SCDayPeriodClass.SCDayUP.SCDisabled
{	background-color: #FF8080/* ~lightred */; }	

/*
	Mode STOP
*/
.SCDayPeriodClass.SCDayDOWN
{	
	background-image: repeating-linear-gradient(-45deg, white, white 1px, black 2px, black 4px);
}
.SCDayPeriodClass.SCDayDOWN .SCDayPeriodText
{	
	background: black;
}
	
.SCDisabled .SCDayPeriodClass.SCDayDOWN,
.SCDayPeriodClass.SCDayDOWN.SCDisabled
{	background-image: repeating-linear-gradient(-45deg, white, white 1px, gray 2px, gray 4px);	}
	
/*
	Highlight
*/
.SCDayPeriodHighlight,
.SCDayHolidays .SCDayPeriodHighlight,
.SCWeekDay0 .SCDayPeriodHighlight
{
	border: 2px solid black;
}

/* Specifics style for SCHorizontal */

	.SCHorizontal .SCVVLine	/* to draw a vertical solid line */
	{
background-color: gray;
display: /*inline-*/block;
height: 1px/*100%*/;
width: 100%/*1px*/;
	}
	.SCHorizontal .SCVVLineThick	/* to draw a vertical solid line */
	{
display: block;
border-top: none;
border-bottom: none;

height: 8px;
width: 100%;
	}	
	.SCHorizontal .SCVHLine	/* to draw a vertical solid line */
	{
display: inline-block;
border-top: initial;
border-left/*-top*/: none;
width: 0px;
	
	}
	.SCHorizontal .SCVHLineThick	/* to draw a vertical solid line */
	{
display: inline-block;
border-top: initial;
border-left/*-top*/: 4px solid white;
width: 0px;
	}
	.SCHorizontal .SCVVLineDotted
	{
border-left-width: 1px;/*instead of 2px*/
	}
.SCHorizontal .SCVMonthWrapper
{
	display: block;
}
.SCHorizontal .SCVMonth
{
display: inline-flex;
background-color: var(--SCColor);
}

	/*
		Month Title line
	*/
	.SCHorizontal .SCVMonthTitle
	{
height: var(--SCDayHeight); /* width when rotated, initially calc(1.5*var(--SCDayHeight));*/
width: 108px/*var(--SCDay24Width)*/;	/* height when rotated*/
align-self: center;
/*transform: rotate(270deg);*/
/*white-space: normal;
overflow: hidden;*/
text-overflow: ellipsis;
border: none;
	}

	
	/*
		Generic Day line
	*/
	.SCHorizontal .SCDay
	{
height: initial;	/* var(--SCDayHeight); */
display: inline-block/*flex*/;	/* so will take the full width */
	}

	
	/*
		Month Subtitle line
	*/
	.SCHorizontal .SCVMonthSubTitles
	{
display: inline-block/*flex*/;

	}
	.SCHorizontal .SCVMonthSubTitles .SCDayTitle
	{
display: block;
height: var(--SCDayHeight);
		border-left: 1px blue solid;
		
	}
	.SCHorizontal .SCVMonthSubTitles .SCVVLine
	{
display: block;
	}
	.SCHorizontal .SCVMonthSubTitles .SCDay24
	{
justify-content: center;	/* Horizontally */
align-self: initial; /* center; */
align-items: initial; /* stretch; Vertically */
overflow: initial; /* visible; */
background-color: black;	/* transparent; color is given by .SCVMonthSubTitles */
width: var(--SCDay24Width);		
	}

	.SCHorizontal .SCVMonthSep
	{
		display: flex;
		flex-direction: column;
		background-color: white;
		width: 4px;
	}
	.SCHorizontal .SCVMonthSep .SCDayTitle
	{
		background-color: white;
		border-right: none;
	}
	.SCHorizontal .SCVMonthSep .SCVVLine
	{
		background-color: white;
	}
	.SCHorizontal .SCVMonthSep .SCDay24
	{	
		background-color: transparent;
		color: white;
		font-weight: bold;
		align-self:stretch;
align-items: center;		/* Vertically */
		overflow: visible;
	}
	
	/*				
		Day line specifics
	*/
	.SCHorizontal .SCDayTitle
	{
display: flex;	/* so will take the full width */
align-self: center;
width:initial;/*width: calc(var(--SCDayWeekNumberWidth) + var(--SCDayNameWidth) + var(--SCDayNumberWidth));*/	/* in case the block is empty */
height: var(--SCDayHeight);
border-right: 1px gray solid;
	}
	.SCHorizontal .SCDay24
	{
width: cal(var(--SCDay24Width) * var(--SCDay24VHeightFactor));
display: flex;	/* so will take the full width */
height: var(--SCDayHeight);
overflow: initial;
white-space: initial;
border-right: 1px gray solid;
	}

		.SCHorizontal .SCDayPeriodText
		{
background-color: initial;
overflow: initial;
white-space: initial;			
		}
		.SCHorizontal .SCDayPeriodClass
		{
overflow: initial;
white-space: initial;
border-width: 1px;
height: calc(var(--SCDayHeight) - 2px);	/* space around - is important */			
		}

.SCVerticalDay .SCVVLine	/* to draw a vertical solid line */
	{
height: calc(var(--SCDay24Width) * var(--SCDay24VHeightFactor));
	}
.SCVerticalDay .SCVVLineDotted	/* to draw a vertical dotted line */
	{
display: block;
/*border-left: 2px dotted gray;*/border-left: initial;
border-top: 2px dotted gray;
height: initial;
/*height: 100%;*/height:initial;		
width: 100%;
	}
.SCVerticalDay .SCDay
	{
/*height: var(--SCDayHeight);*/height: initial;
	}
.SCVerticalDay .SCVMonthSubTitles
	{
/*height: var(--SCDayHeight);*/height: initial;
background-color: black;
	}
.SCVerticalDay .SCVMonthSubTitles .SCVVLine	/* to draw a vertical solid line */
	{
height: calc(var(--SCDay24Width)/* * var(--SCDay24VHeightFactor)*/);
	}	
.SCVerticalDay .SCVMonthSubTitles .SCDay24
	{	
background-color: transparent;	/* color is given by .SCVMonthSubTitles */
display: flex;
align-self: center;
justify-content: center;
align-items: center;	
transform: rotate(270deg);
height: var(--SCDayHeight);	/* Largeur apres la rotation */
	}
.SCVerticalDay .SCDayTitle
	{
display: flex;
	}
	.SCVerticalDay .SCDayWeekNumber
			{
padding: calc((var(--SCDay24Width) * var(--SCDay24VHeightFactor) - 20px) / 2) 0;
			}
	.SCVerticalDay .SCDayName
			{
padding: calc((var(--SCDay24Width) * var(--SCDay24VHeightFactor) - 20px) / 2) 0;
			}
	.SCVerticalDay .SCDayNumber
			{
padding: calc((var(--SCDay24Width) * var(--SCDay24VHeightFactor) - 20px) / 2) 0;				
			}
.SCVerticalDay .SCDay24
	{
display: flex;
flex-flow: column nowrap;
/*width: var(--SCDay24Width);*/width: initial;
height: calc(var(--SCDay24Width) * var(--SCDay24VHeightFactor));
width: var(--SCDayHeight);
	}
.SCVerticalDay .SCDayPeriodText
		{	
align-self: center;		/* The height is limited to the font height*/
font-size: calc(var(--SCDayHeight) * var(--SCDay24VHeightFactor) * 0.75);
transform: rotate(270deg);
		}	
.SCVerticalDay .SCDayPeriodClass
		{
flex-direction: column;
/*height: calc(var(--SCDayHeight) - 4px);*/ height: initial;/* space around - is important */
width: calc(var(--SCDayHeight) - 4px);
		}
.SCVerticalDay .SCDayPeriodNum0	{	height: 29%; 	/* 7/24=0.2916... */	}
.SCVerticalDay .SCDayPeriodNum1	{	height: 58%;	/* 14/24=0.583... */	}
.SCVerticalDay .SCDayPeriodNum2	{	height: 13%;	/* 3/24=0.125 */		}
	
		/* img */
.SCVerticalDay .SCDayPeriodClass img
		{
/*top: 0;*/top: initial;
left: 0;
		}
.SCVerticalDay .SCDayPeriodNum0 img	{	width: initial; height: 18px;	}
.SCVerticalDay .SCDayPeriodNum1 img	{	width: initial; height: 18px;	}
.SCVerticalDay .SCDayPeriodNum2 img	{	width: initial; height: 18px;	}
	

/***********************
	Data Tables
************************/

.dataTables_wrapper	{ margin-left:15px; margin-right:15px;font-size:small;font-family: Arial, Helvetica, sans-serif;}
.dataTables_wrapper .dataTables_filter 	{ padding:0px 4px 0px 0px; float:left; clear:none; text-align:left;}
.dataTables_wrapper .dataTables_info	{ padding:3px 0px 3px 0em; float:left; clear:none; } 
.dataTables_wrapper .dataTables_length 	{ padding:0px; float:left; clear:left; }
.dataTables_wrapper .dt-buttons	 		{ float:right; }
.dataTables_wrapper .dt-button	 		{ }
.dataTables_wrapper .ui-button 			{ padding: 1px 1px; } 	/* Taille des boutons des dataTables() */
.dataTables_wrapper .ui-button-text		{ color: black; padding-top: 3px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; 		 font-size: smaller; font-weight: bold;}
.dataTables_wrapper .dt-button-collection { }
.dataTables_wrapper .buttons-columnVisibility { background: #e6e6e6; border-color: #d3d3d3;} 


.dataTables_wrapper .fg-toolbar	 		{ padding: 4px 4px;}

.dataTables_wrapper table caption 		{ padding: 4px; background:black; color:white; text-align: center; font-weight:bold; font-size: larger;}
.dataTables_wrapper	table.dataTable tbody td { padding: 1px 0px 1px 0.5em;}
.dataTables_wrapper	table.dataTable thead th,
					table.dataTable thead td,
					table.dataTable tfoot th,
					table.dataTable tfoot td { padding: 2px 18px 2px 0.5em;}
.dataTables_wrapper	table.dataTable thead th:hover { background:lightgray; /*title:"sorting"; not CSS 250320*/}


.dataTables_wrapper .dataTables_paginate { padding: 0px;	margin:0px 2px 0px 4px;} /* Page number buttons */
.dataTables_wrapper .dataTables_paginate .fg-button { color:black; font-weight:bold; padding: 2px 0px;	margin:0px 1px;} /* Page number buttons */


/***********************
	SHTML_Switch
************************/

	
/*
 * Copyright (c)  DesignBombs
 * http://www.designbombs.com
 *
 * Licensed under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 */
/* https://freebiesbug.com/code-stuff/simple-toggle-SHTML_Switch-css/ */
:root {
	--SHTML_Switch_Size: 56px;
}
.SHTML_Switch {
  font: 13px/20px 'Helvetica Neue', Helvetica, Arial, sans-serif;
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: var(--SHTML_Switch_Size);
  height: 20px;
  padding: 3px;
  background-color: white;
  border-radius: 18px;
  box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  background-image: -webkit-linear-gradient(top, #eeeeee, white 25px);
  background-image: -moz-linear-gradient(top, #eeeeee, white 25px);
  background-image: -o-linear-gradient(top, #eeeeee, white 25px);
  background-image: linear-gradient(to bottom, #eeeeee, white 25px);
}

.SHTML_Switch-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.SHTML_Switch-label {
  position: relative;
  display: block;
  height: inherit;
  font-size: 10px;
  text-transform: uppercase;
  background: #eceeef;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
  -webkit-transition: 0.15s ease-out;
  -moz-transition: 0.15s ease-out;
  -o-transition: 0.15s ease-out;
  transition: 0.15s ease-out;
  -webkit-transition-property: opacity background;
  -moz-transition-property: opacity background;
  -o-transition-property: opacity background;
  transition-property: opacity background;
}
.SHTML_Switch-label:before, .SHTML_Switch-label:after {
  position: absolute;
  top: 50%;
  margin-top: -.5em;
  line-height: 1;
  -webkit-transition: inherit;
  -moz-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}
.SHTML_Switch-label:before {
  content: attr(data-off);
  right: 11px;
  color: #aaa;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}
.SHTML_Switch-label:after {
  content: attr(data-on);
  left: 11px;
  color: white;
  text-shadow: 0 1px rgba(0, 0, 0, 0.2);
  opacity: 0;
}
.SHTML_Switch-input:checked ~ .SHTML_Switch-label {
  background: #47a8d8;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}
.SHTML_Switch-input:checked ~ .SHTML_Switch-label:before {
  opacity: 0;
}
.SHTML_Switch-input:checked ~ .SHTML_Switch-label:after {
  opacity: 1;
}

.SHTML_Switch-handle {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 18px;
  height: 18px;
  background: white;
  border-radius: 10px;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, white 40%, #f0f0f0);
  background-image: -moz-linear-gradient(top, white 40%, #f0f0f0);
  background-image: -o-linear-gradient(top, white 40%, #f0f0f0);
  background-image: linear-gradient(to bottom, white 40%, #f0f0f0);
  -webkit-transition: left 0.15s ease-out;
  -moz-transition: left 0.15s ease-out;
  -o-transition: left 0.15s ease-out;
  transition: left 0.15s ease-out;
}
.SHTML_Switch-handle:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -6px;
  width: calc(var(--SHTML_Switch_Size) - 44px);/*12px;*/
  height: 12px;
  background: #f9f9f9;
  border-radius: 6px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
  background-image: -webkit-linear-gradient(top, #eeeeee, white);
  background-image: -moz-linear-gradient(top, #eeeeee, white);
  background-image: -o-linear-gradient(top, #eeeeee, white);
  background-image: linear-gradient(to bottom, #eeeeee, white);
}
.SHTML_Switch-input:checked ~ .SHTML_Switch-handle {
  left: 40px;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

.SHTML_Switch-green > .SHTML_Switch-input:checked ~ .SHTML_Switch-label {
  background: #4fb845;
}
	

/***********************
	SHTML_Switch3
************************/
	
/*
251206 Generated and adapted from Claude.ai code generation
*/

/* Demo page styling - can be removed */
.SHTML_Switch3 {
	display: inline-block;
	border: 1px black dotted;
}

/* Toggle component styles - keep these */
.SToggle3-wrapper {
	position: relative;
	background: #e0e0e0;
	transition: all 0.3s ease;
	box-shadow: 
		inset 0 2px 4px rgba(0, 0, 0, 0.15),
		inset 0 -2px 4px rgba(255, 255, 255, 0.5),
		0 4px 8px rgba(0, 0, 0, 0.1);
}

.SToggle3-slider {
	position: absolute;
	background: #667eea;
	transition: all 0.2s ease;
	box-shadow: 
		0 6px 20px rgba(102, 126, 234, 0.4),
		0 3px 8px rgba(0, 0, 0, 0.2),
		inset 0 1px 2px rgba(255, 255, 255, 0.3),
		inset 0 -1px 2px rgba(0, 0, 0, 0.1);
	transform: translateY(0);
}

.SToggle3-slider:active {
	transform: translateY(1px);
	box-shadow: 
		0 4px 15px rgba(102, 126, 234, 0.4),
		0 2px 5px rgba(0, 0, 0, 0.2),
		inset 0 1px 2px rgba(255, 255, 255, 0.3),
		inset 0 -1px 2px rgba(0, 0, 0, 0.1);
}

.SToggle3-wrapper[data-state="middle"] .SToggle3-slider {
	background: #667eea;/*#f5576c;*/
	box-shadow: 
		0 6px 20px rgba(102, 126, 234, 0.4),/*rgba(245, 87, 108, 0.4),*/
		0 3px 8px rgba(0, 0, 0, 0.2),
		inset 0 1px 2px rgba(255, 255, 255, 0.3),
		inset 0 -1px 2px rgba(0, 0, 0, 0.1);
}

.SToggle3-wrapper[data-state="right"] .SToggle3-slider {
	background: #667eea;/*#00d4ff;*/
	box-shadow: 
		0 6px 20px rgba(102, 126, 234, 0.4),/*rgba(0, 212, 255, 0.4),*/
		0 3px 8px rgba(0, 0, 0, 0.2),
		inset 0 1px 2px rgba(255, 255, 255, 0.3),
		inset 0 -1px 2px rgba(0, 0, 0, 0.1);
}

.SToggle3-options {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
	z-index: 1;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;	
}

.SToggle3-option {
	flex: 1;
	text-align: center;
	font-weight: 600;
	color: #666;
	transition: all 0.3s ease;
	user-select: none;
	cursor: pointer;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.SToggle3-wrapper[data-state="left"] .SToggle3-option:nth-child(1),
.SToggle3-wrapper[data-state="middle"] .SToggle3-option:nth-child(2),
.SToggle3-wrapper[data-state="right"] .SToggle3-option:nth-child(3) {
	color: white;
	text-shadow: 
		0 2px 4px rgba(0, 0, 0, 0.3),
		0 1px 2px rgba(0, 0, 0, 0.2);
}
	
	
/***********************
	SFormTEXTDataListJS
************************/	
	
.SFormTEXTDataListJS_field { margin-bottom: 40px; }
div.SFormTEXTDataListJS_field { display: inline; margin-bottom: 6px; font-weight: 600; }
.SFormTEXTDataListJS_field > label { display: block; margin-bottom: 6px; font-weight: 600; }
.SFormTEXTDataListJS_field > div { display: inline}

  /* --- combo dropdown component styles --- */
  .cdl-wrap {
    position: relative;
    display: inline-block;
  }
  .cdl-wrap input[type="text"] {
    box-sizing: border-box;
    padding: 6px 28px 6px 8px;
    font-size: 14px;
  }
  .cdl-toggle {
    position: absolute;
    right: 2px;
    top: 1px;
    height: calc(100% - 2px);
    width: 22px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 12px;
    color: #555;
  }
  .cdl-toggle:hover { color: #000; }
  .cdl-list {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 2px 0 0;
    padding: 4px 0;
    list-style: none;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 4px 10px rgba(0,0,0,.12);
    max-height: 180px;
    overflow-y: auto;
    z-index: 1000;
  }
  .cdl-list[hidden] { display: none; }
  .cdl-item {
    padding: 6px 10px;
    cursor: pointer;
    font-size: 14px;
    white-space: nowrap;
  }
  .cdl-item.is-active {
    background: #2563eb;
    color: #fff;
  }
  .cdl-item[hidden] { display: none; }
  .cdl-empty {
    padding: 6px 10px;
    font-size: 13px;
    color: #888;
    font-style: italic;
  }
</style>