/*******************************************************************************
 * Copyright (c) 2008, 2021 SAP AG and IBM Corporation.
 * All rights reserved. This program and the accompanying materials
 * are made available under the terms of the Eclipse Public License 2.0
 * which accompanies this distribution, and is available at
 * https://www.eclipse.org/legal/epl-2.0/
 *
 * SPDX-License-Identifier: EPL-2.0
 *
 * Contributors:
 *     SAP AG - initial API and implementation
 *******************************************************************************/
/* basic styles */

body {
	background: white;
	color: black;
	font-size: 10pt;
	font-family: verdana, arial, helvetica, sans-serif;
}
:root {
	--dark-color: white;
	--dark-background: #101010;
}
@media screen {
	body {
		background: #101010;
		background: var(--dark-background);
		color: white;
		color: var(--dark-color)
	}
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
}

h5 {
	font-size: 10pt;
}

.command {
	font-size: 8pt;
	padding: 5px;
}

img {
	border: 0;
	vertical-align: middle;
}
@media screen {
	/* Only match the big images, not icons */
	/* flips white and black, but keeps hues */
	/* 94% means white goes to near black matching background */
	div > img {
		filter: invert(94%) hue-rotate(180deg);
	}
}

/* header */

#header {
	float: left;
	width: 100%;
	background: #d7e5f0;
	font-size: x-small;
	font-weight: bold;
	line-height: normal;
}
@media screen {
	#header {
		background: #182830;
	}
}

#header ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#header li {
	margin: 0;
	padding: 0;
	float: left;
	display:block;
	padding: 5px 5px;
}

/* footer */

#footer {
	float: left;
	width: 100%;
	background: #d7e5f0;
	font-size: x-small;
	font-weight: bold;
	line-height: normal;
	padding: 5px 5px;
}
@media screen {
	#footer {
		background: #182830;
	}
}

#footer .toc {
	float:left;
}

#footer .mat {
	float:right;
}

.important {
	background-color: #FFFFE1;
	padding: 10px 10px 10px 10px;
	border: 1px dotted black;
	max-width: 600px;
	overflow: visible;
}
@media screen {
	.important {
		background-color: #c27f20;
		border: 1px dotted white;
		border: 1px dotted var(--dark-color);
	}
}

/* query table and trees */

.result {
	border: 1px solid #666666;
	font-family: "lucida grande", verdana, sans-serif;
	font-size: 8pt;
}
@media screen {
	.result {
		border: 1px solid #999999;
	}
}

.result thead tr th {
	padding: 3px 8px;
	text-align: left;
}

.result tbody tr td {
	padding: 3px 8px;
	border-left: 1px solid #D9D9D9;
}
@media screen {
	.result tbody tr td {
		border-left: 1px solid #262626;
	}
}

@media screen {
	/* For the tree icons */
	/* flips white and black, but keeps hues */
	/* 94% means white goes to near black matching background */
	img.line {
		filter: invert(94%) hue-rotate(180deg);
	}
}

.evenrow {
	background-color: #ffffff;
}
.oddrow {
	background-color: #eeeeee;
}
@media screen {
	.evenrow {
		background-color: #101010;
		background-color: var(--dark-background);
	}
	.oddrow {
		background-color: #181818;
	}
}

.result tbody tr.selected td {
	background-color: #3d80df;
	color: #ffffff;
	font-weight: bold;
	border-left: 1px solid #346DBE;
	border-bottom: 1px solid #7DAAEA;
}
@media screen {
	.result tbody tr.selected td {
		background-color: #4d90ef;
		color: #101010;
		color: var(--dark-background);
		border-left: 1px solid #8DBAFA;
		border-bottom: 1px solid #447DCE;
	}
}

.result tbody tr.selected td a {
	color: #ffffff;
}
@media screen {
	.result tbody tr.selected td a {
		color: #101010;
		color: var(--dark-background);
	}
}

.result tbody tr.selected td a:focus {
	outline-style: dotted;
	outline-width: 1px;
	outline-color: #ffffff
}
@media screen {
	.result tbody tr.selected td a:focus {
		outline-color: #101010;
		outline-color: var(--dark-background);
	}
}

.result tbody tr.totals td {
	font-weight: bold;
	background-color: #D3D3D3;
}
@media screen {
	.result tbody tr.totals td {
		font-weight: bold;
		background-color: #2c2c2c;
	}
}

.result tbody tr.filter td {
	background-color: #D3D3D3;
	color: green;
	text-align: left;
	font-weight: bold;
}
@media screen {
	.result tbody tr.filter td {
		background-color: #2c2c2c;
		color: green;
	}
}

.result tbody tr td img {
	border: 0;
	vertical-align: middle;
	padding: 0px;
	float: left;
	margin: 0px;
}

.result tbody tr td ul {
	list-style: none;
	overflow: visible;
	margin: 0px;
	padding: 0px;
}

.result tbody tr td li {
	word-wrap: break-word;
	float: left;
}
