MediaWiki:Common.css: Difference between revisions

Latest revision as of 23:52, 22 September 2026

/*
 * This is the CSS common to all desktop skins on Vrienden Universe.
 * Styling inside .mw-parser-output should generally use TemplateStyles.
 */
/* Reset italic styling set by user agent */
cite,
dfn {
	font-style: inherit;
}

/* Straight quote marks for <q> */
q {
	quotes: '"' '"' "'" "'";
}

/* Avoid collision of blockquote with floating elements by swapping margin and padding */
blockquote {
	overflow: hidden;
	margin: 1em 0;
	padding: 0 40px;
}

/* Consistent size for <small>, <sub> and <sup> */
small {
	font-size: 85%;
}

.mw-body-content sub,
.mw-body-content sup {
	font-size: 80%;
}

/* Same spacing for indented and unindented paragraphs on talk pages */
.ns-talk .mw-body-content dd {
	margin-top: 0.4em;
	margin-bottom: 0.4em;
}

/* Reduce page jumps by hiding collapsed/dismissed content */
.client-js .collapsible:not( .mw-made-collapsible).collapsed > tbody > tr:not(:first-child),

/* Avoid FOUC/reflows on collapsed elements. */
/* This copies MediaWiki's solution for T42812 to apply to innercollapse/outercollapse (T325115). */
/* TODO: Use :is() selector at some reasonable future when support is good for Most Clients */
/* Reference: https://gerrit.wikimedia.org/g/mediawiki/core/+/ecda06cb2aef55b77c4b4d7ecda492d634419ead/resources/src/jquery/jquery.makeCollapsible.styles.less#75 */
.client-js .outercollapse .innercollapse.mw-collapsible:not( .mw-made-collapsible ) > p,
.client-js .outercollapse .innercollapse.mw-collapsible:not( .mw-made-collapsible ) > table,
.client-js .outercollapse .innercollapse.mw-collapsible:not( .mw-made-collapsible ) > thead + tbody,
.client-js .outercollapse .innercollapse.mw-collapsible:not( .mw-made-collapsible ) tr:not( :first-child ),
.client-js .outercollapse .innercollapse.mw-collapsible:not( .mw-made-collapsible ) .mw-collapsible-content,

/* Hide charinsert base for those not using the gadget */
#editpage-specialchars {
	display: none;
}

/* Different margin on references */
.references {
	margin-bottom: 0.5em;
}

/* Cite customizations */
span[ rel="mw:referencedBy" ] {
	counter-reset: mw-ref-linkback 0;
}

span[ rel='mw:referencedBy' ] > a::before {
	content: counter( mw-ref-linkback, lower-alpha );
	font-size: 80%;
	font-weight: bold;
	font-style: italic;
}

a[ rel="mw:referencedBy" ]::before {
	font-weight: bold;
	content: "^";
}

span[ rel="mw:referencedBy" ]::before {
	content: "^ ";
}

/* Styling for jQuery makeCollapsible, matching that of collapseButton */
.mw-parser-output .mw-collapsible-toggle:not(.mw-ui-button) {
	font-weight: normal;
	padding-right: 0.2em;
	padding-left: 0.2em;
}

.mw-collapsible-leftside-toggle .mw-collapsible-toggle {
	/* @noflip */
	float: left;
}

/* Lists in wikitable data cells are always left-aligned */
.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
	/* @noflip */
	text-align: left;
}

/* Change the external link icon to a PDF icon for all PDF files */
.mw-parser-output a[href$=".pdf"].external,
.mw-parser-output a[href*=".pdf?"].external,
.mw-parser-output a[href*=".pdf#"].external,
.mw-parser-output a[href$=".PDF"].external,
.mw-parser-output a[href*=".PDF?"].external,
.mw-parser-output a[href*=".PDF#"].external {
	background: url("//upload.wikimedia.org/wikipedia/commons/4/4d/Icon_pdf_file.png") no-repeat right;
	/* @noflip */
	padding: 8px 18px 8px 0;
}

/* System messages styled similarly to fmbox */
/* for .mw-warning-with-logexcerpt, behavior of this line differs between
 * the edit-protected notice and the special:Contribs for blocked users
 * The latter has specificity of 3 classes so we have to triple up here.
 */
.mw-warning-with-logexcerpt.mw-warning-with-logexcerpt.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div#mw-protect-cascadeon {
	clear: both;
	margin: 0.2em 0;
	border: 1px solid #bb7070;
	background-color: var(--background-color-error-subtle, #ffdbdb);
	padding: 0.25em 0.9em;
	box-sizing: border-box;
}

/* default colors for partial block message */
/* gotta get over the hump introduced by the triple class above */
.mw-contributions-blocked-notice-partial .mw-warning-with-logexcerpt.mw-warning-with-logexcerpt {
	border-color: var(--border-color-warning, #ab7f2a);
	background-color: var(--background-color-warning-subtle, #fef6e7);
}

/* Minimum thumb width */
@media (min-width: 640px) {
	figure[typeof~='mw:File/Thumb'],
	figure[typeof~='mw:File/Frame'],
	.thumbinner {
		min-width: 100px;
	}
}

/* Prevent floating boxes from overlapping any category listings,
   file histories, edit previews, and edit [Show changes] views. */
#mw-subcategories,
#mw-pages,
#mw-category-media,
#filehistory,
#wikiPreview,
#wikiDiff {
	clear: both;
}

/* Hide stuff meant for accounts with special permissions. Made visible again in
   [[MediaWiki:Group-checkuser.css]], [[MediaWiki:Group-sysop.css]], [[MediaWiki:Group-abusefilter.css]],
   [[MediaWiki:Group-abusefilter-helper.css]], [[MediaWiki:Group-patroller.css]],
   [[MediaWiki:Group-templateeditor.css]], [[MediaWiki:Group-extendedmover.css]],
   [[MediaWiki:Group-extendedconfirmed.css]], [[Mediawiki:Group-autoconfirmed.css]], and [[MediaWiki:Group-user.css]] */
.checkuser-show,
.sysop-show,
.abusefilter-show,
.abusefilter-helper-show,
.patroller-show,
.templateeditor-show,
.extendedmover-show,
.extendedconfirmed-show,
.autoconfirmed-show,
.user-show {
	display: none;
}

/* Hide the redlink generated by {{Editnotice}},
   this overrides the ".sysop-show { display: none; }" above that applies
   to the same link as well. See [[phab:T45013]]

   Hide the images in editnotices to keep them readable in VE view.
   Long term, editnotices should become a core feature so that they can be designed responsive. */
.ve-ui-mwNoticesPopupTool-item .editnotice-redlink,
.ve-ui-mwNoticesPopupTool-item .mbox-image,
.ve-ui-mwNoticesPopupTool-item .mbox-imageright {
	display: none !important;
}

/* Remove bullets when there are multiple edit page warnings */
ul.permissions-errors {
	margin: 0;
}

ul.permissions-errors > li {
	list-style: none;
}

/* larger inline math */
span.mwe-math-mathml-inline {
	font-size: 118%;
}

/* Make <math display="block"> be left aligned with one space indent for 
 * compatibility with style conventions
 */
.mwe-math-fallback-image-display,
.mwe-math-mathml-display {
	margin-left: 1.6em !important;
	margin-top: 0.6em;
	margin-bottom: 0.6em;
}

.mwe-math-mathml-display math {
	display: inline;
}

@media screen {
	/* Put a chequered background behind images, only visible if they have transparency,
	 * except on main, user, and portal namespaces
	 */
	body:not(.ns-0):not(.ns-2):not(.ns-100) .gallerybox .thumb img {
		background: #fff url(//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png) repeat;
	}

	/* Display "the site subtitle" in skins that support it,
	   do not apply to print mode */
	#siteSub {
		display: block;
	}
	
	/* Make the list of references smaller
	 * Keep in sync with Template:Refbegin/styles.css
	 * And Template:Reflist/styles.css
	 */
	.references {
		font-size: 90%;
	}
}

/* Hide FlaggedRevs notice UI when there are no pending changes */
.flaggedrevs_draft_synced,
.flaggedrevs_stable_synced,
/* "Temporary" to remove links in sidebar T255381 */
#t-upload,
/* Hide broken download box on Special:Book pending T285400 */
.mw-special-Book #coll-downloadbox {
	display: none;
}

/*
 * BELOW HERE THERE BE SOONTOBE TEMPLATESTYLES THINGS;
 * SEE [[MediaWiki talk:Common.css/to do]]
 * CSS is separated by component (which is why media queries are not joined)
 */

/* Infoboxes */
.infobox {
	border: 1px solid var(--border-color-base, #a2a9b1);
	color: var(--color-base, #202122);
	background-color: var(--background-color-neutral-subtle, #f8f9fa);
	padding: 0.2em;
	font-size: 88%;
	line-height: 1.5em;
	border-spacing: 3px;
	margin: 0.5em 0;
}

/* Ensure nothing inside forces black text */
.infobox * {
	color: inherit;
}

/* Links inside infobox follow theme colors */
.infobox a:link,
.infobox a:visited {
	color: var(--color-progressive, #36c);
}

.infobox a.new:link,
.infobox a.new:visited {
	color: var(--color-destructive, #d33);
}

@media (max-width: 640px) {
	.infobox {
		width: 100%;
	}
    
	.infobox .nowrap {
		white-space: normal;
	}
}

@media (min-width: 640px) {
	.infobox {
		/* @noflip */
		margin-left: 1em;
		/* @noflip */
		float: right;
		/* @noflip */
		clear: right;
		width: 22em;
	}
}

.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox th,
.infobox td {
	vertical-align: top;
}

.infobox-label,
.infobox-data,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox th,
.infobox td {
	/* @noflip */
	text-align: left;
}

/* Keep infobox values starting near the middle, Wikipedia-style. */
.infobox .infobox-label {
	width: 40%;
}

/* Remove .infobox when element selectors above are removed */
.infobox .infobox-above,
.infobox .infobox-title,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox caption {
	font-size: 125%;
	font-weight: bold;
	text-align: center;
}

.infobox-title,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox caption {
	padding: 0.2em;
}

/* Remove .infobox when element selectors above are removed */
.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
	text-align: center;
}

/* Remove .infobox when element selectors above are removed */
.infobox .infobox-navbar {
	/* @noflip */
	text-align: right;
}

/* Normal font styling for wikitable row headers with scope="row" tag */
.wikitable.plainrowheaders th[scope=row],
.wikitable.plainrowheaders th[scope=rowgroup] {
	font-weight: normal;
	/* @noflip */
	text-align: left;
}

/* Remove underlines from certain links */
.nounderlines a,
.IPA a:link,
.IPA a:visited {
	text-decoration: none !important;
}

/* Prevent line breaks in silly places where desired (nowrap)
   and links when we don't want them to (nowraplinks a) */
.nowrap,
.nowraplinks a {
	white-space: nowrap;
}

/* But allow wrapping where desired: */
.wrap,
.wraplinks a {
	white-space: normal;
}

/* texhtml class for inline math (based on generic times-serif class) */
/* remove spans when this is TemplateStyled */
span.texhtml {
	font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
	font-size: 118%;
	line-height: 1;
	/* Force tabular and lining display for texhtml */
	font-variant-numeric: lining-nums tabular-nums;
	font-kerning: none;
}

span.texhtml span.texhtml {
	font-size: 100%;
}

@media (min-width: 640px) {
	span.texhtml {
		white-space: nowrap;
	}
}

/* Prevent flags in tables from collapsing: Fix for T116318
 * TODO: Remove when [[phab:T368469]] merges [[phab:T367463]] for the other skins
 */
@media (max-width: 640px) {
	.flagicon a > img,
	.flagicon noscript > img {
		max-width: none !important;
	}
}

@media screen {
	.nochecker .gallerybox .thumb img {
		background-image: none;
	}
}

/* Hide maintenance / tracking categories */
.mw-hidden-cats {
	display: none;
}

/* Override inline hard-coded header backgrounds in infoboxes */
.infobox td.infobox-above,
.infobox th.infobox-above,
.infobox td.infobox-title,
.infobox th.infobox-title,
.infobox caption,
.infobox th[colspan] {
  background: var(--background-color-progressive-subtle, #eaf3ff) ;
  color: var(--color-base, #202122) ;
}

/* Ensure ALL infobox cells remain readable */
.infobox td,
.infobox th {
  color: var(--color-base, #202122) ;
  border-color: var(--border-color-base, #a2a9b1);
}
/*
 * Put anything you mean to be a sitewide addition above the TemplateStyles
 * comment above.
 */
/* Dark mode fixes for navboxes and similar boxes */
@media screen {
    /* User-selected Dark mode */
    html.skin-theme-clientpref-night .navbox,
    html.skin-theme-clientpref-night .navbox-subgroup,
    html.skin-theme-clientpref-night .navbox th,
    html.skin-theme-clientpref-night .navbox td {
        background-color: #1e1e1e ;  /* dark main body */
        color: #d0d0d0 ;
        border-color: #444 ;
    }

    /* Match infobox header color but darkened for dark mode (titles, above/below rows) */
    html.skin-theme-clientpref-night .navbox-title,
    html.skin-theme-clientpref-night .navbox-abovebelow,
    html.skin-theme-clientpref-night .navbox th[scope="col"],          /* column headers */
    html.skin-theme-clientpref-night .navbox .navbox-title,            /* nested titles */
    html.skin-theme-clientpref-night .navbox .navbox-group {           /* left-side group labels, often "side ones" */
        background-color: #1B223D ;  /* darkened blue-gray variant of #eaf3ff */
        color: #e0f0ff ;             /* very light blue-white text for contrast */
        border-color: #3a506b ;      /* subtle border to match */
    }

    /* If your navbox uses .navbox-group for left-side labels, this targets them specifically */
    html.skin-theme-clientpref-night .navbox .navbox-group {
        background-color: #1B223D ;
        font-weight: bold;
    }

    /* Alternating rows stay dark */
    html.skin-theme-clientpref-night .navbox-odd,
    html.skin-theme-clientpref-night .navbox-even {
        background-color: #252525 ;
    }

    /* Links inside navbox */
    html.skin-theme-clientpref-night .navbox a:not(.new):not(.mw-selflink) {
        color: #88ccff ;
    }

    /* For Automatic/OS dark preference */
    @media (prefers-color-scheme: dark) {
        html.skin-theme-clientpref-os .navbox,
        html.skin-theme-clientpref-os .navbox-subgroup,
        html.skin-theme-clientpref-os .navbox th,
        html.skin-theme-clientpref-os .navbox td {
            background-color: #1e1e1e ;
            color: #d0d0d0 ;
            border-color: #444 ;
        }
        html.skin-theme-clientpref-os .navbox-title,
        html.skin-theme-clientpref-os .navbox-abovebelow,
        html.skin-theme-clientpref-os .navbox th[scope="col"],
        html.skin-theme-clientpref-os .navbox .navbox-title,
        html.skin-theme-clientpref-os .navbox .navbox-group {
            background-color: #1B223D ;
            color: #e0f0ff ;
            border-color: #3a506b ;
        }
        html.skin-theme-clientpref-os .navbox .navbox-group {
            background-color: #1B223D ;
        }
        html.skin-theme-clientpref-os .navbox-odd,
        html.skin-theme-clientpref-os .navbox-even {
            background-color: #252525 ;
        }
    }
}

/*
 * Vrienden Universe "Paap" color theme.
 *
 * Paap builds on Vector 2022's night mode. The accompanying Common.js code
 * keeps skin-theme-clientpref-night active, then adds vu-theme-paap.
 */
html.vu-theme-paap {
	color-scheme: dark;
	--background-color-base: #170d24;
	--background-color-neutral: #241338;
	--background-color-neutral-subtle: #211330;
	--background-color-interactive: #2a1742;
	--background-color-interactive-subtle: #241338;
	--background-color-progressive-subtle: #351d53;
	--border-color-base: #604379;
	--border-color-subtle: #422d59;
	--color-base: #ffffff;
	--color-subtle: #d8cedf;
	--color-progressive: #79bff2;
	--color-destructive: #ef7180;
}

html.vu-theme-paap,
html.vu-theme-paap body,
html.vu-theme-paap .mw-page-container,
html.vu-theme-paap .mw-body,
html.vu-theme-paap .vector-header-container,
html.vu-theme-paap .vector-column-start,
html.vu-theme-paap .vector-column-end {
	background-color: #170d24;
	color: #ffffff;
}

html.vu-theme-paap .vector-dropdown-content,
html.vu-theme-paap .vector-menu-content,
html.vu-theme-paap .mw-portlet,
html.vu-theme-paap .cdx-menu,
html.vu-theme-paap .oo-ui-popupWidget-popup {
	background-color: #211330;
	color: #ffffff;
	border-color: #422d59;
}

/* Slightly darker than the existing dark-theme blue (#88ccff). */
html.vu-theme-paap body a:not(.new):not(.mw-selflink):link,
html.vu-theme-paap body a:not(.new):not(.mw-selflink):visited {
	color: #79bff2;
}

/* Darker than the existing dark-theme red (#ff6b6b), with AA contrast. */
html.vu-theme-paap body a.new:link,
html.vu-theme-paap body a.new:visited {
	color: #ef7180;
}

html.vu-theme-paap .infobox,
html.vu-theme-paap .navbox,
html.vu-theme-paap .navbox-subgroup,
html.vu-theme-paap .navbox th,
html.vu-theme-paap .navbox td,
html.vu-theme-paap .wikitable,
html.vu-theme-paap .wikitable > * > tr > th,
html.vu-theme-paap .wikitable > * > tr > td {
	background-color: #241338;
	color: #ffffff;
	border-color: #604379;
}

/* Replaces the current dark-blue #1B223D header surfaces. */
html.vu-theme-paap .infobox .infobox-above,
html.vu-theme-paap .infobox .infobox-title,
html.vu-theme-paap .infobox .infobox-header,
html.vu-theme-paap .infobox .infobox-subheader,
html.vu-theme-paap .infobox .infobox-below,
html.vu-theme-paap .infobox caption,
html.vu-theme-paap .infobox th[colspan],
html.vu-theme-paap .navbox-title,
html.vu-theme-paap .navbox-abovebelow,
html.vu-theme-paap .navbox th[scope="col"],
html.vu-theme-paap .navbox .navbox-group {
	background-color: #351d53;
	color: #ffffff;
	border-color: #604379;
}

html.vu-theme-paap .navbox-odd {
	background-color: #211330;
}

html.vu-theme-paap .navbox-even {
	background-color: #2a1742;
}

html.vu-theme-paap .mw-code,
html.vu-theme-paap pre,
html.vu-theme-paap code,
html.vu-theme-paap .toc,
html.vu-theme-paap .catlinks {
	background-color: #211330;
	color: #ffffff;
	border-color: #422d59;
}

/* Main Page components have their own navy palette; replace it for Paap. */
html.vu-theme-paap .vu-main {
	--vu-navy: #351d53;
	--vu-navy-light: #4a2b6b;
	--vu-blue: #79bff2;
}

html.vu-theme-paap .vu-header {
	background: linear-gradient(118deg, #211330 0%, #351d53 55%, #4a2b6b 100%);
}

html.vu-theme-paap .vu-explore-mark,
html.vu-theme-paap .vu-person-image {
	background-color: #351d53;
}

html.vu-theme-paap .vu-browse {
	background: linear-gradient(145deg, #351d53 0%, #351d53 72%, #4a2b6b 72%);
}

/*
 * Vrienden Universe "Hugerinus" color theme.
 *
 * Inspired by the green and blue Fish Collective userbox associated with
 * Hugerinus, with a muted sea-green side and a deep saturated blue side.
 */
html.vu-theme-hugerinus {
	color-scheme: dark;
	--background-color-base: #003a43;
	--background-color-neutral: #00354f;
	--background-color-neutral-subtle: #002f48;
	--background-color-interactive: #004457;
	--background-color-interactive-subtle: #00384e;
	--background-color-progressive-subtle: #003b70;
	--border-color-base: #3d99a4;
	--border-color-subtle: #277783;
	--color-base: #ffffff;
	--color-subtle: #d9f4f2;
	--color-progressive: #66bfff;
	--color-destructive: #ff9aa2;
}

html.vu-theme-hugerinus,
html.vu-theme-hugerinus body,
html.vu-theme-hugerinus .mw-page-container,
html.vu-theme-hugerinus .vector-header-container,
html.vu-theme-hugerinus .vector-column-start,
html.vu-theme-hugerinus .vector-column-end {
	background-color: #003a43;
	background-image: linear-gradient(135deg, #2F766C 0%, #1E5C96 50%, #0047D9 100%);
	background-attachment: fixed;
	color: #ffffff;
}

html.vu-theme-hugerinus .mw-body {
	background: transparent;
	color: #ffffff;
	border-radius: 0;
	box-shadow: none;
}

html.vu-theme-hugerinus .vector-dropdown-content,
html.vu-theme-hugerinus .vector-menu-content,
html.vu-theme-hugerinus .mw-portlet,
html.vu-theme-hugerinus .cdx-menu,
html.vu-theme-hugerinus .oo-ui-popupWidget-popup {
	background: #002f48;
	color: #ffffff;
	border-color: #277783;
}

html.vu-theme-hugerinus .vector-column-start .mw-portlet,
html.vu-theme-hugerinus .vector-column-end .mw-portlet {
	background: transparent;
	border-radius: 0;
	box-shadow: none;
}

html.vu-theme-hugerinus .vector-column-start .vector-menu-content,
html.vu-theme-hugerinus .vector-column-end .vector-menu-content,
html.vu-theme-hugerinus .vector-column-start .vector-menu-content-list,
html.vu-theme-hugerinus .vector-column-end .vector-menu-content-list {
	background: transparent;
	background-image: none;
	border-color: transparent;
}

html.vu-theme-hugerinus .vector-column-start .vector-pinned-container,
html.vu-theme-hugerinus .vector-column-end .vector-pinned-container {
	background: transparent;
	border-radius: 0;
	box-shadow: none;
}

html.vu-theme-hugerinus .vector-sticky-pinned-container::after {
	display: none;
	background: none;
}

html.vu-theme-hugerinus .mw-page-container,
html.vu-theme-hugerinus .vector-column-start,
html.vu-theme-hugerinus .vector-column-end {
	background-image:
		linear-gradient(rgba(0, 34, 56, 0.58), rgba(0, 34, 56, 0.58)),
		linear-gradient(135deg, #2F766C 0%, #1E5C96 50%, #0047D9 100%);
}

html.vu-theme-hugerinus .mw-logo-container.skin-invert {
	filter: none !important;
}

html.vu-theme-hugerinus .mw-logo-wordmark {
	color: #66BFFF !important;
	-webkit-text-fill-color: #66BFFF !important;
}

html.vu-theme-hugerinus body a:not(.new):not(.mw-selflink):link,
html.vu-theme-hugerinus body a:not(.new):not(.mw-selflink):visited {
	color: #66bfff;
}

html.vu-theme-hugerinus body a.new:link,
html.vu-theme-hugerinus body a.new:visited {
	color: #ff9aa2;
}

html.vu-theme-hugerinus .infobox,
html.vu-theme-hugerinus .navbox,
html.vu-theme-hugerinus .navbox-subgroup,
html.vu-theme-hugerinus .navbox th,
html.vu-theme-hugerinus .navbox td,
html.vu-theme-hugerinus .wikitable,
html.vu-theme-hugerinus .wikitable > * > tr > th,
html.vu-theme-hugerinus .wikitable > * > tr > td {
	background: rgba(0, 47, 72, 0.92);
	color: #ffffff;
	border-color: #3d99a4;
}

html.vu-theme-hugerinus .infobox .infobox-above,
html.vu-theme-hugerinus .infobox .infobox-title,
html.vu-theme-hugerinus .infobox .infobox-header,
html.vu-theme-hugerinus .infobox .infobox-subheader,
html.vu-theme-hugerinus .infobox .infobox-below,
html.vu-theme-hugerinus .infobox caption,
html.vu-theme-hugerinus .infobox th[colspan],
html.vu-theme-hugerinus .navbox-title,
html.vu-theme-hugerinus .navbox-abovebelow,
html.vu-theme-hugerinus .navbox th[scope="col"],
html.vu-theme-hugerinus .navbox .navbox-group {
	background: linear-gradient(to right, #2F766C 0%, #1E5C96 50%, #0047D9 100%);
	color: #ffffff;
	border-color: #3d99a4;
}

html.vu-theme-hugerinus .navbox-odd {
	background: rgba(0, 55, 63, 0.94);
}

html.vu-theme-hugerinus .navbox-even {
	background: rgba(0, 35, 83, 0.94);
}

html.vu-theme-hugerinus .mw-code,
html.vu-theme-hugerinus pre,
html.vu-theme-hugerinus code,
html.vu-theme-hugerinus .toc,
html.vu-theme-hugerinus .catlinks {
	background: rgba(0, 47, 72, 0.94);
	color: #ffffff;
	border-color: #277783;
}

html.vu-theme-hugerinus .vu-main {
	--vu-navy: #003b70;
	--vu-navy-light: #00685f;
	--vu-blue: #66bfff;
}

html.vu-theme-hugerinus .vu-header {
	background: linear-gradient(118deg, #2F766C 0%, #1E5C96 50%, #0047D9 100%);
}

html.vu-theme-hugerinus .vu-explore-mark,
html.vu-theme-hugerinus .vu-person-image {
	background-color: #003b70;
}

html.vu-theme-hugerinus .vu-browse {
	background: linear-gradient(145deg, #2F766C 0%, #1E5C96 50%, #0047D9 100%);
}

/*
 * Vrienden Universe "Noord" color theme.
 * Matches Paap's dark tonal range with a red palette.
 */
html.vu-theme-noord {
	color-scheme: dark;
	--background-color-base: #240d0d;
	--background-color-neutral: #381313;
	--background-color-neutral-subtle: #301313;
	--background-color-interactive: #421717;
	--background-color-interactive-subtle: #381313;
	--background-color-progressive-subtle: #531d1d;
	--border-color-base: #794343;
	--border-color-subtle: #592d2d;
	--color-base: #ffffff;
	--color-subtle: #dfcece;
	--color-progressive: #79bff2;
	--color-destructive: #ef7180;
}

html.vu-theme-noord,
html.vu-theme-noord body,
html.vu-theme-noord .mw-page-container,
html.vu-theme-noord .mw-body,
html.vu-theme-noord .vector-header-container,
html.vu-theme-noord .vector-sticky-header,
html.vu-theme-noord .vector-column-start,
html.vu-theme-noord .vector-column-end {
	background-color: #240d0d;
	color: #ffffff;
}

html.vu-theme-noord .vector-dropdown-content,
html.vu-theme-noord .vector-menu-content,
html.vu-theme-noord .mw-portlet,
html.vu-theme-noord .cdx-menu,
html.vu-theme-noord .oo-ui-popupWidget-popup {
	background-color: #301313;
	color: #ffffff;
	border-color: #592d2d;
}

html.vu-theme-noord body a:not(.new):not(.mw-selflink):link,
html.vu-theme-noord body a:not(.new):not(.mw-selflink):visited {
	color: #79bff2;
}

html.vu-theme-noord body a.new:link,
html.vu-theme-noord body a.new:visited {
	color: #ef7180;
}

html.vu-theme-noord .mw-heading,
html.vu-theme-noord h1,
html.vu-theme-noord h2,
html.vu-theme-noord h3,
html.vu-theme-noord h4,
html.vu-theme-noord h5,
html.vu-theme-noord h6 {
	background: transparent !important;
	color: #ffffff !important;
	border-color: #592d2d !important;
}

html.vu-theme-noord input:not([type="radio"]),
html.vu-theme-noord button {
	background-color: #421717 !important;
	color: #ffffff !important;
	border-color: #794343 !important;
}

html.vu-theme-noord .cdx-label {
	color: #ffffff !important;
}

html.vu-theme-noord input:not([type="radio"])::placeholder {
	color: #dfcece;
	opacity: 1;
}

html.vu-theme-noord .infobox,
html.vu-theme-noord .infobox td,
html.vu-theme-noord .infobox th,
html.vu-theme-noord .navbox,
html.vu-theme-noord .navbox-subgroup,
html.vu-theme-noord .navbox th,
html.vu-theme-noord .navbox td,
html.vu-theme-noord .wikitable,
html.vu-theme-noord .wikitable > * > tr > th,
html.vu-theme-noord .wikitable > * > tr > td {
	background-color: #381313;
	color: #ffffff;
	border-color: #794343;
}

html.vu-theme-noord .infobox .infobox-above,
html.vu-theme-noord .infobox .infobox-title,
html.vu-theme-noord .infobox .infobox-header,
html.vu-theme-noord .infobox .infobox-subheader,
html.vu-theme-noord .infobox .infobox-below,
html.vu-theme-noord .infobox caption,
html.vu-theme-noord .infobox th[colspan],
html.vu-theme-noord .navbox-title,
html.vu-theme-noord .navbox-abovebelow,
html.vu-theme-noord .navbox th[scope="col"],
html.vu-theme-noord .navbox .navbox-group {
	background-color: #531d1d;
	color: #ffffff;
	border-color: #794343;
}

html.vu-theme-noord .navbox-odd {
	background-color: #301313;
}

html.vu-theme-noord .navbox-even {
	background-color: #421717;
}

html.vu-theme-noord .mw-code,
html.vu-theme-noord pre,
html.vu-theme-noord code,
html.vu-theme-noord .toc,
html.vu-theme-noord .catlinks {
	background-color: #301313;
	color: #ffffff;
	border-color: #592d2d;
}

html.vu-theme-noord .vu-main {
	--vu-navy: #531d1d;
	--vu-navy-light: #6b2b2b;
	--vu-blue: #79bff2;
	background-color: #240d0d;
}

html.vu-theme-noord .vu-header {
	background: linear-gradient(118deg, #301313 0%, #531d1d 55%, #6b2b2b 100%);
}

html.vu-theme-noord .vu-explore-mark,
html.vu-theme-noord .vu-person-image {
	background-color: #531d1d;
}

html.vu-theme-noord .vu-browse {
	background: linear-gradient(145deg, #531d1d 0%, #531d1d 72%, #6b2b2b 72%);
}

/*
 * Vrienden Universe "Van Hetten" color theme.
 * Matches Paap's dark tonal range with an orange palette.
 */
html.vu-theme-van-hetten {
	color-scheme: dark;
	--background-color-base: #24180d;
	--background-color-neutral: #382513;
	--background-color-neutral-subtle: #302113;
	--background-color-interactive: #422c17;
	--background-color-interactive-subtle: #382513;
	--background-color-progressive-subtle: #53371d;
	--border-color-base: #795d43;
	--border-color-subtle: #59422d;
	--color-base: #ffffff;
	--color-subtle: #dfd6ce;
	--color-progressive: #ff9d3d;
	--color-destructive: #ef7180;
}

html.vu-theme-van-hetten,
html.vu-theme-van-hetten body,
html.vu-theme-van-hetten .mw-page-container,
html.vu-theme-van-hetten .mw-body,
html.vu-theme-van-hetten .vector-header-container,
html.vu-theme-van-hetten .vector-sticky-header,
html.vu-theme-van-hetten .vector-column-start,
html.vu-theme-van-hetten .vector-column-end {
	background-color: #24180d;
	color: #ffffff;
}

html.vu-theme-van-hetten .vector-dropdown-content,
html.vu-theme-van-hetten .vector-menu-content,
html.vu-theme-van-hetten .mw-portlet,
html.vu-theme-van-hetten .cdx-menu,
html.vu-theme-van-hetten .oo-ui-popupWidget-popup {
	background-color: #302113;
	color: #ffffff;
	border-color: #59422d;
}

html.vu-theme-van-hetten body a:not(.new):not(.mw-selflink):link,
html.vu-theme-van-hetten body a:not(.new):not(.mw-selflink):visited {
	color: #ff9d3d;
}

html.vu-theme-van-hetten body a.new:link,
html.vu-theme-van-hetten body a.new:visited {
	color: #ef7180;
}

html.vu-theme-van-hetten .mw-heading,
html.vu-theme-van-hetten h1,
html.vu-theme-van-hetten h2,
html.vu-theme-van-hetten h3,
html.vu-theme-van-hetten h4,
html.vu-theme-van-hetten h5,
html.vu-theme-van-hetten h6 {
	background: transparent !important;
	color: #ffffff !important;
	border-color: #59422d !important;
}

html.vu-theme-van-hetten input:not([type="radio"]),
html.vu-theme-van-hetten button {
	background-color: #422c17 !important;
	color: #ffffff !important;
	border-color: #795d43 !important;
}

html.vu-theme-van-hetten .cdx-label {
	color: #ffffff !important;
}

html.vu-theme-van-hetten input:not([type="radio"])::placeholder {
	color: #dfd6ce;
	opacity: 1;
}

html.vu-theme-van-hetten .infobox,
html.vu-theme-van-hetten .infobox td,
html.vu-theme-van-hetten .infobox th,
html.vu-theme-van-hetten .navbox,
html.vu-theme-van-hetten .navbox-subgroup,
html.vu-theme-van-hetten .navbox th,
html.vu-theme-van-hetten .navbox td,
html.vu-theme-van-hetten .wikitable,
html.vu-theme-van-hetten .wikitable > * > tr > th,
html.vu-theme-van-hetten .wikitable > * > tr > td {
	background-color: #382513;
	color: #ffffff;
	border-color: #795d43;
}

html.vu-theme-van-hetten .infobox .infobox-above,
html.vu-theme-van-hetten .infobox .infobox-title,
html.vu-theme-van-hetten .infobox .infobox-header,
html.vu-theme-van-hetten .infobox .infobox-subheader,
html.vu-theme-van-hetten .infobox .infobox-below,
html.vu-theme-van-hetten .infobox caption,
html.vu-theme-van-hetten .infobox th[colspan],
html.vu-theme-van-hetten .navbox-title,
html.vu-theme-van-hetten .navbox-abovebelow,
html.vu-theme-van-hetten .navbox th[scope="col"],
html.vu-theme-van-hetten .navbox .navbox-group {
	background-color: #53371d;
	color: #ffffff;
	border-color: #795d43;
}

html.vu-theme-van-hetten .navbox-odd {
	background-color: #302113;
}

html.vu-theme-van-hetten .navbox-even {
	background-color: #422c17;
}

html.vu-theme-van-hetten .mw-code,
html.vu-theme-van-hetten pre,
html.vu-theme-van-hetten code,
html.vu-theme-van-hetten .toc,
html.vu-theme-van-hetten .catlinks {
	background-color: #302113;
	color: #ffffff;
	border-color: #59422d;
}

html.vu-theme-van-hetten .vu-main {
	--vu-navy: #53371d;
	--vu-navy-light: #6b4a2b;
	--vu-blue: #ff9d3d;
	background-color: #24180d;
}

html.vu-theme-van-hetten .vu-header {
	background: linear-gradient(118deg, #302113 0%, #53371d 55%, #6b4a2b 100%);
}

html.vu-theme-van-hetten .vu-explore-mark,
html.vu-theme-van-hetten .vu-person-image {
	background-color: #53371d;
}

html.vu-theme-van-hetten .vu-browse {
	background: linear-gradient(145deg, #53371d 0%, #53371d 72%, #6b4a2b 72%);
}

/*
 * Vrienden Universe "Hoos" color theme.
 * A restrained yellow-to-white gradient with black text.
 */
html.vu-theme-hoos {
	color-scheme: light;
	--background-color-base: #e8dca8;
	--background-color-neutral: #f1e4a8;
	--background-color-neutral-subtle: #fffdf2;
	--background-color-interactive: #e4cc6a;
	--background-color-interactive-subtle: #f1e4a8;
	--background-color-progressive-subtle: #f5e58f;
	--border-color-base: #8a772f;
	--border-color-subtle: #b9a75b;
	--color-base: #000000;
	--color-subtle: #4b4325;
	--color-progressive: #003f9e;
	--color-destructive: #8a1f2d;
}

html.vu-theme-hoos,
html.vu-theme-hoos body,
html.vu-theme-hoos .mw-page-container,
html.vu-theme-hoos .vector-header-container,
html.vu-theme-hoos .vector-column-start,
html.vu-theme-hoos .vector-column-end {
	background-color: #e8dca8;
	background-image: linear-gradient(135deg, #d9b92e 0%, #f0e19a 55%, #fffdf4 100%);
	background-attachment: fixed;
	color: #000000;
}

html.vu-theme-hoos .mw-body {
	background: transparent;
	color: #000000;
	border-radius: 0;
	box-shadow: none;
}

html.vu-theme-hoos .vector-dropdown-content,
html.vu-theme-hoos .vector-menu-content,
html.vu-theme-hoos .mw-portlet,
html.vu-theme-hoos .cdx-menu,
html.vu-theme-hoos .oo-ui-popupWidget-popup {
	background: #fffdf2;
	color: #000000;
	border-color: #8a772f;
}

html.vu-theme-hoos body a:not(.new):not(.mw-selflink):link,
html.vu-theme-hoos body a:not(.new):not(.mw-selflink):visited {
	color: #003f9e;
}

html.vu-theme-hoos body a.new:link,
html.vu-theme-hoos body a.new:visited {
	color: #8a1f2d;
}

html.vu-theme-hoos .mw-heading,
html.vu-theme-hoos h1,
html.vu-theme-hoos h2,
html.vu-theme-hoos h3,
html.vu-theme-hoos h4,
html.vu-theme-hoos h5,
html.vu-theme-hoos h6,
html.vu-theme-hoos .cdx-label {
	color: #000000 !important;
	border-color: #8a772f !important;
}

html.vu-theme-hoos input:not([type="radio"]),
html.vu-theme-hoos button {
	background-color: #f5e58f !important;
	color: #000000 !important;
	border-color: #8a772f !important;
}

html.vu-theme-hoos input:not([type="radio"])::placeholder {
	color: #4b4325;
	opacity: 1;
}

html.vu-theme-hoos .infobox,
html.vu-theme-hoos .infobox td,
html.vu-theme-hoos .infobox th {
	background: #fffdf2 !important;
	color: #000000 !important;
	border-color: #8a772f !important;
}

html.vu-theme-hoos .infobox .infobox-above,
html.vu-theme-hoos .infobox .infobox-title,
html.vu-theme-hoos .infobox .infobox-header,
html.vu-theme-hoos .infobox .infobox-subheader,
html.vu-theme-hoos .infobox .infobox-below,
html.vu-theme-hoos .infobox caption,
html.vu-theme-hoos .infobox th[colspan],
html.vu-theme-hoos .navbox-title,
html.vu-theme-hoos .navbox-abovebelow,
html.vu-theme-hoos .navbox th[scope="col"],
html.vu-theme-hoos .navbox .navbox-group {
	background: linear-gradient(to right, #d9b92e 0%, #f0e19a 55%, #fffdf4 100%) !important;
	color: #000000 !important;
	border-color: #8a772f !important;
}

html.vu-theme-hoos .navbox,
html.vu-theme-hoos .navbox-subgroup,
html.vu-theme-hoos .navbox th,
html.vu-theme-hoos .navbox td,
html.vu-theme-hoos .wikitable,
html.vu-theme-hoos .wikitable > * > tr > th,
html.vu-theme-hoos .wikitable > * > tr > td,
html.vu-theme-hoos .mw-code,
html.vu-theme-hoos pre,
html.vu-theme-hoos code,
html.vu-theme-hoos .toc,
html.vu-theme-hoos .catlinks {
	background: #fffdf2;
	color: #000000;
	border-color: #8a772f;
}

html.vu-theme-hoos .navbox-odd {
	background: #fff9d9;
}

html.vu-theme-hoos .navbox-even {
	background: #f5e9ae;
}

html.vu-theme-hoos .vu-main,
html.vu-theme-hoos .vu-main [class^="vu-"],
html.vu-theme-hoos .vu-main [class*=" vu-"] {
	color: #000000 !important;
	border-color: #8a772f !important;
}

html.vu-theme-hoos .vu-main {
	--vu-navy: #d9b92e;
	--vu-navy-light: #f0e19a;
	--vu-blue: #003f9e;
	background: transparent;
}

html.vu-theme-hoos .vu-header,
html.vu-theme-hoos .vu-about,
html.vu-theme-hoos .vu-explore,
html.vu-theme-hoos .vu-feature,
html.vu-theme-hoos .vu-guide,
html.vu-theme-hoos .vu-notice,
html.vu-theme-hoos .vu-information,
html.vu-theme-hoos .vu-people-stage,
html.vu-theme-hoos .vu-family-area,
html.vu-theme-hoos .vu-browse {
	background: linear-gradient(118deg, #d9b92e 0%, #f0e19a 55%, #fffdf4 100%) !important;
	color: #000000 !important;
	border-color: #8a772f !important;
}

html.vu-theme-hoos .vu-header-button,
html.vu-theme-hoos .vu-route-button,
html.vu-theme-hoos .vu-browse-button,
html.vu-theme-hoos .vu-slide-button,
html.vu-theme-hoos .vu-person-open,
html.vu-theme-hoos .vu-family-link,
html.vu-theme-hoos .vu-feature-link,
html.vu-theme-hoos .vu-explore-link {
	background-color: #fffdf2 !important;
	color: #000000 !important;
	border-color: #8a772f !important;
}
/*
 * Vrienden Universe "Schroeter" color theme.
 * Neutral beige surfaces with high-contrast charcoal-brown text.
 */
html.vu-theme-schroeter {
	color-scheme: light;
	--background-color-base: #E8D8C3;
	--background-color-neutral: #E1D0B9;
	--background-color-neutral-subtle: #F3EADF;
	--background-color-interactive: #D6C2A6;
	--background-color-interactive-subtle: #E1D0B9;
	--background-color-progressive-subtle: #D6C2A6;
	--border-color-base: #806F5C;
	--border-color-subtle: #A99883;
	--color-base: #2B2520;
	--color-subtle: #5A4E43;
	--color-progressive: #254F73;
	--color-destructive: #8A1F2D;
}

html.vu-theme-schroeter,
html.vu-theme-schroeter body,
html.vu-theme-schroeter .mw-page-container,
html.vu-theme-schroeter .mw-body,
html.vu-theme-schroeter .vector-header-container,
html.vu-theme-schroeter .vector-sticky-header,
html.vu-theme-schroeter .vector-column-start,
html.vu-theme-schroeter .vector-column-end {
	background: #E8D8C3;
	color: #2B2520;
}

html.vu-theme-schroeter .vector-dropdown-content,
html.vu-theme-schroeter .vector-menu-content,
html.vu-theme-schroeter .mw-portlet,
html.vu-theme-schroeter .cdx-menu,
html.vu-theme-schroeter .oo-ui-popupWidget-popup {
	background: #F3EADF;
	color: #2B2520;
	border-color: #806F5C;
}

html.vu-theme-schroeter body a:not(.new):not(.mw-selflink):link,
html.vu-theme-schroeter body a:not(.new):not(.mw-selflink):visited {
	color: #254F73;
}

html.vu-theme-schroeter body a.new:link,
html.vu-theme-schroeter body a.new:visited {
	color: #8A1F2D;
}

html.vu-theme-schroeter .mw-heading,
html.vu-theme-schroeter h1,
html.vu-theme-schroeter h2,
html.vu-theme-schroeter h3,
html.vu-theme-schroeter h4,
html.vu-theme-schroeter h5,
html.vu-theme-schroeter h6,
html.vu-theme-schroeter .cdx-label {
	color: #2B2520 !important;
}

html.vu-theme-schroeter input:not([type="radio"]),
html.vu-theme-schroeter button {
	background-color: #D6C2A6 !important;
	color: #2B2520 !important;
	border-color: #806F5C !important;
}

html.vu-theme-schroeter input:not([type="radio"])::placeholder {
	color: #5A4E43;
	opacity: 1;
}

/* Explicit cell rules beat the night-mode infobox rules underneath. */
html.vu-theme-schroeter .infobox,
html.vu-theme-schroeter .infobox td,
html.vu-theme-schroeter .infobox th {
	background: #F3EADF !important;
	color: #2B2520 !important;
	border-color: #806F5C !important;
}

html.vu-theme-schroeter .infobox .infobox-above,
html.vu-theme-schroeter .infobox .infobox-title,
html.vu-theme-schroeter .infobox .infobox-header,
html.vu-theme-schroeter .infobox .infobox-subheader,
html.vu-theme-schroeter .infobox .infobox-below,
html.vu-theme-schroeter .infobox caption,
html.vu-theme-schroeter .infobox th[colspan] {
	background: #D6C2A6 !important;
	color: #2B2520 !important;
	border-color: #806F5C !important;
}

/* Outrank Vector's more specific night-mode header selectors. */
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox .infobox-above,
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox .infobox-title,
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox .infobox-header,
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox .infobox-subheader,
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox .infobox-below,
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox caption,
html.vu-theme-schroeter.skin-theme-clientpref-night .infobox th[colspan] {
	background: #D6C2A6 !important;
	color: #2B2520 !important;
	border-color: #806F5C !important;
}

html.vu-theme-schroeter .infobox a {
	background: transparent !important;
}

html.vu-theme-schroeter .navbox,
html.vu-theme-schroeter .navbox-subgroup,
html.vu-theme-schroeter .navbox th,
html.vu-theme-schroeter .navbox td,
html.vu-theme-schroeter .wikitable,
html.vu-theme-schroeter .wikitable > * > tr > th,
html.vu-theme-schroeter .wikitable > * > tr > td,
html.vu-theme-schroeter .mw-code,
html.vu-theme-schroeter pre,
html.vu-theme-schroeter code,
html.vu-theme-schroeter .toc,
html.vu-theme-schroeter .catlinks {
	background: #F3EADF;
	color: #2B2520;
	border-color: #806F5C;
}

html.vu-theme-schroeter .navbox-title,
html.vu-theme-schroeter .navbox-abovebelow,
html.vu-theme-schroeter .navbox th[scope="col"],
html.vu-theme-schroeter .navbox .navbox-group {
	background: #D6C2A6 !important;
	color: #2B2520 !important;
}

html.vu-theme-schroeter .vu-main,
html.vu-theme-schroeter .vu-main [class^="vu-"],
html.vu-theme-schroeter .vu-main [class*=" vu-"] {
	color: #2B2520 !important;
	border-color: #806F5C !important;
}

html.vu-theme-schroeter .vu-main {
	background-color: #E8D8C3 !important;
}

html.vu-theme-schroeter .vu-header {
	background: linear-gradient(118deg, #E8D8C3 0%, #E1D0B9 52%, #D6C2A6 100%) !important;
}

html.vu-theme-schroeter .vu-about,
html.vu-theme-schroeter .vu-explore,
html.vu-theme-schroeter .vu-feature,
html.vu-theme-schroeter .vu-guide,
html.vu-theme-schroeter .vu-notice,
html.vu-theme-schroeter .vu-information,
html.vu-theme-schroeter .vu-people-stage,
html.vu-theme-schroeter .vu-family-area,
html.vu-theme-schroeter .vu-browse {
	background-color: #F3EADF !important;
	background-image: none !important;
	border-color: #806F5C !important;
}

html.vu-theme-schroeter .vu-header-button,
html.vu-theme-schroeter .vu-route-button,
html.vu-theme-schroeter .vu-browse-button,
html.vu-theme-schroeter .vu-slide-button,
html.vu-theme-schroeter .vu-person-open,
html.vu-theme-schroeter .vu-family-link,
html.vu-theme-schroeter .vu-feature-link,
html.vu-theme-schroeter .vu-explore-link {
	background-color: #D6C2A6 !important;
	color: #2B2520 !important;
	border-color: #806F5C !important;
}

/*
 * Custom-theme infobox palette.
 * These rules are deliberately scoped to custom themes; native Dark keeps its
 * existing #1B223D headers and #1e1e1e body cells.
 */
html.vu-theme-paap {
	--vu-infobox-body: #241338;
	--vu-infobox-header: #351D53;
	--vu-infobox-text: #FFFFFF;
	--vu-infobox-border: #604379;
}

html.vu-theme-hugerinus {
	--vu-infobox-body: #002F48;
	--vu-infobox-header: linear-gradient(90deg, #2F766C 0%, #1E5C96 50%, #0047D9 100%);
	--vu-infobox-text: #FFFFFF;
	--vu-infobox-border: #3D99A4;
}

html.vu-theme-noord {
	--vu-infobox-body: #381313;
	--vu-infobox-header: #531D1D;
	--vu-infobox-text: #FFFFFF;
	--vu-infobox-border: #794343;
}

html.vu-theme-van-hetten {
	--vu-infobox-body: #382513;
	--vu-infobox-header: #53371D;
	--vu-infobox-text: #FFFFFF;
	--vu-infobox-border: #795D43;
}

html.vu-theme-hoos {
	--vu-infobox-body: #FFFDF2;
	--vu-infobox-header: linear-gradient(90deg, #D9B92E 0%, #F0E19A 55%, #FFFDF4 100%);
	--vu-infobox-text: #000000;
	--vu-infobox-border: #8A772F;
}

html.vu-theme-schroeter {
	--vu-infobox-body: #F3EADF;
	--vu-infobox-header: #D6C2A6;
	--vu-infobox-text: #2B2520;
	--vu-infobox-border: #806F5C;
}

html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox td,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th {
	background: var(--vu-infobox-body) !important;
	color: var(--vu-infobox-text) !important;
	border-color: var(--vu-infobox-border) !important;
}

html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox td.infobox-above,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th.infobox-above,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox td.infobox-title,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th.infobox-title,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox td.infobox-header,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th.infobox-header,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox td.infobox-subheader,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th.infobox-subheader,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox td.infobox-below,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th.infobox-below,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox caption,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox th[colspan] {
	background: var(--vu-infobox-header) !important;
	color: var(--vu-infobox-text) !important;
	border-color: var(--vu-infobox-border) !important;
}

html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox a,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox span,
html.skin-theme-clientpref-night:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .infobox div {
	background: transparent !important;
}

/* Preserve the Tanoa navbox's semantic gold identity in custom themes. */
html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .tanoa-navbox .navbox-title {
	background: #B37C28 !important;
	color: #000000 !important;
}

html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .tanoa-navbox .navbox-group {
	background: #C48F2D !important;
	color: #000000 !important;
}

html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .tanoa-navbox .navbox-title a,
html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .tanoa-navbox .navbox-group a {
	background: transparent !important;
	color: #000000 !important;
}

/* Beat late-loaded TemplateStyles/night selectors without affecting native Dark. */
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox td.infobox-above,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox th.infobox-above,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox td.infobox-title,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox th.infobox-title,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox td.infobox-header,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox th.infobox-header,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox td.infobox-subheader,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox th.infobox-subheader,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox td.infobox-below,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox th.infobox-below,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox caption,
html.skin-theme-clientpref-night:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .infobox th[colspan] {
	background: var(--vu-infobox-header) !important;
	color: var(--vu-infobox-text) !important;
	border-color: var(--vu-infobox-border) !important;
}

html:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .tanoa-navbox th.navbox-title {
	background: #B37C28 !important;
	color: #000000 !important;
}

html:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mw-parser-output .tanoa-navbox th.navbox-group {
	background: #C48F2D !important;
	color: #000000 !important;
}

/* Missing pages stay recognizably red and readable in every appearance. */
html.skin-theme-clientpref-day body a.new.new.new.new.new,
html.skin-theme-clientpref-os body a.new.new.new.new.new {
	background: transparent !important;
	color: #B00020 !important;
	text-decoration: underline;
	text-decoration-color: currentColor;
}

html.skin-theme-clientpref-night body a.new.new.new.new.new {
	background: transparent !important;
	color: #FF7B86 !important;
	text-decoration: underline;
	text-decoration-color: currentColor;
}

@media (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os body a.new.new.new.new.new {
		color: #FF7B86 !important;
	}
}

html.vu-theme-paap body a.new.new.new.new.new {
	background: transparent !important;
	color: #EF7180 !important;
}

html.vu-theme-hugerinus body a.new.new.new.new.new {
	background: transparent !important;
	color: #FF9AA2 !important;
}

html.vu-theme-van-hetten body a.new.new.new.new.new {
	background: transparent !important;
	color: #EF7180 !important;
}

html.vu-theme-hoos body a.new.new.new.new.new {
	background: transparent !important;
	color: #8A1F2D !important;
}

html.vu-theme-schroeter body a.new.new.new.new.new {
	background: transparent !important;
	color: #8A1F2D !important;
}

html body a.new.new.new.new.new {
	text-decoration: none !important;
}

html.vu-theme-noord body a.new.new.new.new.new {
	background: transparent !important;
	color: #EF7180 !important;
	padding-inline: 0;
	border-radius: 0;
}

html.vu-theme-noord.vu-theme-noord body a:not(.new):not(.mw-selflink):link,
html.vu-theme-noord.vu-theme-noord body a:not(.new):not(.mw-selflink):visited {
	background: transparent !important;
	color: #79BFF2 !important;
	text-decoration: none !important;
}

html.vu-theme-noord.vu-theme-noord body .mw-parser-output .navbox td.navbox-list a:not(.new):not(.mw-selflink) {
	color: #79BFF2 !important;
	text-decoration: none !important;
}

html.vu-theme-noord.vu-theme-noord body .mw-parser-output .navbox td.navbox-list a.new.new.new.new.new {
	background: transparent !important;
	color: #FF7B86 !important;
}

html.vu-theme-van-hetten.vu-theme-van-hetten body a:not(.new):not(.mw-selflink):link,
html.vu-theme-van-hetten.vu-theme-van-hetten body a:not(.new):not(.mw-selflink):visited {
	background: transparent !important;
	color: #FF9D3D !important;
	text-decoration: none !important;
}

html.vu-theme-van-hetten.vu-theme-van-hetten body .mw-parser-output .navbox td.navbox-list a:not(.new):not(.mw-selflink) {
	color: #FF9D3D !important;
	text-decoration: none !important;
}

html.vu-theme-van-hetten.vu-theme-van-hetten body .mw-parser-output .tanoa-navbox .navbox-title a:not(.new),
html.vu-theme-van-hetten.vu-theme-van-hetten body .mw-parser-output .tanoa-navbox .navbox-group a:not(.new) {
	color: #000000 !important;
}

html.vu-theme-hoos.vu-theme-hoos body a:not(.new):not(.mw-selflink):link,
html.vu-theme-hoos.vu-theme-hoos body a:not(.new):not(.mw-selflink):visited,
html.vu-theme-hoos.vu-theme-hoos body .mw-parser-output .navbox td.navbox-list a:not(.new):not(.mw-selflink) {
	background: transparent !important;
	color: #003F9E !important;
	text-decoration: none !important;
}

.mw-pt-translate-header {
    display: none;
}

/* Keep appearance controls and page-preview prose readable in every VU theme. */
html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .vector-appearance .vector-menu-heading,
html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .vector-appearance .cdx-label,
html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .vector-appearance .cdx-label__label__text,
html:is(.vu-theme-paap, .vu-theme-hugerinus, .vu-theme-noord, .vu-theme-van-hetten, .vu-theme-hoos, .vu-theme-schroeter) .vector-appearance .skin-client-pref-exclusion-notice {
	color: var(--color-base, #202122) !important;
	opacity: 1 !important;
}

/* The preview extract is prose even when the extension wraps it in a link. */
html .mwe-popups .mwe-popups-extract,
html .mwe-popups .mwe-popups-extract > span,
html .mwe-popups .mwe-popups-extract > p {
	color: var(--color-base, #202122) !important;
}

html.vu-theme-paap {
	--vu-preview-link: #79BFF2;
}

html.vu-theme-hugerinus {
	--vu-preview-link: #66BFFF;
}

html.vu-theme-noord {
	--vu-preview-link: #79BFF2;
}

html.vu-theme-van-hetten {
	--vu-preview-link: #FF9D3D;
}

html.vu-theme-hoos {
	--vu-preview-link: #003F9E;
}

html.vu-theme-schroeter {
	--vu-preview-link: #254F73;
}

html:is(.vu-theme-paap.vu-theme-paap, .vu-theme-hugerinus.vu-theme-hugerinus, .vu-theme-noord.vu-theme-noord, .vu-theme-van-hetten.vu-theme-van-hetten, .vu-theme-hoos.vu-theme-hoos, .vu-theme-schroeter.vu-theme-schroeter) body .mwe-popups.mwe-popups a.mwe-popups-extract.mwe-popups-extract {
	color: var(--color-base, #202122) !important;
}

/* Retain link color only for actual links and the linked preview title. */
html .mwe-popups .mwe-popups-extract a,
html .mwe-popups a.mwe-popups-extract > b:first-child,
html .mwe-popups a.mwe-popups-extract > strong:first-child,
html .mwe-popups .mwe-popups-extract > p:first-child > b:first-child,
html .mwe-popups .mwe-popups-extract > p:first-child > strong:first-child {
	color: var(--vu-preview-link, var(--color-progressive, #36c)) !important;
}
VU-MaintenanceBot (talk | contribs)

Latest revision as of 23:52, 22 September 2026
