/* 
waasio.css
this modifies bootstrap
*/

/* Rules for icon sizes: */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; } /* Default */
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

body, html { /* not sure if these are needed, and if so not for small screens */
  /*height: 100%;
  overflow:hidden;*/
  background-color: #f1f1f1; /* 8-28-25*/
}

.container-fluid {
	/*height: 100%;
	overflow-y:auto;*/
		
}

.full_height {
	/*height: 100%;*/
	overflow-y: auto;
	position: relative;
}

#waasio-main {
	/*height: 100%;
	overflow-y: auto;*/
	/*height: 800px;
	border: 1px solid #999;*/
	/*overflow-y: auto;*/
	
	background-color:#f1f1f1;
	
}

.list-group {/* this is the data table choose table sidebar*/
	/*height: 100%;
	overflow	-y: auto;*/	
	/*position:fixed;*/
  
	/*height:800px;*/ /* heights are going to have to set with JS and not for small screens */
	/*overflow-y: auto;*/
	/*height:calc(100% - 300px);
	position: fixed;*/
}

.main_panel  {/* this is the table of fields*/
  
	/*height:500px;*/ /* heights are going to have to set with JS and not for small screens */
	overflow-y: auto;
	/*overflow-y:hidden;*/
	
}

#waasio-main .page_root {
	/*font-size: .875em;*/ /* 14px*/
}




table {
/*	
	max-height: 300px;
	overflow-y: auto;
	display:block;
*/	
}

.main_panel table tbody {
/*	
	max-height: 300px;
	overflow-y: auto;
	display:block;
*/	
}

#waasio-navbar {
	display:inline; /* doing this so that the bs navbar can have sticky-top*/	
}

#waasio-navbar .bg-dark {
	background-color: #3a0088 !important; /* dark purple*/
}

#waasio-navbar .bg-dark .nav-link {
	color: #fff
}

#waasio-navbar nav.navbar {
	/*margin:0;*/
	/*height: 80px;*/ /* temp hack */
	height: 50px; /* temp hack */
	font-size: .875em;
}
#waasio-navbar nav.navbar .dropdown-menu{
	font-size: 1em;
}

div#waasio-titlebar {
	/*background-color: #f1f1f1;*/
	padding: 10px 20px;
	position: sticky;
	top: 40px;
	z-index:1000;
	height: 40px;
	line-height: 20px;
	font-size: 1.125em; /* 18/16*/
/* 5-24-20 removing the titlebar for now*/
	display:none;

	
}
div#waasio-titlebar h1 {
	margin:0px
}


#row-main_toolbar {
	position: sticky;
	top: 90px; /* navbar ht + titlebar ht*/
	z-index:1000;
	/*margin-top: 5px;*/
	margin-bottom: 5px;
	
	top: 50px; /* 5-24-20 because we removed titltebar*/
	margin-left: -15px;
	margin-right: -15px;
	margin-bottom: 15px;	
	background: #f1f1f1;
	background: #e1e1e1;
	/*border-bottom: 1px solid #e1e1e1;*/
	border-bottom: 1px solid #d1d1d1;	
	box-shadow: 0px 1px #f9f9f9;
	
}
div.pages-toolbar, div.toolbar {
	margin: 10px 0;
}
table#builder_edit_table input, table#builder_edit_table select {
	display: block; padding: 0; margin: 0; 
	/*border: 0; */
	width: 100%;border-radius:0; 
	background:transparent;

	border-top-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-width: 1px;
	
	box-shadow: none;
	
	}

table#builder_edit_table td {margin: 0; padding: 0; border-color: #ddd; 
	border-width: 0px 0px 0px 0px;
	
}
#builder_edit_table_properties_container {
	font-size: .75em;
}

/* following for draggable data table schema */
div.data-table-container {
	background-color: #f1f1f1;
	overflow: auto;
	height:800px;/*just tmep */
}
div.draggable-table-box {
	width: 100px;
	height: 100px;
	border: 1px solid #ccc;
	display:inline-block;
	margin: 10px;
	background-color: #fff;
}

.table_container_container.fixed_header {
	overflow-y: auto; 
	height: 500px;
	overflow-x: auto;
	/*width:500px;*//* just for testing freeze cols*/
}

.pagination-header {
	position: sticky; 
	top: 0; 
}

table.fixed_header th {
	position: sticky; 
	top: 0; 
	background-color: #fff;
}
/*
table.fixed_header thead tr {
	display:block;
}

table.fixed_header tbody {
	display:block;
	overflow:auto;
	height:200px;
	width:100%;
}
*/

.table tr.selected-row  { /*for bootstrap need to override table striped*/
	background-color: #ccc !important;
}

table.zebra_strips tr:nth-child(even) {
	background-color: #f2f2f2;
}
table.mouseover_highlight tr:hover {
	background-color: #e2e2e2;
	cursor:pointer;
}	


table.spreadsheet {
	/*border-spacing:0;
	border:0;*/
	border-collapse:collapse;
}

table.spreadsheet tr {/* make an editable table look like a spreadsheet*/
	/*border:0;*/
}

table.spreadsheet td, table.spreadsheet th {/* make an editable table look like a spreadsheet*/
	padding:0;
	border:1px solid #eceeef;	
}

table.spreadsheet td input, table.spreadsheet td select, table.spreadsheet td span  {/* make an editable table look like a spreadsheet*/
	border-radius:0;
	border:0;
	margin: 1px;
	height:auto !important; /* negates bs select.form-control*/
	/* maybe instead of adding border to the input/select, we should change the border color of the td */
	
}
/*table.spreadsheet td input:focus, table.spreadsheet td select:focus {/* make an editable table look like a spreadsheet*/	
table.spreadsheet td input:focus {
	border:1px solid #5292F7;
	margin:0;
	/*outline: none;*/
}
table.spreadsheet td select:focus {/* make an editable table look like a spreadsheet*/	
	border:1px solid #5292F7;
	margin: 0px 1px 1px 0px;		
	/*outline: none;*/
}

table tr.group_header {
	background-color: #999;
	font-weight: bold;
	color: #333;
}

table tr.group_footer {	
	font-weight: bold;	
}

table td.right_justify, table th.right_justify {
	text-align: right;
}


li.selected {
	background-color: #ccc;
}



div#test_import_results td {
	/*border: 1px solid #f1f1f1;*/
} 

.red {color:red;}  /*hack for importing data */

.minimize_button {
	z-index:1000;
	position:absolute;
	right:0;
}
.radio_group_container .form-check {
	/*padding-left:0;*/
}
.radio_group_container .form-check label {
	/*margin-left: .25rem;*/
}

.form_element_container[data-element_type='form_date_range'] .form-inline input[data-date_filter='max'] {
	margin-left: .5rem;
}

/**************** FOLLOWING FOR QUERY BUILDER*************************/

.spa-x-clearfloat {
	height: 0 !important;
	float: none !important;
	visibility: hidden !important;
	clear :both !important;
}



	.report_builder_container ul {
		list-style: outside none none;
		padding-left:0;
	}
		
	.field_container {
		display: block;
	}

	/*.subtab_content { border:1px solid #34495e; padding: 10px; border-radius: 6px; position:relative}*/
	
	.hamburger { position: absolute; right:.5em; top:.5em; font-size: 1.25em; background-color: #ddd; border-radius: 3px; color: #666; border: 1px solid #999; cursor:pointer; width: 1.75em; text-align: center; line-height: 1.75em}
	.hamburger:hover { background-color: #ccc }
	.hamburger_menu { display: none; font-size: .7em; position: absolute; right: 0; width:  15em; background-color: #fff; margin-top: 5px; border: 1px solid #ccc; text-align: left;z-index:1}
	.hamburger_menu li { padding: 0 1em; cursor:pointer}
	.hamburger_menu li:hover { background-color: #ccc; color: #333 }
	
	#query_0 .hamburger_menu li.btn_delete_subquery { display:none; }
	
	.field_container .hamburger { right:0;top:0;font-size: 1em;  }
	.field_container .hamburger_menu { font-size: .85714em;}
	.field_container .hamburger_menu li { border:0px; line-height: 2em; height: auto; }
	
	
	.meta_container { font-size: .875em; }
	/*.meta_container .header {font-size: 1.142857em;}*/
	.meta_container .header {font-size: 1em;}
	
	.delete_button {display:inline-block;font-size: .85714em; border-radius: 3px; color: #666; border: 1px solid #999; cursor:pointer; width: 1.5em; text-align: center; line-height: 1.5em;background-color: #ddd; float:right }
	.delete_button:hover { background-color: #ccc}
	
	/*.expand_box {position:absolute;right:0;top:0;width:15px;height:15px;background-color:red;}*/

	.table_select_container { display:inline-block; float:left;vertical-align: top}
	.table_select_container select {font-size: .875em;}
	.table_select_container option {padding: .25em;}
	
	
	
	
	/*#query_0 .query_description_container, #query_0 .query_options_container {display:none;}*/
	/* following changed 10-13-16 */
/*	
	.report_builder_query[data-query_type='sub'] .report_title_container, .report_builder_query[data-query_type='union'] .report_title_container {display:none;}
	.report_builder_query[data-query_type='main'] .query_description_container, .report_builder_query[data-query_type='main'] .query_options_container {display:none;}
*/
	
	/* following added 6-11-18 to show/hide rows (li) of the horizontal_table depending on query_type */
/* 	THESE ARE A MESS!!!! ESPECIALLY WITH LOTS MORE QUERY TYPES: INSERT/DATETE/UPDATE/PIVOT */	
	.report_builder_query[data-query_type='sub'] li.query_type_main, .report_builder_query[data-query_type='union'] li.query_type_main {display:none;}
	.report_builder_query[data-query_type='main'] li.query_type_sub, .report_builder_query[data-query_type='union'] li.query_type_sub, .report_builder_query[data-query_type='update'] li.query_type_sub {display:none;}
	.report_builder_query[data-query_type='main'] li.query_type_union, .report_builder_query[data-query_type='sub'] li.query_type_union, .report_builder_query[data-query_type='update'] li.query_type_union {display:none;}
	
	.report_builder_query[data-query_type='main'] div.union_query_field_container, .report_builder_query[data-query_type='sub'] div.union_query_field_container, .report_builder_query[data-query_type='update'] div.union_query_field_container, .report_builder_query[data-query_type='insert'] div.union_query_field_container, .report_builder_query[data-query_type='delete'] div.union_query_field_container, .report_builder_query[data-query_type='pivot'] div.union_query_field_container {display:none;}
	
	.report_builder_query li.query_type_update {display:none;}
/* andrew start here 11-8-19 */	
	.report_builder_query[data-query_type='insert'] li.query_type_update, .report_builder_query[data-query_type='update'] li.query_type_update {display:inline-block}
	
	
	
	.query_description_container, .query_options_container {display:inline-block; margin-left: 1em;}
	.query_description_container label, .query_options_container {vertical-align: top; padding-top: 0.25em;display:inline-block;}
	.query_description_container textarea {max-width: 100%; width: 400px; padding: 0.25em;font-size: .875em;}
	.query_options_container select {padding: 0.25em;font-size: .875em;}
	
	
	/*.btn_show_formula_builder { float: right;margin-right: 3em;}	*/
	
	.select_field_container .card-block { width: 100%;  overflow-x: auto; overflow-y: hidden;   white-space: nowrap; margin-bottom: 10px;}
	.select_query_field_container, .select_table_field_container {display:inline-block;}
	.select_table_field_container {
		width: 100%;  overflow-x: auto; overflow-y: hidden;   white-space: nowrap;
		
	}
	.select_field_container_button_container { margin-bottom:10px;}
	
	/*.select_table_container { width: 16em; margin:5px .25em 0; border:1px solid #ccc; font-size: .875em; display:inline-block; vertical-align:top; }*/

/* commented out these 12-1-20 becuase we are using same style spans with icons as for a form	
	.select_table_container span { padding: 5px; background-color: #34495e; color: #fff; display:block; font-weight: bold;}	
	.select_table_container span {background-color: #333}
*/
	
	/*.select_table_inner_container { width: 100%; height: 400px; overflow-y:auto; overflow-x: hidden; background-color: #fff; } for sidebars*/
	.select_table_inner_container { 
		width: 100%; 
		height: 100px; 
		overflow-y:auto; 
		overflow-x: hidden; 
		background-color: #fff; 
		background:transparent;
	}
	
	.select_field_container_joins .card.select_table_container .select_table_inner_container {
		/*height: auto;*/
		height: 150px;
		background: #fff;
	}
	
	
	.select_table_container li { padding: 2px 1em; cursor:pointer; white-space:normal;} 
	.select_table_container li:hover:not(.field_selected) { background-color: #ccc; } 
	
	
/*.field_list_container, .join_container { width: 100%; height: 200px; overflow:auto; padding:5px; }*/
	
	.field_selected { background-color: #999; font-weight: bold;}
	.table_field_container {display:inline-block; position:relative; border-right: 1px dashed #666; cursor:move; vertical-align: top; max-width: 20em;overflow:hidden} /* need the veritcal align for the sortable*/
	.table_field_container:hover { background-color: #999; color: #000 }
	
	
	.field_container {width: 100%; border:1px solid #666; font-size: .875em; }
	.field_container {margin-bottom: 10px;}
	.field_container {position:relative; }
	
	/*.field_container li.field_aggregate_function, .field_container li.field_join_select {display:none;}	*/
	/*.field_container li.field_aggregate_function {display:none;}*/
/* 11-30-20 */
	/*.report_builder_query [data-id='field_aggregate_function'] {display:none;}*/
	/*9-4-25 commented out next line*/
	/*.query_builder_field_container [data-id='field_aggregate_function'] {display:none;}*/  /* 1-18-21*/
	.query_builder_field_container .aggregate [data-id='field_aggregate_function'] {display:table-cell;} /* 1-18-21*/

	.report_builder_query .union_query_col {display:none;}  /* 1-26-21*/
	.report_builder_query[data-query_type='union'] .union_query_col {display:inline-block;} /* 1-26-21*/
	
	.report_builder_query [data-id='field_set_value'] {display:none;}
	
	
	.report_builder_query[data-query_type='main'] .field_container li.field_join_select {display:none;}
	.report_builder_query[data-query_type='union'] .field_container li.field_join_select {display:none;}
	.report_builder_query[data-query_type='update'] .field_container li.field_join_select {display:none;}
	.report_builder_query[data-query_type='insert'] .field_container li.field_join_select {display:none;}
	.report_builder_query[data-query_type='delete'] .field_container li.field_join_select {display:none;}
	.report_builder_query[data-query_type='pivot'] .field_container li.field_join_select {display:none;}
	
	.table_field_header_container {display:inline-block; position:relative; background-color: #ddd; color: #000; border-right: 1px dashed #666; float:left}
	.table_field_header_container span, .table_field_container select {display:block;}
	.table_field_sortable_container { position: relative;overflow-x: auto; overflow-y: hidden;   white-space: nowrap; }
		
	
	.table_field_header_container li, .table_field_container li { border-bottom: 1px solid #ccc; height: 2em;line-height:2em;padding:0 1em 0 .5em}
	.table_field_header_container li:last-child, .table_field_container li:last-child { border-bottom: 0px}	
	
	.table_field_container li.field_title {padding:0px;}
	.table_field_container li.field_title input  {height: 100%;margin-right: 2em; padding-left: .5em;}
	.table_field_container li select {height: 100%;width: 100%; max-width: 12em;}
	.table_field_container li.field_show { text-align: center }
	
	
	.join {
		color: #930077; /* magenta*/
	}
	.join_disabled {color: #999}
	
	.meta_container option { padding: .5px .25em; }
	.meta_container input { padding: 3px .25em; }
	
	.meta_container_container {width: 100%; display:block; margin-bottom: 10px;}
/*
	.meta_container { width: 32.333%; margin-right: 1.5%; padding: 5px 0px; float:left;}	
	.meta_container_container div:nth-child(3), .meta_container_container div:nth-child(5) { margin-right: 0}
*/
	
	span.header { width: 100%; padding: .25em .5em; display:block; color: #fff; background-color: #666; font-weight:bold; }		
	span.header {background-color: #34495e}
	span.header {background-color: #333; font-size: .875em; font-weight: bold; padding: .5em;}
	
	.meta_container .col_headers { background-color: #bbb; padding: .5em; width: 100%;font-weight:bold;}
	.meta_container .col_headers span { display:inline-block; margin-right: .5% }
	.meta_container li { padding: 5px .5em; border-width:1px 1px 0px 1px; border-color: #ccc; border-style: solid; cursor:move; background-color: #eee}
	.meta_container li:first-child { border-top-width: 0px; }
	.meta_container li:last-child { border-width: 1px; }
	.meta_container li span { display:inline-block; width: 90%; padding:3px 0}
	.meta_container li .delete_button span {padding:0}
	.meta_container li:hover {background-color: #999}
	
	.sort_container li span { width:70%}	
	.sort_container li select { width: 20%; padding: 3px 0}
	


	.report_builder_query[data-query_type='main'] .group_container, .report_builder_query[data-query_type='main'] .dynamic_filter_container,  .report_builder_query[data-query_type='pivot'] .group_container, .report_builder_query[data-query_type='pivot'] .dynamic_filter_container{display:inline-block;}
	.report_builder_query[data-query_type='main'] .btn_add_field_to_group, .report_builder_query[data-query_type='main'] .btn_add_field_to_dynamic_filter, .report_builder_query[data-query_type='pivot'] .btn_add_field_to_group, .report_builder_query[data-query_type='pivot'] .btn_add_field_to_dynamic_filter {display:inline-block;}
	.report_builder_query[data-query_type='main'] li.field_group_function, .report_builder_query[data-query_type='main'] li.field_show, .report_builder_query[data-query_type='main'] li.field_format, .report_builder_query[data-query_type='pivot'] li.field_group_function, .report_builder_query[data-query_type='pivot'] li.field_show, .report_builder_query[data-query_type='main'] li.field_format {display:block;}	
	.report_builder_query .group_container, .report_builder_query .dynamic_filter_container, .report_builder_query li.field_group_function, .report_builder_query li.field_show, .report_builder_query li.field_format { display:none}
	.report_builder_query .btn_add_field_to_group, .report_builder_query .btn_add_field_to_dynamic_filter { display:none}		
	
	
	
	/*.static_filter_container { width: 49.25%;clear:both; }*/
	.static_filter_container span.col_header_filter_field { width: 30%}
	.static_filter_container span.col_header_filter_operator { width: 30%}
	.static_filter_container span.col_header_filter_value { width: 30%}
	.static_filter_container li span { width:30%; margin-right: .5%}	
	.static_filter_container li select { width: 30%; padding: 3px 0; margin-right: .5%}
	
	/*.where_container { width: 66.1667%;}*/
	/*.where_container { width: 49.25%;}*/
	/*.dynamic_filter_container { width: 49.25%}	*/
	.dynamic_filter_container li span { width:30%; margin-right: .5%}	
	.dynamic_filter_container li select { width: 30%; padding: 3px 0; margin-right: .5%}
	.dynamic_filter_container span.col_header_filter_field { width: 30%}
	.dynamic_filter_container span.col_header_filter_type { width: 30%;}
	.dynamic_filter_container span.col_header_filter_default_value { width: 30%;}
	
	
	.formula_builder_container { display:none; border: 1px solid #666; background-color: #ddd; margin: 10px 0; position: relative }
	.formula_builder, .where_container_formula { border:1px solid #ccc; background-color: #fff; height: 100px; padding:.5em 1em;}	
	.formula_builder_container .left_side {width: 60%; margin: 1%; display:inline-block; float:left;}
	.formula_builder_container .right_side {width: 35%; margin: 1% 0; display:inline-block;}
	.formula_builder_container span.header { padding: .75em .5em;}
	.formula_builder span.field, .where_container_formula span.field, .formula_builder span.visible_field, .where_container_formula span.visible_field { color: blue; } 	
	.formula_builder div.derived_fields, .where_container_formula div.derived_fields { display:none } 	
	.formula_builder_list { overflow-y: scroll; height:150px; border:1px solid #ccc; background-color:#fff; }
	.formula_builder_list li { padding: .25em 1em; cursor: pointer; font-size: .875em;}
	.formula_builder_list li:hover { background-color: #ccc;}
	
	.formula_builder_container.field_formula .btn_save_formula {display:inline-block;}
	.formula_builder_container.field_formula .btn_save_formula_to_where {display:none}
	
	.formula_builder_container.where_formula .btn_save_formula {display:none;}		
	.formula_builder_container.where_formula .btn_save_formula_to_where {display:inline-block;	}		

	
	.btn_add_field_to_formula { display:none; }
	.btn_hide_formula_builder { position: absolute; top:.1em; right:.1em; width: 1.5em; line-height: 1.5em; font-size: 1.25em; background-color: #ddd; border-radius: 3px; color: #666; border: 1px solid #999; cursor:pointer; text-align: center;}
	.btn_hide_formula_builder:hover {background-color: #ccc }
	.formula_buttons { margin: 1em 0 0}
	.formula_buttons .btn_replace_formula {display:none; }
	
	#report_builder_preview_container {min-height: 300px;}
	#report_builder_preview_container .table_pagination {display:none;}
	#report_builder_preview_container span.no_data { display:inline-block; padding: 1em; font-size: 1.5em; color: #333;}
	
	/*.row_event_container { width: 49.25%;}*/
	.row_event_container li span { width:30%; margin-right: .5%}	
	.row_event_container li select { width: 30%; padding: 3px 0; margin-right: .5%}
	.row_event_container span.col_header_redirect_page { width: 30%}
	.row_event_container span.col_header_redirect_id_field { width: 30%;}
	.row_event_container span.col_header_redirect_option { width: 30%;}	

	/* following added 7-24-18 for query_builder/formula_builder*/
	span.highlight_paren {color:blue;font-weight:bold;}
	span#partial_function_remainder {color:#aaa;}
	div.formula_builder {
		position:relative;
	}
	div.function_autocomplete {
		display:none;
		position:absolute; 
		width:300px; 
		height:150px; 
		/*top:20px; 
		left:0px; */
		background-color: #e1e1e1;
		padding:5px;
		overflow-y:auto; /* scroll??? */
	}
	div.function_autocomplete.show {
		/*display:block;*/
	}
	div.formula_builder span {
		 white-space: pre-wrap; /* needed for spans that are just spaces in teh formulaS*/
	}		
	
	
	
/* FOLLOWING IS FOR THE NEW HORIZONTAL_TABLE USED FOR REPORT FIELDS WHICH MIMICS THE OLD FIELD_CONTAINER */
	
	.query_builder, .query_builder input, .query_builder select, .query_builder button {
		/*font-size: .875rem;*/ /* 14/16 */
		font-size: .8125rem; /* 13/16 */
		
	}
	
	.query_properties_container {
		background-color: #f1f1f1;
		border-left: 1px solid #e1e1e1;
	}
	
	.query_properties_container .tab_container.level3_tab {
		padding: .25rem .5rem; 
		font-size: .75rem; /* 12*/
	}
	
	.horizontal_table_container {
		/*border: 1px solid #ccc;*/
		/*padding: 5px;*/	
		
	}
	
	.horizontal_table_container .col_container {
		display:inline-block;
		border-right: 1px dashed #ccc;		
		vertical-align:top;		
	}
	.horizontal_table_container .sortable .col_container {
		cursor: move;
	}
	.col_container { width: 150px;}
	
	.col_container.active {
		border:1px solid blue;
	}
	
	.horizontal_table_container ul {
		margin-bottom: 0;
		width: 100%; /* need this for resizing */
	}
	
	.horizontal_table_container li {
		border-bottom: 1px solid #ccc;
		height: 3em;
		line-height:3em;
		/*padding: 0 1em 0 .5em;*/
		/*overflow:hidden;*/ /*TEMP HACK*/
		padding: 5px;
	}
	.horizontal_table_container li:last-child {
		border-bottom: none;
	}
	
	.horizontal_table_header {
		display:inline-block;
		float:left;
		border-right:1px solid #ccc;		
		background-color:#ddd;
	}
	
	.horizontal_table_body {/* union_query_field_container is not sortable*/
		overflow-x: hidden;
		overflow-y: hidden;
		white-space: nowrap;		
	}
	
	.horizontal_table_body.sortable {/* union_query_field_container is not sortable*/
		overflow-x: auto;
		overflow-y: hidden;
		white-space: nowrap;		
	}
	.horizontal_table_header ul {
		width: 150px;
		
	}
	.horizontal_table_body ul {
		/*width: 150px;*/
		background-color:#f1f1f1;
	}
	
	/* following temp hack */
	.select_table_inner_container {height:auto;}
	.table_select_container {width: 100%}
	.card.select_table_container {width:100%; max-width:auto;}
	
	.query_builder table td, .query_builder table th {padding: .25rem;} /* cell padding for query results tables */
	
	
/**************** FOLLOWING FOR CALENDAR*************************/

#calendar_container #calendar_toolbar button {
	margin-right: 5px;
}
	
#calendar_container div.monthly_calendar_header div.col,  #calendar_container div.weekly_calendar_header div.col {	
	text-align:center;
	font-weight: bold;
	font-size: 1.25rem;
	padding-bottom: 5px;
}
	
#calendar_container div.monthly_calendar_detail div.row {
	height: 100px;
	/*height: 500px;*/ /*for testing */
	border-bottom:1px solid #ccc;
}
#calendar_container div.monthly_calendar_days_of_the_week {
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #ccc;
	height: 40px;
}

#calendar_container div.monthly_calendar_days_of_the_week div.col {	
	border-right:1px solid #ccc;
	background-color: #333;
	color: #fff;
	padding: 5px;
}

#calendar_container div.monthly_calendar_days_of_the_week span {
	/*display:table;
	margin:0 auto;*/
	display:block;
	font-weight: bold;
	text-align: center;
}
#calendar_container div.monthly_calendar_detail div.col {
	border-right: 1px solid #ccc;
	padding:1px;
	background-color: #fff;
	/*overflow-x: auto;*/
	/*overflow-y: auto;*/
	/*overflow-y:hidden;*/
}
#calendar_container div.monthly_calendar_detail div.col:first-child {
	border-left: 1px solid #ccc;
}
/*calendar_container div.monthly_calendar_detail div.row:not(:first-child) div.col span {*/
/*#calendar_container div.monthly_calendar_detail div.row div.col span {*/

#calendar_container div.monthly_calendar_detail div.col div.calendar_event, #calendar_container div.weekly_calendar_detail div.calendar_event {
	position: absolute;
	/*width:101%;*//* 101 so that it runs thru the border*/
	color: #fff;
	background-color: #000;
	margin-bottom: 1px;
	font-size: 10px;
	z-index: 10; /* so that the line goes over the border between days */
	
}
#calendar_container div.weekly_calendar_detail div.calendar_event {
	border:1px solid #fff;
}

#calendar_container div.monthly_calendar_detail div.row div.col span.month_day {
	float:right;
}
#calendar_container span.today {
	color: red;
	font-weight: bold;
}
#calendar_container span.current_month {
	color: black;
}

#calendar_container div.monthly_calendar_detail div.different_month {
	background-color: #e1e1e1;
}

#calendar_container span.different_month {
	color:gray;
}
#calendar_container .weekly_calendar_detail div.calendar_cell {
	height: 40px; 
	/*height: 120px;  for testing*/
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;	
	position:relative;
}
#calendar_container .weekly_calendar_detail div.calendar_cell.all_day {
	height:auto;
	min-height: 40px;	
}

#calendar_container .weekly_calendar_detail div.calendar_cell span.hour_str {
	float: right;
	padding-right:3px;
	font-size: 10px;
}
#calendar_container .weekly_calendar_detail div.calendar_cell.weekly_header {
	background-color: #333;
	color: #fff;
	padding: 5px;
}

#calendar_container .weekly_calendar_detail div.calendar_cell.weekly_row_header {
	border-left: 1px solid #ccc;
	background-color: #999;
	font-weight: bold;
}


/**************** FOLLOWING FOR EDITING MENUS IN BUILDER*************************/
#waasio-user-menus-main-card-body {
	height:320px;
	overflow-x:auto;
	overflow-y:hidden;
	white-space:nowrap;
}

.waasio_user_menus_col_container {
/*	width: 150px;
	height:300px;
	margin-right:10px;
*/	
	display:inline-block;

}

#waasio-user-menus-main-card-body .card {
	width: 150px;
	height:300px;
	display:inline-block;
	margin-right:10px;
}
#waasio-user-menus-main-card-body .card-body {
	overflow:auto;	
	height: 250px;
	
}
#waasio-user-menus-main-card-body .card-body span {
	display:block;
}

#waasio-user-menus-main-card-body .card[data-col_type='submenu'] { /*TEMP HACK FOR SUBMENUS */
	margin-top: 40px;
	height:260px;
	vertical-align: bottom;
}
.waasio_user_menus_submenu_container {
	display:inline-block;
}
.waasio-user-menus-menu_row.active, .waasio-user-menus-submenu_header.active {
	background-color: #ccc;
}
/*************** FOLLOWING FOR NAVBAR SUBMENUS *******************/
.dropdown-submenu {
  position: relative;
}

.dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -1px;
}

div.properties_container.normal_width .spa-main-properties-container {
	/*margin-left: 0%;*/
	/*position:relative;*/
	transition:all 500ms linear;
	position:absolute;
	right:10px;
	/*width:auto;*/
	width:100%;
	
}

div.properties_container.properties_wide .spa-main-properties-container {
	/* this is for making the properties container grow */
	width:90%; /* not sure what this should be*/
	width: 1000px;
	
	position:absolute;
	right:10px;
	max-width: none;
	/*transition: width 1s; this does not work because it animates from the left, not the right*/
	/*transition:width 1s;*/
	/*transition:right 1s linear;*/
	transition:all 500ms linear;
	/*transition: right 2s, width 2s;*/
	/*margin-left: 10%;*/
	
	background-color: #fff;
	/*opacity: .9; */
	border:1px solid #ccc;
}

div.properties_container_header_NOT_USESD {
	color: #7678ed;
	font-weight: bold;
	border-bottom: 1px solid #7678ed;
	font-size: .875rem; /* 14 */
	padding-bottom: .25rem;
	margin-bottom: .75rem;
}

div.properties_container_header {
	color: teal;
	font-weight: bold;
	/*border-bottom: 1px solid #7678ed;*/
	font-size: .875rem; /* 14 */
	padding-bottom: .25rem;
	/*margin-bottom: .75rem;*/
}


.form_element_container {
	position:relative;/* need this for tooltips which have absolute*/
}

.invalid-tooltip.warning {/* this is for a form's validation*/
	/* this is yellow and matches bootstrap's alerts*/
	color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

/*********** FOLLOWING FOR KANBAN ************/
.kanban_card {
	margin: 10px;
}
/* for table cells */
.left_justify {
	text-align: left;
}
.center_justify {
	text-align: center;
}

.right_justify {
	text-align: right;
}
.form_element_container.form-inline label {
	justify-content: left; /* need this in a filter form for the label of a date range*/
}

.kanban_card input {
	/* 9-7-25 HACK to make an input like a span element */
	border:0;
	padding:0;
}
div[data-element_type='kanban_container'] .card-body {
	padding:0;
}
div[data-element_type='kanban_container'] .card-body .card-body {
	padding:.875rem;
}

.kanban_card input .form-control:disabled, .form-control[readonly] {
	background: transparent;
}


/* following for waasio dropdown and two col select*/
.two_col_select_container {
	width: 500px; /* temp hack */
}
.waasio_dropdown_container {
	display: none;
	position: absolute;
	/* following styles to MOSTLY match bootstrap dropdown */
	z-index: 1000;
	min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;    
    color: #212529;
    text-align: left;
	background-color: #fff;
    background-clip: padding-box;
	border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

/* following for ACE code editor */
#editor { 
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
/******* FOLLOWING TO MODIFY BOOTSTRAP TABS ***************/
.nav-tabs .nav-item a {
	padding: .5rem .5rem;
}

.nav-tabs i {
	font-size: 1rem; /*16px;*/
}

.nav-tabs {
		
	border-bottom: 1px dotted #3a0088; /* dark purple*/
	
	border-bottom: 1px solid #930077;
	border-bottom: 1px solid #e1e1e1;
	
	
}

.nav-tabs .nav-link:hover {	
	border-bottom:3px solid #930077;
	color: #930077;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	/*border-color: #313131 #313131 #fff;
	border-color: #7678ed #7678ed #fff;*/
	/*background-color: #e1e1e1;*/
	/*color: #fff;*/
	border-top: 1px dashed #7678ed; 
	border-left: 1px dashed #7678ed;
	border-right: 1px dashed #7678ed;
	
	border-top: 1px dotted #3a0088; 
	border-left: 1px dotted #3a0088;
	border-right: 1px dotted #3a0088;
		
	/*border-bottom: 1px solid #fff;	*/
	border-bottom: 1px solid #f1f1f1;
	color: #313131;	
	font-weight: bold;
	background:transparent;
	
	
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:3px solid #930077;
	color: #930077;
	
	
}
a.nav-link {
	color: #7678ed; /* light purple*/
	color: #3a0088; /* dark purple */
	color: #313131;
	
}
.nav-tabs .nav-link {
	/*border-bottom:3px solid #cded32;*/
	border-top:none;
	border-left:none;
	border-right:none;
}

.level2_tab.upside_down .nav-tabs {
	/*border-bottom: 1px dashed teal;*/
	border-bottom: 0px;
	border-top: 1px dashed teal;
}
.level2_tab .nav-tabs {
	/*border-bottom: 1px dashed teal;*/
	border-top: 0px;
	border-bottom: 1px dotted teal;
}

.level2_tab.upside_down .nav-tabs .nav-item {
	margin-bottom:0px;
	margin-top: -1px;
}

.level2_tab .nav-tabs .nav-item {
	margin-top:0px;
	margin-bottom: -1px;
}

.level2_tab.upside_down .nav-tabs .nav-link {
	border: 1px solid transparent;
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem;
	border-bottom-left-radius: .25rem;
    border-bottom-right-radius: .25rem;
}

.level2_tab .nav-tabs .nav-link {
	border: 1px solid transparent;
    border-bottom-left-radius: 0rem;
    border-bottom-right-radius: 0rem;
	border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}

.level2_tab a.nav-link {
	color: #313131;
	font-size: .75rem; /* 12 */
}

.level2_tab li.pages-sidebar-element {
	padding-left: .25rem;
	color: teal;
}

.level2_tab li.pages-sidebar-element i {
	color: teal;
}

.level2_tab .nav-tabs .nav-link:hover {	
	border-top: 1px solid #e1e1e1;
	border-left: 1px solid #e1e1e1;
	border-right: 1px solid #e1e1e1;
	border-bottom: 1px dotted teal;	
	color: teal;
}
.level2_tab.upside_down .nav-item a.active {
	/*border-top: 1px dashed teal;*/
	border-bottom: 1px dashed teal;
	border-left: 1px dashed teal;
	border-right: 1px dashed teal;
	/*border-top: 1px solid #fff;*/
	border-top: 1px solid #f1f1f1;	
	color: teal;
}
.level2_tab .nav-item a.active, .level2_tab .nav-item a.active:hover {
	border-top: 1px dotted teal;
	border-left: 1px dotted teal;
	border-right: 1px dotted teal;
	border-bottom: 1px solid #f1f1f1;	
	color: teal;
}

.level3_tab a.nav-link {
	border:none;
	color: #313131;
}


.level3_tab .nav-tabs .nav-link {
	border-radius: 0px;
}

.level3_tab .nav-item a.active {
	border:none;
}

.level3_tab .nav-tabs {
	border:none;
	font-size: .75rem;
}
.level3_tab .nav-tabs .nav-link {
	border:none;	
}
.level3_tab .nav-tabs .nav-link:hover {
	border-bottom: 2px solid #e1e1e1;
}
.level3_tab .nav-tabs .nav-link.active {	
	border-bottom: 2px solid #930077; /* magenta*/
	color: #930077;
}


.card {
	background: transparent;
	border:none;
}
.card-header {
	background: none;
	font-size: .875rem; /* 14 */
	padding: .25rem 0rem;
	border-bottom: 1px solid #930077; /* magenta*/
	color: #930077; /* magenta*/
	border-radius: 0px;
	font-weight:bold;
}
.card.select_field_container_joins, .card.select_field_container_joins {
	height: 240px;
}
.card .card .card-header {
	padding: .25rem .5rem;
	background-color: #e1e1e1;
	color: #313131;
	font-weight:normal;
}

.card .card.active .card-header {
	background-color: #930077; /* magenta*/
	color: #fff;
}
.card .card .card-body {
	border: 1px solid #e1e1e1;
	background-color: #f1f1f1;
}
.card-header:first-child {
	border-radius: 0px;
}

div.card.active div.card-header {/*bs4 white on blue*/
/*
	background-color: #0275d8;
    background-color: seagreen;
	border-color: #0275d8;
	border:none;
	color:#fff;
*/	
}
div.select_table_field_container div.card-header:hover {
/*	
	background-color: #025aa5;
    border-color: #01549b;
	color:#fff;
*/	
	cursor:pointer;
    
}	

div.card.no-padding div.card-block {
	padding:0;
}

.report_builder_container .card-body {
	padding:0px
}
	.card.select_table_container { 
		/*max-width: 200px; 
		margin:5px; */
		display:inline-block; 
		vertical-align:top;
	}
	
	.select_field_container_joins .card.select_table_container {
		max-width: 200px; 
		margin:5px;
		margin: 0px;
	}