/* CSS Document iV5 BS5.3 */
header.header {
	background-color:var(--gasto-surface, #fff);
	margin:0;
	padding:0;
	width:100%;
	display:block;
	border-bottom:2px solid var(--gasto-primary, #67b516);
	min-height:58px;
	position:relative;
	z-index:3;
	}
			
#container {
	clear:both;
	margin:0;
	width:100%;
	position:relative;
	}
	/* styling Toolbar: see maincontent_menu.css */	
	div.maincontent {
		background-color:var(--gasto-surface, #ffffff);			
		border-top:1px solid var(--gasto-border, #EDEDED);
		padding:1em 0;
	    overflow:hidden;
		}
	div.maincontent .column {
		margin:0;
		float:left;
		}
		/*dashboard*/
		#dashboard #dashboard-table { /* always stretch dashboard into 100% */
			table-layout:fixed;
			width:100%;
			}		
		#dashboard .module,
		#modal-dialog .module {
			clear: both;
			margin: 0 0.5em 0.5em;
			word-wrap: break-word;
			border-radius:5px;	
			border:1px solid var(--gasto-border, #aaaaaa);
			}
			#dashboard .mod-header,
			#modal-dialog .mod-header {
				clear:both;
				display:block;
				background-color:var(--gasto-surface-2, rgba(33,37,41, 0.03));
				border-radius:calc(0.375rem - 1px) calc(0.375rem - 1px) 0 0;
				border-bottom-width:1px;
				border-bottom-style:solid;
				}
				#dashboard .mod-header h3,
				#modal-dialog .mod-header h3 {
					font-size:1.25rem;
					line-height:1.2;
					text-transform:none;
					color:inherit;
					padding:0.5rem 1rem;
					display: flex;
					justify-content: space-between;
					flex-wrap: wrap;
					font-weight:400;
					}
					#dashboard .mod-header .config_buttons {
						min-width:55px;
						}
						/* ensure the blockmenu-dropdown is always on top */
						#dashboard .mod-header .config_buttons ul.dropdown-menu {
							z-index:9999;
							}

                #dashboard .mod-header h3 .show_icon {
                    text-transform:none;
                }
                #dashboard .mod-header h3 .show_icon_text {
                    text-transform:none;
                    width:20em!important;
                    color:inherit;
                    padding-left:20px;
                }
			#dashboard .mod-content, 
			#modal-dialog .mod-content {
				clear:both;
				display:block;
				overflow:hidden;
				}
				#dashboard .mod-content {
					overflow-x:auto!important;
					}
					/* Avoid unwanted or unnecessary scrollbars in dashboard blocks */
					#dashboard-table .mod-content .row {
						margin-left:0;
						margin-right:0;
						}
					
				/* if no scroll on the modal-body is set (see http://wiki.teqa.nl/display/DEV/Bootstrap+conversie+voorbeelden)
				 * our modal-footer is loaded INSIDE the modal-body
				 * in this case we also want the the modal-footer using the full-width of the modal-dialog
				 * AND we don't need the default set padding-bottom of 15px, instead we use 5px + we don't want to show the grey border-top
				 * With this adjustments the look is the same as if the scroll on the modal-body is set */
				 .modal-content .modal-body .modal-footer {
				 	margin-left:-15px;
				 	margin-right:-15px;
				 	padding-bottom:5px;
				 	border-top-color:transparent;
				 	}
					
			.module {
				clear: both;
				margin-bottom: 0.5em;
				word-wrap: break-word;
				}
				.mod-header {
					clear:both;
					display:block;
					background-color:var(--gasto-surface-2, rgba(33,37,41, 0.03));
					border-bottom:1px solid var(--gasto-border, rgba(33,37,41, 0.125));
					border-radius:calc(0.375rem - 1px) calc(0.375rem - 1px) 0 0;
					}
					.mod-header h3 {
						font-size:1.25rem;
						text-transform:none;
						font-weight:400;
						padding:0.5rem 1rem;
                        margin-top:0px;
                        margin-bottom:0px;
						}					
				.mod-content {
					clear:both;
					display:block;
					overflow:hidden;
					}
					
			/***TAB MENU***/
			#tabmenu {
				display:block;
				height:30px;
				overflow:hidden;
				width:100%;
				background:transparent url(../images/tabmenu_border.png) bottom left repeat-x;
				}
			#tabmenu ul {
				border: 0 none;
    			display: block;
   				list-style-type: none;
    			margin: 0;
    			padding: 0;
				}
				#tabmenu li {
				border: 0 none;
    			display: block;
    			float: left;
    			margin: 0 0 0 0;
    			padding: 0;
				height:30px;
				}
				#tabmenu li a {
					font-size:/*14px;*/116.66666%;
					color:var(--gasto-link, #1f6c89);
					text-decoration:none;
					cursor:pointer;
					display:block;
					background-color:transparent;
    				border:1px solid var(--gasto-border, #f6f6f6);
					display: block;
					text-align:center;
					padding:0 10px;
					height:27px;
					}									
					#tabmenu li a.current {
						border:1px solid var(--gasto-border, #a1a1a1);
						border-bottom:1px solid var(--gasto-border, #f6f6f6);
						color:var(--gasto-text, #000000);
						height:28px;
						}
						#tabmenu li a.current:hover {
							text-decoration:underline;
							color:var(--gasto-text, #000000);
							height:28px;
							}
						#tabmenu li a:hover {
							border:1px solid var(--gasto-border, #c6c6c6);
							border-bottom:1px solid var(--gasto-border, #f6f6f6);
							height:27px;
							}							
					#tabmenu a .menutext {
						line-height:30px;
						}
				
				/***TAB CONTENT***/
				#tabcontent {
					clear:both;
					display:block;
					padding:1em;
					}
				

/*** FOOTER **/
/* Change font-size buttons */
.changefontsize .sizing {
	font-size:9px;
	}

/*** COMMON STYLING CLASS SETTINGS ***/
/*a:link {
	color:var(--gasto-link, #1F6C89);
	text-decoration:none;
	}
	a:visited {
		color:var(--gasto-link, #1F6C89);
		text-decoration:none;
		}
	a:hover {
		color:var(--gasto-link, #1F6C89);
		text-decoration:underline;
		}
	a:active {
		color:var(--gasto-primary, #93C30F);
		text-decoration:none;
		}*/

.hideme {
	display:none;
	visibility:hidden;
	}

.bold {font-weight:bold;}

.right {text-align:right;}

.center {text-align:center;}

.left {text-align:left;}

.top {vertical-align:top;}

.middle {vertical-align:middle;}

.bottom {vertical-align:bottom;}

.floatleft {float:left;}

.floatright {float:right;}

.floatnone {float:none;}

.content_alignment {
	margin:0.5em;
	}
	.inline_table {
		margin:0;
		}
    .block_settings, .block_content {
		padding:1em;
		}
	.inline_popuptable {
		margin:0;
		}
	.tabcontent_table {
		margin:-5px;
		}
	.inline_formtable {
		display:table;
		overflow:visible;
		}
    .header_links {
		padding:0;
		border-bottom:1px dashed var(--gasto-border, #cccccc);
		}
	.footer_links {
		padding:5px 7px;
		border-top:1px dashed var(--gasto-border, #cccccc);
		}
		.footer_links a,
		.footer_links a:link,
		.footer_links a:visited {
			color:var(--gasto-muted, #a1a1a1);
			text-decoration:none;
			font-weight:bold;
			text-transform:lowercase;
			}
			.footer_links a:hover {
				text-decoration:underline;
				color:var(--gasto-link, #1F6C89);
				font-weight:bold;
				}
	/*** special setting for footer in booking_detail block ***/
	.booking_detail_footer, .customer_detail_footer, .invoice_detail_footer, 
    .gift_detail_footer, .knipkaart_detail_footer, .event_detail_footer, 
    .subscription_detail_footer, .fee_detail_footer, .id_column {
		padding:0;
		color:var(--gasto-muted, #A1A1A1);
		}


.head {
	text-transform:uppercase;
	}

.explanation {
	font-style:italic;
	color:var(--gasto-muted, #a1a1a1);
	}



/****spacers padding***/
.top_space20 {
	padding-top:20px!important;
	}
.top_space15 {
	padding-top:15px!important;
	}
.top_space10 {
	padding-top:10px!important;
	}
.top_space5 {
	padding-top:5px!important;
	}
.bottom_space5 {
	padding-bottom:5px!important;
	}
.bottom_space10 {
	padding-bottom:10px!important;
	}
.bottom_space15 {
	padding-bottom:15px!important;
	}
.bottom_space20 {
	padding-bottom:20px!important;
	}
.right_space10 {
	padding-right:10px!important;
	}
.right_space15 {
	padding-right:15px!important;
	}
.right_space20 {
	padding-right:20px!important;
	}
.right_space25 {
	padding-right:25px!important;
	}
.right_space30 {
	padding-right:30px!important;
	}
.left_space5 {
	padding-right:5px!important;
	}
.left_space10 {
	padding-right:10px!important;
	}
/****spacers margin***/	
.bottom_margin10 {
	margin-bottom:10px!important;
	}
.bottom_margin15 {
	margin-bottom:15px!important;
	}
.bottom_margin20 {
	margin-bottom:20px!important;
	}
.bottom_margin30 {
	margin-bottom:30px!important;
	}
.top_margin15 {
	margin-top:15px!important;
	}
.top_margin20 {
	margin-top:20px!important;
	}
.top_margin25 {
	margin-top:25px!important;
	}
.top_margin30 {
	margin-top:30px!important;
	}
.top_margin35 {
	margin-top:35px!important;
	}
.top_margin40 {
	margin-top:40px!important;
	}
.top_margin50 {
	margin-top:50px!important;
	}
	
 /****vertical align, default is baseline****/
 .VAlignMiddle {
 	vertical-align:middle;
	}
.VAlignTop {
 	vertical-align:top!important;
	}
.VAlignBottom {
 	vertical-align:bottom!important;
	}


/*** styling message boxes ***/
.tundra .dhtmlx_message_area {
    position: fixed;
	left:auto;
    top:auto!important;
	right:15px;
	bottom:0; /*leave */
    min-width:290px;
	max-width:90%;
    width:auto;
    height:auto;
    z-index:1050;		
	}
	.tundra .dhtmlx_message_area .alert {
		font-size:14px;
		font-family:tahoma;
		font-weight:bold;
		box-shadow:0 0 6px 1px rgba(0,0,0,.15);
		border-width:1px;
		float: none;
		margin: auto;
		margin-bottom:15px;
		width: auto;
		}
		.tundra .dhtmlx_message_area .alert-success {
			border-color: var(--gasto-success, rgba(60,118,61,0.5));
			}
		.tundra .dhtmlx_message_area .alert-danger {
			border-color: var(--gasto-danger, rgba(169,68,66,0.5));
			}
		.tundra .dhtmlx_message_area .alert-warning {
			border-color: var(--gasto-warning, rgba(138,109,59,0.5));
			}
		.tundra .dhtmlx_message_area .alert-info {
			border-color: var(--gasto-info, rgba(49,112,143,0.5));
			}
	.tundra .dhtmlx_message_area .alert ul {
		padding-left:0;
		list-style:none;
		font-weight:normal;
		font-size:12px;
		}
		.tundra .dhtmlx_message_area .alert ul li {
			margin-top:5px;
			}
		.tundra .dhtmlx_message_area .alert ul li:first-child {
			margin-top:10px;
			}
				.tundra .dhtmlx_message_area .alert ul li span.field {
					font-weight:bold;
					}

/*****************************************
checkup and/or replace to another css file
******************************************/	
/*** mod=layouts edit_layout***/
#layout_columns {
	display:block;
	width:100%;
	margin-top:20px;
	margin-bottom:10px;
	}
	.editlayout_columns {
		background-color: var(--gasto-surface-2, #ededed);
		text-align:center;
		color:var(--gasto-text, #212121);
		font-weight:bold;
		}
		.editlayout_columns:hover {
			background-color: var(--gasto-surface-2, #cccccc);
			}
	.tundra .maincontent .dijitSplitterV, 
	.tundra .maincontent .dijitGutterV {
		background-color:var(--gasto-surface-2, #f6f6f6);
		width:16px;
		}
		.tundra .maincontent .dijitSplitterHover {
			background-color:var(--gasto-link, #1F6C89);
			opacity:0.8;
			}
		.tundra .maincontent .dijitSplitterActive {
			background-color:var(--gasto-primary, #93c30f);
			opacity:0.8;
			}
		.tundra .maincontent .dijitSplitterV .dijitSplitterThumb {
			background:transparent url(../images/iconbuttons-sprite-height16px.png) 0 0 no-repeat;
			height: 16px;
			left: 0;
			width: 16px;
			}
			.tundra .maincontent .dijitSplitterHover .dijitSplitterThumb,
			.tundra .maincontent .dijitSplitterActive .dijitSplitterThumb {
				background:transparent url(../images/iconbuttons-sprite-height16px.png) 0 -16px no-repeat;
				}

/*** mod=layouts add_layout***/
.add_layout_table {
	width:auto!important;
	}
	a.layout_types,
	a.layout_types:visited {
		display:block;
		width:200px;
		height:127px;
		text-decoration:none;
		padding:0;
		border:1px solid var(--gasto-border, #c0c0c0);
		background-image:url(../images/layouts-sprite-width200px.png);
		background-position:0 -780px;
		background-repeat:no-repeat;
		background-color:var(--gasto-surface-2, #c0c0c0);
		border-radius:5px;
		}		
		a.layout_types:hover {
			text-decoration:none;
			border-color:var(--gasto-link, #1F6C89);
			background-color:var(--gasto-link, #1F6C89);
			}
		a.layout_types.selected {
			border-color:var(--gasto-primary, #93C30F);
			background-color:var(--gasto-primary, #93C30F);
			}
		/* background images to show lay-out type */
		a.type_single {
			background-position:0 0;
			}
		a.type_2_column_50_50 {
			background-position:0 -130px;
			}
		a.type_3_column_33_33_33 {
			background-position:0 -260px;
			}
		a.type_2_column_66_33 {
			background-position:0 -390px;
			}
		a.type_2_column_33_66 {
			background-position:0 -520px;
			}
			a.layout_types span,
			a.layout_types:visited span {
				text-decoration:none;
				color:var(--gasto-on-primary, #ffffff);
				}
				a.layout_types:hover span {			
					color:var(--gasto-on-primary, #ffffff);
					}
				a.layout_types.selected span {
					color:var(--gasto-on-primary, #ffffff);
					font-weight:bold;
					}


#loading {
	margin-top: 300px;
	margin-left: 670px;
	}

.loading {
	background-image:url(../images/loading.png); 
	background-repeat:no-repeat;
	background-position:center center;
	height:40px;
	width:40px;
	background-color:var(--gasto-surface-2, #cccccc);
	border-radius:5px;
	}


.country_inlineedit .country_option img
{
	display:none;
}

.header_shoppingcart_notifier {
	background-color:green;
	text-align:center;
}

.header_showlicense_notifier {
	text-align:center;
}
.lic_yellow { background-color:yellow; }
.lic_red { background-color:red; }
.lic_orange { background-color:orange; }

.confirm_text{
	
}

.confirm_actions{
	
}
.remove_dummy_button{
	display:none;
}

.message_valid{
	color:var(--gasto-success, #93c30f);
}

.message_invalid{
	color:var(--gasto-danger, #ff0000);
}

/*
Pagination styling inspiration:
http://mis-algoritmos.com/2007/03/16/some-styles-for-your-pagination
*/
.pagination {
	text-align: right;
	}
	div.pagination {
		padding: 3px;
		margin: 3px;
	}
	
	div.pagination a {
		border: 1px solid var(--gasto-border, #ccc);
		margin-right:3px;
		padding:2px 6px;

		background-position:bottom;
		text-decoration: none;
		font-weight:bold;

		color: var(--gasto-text, #000000);
        border-radius: 5px 5px 5px 5px;
	}
	div.pagination a:hover, div.pagination a:active {
		background-image:none;
		background-color:var(--gasto-nav-hover, #b6b6b6);
		color: var(--gasto-on-primary, #fff);
	}
	div.pagination span.current {
		margin-right:3px;
		padding:2px 6px;
		
		font-weight: bold;
		color: var(--gasto-text, #000);
	}
	div.pagination span.disabled {
		display:none;
	}

/*** styling process bar ***/
.loadingOverlay {
    background-image:url("../images/loadingAnimation.gif");
    background-repeat:no-repeat;
	background-position:center;
    position: relative;
    z-index: 9999;
    display: none;
    padding: 25px 40px;
    margin-right: 41px;
}
.pageOverlay {
    margin-left: 41px;
}
.loadingMessage {
    color: var(--gasto-muted, #999);
    font-family: small-caption;
    font-size: large;
    text-align: center;
}
.message {
    color: var(--gasto-muted, #999);
    font-family: small-caption;
    font-size: large;
    margin-bottom: 10px;
    width: 100%;
}
#process_bar_dia div span.dijitDialogCloseIcon{
	display: none;
}
#process_bar_dia{
	z-index: 9999;
}

/*** styling payment schedules modal box ***/
#widget_pas_name, 
#widget_pas_desc, 
#widget_pas_tgt_desc, 
#widget_pas_tgt_price, 
#widget_pas_tgt_date{ 
	width: 68%;
}
#pas_fixed_chzn a,
#pas_fixed_chzn div.chzn-drop,
#pas_obj_id_chzn a,
#pas_obj_id_chzn div.chzn-drop,
#pas_com_id_chzn a,
#pas_com_id_chzn div.chzn-drop{ 
	width: 445px!important;
} 
#payment_schedules_dia{
	width:75%;
}

/*** styling statuses tables header area ***/
.status_row_10{
	background-color: #000000;
}
.status_row_11{
	background-color: #000066;
}
.status_row_12{
	background-color: #000077;
}
.status_row_20{
	background-color: #000080;
}
.status_row_21{
	background-color: #000088;
}
.status_row_22{
	background-color: #0000AA;
}
.status_row_23{
	background-color: #0000C0;
}
.status_row_24{
	background-color: #0000CC;
}
.status_row_25{
	background-color: #0000CD;
}
.status_row_26{
	background-color: #005580;
}
.status_row_27{
	background-color: #FFF700;
}
.status_row_28{
	background-color: #FFDDDD;
}
.status_row_29{
	background-color: #8FC9FF;
}
.status_row_30{
	background-color: #007700;
}
.status_row_31{
	background-color: #00CF00;
}
.status_row_32{
	background-color: #05B2D2;
}
.status_row_40{
	background-color: #20B2AA;
}
.status_row_70{
	background-color: #FF5500;
}
.status_row_71{
	background-color: #9FA8C6;
}
.status_row_80{
	background-color: #AC2925;
}
.status_row_90{
	background-color: #EE82EE;
}
.status_row_99{
	background-color: #E5C267;
}

/*** styling for pricedetails.tpl of discount module table ***/
#discountpricedetails{
	border: 1px solid var(--gasto-border, #C7C7C7);
    margin-bottom: 15px;
    margin-left: 0px;
    margin-right: auto;
    width: auto;
}
.admin_ires_error {
	border: solid 1px var(--gasto-danger, #ff0000) !important;
}

/*** Overright styling due to add color screen not show error message***/
form#addColorForm{
    width: auto!important;
}

.dropdown-menu > li > a > label.checkbox {
    margin-top: 0px;
    margin-bottom: 0px;
}

.maincontent .scrollable{
	overflow-x:hidden;
	overflow-y:scroll;
	}


/* no box-shadow for .well */
#dashboard .well {
	box-shadow:none;
}

/* TAKE SNAPSHOT */
#default_image_webcam_dia #defaultimagewebcam {
	margin-left:auto;
	margin-right:auto;
	display:block;
}

/***                   PRINT ONLY                              ***/
/* addition for the common media print settings in bootstrap css */
@media print {
	@page {
	  size: A4;
	}
	body {
		margin:0;
		padding:0;
		vertical-align:top!important;
		}
		#loading,
		header.header,
		#toolbar,	
		footer.footer {	
			display:none;
			}
		#dashboard {
			margin:0;
			padding:0;
			border:0 none;
			position:relative;
			top:0;
			vertical-align:top!important;
			}
			#dashboard a[href]:after {
				content: ""!important;
				}
			#dashboard table,
			#dashboard table tr,
			#dashboard table th,
			#dashboard table td,
			#dashboard div {
				vertical-align:top!important;
				}
				#dashboard .module,
				#dashboard div[class*="Module_color_"] {
					border-width:0.5mm;
					margin:0.5mm 0.5mm 3.5mm;
					page-break-inside:avoid;
					position:relative
					}
}
/* for charts */
.pielabel{
    background-color:var(--gasto-surface, #ffffff);
    border-radius:4px;
    height:15px;
    line-height:15px;
    font-size: 9px;
    width:25px;
    text-align:center;
}
area { cursor: pointer; cursor: hand; }

/* override/improvement BS Daterangepicker */
.daterangepicker .calendar {
	max-width:none!important;
	}
#editor div.nav-tabs {
    display:none;
}
.tag.label {
    font-size:100%!important;
}

/* divider */
.divider {
	margin:25px 0 15px 0;
	border-bottom:1px solid var(--gasto-border, rgba(0,0,0,0.1));
	}
	.divider.smallMarginTop {
		margin:10px 0 15px 0;
		}

/*** adminEventRecurring ***/
/* width + alignment setting 'count' text-fields */
.countField div {
	display:inline-block;
	}
	.countField input {
		max-width:3em;
		display:inline-block!important;
		margin-top:-7px;
		margin-bottom:-7px;
		}
		#monthoption .col-xs-12 .countField input,
		#yearoption .col-xs-12 .countField input {
			margin-top:0;
			margin-bottom:0;
			}
	.countSelectField .select2-container[style] {
		width:auto!important;
		}
		.countSelectField .select2-container .select2-choice {
			height:34px;
			line-height:34px;
			margin-top:-7px;
			margin-bottom:-7px;
			}
			#monthoption .col-xs-12 .countSelectField .select2-container .select2-choice,
			#yearoption .col-xs-12 .countSelectField .select2-container .select2-choice {
				margin-top:0;
				margin-bottom:0;
				}

			.countSelectField .select2-container .select2-choice .select2-arrow b {
    			background-position:0 3px;
    			}
/* recurring eventdetails */
#recurring_dia .block-field th,
#recurring_dia .block-field td {
    height: 34px;
    vertical-align: middle;
	}

/***** BULK WIZARD *****/
.stepwizard {
	display:table;
	width:100%;
	position:relative;
	margin-top:10px;
	}
	.stepwizard-row {
		display:table-row;
		}
		.stepwizard-row:before {
			top:14px;
			bottom:0;
			position:absolute;
			content:" ";
			width:100%;
			height:1px;
			background-color:var(--gasto-border, #ccc);
			z-index:0;
			}
	.stepwizard-step {
		display:table-cell;
		text-align:center;
		position:relative;
		}
		.stepwizard-step .btn-circle {
			width:30px;
			height:30px;
			text-align:center;
			padding:0;
			font-size:12px;
			line-height:15px;
			border-radius:50%;
			}
			.stepwizard-step .btn-circle[disabled] {
				opacity:1!important;
				}
			.stepwizard-step p {
				margin-top:10px;
				color:var(--gasto-muted, #777777);
				}
#bulk_action_dia_error .alert {
	margin-top:15px;
	margin-bottom:0;
	}
#bulk_grid {
    margin-bottom: 20px;
	}
#bulkwizard .form-horizontal .control-label {
    text-align:left;
	}
	
#var_selection_container h3 {
    display: block;
    cursor: pointer;
    position: relative;
    margin: 2px 0 0 0;
    padding: .5em .5em .5em .7em;

    font-size: 100%;

    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    
	border: 1px solid var(--gasto-border, #c5c5c5);
	background:var(--gasto-surface-2, #f6f6f6);
	color: var(--gasto-text, #454545);
}
/*** STACKED MODALS + BACKDROPS ***/
/* Bootstrap 5 sets --bs-backdrop-zindex: 1050 on .modal-backdrop and uses
/* z-index: var(--bs-backdrop-zindex).  Because bootstrap.min.css loads AFTER
/* style.css, a plain .modal-backdrop rule loses by cascade order.
/* Fix: double the selector for higher specificity (0,2,0 vs 0,1,0) so it
/* always wins regardless of stylesheet load order.
/* This keeps the backdrop (1040) well below the modal default (1055).
/* JS (admin-ui.js setModalsAndBackdropsOrder) sets inline z-index for
/* stacked modals, which overrides any stylesheet rule.
*/
.modal-backdrop.modal-backdrop {
	--bs-backdrop-zindex: 1040;
	z-index: 1040;
}
/*
/* Per-modal stacking levels below override both modal and backdrop z-index
/* for known stacked-modal combinations.
*/
/* stack level: 2 */
#show_conflict_dia.modal.fade.show,
#roster_filter_div.modal.fade.show,
#roster_color_div.modal.fade.show,
#roster_setting_div.modal.fade.show,
#view_color_div.modal.fade.show,
#manage_viewsortcolumns_dia.modal.fade.show,
#shares_dia.modal.fade.show {
	z-index:1057;	
	}
	div#show_conflict_dia + div.modal-backdrop.show,
	div#roster_filter_div + div.modal-backdrop.show,
	div#roster_color_div + div.modal-backdrop.show,
	div#roster_setting_div + div.modal-backdrop.show,
	div#view_color_div + div.modal-backdrop.show,
	div#manage_viewsortcolumns_dia + div.modal-backdrop.show,
	div#shares_dia + div.modal-backdrop.show {
		z-index:1056;
		opacity:0.6;
		}
/* stack level: 3 */
#highlight_colorpicker_dia.modal.fade.show,
#roster_add_color_div.modal.fade.show,
#view_add_color_div.modal.fade.show,
#roster_colorcopy_div.modal.fade.show {
	z-index:1059;	
	}
	div#highlight_colorpicker_dia + div.modal-backdrop.show,
	div#roster_add_color_div + div.modal-backdrop.show,
	div#view_add_color_div + div.modal-backdrop.show,
	div#roster_colorcopy_div + div.modal-backdrop.show {
		z-index:1058;
		opacity:0.6;
		}	
/* stack level: 4 */
#search_cust_dialog.modal.fade.show,
.bootbox.modal.fade.show {
	z-index:1061;	
	}
	div#search_cust_dialog + div.modal-backdrop.show,
	div.bootbox.modal.fade.show + div.modal-backdrop.show {
		z-index:1060;
		opacity:0.6;
		}
/* stack level: 5 */
#add_cust_dialog.modal.fade.show {
	z-index:1062;
}
div#add_cust_dialog + div.modal-backdrop.show {
	z-index:1061;
	opacity:0.6;
}
/* higher z-index needed for select dropdown inside modals
/* default z-index is 1056
/* it seems harmless to setthe z-index default on 1065
*/
.select2-container--bootstrap-5.select2-container--open .select2-dropdown {
	z-index:1065;
	}

/*** OVERRIDE AUTO CALCULTED MODAL POSITION ROSTER (7) ***/
.modal.show#scheduler_lightbox[style] {
    top:100px!important;
	}
/* for SM+XS devices: set margin-top to 10px */
@media screen and (max-width:767px) {
	.modal.show#scheduler_lightbox[style] {
		top:10px!important;
		}
}

/*** Dashboard blocks **/
.dw-100 {
	width: 100% !important;
}

.dw-99 {
	width: 99% !important;
}

.dw-50 {
	width: 50% !important;
}

.dw-33 {
	width: 33% !important;
}

.dw-66 {
	width: 66% !important;
}

.dw-67 {
	width: 67% !important;
}

@media screen and (max-width:992px) {
	.dw-33, .dw-66, .dw-67 {
		width: 50% !important;
	}
}

@media screen and (max-width:768px) {
	.dw-33, .dw-66, .dw-67, .dw-50 {
		width: 100% !important;
	}
}

/*** Dashboard grid renderer (DivCreatorGrid) — client-side masonry ***/
.dashboard-grid {
	position: relative;
}
.dashboard-grid-item {
	box-sizing: border-box;
}
.dashboard-grid-item .content {
	margin: 0;
	padding: 0;
}
.dashboard-grid-break {
	display: none;
}

/*** start TOOLTIPS ***/
/* auto width + text-align left for ALL tooltips:
* text-align: left is visible for tooltips containing several lines
* in case a tooltips contains one word or a small line, 
* the result looks like the text is centered by the auto width setting 
* in combination with the min-widt setting on only 50px
*/
.tooltip .tooltip-inner {
	width:auto;
	min-width:50px;
	max-width:80vw;
	text-align:left;
	}
/*** end TOOLTIPS ***/

/*** start CONFIGFRONTCSS ***/
/* max. height logo-image in theme block */
#configfront_frm .card-img-top {
	max-height:240px;
	width:auto;
	margin:0 auto;	
}
/*** end CONFIGFRONTCSS ***/

/*** start IRES-CORE-LIBRARY INTEGRATION ***/
/* TimePicker inside input-group: make the wrapper participate in flex layout
   so the clock icon (input-group-addon) and timepicker input appear joined. */
.input-group > [id$="-ires-timepicker"] {
	flex: 1 1 auto;
	display: flex;
	min-width: 0;
}
.input-group > [id$="-ires-timepicker"] .ires-timepicker-container {
	flex: 1 1 auto;
	display: flex;
	min-width: 0;
}
.input-group > [id$="-ires-timepicker"] .ires-timepicker-input {
	flex: 1 1 auto;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
/*** end IRES-CORE-LIBRARY INTEGRATION ***/