/* Topic-local Light / Dark mode image compare tabs.
   Used only by riverbed_iq_personalization.htm. Not Shared-managed. */

.ui-theme-compare
{
	margin: 1em 0 1.5em 0;
	max-width: 100%;
}

.ui-theme-compare input[type="radio"]
{
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.ui-theme-compare-tabs
{
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	border-bottom: 1px solid #d3d3d3;
	margin-bottom: 0.75em;
}

.ui-theme-compare-tabs label
{
	cursor: pointer;
	padding: 0.5em 1em;
	margin: 0;
	border: 1px solid transparent;
	border-bottom: none;
	color: #404040;
	font-weight: 600;
	background-color: transparent;
}

.ui-theme-compare-panel
{
	display: none;
}

.ui-theme-compare-panel img
{
	max-width: 100%;
	height: auto;
	border: 1px solid #d3d3d3;
}

.ui-theme-compare #ui-theme-tab-light:checked ~ .ui-theme-compare-tabs label[for="ui-theme-tab-light"],
.ui-theme-compare #ui-theme-tab-dark:checked ~ .ui-theme-compare-tabs label[for="ui-theme-tab-dark"]
{
	color: #2D8DCC;
	border-color: #d3d3d3;
	border-bottom-color: #FFFFFF;
	background-color: #FFFFFF;
	margin-bottom: -1px;
}

.ui-theme-compare #ui-theme-tab-light:checked ~ .ui-theme-compare-panel-light,
.ui-theme-compare #ui-theme-tab-dark:checked ~ .ui-theme-compare-panel-dark
{
	display: block;
}

.ui-theme-compare-print img
{
	max-width: 100%;
	height: auto;
	border: 1px solid #d3d3d3;
	margin-bottom: 1em;
}

.ui-theme-compare-print p
{
	margin-bottom: 0.35em;
}