
div.listview { clear:both; display: block; width: 100%; }
div.listview div.searchbar input { background: #111; border: 1px solid transparent; font-size: 100%; padding: 6px; }
div.listview div.searchbar input:focus { border: 1px solid var(--accent-1); color: #FFF; }

table.listview { width: 100%; border-collapse: collapse; }
table.listview.filtering > tbody { filter: blur(3px) saturate(0); }

table.listview > thead > tr > th { padding: 10px; border-bottom: 4px solid #444; border-left: 1px solid #444; color: #FFF; font-weight: 300; text-transform: uppercase; font-size: 90%; 
	text-align: left}
table.listview > thead > tr > th:first-child { border-left: none; }
table.listview > thead > tr > th > span.sort { display: block; float: right; width: 16px; height: 16px; background: blue; overflow: hidden; 
	background: url('../img/sortarrows.png') no-repeat -16px 0; opacity: 0; }
table.listview > thead > tr > th.sort-asc > span.sort { opacity: 0.6; background-position: -48px 0; }
table.listview > thead > tr > th.sort-desc > span.sort { opacity: 0.6; background-position: -32px 0; }
table.listview > thead > tr > th:hover > span.sort { opacity: 1; }

table.listview > tbody > tr > td > span,
table.listview > tbody > tr > td > a > span { display: block; padding: 10px; cursor: default; transition: background-color 0.1s; }
table.listview > tbody > tr:first-child > td { padding-top: 10px; }
table.listview > tbody > tr:hover > td > span { background: rgba(255, 255, 255, 0.1); color: white; }
table.listview > tbody > tr > td > a { color: #CCC; text-decoration: none; display: block; }
table.listview > tbody > tr:hover > td > a:hover { color: #FFF; text-decoration: none; }
table.listview > tbody > tr:hover > td > a { background: var(--accent-2) url('../img/listview-link.png') no-repeat; 
	background-size: 18px 18px; background-position: right 10px center; }
table.listview > tbody > tr > td > a > span { cursor: pointer; }
table.listview > tbody > tr > td.hidden { width: 0; display: none; }
table.listview > tbody > tr > td > span a { color: #FFF; }
table.listview > tbody > tr > td > span:hover a { color: var(--accent-1); }

table.listview > tbody > tr > td.check { width: 40px; text-align: center; }
table.listview > tbody > tr > td span.tag { margin-top: -2px; margin-bottom: -2px; }

table.listview > tbody > tr.status > td { text-align: center; padding: 10px 0 20px; font-weight: 200; font-size: 90%; }
table.listview > tbody > tr.noresults { display: none; }
table.listview > tbody > tr.hidden { display: none; color: red; }

table.listview > tbody > tr.group-header > th { padding: 20px 10px 4px; 
	text-align: left; font-weight: 200; text-transform: uppercase; border-bottom: 1px solid #444; }