Template:Wflicence/styles.css

.WflicenseBox {
	color: #212529;
}

.free-class, .free_nocat-class {
	background-color: #f8f9fa;
	border-color: #7092ff;
	border-style: solid;
	border-width: 1px;
}

.default-class, .permitted-class {
	background-color: #eeeeee;
	border-color: #6610f2;
	border-style: solid;
	border-width: 1px;
}

.problematic-class {
	background-color: #fff3cd;
	border-color: #dc3545;
	border-style: solid;
	border-width: 3px;
}

/* Colours for dark mode GUI */
@media screen {
    html.skin-theme-clientpref-night .WflicenseBox {
	    color: #f0f0f0;
	}
	html.skin-theme-clientpref-night .free-class {
	    background: #4d5c6b;
	}
	html.skin-theme-clientpref-night .free_nocat-class {
	    background: #4d5c6b;
	}
	html.skin-theme-clientpref-night .default-class {
	    background: #5c5c5c;
	}
	html.skin-theme-clientpref-night .permitted-class {
	    background: #5c5c5c;
	}
	html.skin-theme-clientpref-night .problematic-class {
	    background: #574200;
	}
	html.skin-theme-clientpref-night .WflicenseBox a {
		color: #98b3f8;
	}
	html.skin-theme-clientpref-night .WflicenseBox a:visited {
		color: #b7a9dd;
	}
}

@media screen and ( prefers-color-scheme: dark ) {
    html.skin-theme-clientpref-os .WflicenseBox {
	    color: #f0f0f0;
	}
	html.skin-theme-clientpref-os .free-class {
	    background: #4d5c6b;
	}
	html.skin-theme-clientpref-os .free_nocat-class {
	    background: #4d5c6b;
	}
	html.skin-theme-clientpref-os .default-class {
	    background: #5c5c5c;
	}
	html.skin-theme-clientpref-os .permitted-class {
	    background: #5c5c5c;
	}
	html.skin-theme-clientpref-os .problematic-class {
	    background: #574200;
	}
	html.skin-theme-clientpref-os .WflicenseBox a {
		color: #98b3f8;
	}
	html.skin-theme-clientpref-os .WflicenseBox a:visited {
		color: #b7a9dd;
	}
}