/* Shared by both Explorer and Extraction Tool */
.message {
	/* Don't use display:none because Internet Explorer doesn't have display:revert */
	position: absolute;
	visibility: hidden;
	max-width: 100% /* parent should be positioned so long messages don't break out */;
}
[aria-busy] > .loading.message { visibility: visible; }
[aria-busy] > .loading.message ~ * { visibility: hidden; }


.error.message { color: #9b2743; }
.error.message img {
	width: 24px;
	height: 24px;
	vertical-align: middle;
}
[aria-invalid] {
	/* Is it an abuse of aria-invalid to use this on non-input elements? The guidance from MDN
	   says "the value entered into an input field" but also "can be used with any typical HTML form
	   element, and is not limited to elements that have an ARIA role assigned."*/
	border-color: #9b2743;
}
[aria-invalid] > .error.message { visibility: visible; }
[aria-invalid] > .error.message ~ * { visibility: hidden; }


.unreleased.banner {
	display: none;
    position: fixed;
    z-index: 3;
    background: orange;
    color: black;
    border: 1px solid gray;
    box-shadow: 2px 2px 5px black;
    text-decoration: none;
    width: 200px;
    text-align: center;
    transform: rotate(-45deg);
    left: -70px;
    top: 30px;
}
.unreleased.banner:hover {
	opacity: 0.3 /* make it easier to see what's underneath */;
	border: none;
	box-shadow: none;
	text-decoration: none;
}
body.unreleased .unreleased.banner { display: block; }


.panel-header {
	font-size: 16px;
	background-image: url('../images/tundra_button_enabled.png');
	background-repeat: repeat-x;
	font-weight: bold;
	margin: 0;
	padding: .25em;
	background-position: bottom;
}