Template:Userbox/styles.css

/* {{pp-template}} */
.wikipediauserbox {
	margin: 1px;
	border: 1px solid var(--border-color-base, #a2a9b1);
	width: 238px;
	float: left;
}

.wikipediauserbox table {
	border-collapse: collapse;
	width: 238px;
	margin-bottom: 0;
	margin-top: 0;
	background: #eee;
	color: inherit;
}

.wikipediauserbox td {
	border: 0;
	vertical-align: middle;
}

.wikipediauserbox .userbox-info {
	border: 0;
	text-align: left;
	font-size: 8pt;
	padding: 0 4px 0 4px;
	height: 45px;
	line-height: 1.25em;
	color: inherit;
	vertical-align: middle;
}

.wikipediauserbox .userbox-id,
.wikipediauserbox .userbox-id2 {
	border: 0;
	width: 45px;
	height: 45px;
	background: #ddd;
	text-align: center;
	font-size: 14pt;
	font-weight: bold;
	color: inherit;
	padding: 0 1px 0 0;
	line-height: 1.25em;
	vertical-align: middle;
}

/* Dark mode fixes */

@media screen {
	html.skin-theme-clientpref-night .wikipediauserbox table {
		background: #202122;
	    color: inherit;
	}
	
	html.skin-theme-clientpref-night .wikipediauserbox .userbox-id,
	html.skin-theme-clientpref-night .wikipediauserbox .userbox-id2 {
		background: #27292d;
	    color: inherit;
	}
	
	/* Defined background, no foreground color (temporary fix) */
	html.skin-theme-clientpref-night .wikipediauserbox table[style*="background"] .userbox-info {
		color: #202122;
	}
}

@media screen and ( prefers-color-scheme: dark ) {
	html.skin-theme-clientpref-os .wikipediauserbox table {
		background: #202122;
	    color: inherit;
	}
	
	html.skin-theme-clientpref-os .wikipediauserbox .userbox-id,
	html.skin-theme-clientpref-os .wikipediauserbox .userbox-id2 {
		background: #27292d;
	    color: inherit;
	}
	
	/* Defined background, no foreground color (temporary fix) */
	html.skin-theme-clientpref-os .wikipediauserbox table[style*="background"] .userbox-info {
		color: #202122;
	    color: inherit;
	}
}