/* {{pp-template|small=yes}} */
.ib-tv-channel .infobox-header {
	background-color: #efefef;
}

/* always light bg for logos */
.ib-tv-channel-logo img {
	background-color: #f8f9fa;
}

.ib-tv-channel-availability .infobox-header{
	background-color: #bfdfff;
	width: 100%;
}

/* FIXME: be specific about which <th>s you're targeting here
 * infoboxes will not be tables forever
 * See also the color line below
 */
.ib-tv-channel-embed-header .infobox-header{
	font-size: 100%;
	background-color: #bfdfff;
}

@media screen {
	html.skin-theme-clientpref-night .ib-tv-channel .infobox-header {
		background-color: hsl(0, 0%, 10%);
		color: inherit;
	}
	
	html.skin-theme-clientpref-night .ib-tv-channel-availability .infobox-header,
	html.skin-theme-clientpref-night .ib-tv-channel-embed-header .infobox-header{
		background-color: hsl(210, 100%, 10%);
		color: inherit;
	}
}

@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .ib-tv-channel-infobox-header {
		background-color: hsl(0, 0%, 10%);
		color: inherit;
	}
	
	html.skin-theme-clientpref-os .ib-tv-channel-availability .infobox-header,
	html.skin-theme-clientpref-os .ib-tv-channel-embed-header .infobox-header{
		background-color: hsl(210, 100%, 10%);
		color: inherit;
	}
}