/** Shared UI components */

/* all dialogs */
.ui-dialog-content > p {
	line-height: 1.35;
	margin-bottom: 25px;
}

/* any disabled element */
body#ViewWrapper-Timesheets :disabled:not(.disabled-noemph):not(.disabled-lowemph),
body#ViewWrapper-Timesheets [readonly]:not(.disabled-noemph):not(.disabled-lowemph), {
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAFUlEQVQImWNgQAOrzpz5T3UBBgYGAFQ/EEbxg55OAAAAAElFTkSuQmCC);
	color: rgba(0,0,0,.5);
	text-shadow: 1px 1px 0px rgba(0,0,0,.15);
	cursor: default;
}

body#ViewWrapper-Timesheets .disabled-lowemph:disabled,
body#ViewWrapper-Timesheets .disabled-lowemph[readonly] {
	background: transparent;
	color: rgba(0,0,0,.75);
	text-shadow: 1px 1px 0px rgba(0,0,0,.15);
	cursor: default;
}

/* disabled without quite as much emphasis */
body#ViewWrapper-Timesheets :disabled.disabled-noemph,
body#ViewWrapper-Timesheets [readonly].disabled-noemph {
	/* color: rgba(0,0,0,1) !important; */
	color: black;
	cursor: default;
}

/* icons when disabled */
body#ViewWrapper-Timesheets .fa.disabled,
body#ViewWrapper-Timesheets .fa.disabled:active,
body#ViewWrapper-Timesheets .fa.disabled:hover {
	color: rgba(0,0,0,.2) !important;
	text-shadow: none !important;
}

/* remove browser-styles on UI elements */
*:active, *:focus {
	outline: none;
}

/* inputs */
body#ViewWrapper-Timesheets input:not([type="checkbox"]):not([type="radio"]),
body#ViewWrapper-Timesheets select,
body#ViewWrapper-Timesheets button:not(.fa) {
	font-family: 'Roboto Mono';
	font-size: 14px;

	border: 0px;

	/* background-color: transparent; */

	/* background: yellow !important; */

	-moz-appearance: none;
	-webkit-appearance: none;
}
body#ViewWrapper-Timesheets input:not([type="checkbox"]):not([type="radio"]),
body#ViewWrapper-Timesheets select {
	background-color: transparent;
}

	body#ViewWrapper-Timesheets input:not([type="checkbox"]):not([type="radio"]),
	body#ViewWrapper-Timesheets select {
		padding: 5px;
	}
		body#ViewWrapper-Timesheets input[type="date"] {
			padding: 4px !important;
		}

	/* options */
	body#ViewWrapper-Timesheets select option {
		font-family: 'Roboto Mono';
		font-size: 14px;
	}

	/* flagged options and labels */
	body#ViewWrapper-Timesheets select option[flags*="obsolete"],
	body#ViewWrapper-Timesheets label[flags*="obsolete"] {
		color: rgba(0,0,0,.35) !important;
		font-style: italic;
	}

	/* flagged options and labels */
	body#ViewWrapper-Timesheets select option[flags*="pending"],
	body#ViewWrapper-Timesheets label[flags*="pending"] {
		color: rgba(255,0,0,.5) !important;
		font-style: italic;
	}

	/* flagged options and labels */
	body#ViewWrapper-Timesheets select option[flags*="warning"],
	body#ViewWrapper-Timesheets label[flags*="warning"] {
		color: rgba(255,0,0,.75) !important;
		font-style: italic;
	}

	/* <select> dimensions are screwy */
	body#ViewWrapper-Timesheets select {
		padding: 4px 5px 4px 5px !important;
	}
		/* chrome adjustment */
		body#ViewWrapper-Timesheets:not(.mobile).is-browser-chrome select {
			padding: 5px !important;
		}

		/* select menus for pay period */
		body#ViewWrapper-Timesheets select[name="PayPeriod"] option.current,
		body#ViewWrapper-Timesheets select[name*="PayPeriod-DateStart"] option.current {
			font-weight: bold;
		}

	/* text inputs only */
	body#ViewWrapper-Timesheets input:not([type="checkbox"]):not([type="radio"]) {
		border-bottom: 1px solid rgba(0,0,0,.35);
	}

	/* text input when focused */
	body#ViewWrapper-Timesheets input:not([type="checkbox"]):not([type="radio"]):not([readonly]):focus {
		border-bottom: 1px solid rgba(0,0,0,.9);
	}

	/* apply selective styling to all <select>'s */
	body#ViewWrapper-Timesheets select.grey-zeroth:not(.selected),
	body#ViewWrapper-Timesheets select.grey-zeroth > option:first-of-type {
		color: rgba(0,0,0,.5);
	}
		body#ViewWrapper-Timesheets select.grey-zeroth option {
			color: black;
		}


/** CONTROL ICONS **/

/* control icons containers */
body#ViewWrapper-Timesheets .control-icons {

}

	/* always hide checkboxes */
	body#ViewWrapper-Timesheets .control-icons:not(.show-inputs) input {
		display: none;
	}

	/* icons */
	body#ViewWrapper-Timesheets .control-icons .fa {
		font-size: 17px;
		width: 20px;
		text-align: center;
		color: rgb(75,75,100);
		vertical-align: middle;
	}
		body#ViewWrapper-Timesheets .control-icons:not(.readonly) .fa:is(:disabled,[disabled],[readonly],.disabled,.readonly) {
			background: transparent !important;
			color: rgba(0,0,0,.15) !important;
			cursor: not-allowed !important;
		}

		body#ViewWrapper-Timesheets .control-icons .fa:hover:not(:disabled):not([disabled]):not([readonly]) {
			color: rgb(75,75,200);
			cursor: pointer;
		}
		body#ViewWrapper-Timesheets .control-icons .fa:active:not(:disabled):not([disabled]):not([readonly]) {
			color: white;
			text-shadow: -1px -1px 0px rgba(0,0,0,.5);
			cursor: pointer;
		}

		/* icon label */
		body#ViewWrapper-Timesheets .control-icons .fa.labelled {
			width: auto;
			margin-left: 5px;
			margin-right: 5px
		}
			/* icon label */
			body#ViewWrapper-Timesheets .control-icons .fa > label {
				display: none;
			}

				/* icon label */
				body#ViewWrapper-Timesheets .control-icons .fa.labelled > label {
					display: inline-block;
					margin-left: 3px;
					margin-top: 2px;
					vertical-align: top;

					font-family: 'Roboto Mono';
					font-size: 12px;
					color: rgba(0,0,0,.75);
				}
					body#ViewWrapper-Timesheets .control-icons .fa.labelled > label:not(:disabled):not([disabled]):not([readonly]) {
						cursor: pointer;
					}

		body#ViewWrapper-Timesheets .control-icons .fa[readonly] {
			cursor:	help;
		}
		body#ViewWrapper-Timesheets .fa.fade {
			opacity: .15;
		}

/* persistent adjustment for ReleaseBanks icon */
.fa.ReleaseBanks {
	transform: scaleX(-1) rotate(-90deg);
}

/* general notification */
#PDCFW3-notify {
	position: fixed;
	display: block;
	z-index: 30;
	top: 50px;
	bottom: auto !important;

	text-align: center;

	font-family: Open Sans, Calibri, Arial !important;
	color: black !important;
	font-weight: bold !important;
	font-size: 13px !important;
	line-height: 1.75 !important;

	background-color: rgba(150,255,225,.9) !important;
	border: 1px solid rgba(0,0,0,.15) !important;
	box-shadow: 0px 0px 50px rgba(0,0,0,0.1) !important;
	opacity: 0;
	transition: opacity 0.2s ease 0s !important;
}
	#PDCFW3-notify.effect {
		opacity: 1;
	}

	/* dimensions and placement on mobile */
	body.mobile #PDCFW3-notify {
		left: calc( 10vw - 20px );
		width: 80vw;
		padding: 20px;
	}

	/* dimensions and placement on desktop */
	body:not(.mobile) #PDCFW3-notify {
		width: 500px;
		padding: 15px;
		margin-left: -260px;
		left: 50%;
	}

/* dialog alerts for wait messaging */
[aria-describedby^="TimesheetsApp-dialogModal"] {

}
	[aria-describedby^="TimesheetsApp-dialogModal"] .ui-dialog-titlebar {
		display: none;
	}

	[id^="TimesheetsApp-dialogModal"] {
		padding: 35px;
		min-height: auto !important;
		height: auto !important;

		text-align: center;
		font-family: Open Sans, Calibri, Arial;
	}

[aria-describedby="TimesheetsApp-dialogModalResize"] {
	top: 300px !important;
	margin-left: calc( 50% - 350px );
}

[aria-describedby="TimesheetsApp-dialogModalWait"] {
	text-align: center;
}

#TimesheetsApp-dialogModalWait {
	padding: 25px;
	line-height: 1.5;
	text-align: center;
}

	#TimesheetsApp-dialogModalWait > .fa {
		display: block;
		width: 50px;
		height: 50px;
		margin: 25px auto 10px auto;

		font-size: 50px;
		color: rgba(0,0,0,.2);
	}

	/* alert dialogs */
	#PDCFW3-dialogAlert, .PDCFW3-dialog {
		padding-top: 20px;
		text-align: center;
		line-height: 1.5;
	}
		/* dialog alerts for entry errors */
		#PDCFW3-dialogAlert.TimesheetsApp-entryErrors, .PDCFW3-dialog {
			text-align: left;
		}

		/* incomplete hilite */
		#PDCFW3-dialogAlert.TimesheetsApp-entryErrors .incomplete, .PDCFW3-dialog {
			background: rgb(255,235,200);
		}
			/* dialog alert unordered lists */
			#PDCFW3-dialogAlert ul,
			.PDCFW3-dialog ul {
				margin-bottom: 15px;
			}
				#PDCFW3-dialogAlert ul > li,
				.PDCFW3-dialog ul > li {
					margin-left: 25px;
					list-style: disc;
				}

	/* first button in "danger" confirmation prompt */
	#PDCFW3-dialogPrompt.danger ~ .ui-dialog-buttonpane > .ui-dialog-buttonset > button:first-of-type {
		background: #A00 !important;
	}
		/* first button in "danger" confirmation prompt */
		#PDCFW3-dialogPrompt.danger ~ .ui-dialog-buttonpane > .ui-dialog-buttonset > button:first-of-type:hover {
			background: #C00 !important;
		}


	/* any dialog type */
	#PDCFW3-dialogAlert, #PDCFW3-dialogPrompt, #PDCFW3-dialogConfirm {
		max-height: 65vh !important;
	}

		/* table inside any dialog type */
		#PDCFW3-dialogAlert > table,
		#PDCFW3-dialogPrompt > table,
		#PDCFW3-dialogConfirm > table {

		}
			/* table inside any dialog type */
			#PDCFW3-dialogAlert > table tr > td,
			#PDCFW3-dialogPrompt > table tr > td,
			#PDCFW3-dialogConfirm > table tr > td {
				padding: 5px;
			}

			/* table inside any dialog type */
			#PDCFW3-dialogAlert > table tr > td:first-of-type,
			#PDCFW3-dialogPrompt > table tr > td:first-of-type,
			#PDCFW3-dialogConfirm > table tr > td:first-of-type {
				padding-right: 25px;
			}



	/** JQUERY UI **/

	.ui-dialog-title {
		font-family: Open Sans, Calibri, Arial;
	}

	.ui-widget-overlay {
		background: rgba(0,0,0,.15) !important;
		opacity: 1 !important;
	}

	/* basic form elements inside ui dialog */
	.ui-dialog form > div {
		margin-bottom: 1px;
	}
		.ui-dialog form > div > * {
			vertical-align: middle;
		}

		.ui-dialog form > div > label {
			display: inline-block;
		}
			.ui-dialog form > div > label:first-of-type {
				width: 125px;
				padding: 5px;
				text-align: right;
				background-color: rgba(7,207,226,.5);
			}

		/* .ui-dialog form *:not(.fa) {
			font-family: 'Roboto Mono';
			font-size: 13px;
		} */


/* button */
a.button.general, a.button.general:active,
button.general, button.general:active,
.ui-dialog button:not(.ui-dialog-titlebar-close),
.ui-dialog button:not(.ui-dialog-titlebar-close):active {
	display: inline-block;

	width: auto;
	margin: 10px !important;
	padding: 10px 12px 10px 12px;

	font-family: Open Sans, Calibri, Arial !important;
	color: white;
	font-size: 13px;
	height: 38px;
	line-height: 1;
	text-shadow: 1px 1px 0px black;

	background: #034d8b;
	border: 0px;

	border-radius: 0px;
	cursor: pointer;
}

	a.button.general:is(:disabled,[readonly]),
	button.general:active:is(:disabled,[readonly]) {
		opacity: .35;
	}

	/* dialog button when disabled */
	.ui-dialog button:not(.ui-dialog-titlebar-close):disabled {
		color: rgba(255,255,255,.75) !important;
		cursor: not-allowed !important;
	}

	/* inline button */
	a.button.inline, button.inline {
		display: inline-block;
	}

	/* smaller button */
	a.button.general.emph-less,
	button.general.emph-less {
		padding: 5px 10px 5px 10px !important;
		background: #3C8FD6 !important;
		height: auto !important;
		margin: 0px !important;
	}

		/* smaller button when "selected" (hi/low lited to indicate state) */
		a.button.general.emph-less.selected,
		button.general.emph-less.selected {
			background: #034d8b !important;
		}

	/* smaller button */
	a.button.general.emph-min,
	button.general.emph-min {
		padding: 2px 7px 2px 2px !important;
		background: #3C8FD6 !important;
		height: auto !important;
		margin: 0px !important;
	}

		/* smaller button when "selected" (hi/low lited to indicate state) */
		a.button.general.emph-min.selected,
		button.general.emph-min.selected {
			background: #034d8b !important;
		}

	a.button.general:not(:disabled):not([readonly]):hover,
	button.general:not(:disabled):not([readonly]):hover,
	.ui-dialog button:not(.ui-dialog-titlebar-close):not(:disabled):not([readonly]):hover {
		background-color: #337AB5;
	}

	button.general > label,
	a.button.general > label {
		cursor: pointer !important;
	}

	button.general:not(.emph-less) .fa,
	a.button.general:not(.emph-less) .fa {
		margin-left: 10px;
	}

	a.button.general.danger, a.button.general.danger:active,
	button.general.danger, button.general.danger:active,
	.ui-dialog button.danger:not(.ui-dialog-titlebar-close),
	.ui-dialog button.danger:not(.ui-dialog-titlebar-close):active {
		background: #F00 !important;
	}
		a.button.general.danger:hover,
		button.general.danger:hover,
		.ui-dialog button.danger:not(.ui-dialog-titlebar-close):hover {
			background: #FF6363 !important;
		}

	/* any disabled element */
	button.general:is(:disabled,[readonly]):not(.disabled-noemph),
	a.button.general:is(:disabled,[readonly]):not(.disabled-noemph):active,
	button.general:is(:disabled,[readonly]):not(.disabled-noemph),
	a.button.general:is(:disabled,[readonly]):not(.disabled-noemph):active {
		color: rgba(255,255,255,.25);
		text-shadow: none;
		opacity: .75;
		cursor: not-allowed;
	}


/* global hilite classes for given states */
.warn {
	background-color: rgb(255,200,100) !important;
	color: black;
}
.warn-lite {
	background-color: rgb(255,225,200) !important;
	color: black;
}
.good {
	background-color: rgb(0,100,200) !important;
	color: white !important;
}
.good-ish {
	background-color: rgb(0,125,150) !important;
	color: white !important;
}
.good-lite {
	background-color: rgb(150,200,255) !important;
	color: white !important;
}
.error {
	background-color: rgb(255,0,0) !important;
	color: white !important;
}

.good-text {
	color: rgb(0,100,200) !important;
}
.good-lite-text {
	color: rgb(150,200,255) !important;
}
.good-bright-text {
	color: rgb(200,200,255) !important;
}
.error-text {
	color: red !important;
}
.warn-text {
	color: rgb(255,200,100) !important;
}
.error-text {
	color: rgb(255,0,0) !important;
}
:is(.warn-text,.error-text,.good-text).emph {
	font-weight: bold;
}


/* system message icon */
#system-message.show {
	display: inline-block !important;

	color: yellow !important;
	text-shadow: 1px 1px 0px black !important;

	animation: blinker 1s infinite;
	cursor: pointer;
}

@keyframes blinker {
	from { opacity: 1.0; }
	50% { opacity: 0.5; }
	to { opacity: 1.0; }
}