.loadingIndicator {
	background-image: url(../images/spinner-solid.svg);
	background-repeat: no-repeat;
	background-position: 30px;
}

.hiddenDetail {
	display: none;
}

/* Added to undo removal of orange coloration of links */
div.ui-widget a {
	color: var(--bgsu-orange);
}

div.ui-widget a:hover {
	color: var(--bgsu-orange-hover);
}

div.ui-dialog-content table a {
	padding: 0;  /* Prevent padding from overlaying lines separating table rows */
}

div.ui-dialog-content > p:last-of-type {
	margin-bottom: 0;
}

#dialogEmployeeDetails tr {
	border-top: 1px solid #dddddd;
}

/*
	Starting the jQuery UI tooltip library causes a div.ui-helper-hidden-accessible element to be
	added to the DOM.  The AInspector Toolbar for Firefox complains about this because it has
	aria-live=assertive and role=log.  Hide this element so it is not considered.
	See "jQuery Tooltip displaying extra div" at https://stackoverflow.com/questions/24685151/jquery-tooltip-displaying-extra-div.
 */
.ui-helper-hidden-accessible {
	display: none;
}

form#directorySearch {
	margin-bottom: 6ex;
}

div#dialogPleaseWait {
	min-height: 0px !important;
}

div#dialogPleaseWait p {
	text-align: center;
}

div.ui-dialog .loadingIndicator {
	background-position: 0px;
	margin-left: 50%;
}

p.searchMessage {
	color: red;
	font-weight: bold;
}

body.acc-contrast #content p.searchMessage {
	color: #cccc00;
}

button.showEmployeeDetails {
	border: none;
	color: var(--bgsu-orange);
	cursor: pointer;
	background-color: transparent;
	padding-left: 0;
	padding-right: 0;
	text-align: left;
}

body.acc-contrast #content button.showEmployeeDetails {
	color: white;
}

div#employeeSearchResults, div#studentSearchResults, div#departmentSearchResults {
	margin-bottom: 2ex;
}

/* The widths are calculated using the old Directory Search's width proportions */
div#employeeSearchResults table.searchResults col#employeeNameColumn {
	width: 31.25%;
}

div#employeeSearchResults table.searchResults col#employeeEmailColumn {
	width: 22.5%;
}

div#employeeSearchResults table.searchResults col#employeePhoneColumn {
	width: 15%;
}

div#employeeSearchResults table.searchResults col#employeeDepartmentColumn {
	width: 31.25%;
}

/* The widths are calculated using the old Directory Search's width proportions */
div#studentSearchResults table.searchResults col#studentNameColumn {
	width: 50%;
}

div#studentSearchResults table.searchResults col#studentEmailColumn {
	width: 50%;
}

/* The widths are calculated using the old Directory Search's width proportions */
div#departmentSearchResults table.searchResults col#departmentNameColumn {
	width: 23.5%;
}

div#departmentSearchResults table.searchResults col#departmentAddressColumn {
	width: 21.75%;
}

div#departmentSearchResults table.searchResults col#departmentTitleColumn {
	width: 21.75%;
}

div#departmentSearchResults table.searchResults col#departmentEmailColumn {
	width: 16.5%;
}

div#departmentSearchResults table.searchResults col#departmentPhoneColumn {
	width: 16.5%;
}

table.searchResults.dataTable {
	margin-bottom: 20px;
}

table.searchResults.dataTable tbody tr:nth-of-type(odd) {
	background-color: #f9f9f9;
}

table.searchResults.dataTable th,
table.searchResults.dataTable td {
	border: 1px solid #dddddd;
}

table.searchResults.dataTable tr.departmentHeader td {
	font-weight: bold;
}

/*
	The following three rules are a workaround for a DataTables limitation that does not allow the number of cells in a row
	to differ from the number of cells in the table header.  We can't use colspan to allow the department name to spread across
	multiple columns.  Instead, we make it appear to spread across multiple columns by removing interior borders and forcing
	the text to not wrap.
 */
table.searchResults.dataTable tr.departmentHeader td:first-of-type {
	white-space: nowrap;
	max-width: 50px;
}

table.searchResults.dataTable tr.departmentHeader td:not(:first-of-type) {
	border-left: none;
}

table.searchResults.dataTable tr.departmentHeader td:not(:last-of-type) {
	border-right: none;
}

table.searchResults.dataTable tr.resultsPageHeader td {
	font-weight: bold;
}

/* Provide finer-grained container widths to help maximize the space for search results at widths between standard Bootstrap breakpoints. */
@media (min-width: 1300px) and (max-width: 1399px) {
	.container, .container-lg, .container-md, .container-sm, .container-xl {
		max-width: 922pt;
	}
}

@media (min-width: 1096px) and (max-width: 1199px) {
	.container, .container-lg, .container-md, .container-sm, .container-xl {
		max-width: 781pt;
	}
}

@media (min-width: 880px) and (max-width: 991px) {
	.container, .container-lg, .container-md, .container-sm {
		max-width: 52.5pc;
	}
}

@media (min-width: 672px) and (max-width: 767px) {
	.container, .container-md, .container-sm {
		max-width: 39pc;
	}
}

@media print {

	article#main-content > div.container {
		max-width: 100%;
	}

	header.cmp-header,
	div.header__nav {
		display: none;
	}

	form#directorySearch {
		display: none;
	}

	div#loginToSearchStudentsMessage,
	div#logoutWhenDone {
		display: none;
	}

	footer .footer__background img,
	footer .footer__background p.footer-date:not(p.footer-date:first-of-type) {
		display: none;
	}

	footer .footer__report-it {
		display: none;
	}

	footer .footer-nav {
		display: none;
	}

	footer .accessibility {
		display: none;
	}

	p.searchMessage {
		color: inherit;
	}

	.dataTables_info,
	.dataTables_paginate {
		display: none;
	}

	table.searchResults {
		font-size: 15px;
	}

	table.searchResults tr {
		break-inside: avoid-page;
	}

	table.searchResults.dataTable tr.resultsPageHeader:not(tr.departmentHeader) {
		display: none;
	}

	.row {
		/* Remove the -20px applied in magic-bootstrap.css */
		margin-left: 0px !important;
	}

	.hiddenDetail {
		display: none;
	}

	div#searchControls {
		display: none;
	}

	p.searchMessage {
		color: var(--bs-body-color);
		font-weight: bold;
	}

	a {
		color: var(--bs-body-color);
	}

	div#contactITS a[href]:after {
		content: " [" attr(href) "]";
	}

	button.showEmployeeDetails {
		color: var(--bs-body-color);
	}

	#informationSection .collapse:not(.show) {
		display: block;
	}

	.cmp-accordion-dropzone__title.js-Accordion-title::before,
	.cmp-accordion-dropzone__title::before {
		display: none;
	}

	div.ui-tooltip {
		display: none;
	}

}
