/**
 * General CRUD CSS
 */

/* controls */
body#ViewWrapper-Timesheets > main > div#CRUD-controls {
	position: fixed;
	width: calc( 100% - 185px );
	padding-right: 10px;
	height: 40px;
	top: 31px;
	right: 0px;
	/* text-align: right; */

	/* background-color: rgb(3, 73, 133); */
	background-color: rgb(4,90,163);

	z-index: 10;

	transition: all 0.25s ease 0s;

	font-size: 0px; /* collapse spacing */
}
	/* controls with noshell */
	body#ViewWrapper-Timesheets.noshell > main > div#CRUD-controls {
		top: 0px;
		right: 0px;
		left: 35px;
		width: calc( 100% - 35px ) !important;
	}

	/* right-floated custom options for CRUDs */
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #options {
		float: right;
		margin: 10px;
	}

		/* option icon */
		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #options > .fa {
			/* float: left; */
			font-size: 17px;
			color: rgba(255,255,255,.85);
			text-shadow: 1px 1px 0px rgba(0,0,0,.5);

			cursor: pointer;
		}

			/* hover */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls > #options > .fa:hover {
				color: white;
				text-shadow: 1px 1px 0px black;
			}

			/* not-last icon */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls > #options > .fa:not(:last-of-type) {
				margin-right: 25px;
			}

			/* option icon text label */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls > #options > .fa > label {
				display: inline-block;
				margin-top: 2px;
				vertical-align: top;

				font-family: Open Sans, Calibri, Arial;
				font-size: 13px;
				cursor: pointer;
			}

	/* filters container */
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters {
		display: block;
		margin: 6px 0px 0px 0px;
	}

		/* filters container with noshell */
		body#ViewWrapper-Timesheets.noshell > main > div#CRUD-controls > #filters {
			margin-left: 5px;
		}

		/* adjustment for chrome */
		body#ViewWrapper-Timesheets.is-browser-chrome > main > div#CRUD-controls > #filters {
			margin-top: 6px;
		}

	/* all filter inputs */
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > input,
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > select,
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters label {
		background-color: rgba(255,255,255,.7);
		border: none;
	}

		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > * {
			display: inline-block;
		}

		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters *.hide {
			display: none;
		}

	/* any disabled element */
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters :disabled:not(.disabled-noemph),
	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters [disabled-for]:not(.disabled-noemph) {
	 	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAI0lEQVQImV3IsQ0AAAiEQEZ3c2yM0afjMAKKBFUSFi/Mf1Bt2HFSMWFAzcIAAAAASUVORK5CYII=);
		cursor: default;
	}

 	/* controls with header collapsed */
 	body#ViewWrapper-Timesheets.header-collapsed > main > div#CRUD-controls {
 		width: calc( 100% - 55px );
 	}

 	/* all immediate child control elements */
 	body#ViewWrapper-Timesheets > main > div#CRUD-controls > * {
 		display: inline-block;
 	}

		/* all filter elements */
		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > :not(:last-child) {
			margin-right: 2px;
		}

 		/* clear button */
		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > #filters-clear {
			margin: -11px 15px 0px 20px;
			vertical-align: middle;
			font-size: 21px;
		}
 			body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > #filters-clear:not(:hover):not(:active) {
 				color: rgba(255,255,255,.75);
 			}

		/* text */
		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > span.text {
			margin-left: 10px;
			font-family: Open Sans, Calibri, Arial;
			color: white;
			font-size: 13px;
		}
			/* text as right-aligned filterbar title */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > span.text.filterbar-title-right {
				text-align: right;
				float: right;
				font-weight: bold;
				font-size: 18px;
				margin: 7px;
			}

 		/* filter <select> */
 		body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > select {
			max-width: 250px;
 		}

		/* prev/next buttons */
		body#ViewWrapper-Timesheets > main > div#CRUD-controls .prev-next-nav {
			vertical-align: top;
			margin-top: -3px;
			width: 35px;
			padding: 0px;

			text-align: center;
			font-size: 34px;
			color: rgba(255,255,255,.7);
			cursor: pointer;

			border: none;
			background: transparent;
		}
			/* offset adjustment when adjacent to <select> el */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls .prev-next-nav.adjacent-select {
				margin-top: -1px;
			}

			/* hover, click, disabled */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls .prev-next-nav:hover {
				color: white;
			}
			body#ViewWrapper-Timesheets > main > div#CRUD-controls .prev-next-nav:active {
				color: rgba(255,255,255,.5);
			}
			body#ViewWrapper-Timesheets > main > div#CRUD-controls .prev-next-nav:disabled {
				background: transparent !important;
				color: rgba(255,255,255,.2) !important;
			}

			/* filter group */
			body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > .filter-group {
				display: inline-block;
				/* margin-top: 7px; */
			}

				/* visually separeated filter group from the left */
				body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > .filter-group.separate-left {
					margin-left: 10px;
				}

				/* tidy select-like menu for filter group */
				body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > .filter-group.select-tidy {
					width: 250px;
					position: absolute;
				}
					/* select tidy title option */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > .select-tidy > .select-tidy-option.title {
						font-family: 'Roboto Mono';
						font-size: 14px;
						text-shadow: 1px 1px 0px white;
						text-align: left;
					}

					/* select tidy options */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > .select-tidy > .select-tidy-option:not(.title) {
						display: none;
					}
					/* select tidy options when menu open */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > .filter-group.select-tidy.open > .select-tidy-option {
						display: block;
						width: auto;
					}

				/* general button */
				body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters button.filter-general {
					padding: 4px 12px 4px 12px;

					font-family: 'Roboto Mono';
					font-size: 14px;
					text-shadow: 1px 1px 0px white;

					text-align: center;

					border-right: 1px solid rgba(0,0,0,.5);
					background-color: rgba(255,255,255,.7);
					cursor: pointer;
				}

					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters button.filter-general:is(:disabled,[readonly]) {
						cursor: default;
					}

					/* general button hover */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters button.filter-general:not(:disabled,[readonly]):hover {
						background-color: rgba(255,255,255,.8);
					}
					/* general button click */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters button.filter-general:not(:disabled,[readonly]):active {
						background-color: rgba(255,255,255,.5);
					}
					/* general button hidden */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters button.filter-general.hide {
						display: none;
					}

				/* buttons in toggle group */
				body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label {
					padding: 5px 15px 5px 15px;

					font-family: 'Roboto Mono';
					font-size: 14px;
					text-shadow: 1px 1px 0px white;

					text-align: center;

					border-right: 1px solid rgba(0,0,0,.5);
					opacity: .35;
					cursor: pointer;
				}

					/* left-separated label */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label.separate {
						margin-left: 25px;
					}

					/* label containing only an icon */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label.icon-only {
						display: inline-block;
						margin-top: -8px;
						padding: 7px 8px 6px 8px;
						width: 20px;

						text-align: center;

						font-size: 0px; /* collapse spacing */
					}
						/* icon inside icon-only label */
						body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label.icon-only > .fa {
							width: 20px;
							text-align: center;
							font-size: 14px;
						}


					/* hide check/radio inputs */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label > input[type="checkbox"],
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label > input[type="radio"] {
						display: none;
					}

					/* toggle group button when selected */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label.checked {
						opacity: 1;
						text-shadow: none;
					}

					/* visual separation */
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label:not(:last-of-type) {
						border-right: 1px solid rgba(0,0,0,.25);
					}
					body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters .filter-group.toggles label:not(:first-of-type) {
						border-left: 1px solid rgba(255,255,255,.25);
					}


	 	/* search */
	 	body#ViewWrapper-Timesheets > main > div#CRUD-controls > #filters > input:not([type="checkbox"]):not([type="radio"])[name="filter-search"] {
	 		width: 300px;
			padding: 4px;
	 	}

		/* info container */
		body#ViewWrapper-Timesheets > main > div#CRUD-controls > .info {
			display: inline-block;
			margin-left: 25px;

			font-family: Open Sans, Calibri, Arial;
			color: rgba(255,255,255,.9);
			font-size: 14px;
			font-weight: bold;
		}

		/* bottom toolbar */
		body#ViewWrapper-Timesheets > main div#toolbar-bottom {
			position: fixed;
			right: 0px;
			bottom: 0px;
			width: calc( 100% - 175px );
			height: 58px;
			text-align: right;

			background: rgba(7,207,226,.9);

			transition: width 0.25s ease 0s;

			font-family: Open Sans, Calibri, Arial;
			font-size: 15px;
			color: black;
		}

			/* toolbar containing only summaries */
			body#ViewWrapper-Timesheets > main div#toolbar-bottom.summaries-only {
				height: 23px;
				padding-top: 8px;
			}

			/* bottom toolbar with header collapsed */
			body#ViewWrapper-Timesheets.header-collapsed > main div#toolbar-bottom {
				width: calc( 100% - 45px );
			}

			/* icons in buttons */
			body#ViewWrapper-Timesheets > main div#toolbar-bottom > button > .fa,
			body#ViewWrapper-Timesheets > main div#toolbar-bottom > a.button > .fa {
				margin-left: 10px;
			}

				/* batch options container */
				body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination {
					position: absolute;
					bottom: 1px;
					margin-left: 10px;
					width: 75%;
					display: inline-block;
					z-index: 9;
					color: rgba(0,0,0,.65);
					text-align: left;

					font-family: 'Roboto Mono';
					font-size: 13px;
				}

					/* page number input */
					body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > input {
						font-family: 'Roboto Mono';
						font-size: 13px;
						color: white;
						background-color: rgba(4,90,163,.75);
						border-bottom: 0px;
						width: 50px;
					}

					/* pages */
					body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > #pages {
						font-weight: bold;
					}

					/* all nav icons */
					body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > .nav {
						vertical-align: top;
						color: rgba(4,90,163,.75);
					}
						/* hover nav icons */
						body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > .nav:hover {
							color: rgba(0,61,112,.75);
							cursor: pointer;
						}

						/* click nav icons */
						body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > .nav:active {
							color: white;
							text-shadow: -1px -1px 0px rgba(0,61,112,.75);
						}

						/* prev/next nav icons */
						body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > .nav.prevnext {
							font-size: 20px;
							margin: 4px 10px 0px 10px;
						}

						/* first/last nav icons */
						body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > .nav.firstlast {
							font-size: 30px;
							margin: -3px 10px 0px 10px;
						}
							/* last nav icon */
							body#ViewWrapper-Timesheets > main div#toolbar-bottom > #pagination > .nav.firstlast[nav="last"] {
								margin-right: 25px;
							}

				/* batch options container */
				body#ViewWrapper-Timesheets > main div#toolbar-bottom > #batch-options {
					position: absolute;
					bottom: -50px;
					margin-left: 10px;
					width: 75%;
					display: inline-block;
					text-align: left;

					opacity: 0;
					transition: bottom .15s linear 0s, opacity .15s linear 0s;
				}

					/* batch UI container when items selected */
					body#ViewWrapper-Timesheets > main div#toolbar-bottom > #batch-options.show {
						bottom: 5px;
						opacity: 1;
						z-index: 9;
					}


				/* summaries container */
				body#ViewWrapper-Timesheets > main div#toolbar-bottom > #summaries {
					position: relative;
					width: calc( 100% - 10px );
					display: inline-block;
					vertical-align: top;
					margin: 1px 10px 0px 0px;
					text-align: right;

					font-family: Roboto Mono, Courier New;
					font-size: 13px;
				}

					/* summary item label */
					body#ViewWrapper-Timesheets > main div#toolbar-bottom > #summaries > label {
						display: inline-block;
						margin-left: 25px;
						font-weight: bold;
					}

					/* summary item data */
					body#ViewWrapper-Timesheets > main div#toolbar-bottom > #summaries > data {
						display: inline-block;
					}
