MediaWiki:Gadget-Site.css

/* 
CSS for all desktop and mobile skins. See also [[MediaWiki:Gadget-Variables.css]]

Inteded to replacement Common.css and Mobile.css which only target desktop and mobile versions, respectively.

Most styles apply to all devices and those that don't generally require media queries anyway.
Also, the default mobile skin (Timeless) can be used on desktop as well.
It simplifies site maintenance to keep all general styles in one place.

The CSS is encapsulated in a gadget for minification and any other ResourceLoader optimizations.

[[Category:Gadget Styles]]
[[Category:Skin Styles]]
*/

body {
	background-color: var(--mw-bg-body);
}
body, .mw-body h1, .mw-body-content h1, .mw-body-content h2 {
	font-family: var(--zw-font-family-sans);
}

/* General classes custom-made for Zelda Wiki content */
.caption { /* See [[Module:UtilsMarkup/Format#caption]] */
	font-size: 12px;
}

/* [[Template:Tooltip]] */
.tooltip, .tooltip a {
	text-decoration: underline;
	text-decoration-style: dotted;
}

/* Media queries. See [[Module:Data Table]] for sample usage */
.size-small-down,
.size-medium-up,
.size-medium-down,
.size-large-up,
.size-large-down,
.size-xlarge-up {
	display: none;
}
@media (max-width: 53.1125rem) {
	.size-small-down {
		display: inherit;
	}
}
@media (min-width: 53.125rem) {
	.size-medium-up {
		display: inherit;
	}
}
@media (max-width: 68.7475rem) {
	.size-medium-down {
		display: inherit;
	}
}
@media (min-width: 68.75rem) {
	.size-large-up {
		display: inherit;
	}
}
@media (max-width: 89.9975rem) {
	.size-large-down {
		display: inherit;
	}
}
@media (min-width: 90rem) {
	.size-xlarge-up {
		display: inherit;
	}
}

/* MediaWiki icons */
.mw-content-ltr .redirectText li:first-child {
	background-image: url("//cdn.wikimg.net/en/zeldawiki/images/d/db/Wiki_Icon_Redirect_Dark.svg");
}
#mw-indicator-mw-helplink a {
	background-image: url("//cdn.wikimg.net/en/zeldawiki/images/0/02/Wiki_Icon_Help_Notice_Dark.svg");
}
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
	background-image: url("//cdn.wikimg.net/en/zeldawiki/images/a/af/Wiki_Icon_Sort_Both_Dark.svg")
}
.jquery-tablesorter th.headerSortUp {
	background-image: url("//cdn.wikimg.net/en/zeldawiki/images/a/a5/Wiki_Icon_Sort_Up_Dark.svg")
}
.jquery-tablesorter th.headerSortDown {
	background-image: url("//cdn.wikimg.net/en/zeldawiki/images/5/56/Wiki_Icon_Sort_Down_Dark.svg")
}
.postedit:after {
    background-image: url("//cdn.wikimg.net/en/zeldawiki/images/1/1a/Wiki_Icon_Close_Dark.svg")
}
.mw-parser-output a.external {
	background-image: url("//cdn.wikimg.net/en/zeldawiki/images/0/02/Wiki_Icon_External_Link.svg");
}

/* MediaWiki OOUI elements */
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {
    color: black;
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
	color: var(--mw-text-button-frameless);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
	color: var(--mw-text-button-frameless-hover);
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive .oo-ui-iconElement-icon {
    filter: var(--mw-text-button-frameless-filter)
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive:hover .oo-ui-iconElement-icon {
    filter: var(--mw-text-button-frameless-hover-filter)
}
.oo-ui-toolbar-popups .oo-ui-iconElement-icon {
    filter: var(--zw-text-filter);
}
.oo-ui-buttonElement-framed .oo-ui-indicatorElement-indicator {
    filter: none; /* because framed buttons (e.g. Special:RecentChanges) aren't styled yet */
}
.oo-ui-toolbar-bar {
    background-color: var(--mw-bg-header);
    color: var(--mw-text)
}
.oo-ui-tool {
    background-color: var(--mw-bg-header);
}
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
    background-color: var(--mw-bg-interactive-hover);
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active > .oo-ui-tool-link {
    background-color: var(--mw-bg-interactive-pressed);
}
.oo-ui-toolGroup-tools {
    background-color: var(--mw-bg-header);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
.oo-ui-popupToolGroup-header {
    color: var(--mw-text-subdued);
}
.oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel {
    color: var(--mw-text-subdued);
}
.oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {
    background-color: var(--mw-bg-interactive-hover);
    color: var(--mw-text);
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover {
    border-right-color: var(--mw-border);
}
.oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
    color: var(--mw-text-disabled);
}
.oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
	color: var(--mw-text-button-frameless);
}
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover {
    background-color: var(--mw-bg-interactive-hover)
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
    box-shadow: inset 0 -2px 0 0 var(--mw-text-button-frameless-hover);
    color: var(--mw-text-button-frameless-hover);
}
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected,
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover {
    box-shadow: inset 0 -2px 0 0 var(--mw-text-button-frameless);
    color: var(--mw-text-button-frameless);
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice {
    background-color: var(--mw-bg-header);
    border-color: var(--mw-border)
}

/* Notifications */
.mw-echo-notifications-badge {
	filter: var(--mw-text-filter);
	opacity: 1 !important;
}

.mw-notification {
    background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
    box-shadow: var(--zw-box-shadow-2);
    color: var(--mw-text);
}

/* Styled Discord link in sidebar
Adapted with permission from Runescape Wiki implementation by User:JaydenKieran, licensed under CC BY-NC-SA 3.0
https://runescape.wiki/w/MediaWiki:Vector.css
https://runescape.wiki/w/User:JaydenKieran */
#p-Navigation #n-Discord a {
    color: white !important;
    font-size: 12px;
    font-weight: bold;
    border-radius: 5px;
    border: 1px solid #4b56d0;
    background-color: #5865F2;
    display: block;
    position: relative;
    padding: 4px 0 5px calc(17px + 5.5px * 2);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    transition: 0.2s ease;
}
#p-Navigation #n-Discord a::before {
    content: 'Chat on ';
    font-weight: normal;
    opacity: 0.85;
}
#p-Navigation #n-Discord a::after {
    content: '';
    background: url('https://cdn.wikimg.net/en/zeldawiki/images/7/7b/Discord_Logo.svg') no-repeat;
    background-size: 17px 13px;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
    position: absolute;
    top: 5px;
    left: 7px;
    width: 17px;
    height: 13px;
}
#p-Navigation #n-Discord a:hover {
    text-decoration: none;
    background-color: #4b56d0;
}

/* Page content */
.mw-body {
	background-color: var(--mw-bg-page);
	border: 1px solid var(--mw-border);
	color: var(--mw-text);
}

/* Site notice */
.mw-dismissable-notice .mw-dismissable-notice-body {
	margin: 0;
}
.mw-dismissable-notice-close {
    margin: var(--zw-space-3);
}
.mw-dismissable-notice-close a {
    cursor: pointer;
}

#contentSub, #contentSub2 { /* Redirect notices and such */
	color: var(--mw-text);
}
h1, h2, h3, h4, h5, h6 {
	color: var(--mw-text);
}
.mw-body h1, .mw-body h2 {
	border-color: var(--mw-border);
	clear: left;
}
hr {
	background-color: var(--mw-border);
}
li {
	list-style-image: none;
}

/* Unbulleted lists */
ol.plainlist,
ul.plainlist {
	line-height: inherit;
	list-style: none none;
	margin: 0;
}
ol.plainlist li,
ul.plainlist li {
	margin-bottom: 0;
}
.plainlist .plainlist {
	margin-left: 1rem;
}

/* Links */
a {
	transition: var(--zw-duration-300);
}
a, .mw-parser-output a.extiw, .mw-parser-output a.external {
	color: var(--mw-link);
}
a:hover, a:visited:hover, .mw-parser-output a.extiw:hover, .mw-parser-output a.external:hover {
	color: var(--mw-link-hover);
}
a:visited, .mw-parser-output a.extiw:visited, .mw-parser-output a.external:visited {
	color: var(--mw-link-visited);
}
a.new, .new a, a.new:visited, .new a:visited {
	color: var(--mw-redlink);
}
a.new:hover, .new a:hover {
	color: var(--mw-redlink-hover);
	text-decoration-style: dashed;
}
.zw-color a {
	color: inherit;
}

/* Footer */
.mw-footer li {
	color: var(--mw-text);
}

/* Article content */
.mw-parser-output {
	font-size: 1rem;
	line-height: 1.75;
}
#mw-content-text .mw-editsection-bracket, .mw-editsection-divider {
	color: var(--mw-text);
	font-size: 0.875rem;
}
.mw-content-ltr .mw-editsection, .mw-content-rtl .mw-content-ltr .mw-editsection, .mw-content-ltr .mw-editsection-like, .mw-content-rtl .mw-content-ltr .mw-editsection-like {
	margin-left: var(--zw-space-2);
}

/* Table of Contents */
.toc {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
	border-radius: var(--zw-border-radius-2);
	padding-left: var(--zw-space-2);
	padding-right: var(--zw-space-2);
}
.tocnumber {
	color: var(--mw-text);
}
.toctogglelabel {
	color: var(--mw-link);
	font-size: 0.875rem;
}

/* Collapsible content */
.mw-collapsible-text {
	font-size: 0.875rem;
}

/* For pixel art (sprites, 2D game screenshots) to be resized using nearest-neighbor interpolation so that the images don't appear blurry. */
/* Should not be applied to all images as it makes images like logos and models and artwork look jagged. */
/* Game prefixes are needed to account for 2D game screenshots. Ideally the pixel-art class would be applied to these images so that we don't have to rely on keeping this list of game prefixes up to date. */
img[src*="Sprite"],
img[src*="Icon"],
img[src*="/TLoZ_"],
img[src*="/TAoL_"],
img[src*="/ALttP_"],
img[src*="/LA_"],
img[src*="/LADX_"],
img[src*="/OoS_"],
img[src*="/OoA_"],
img[src*="/FS_"],
img[src*="/FSAE_"],
img[src*="/FSA_"],
img[src*="/TMC_"],
img[src*="/ZG&W_"],
img[src*="/TFoE_"],
img[src*="/TWoG_"],
img[src*="/BSTLoZ_"],
img[src*="/ZA_"],
img[src*="/AST_"],
img[src*="/FPTRR_"],
img[src*="/TBFDS_"],
img[src*="/TMTP_"],
img[src*="/RTBToL_"],
img[src*="/MNPTP_"],
img[src*="/CoH_"],
img[src*="/G&WTLoZV_"],
.pixel-art {
	-ms-interpolation-mode:nearest-neighbor;
	image-rendering:pixelated;
}

/* Thumbnails */
figure[typeof~='mw:File/Thumb'] {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
}

/* Thumbnails - legacy code to be deleted once the $wgParserEnableLegacyMediaDOM transition is complete  */
div.thumbinner, .thumbimage {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
	border-radius: var(--zw-border-radius-2);
}
div.thumbinner {
	padding: var(--zw-space-1);
}
.thumbimage {
	border: none;
}
.magnify {
	display: none;
}
.MediaTransformError { 
    color: var(--mw-text-warning);
    font-weight: bold;
    
	/* The height property breaks templates such as [[Template:Tabs]]. */
    height: auto !important; /* !important necessary to override inline style */
}

/* Galleries */
ul.gallery {
	margin: 0;
	margin-left: calc(-1*var(--zw-space-1));
}
.gallerybox {
	margin-left: var(--zw-space-1)
}
li.gallerybox div.thumb {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
	border-radius: var(--zw-border-radius-2);
	margin: 0;

	display: flex;
	align-items: center; /* Center align file name that appears when the file does not exist */
	justify-content: center;
}
.gallerytext p {
    line-height: 1.5rem;
    font-size: 0.875rem;
    margin-top: 0;
}

/* Tables - see also [[MediaWiki:Gadget-Tables.css]] */
.wikitable {
	background-color: var(--mw-bg-page);
	border-color: var(--mw-border);
	border-radius: var(--zw-border-radius-2);
	border-width: 1px;
	color: var(--mw-text);
	margin: 0;
}

table.wikitable {
	padding: 4px;
	border-collapse: separate;
}

table.wikitable > * > tr > th {
	background-color: var(--mw-bg-header);
}

table.wikitable > * > tr > th,
table.wikitable > * > tr > td {
	border-color: var(--mw-border);
}

table.infobox tr.infobox-field th {
	text-align: right;
	max-width: 50%;
}

table.infobox tr.infobox-field td {
	min-width: 50%;
}

table.infobox tr.infobox-field th,
table.wikitable td {
	padding: 8px;
}

table.infobox tr.infobox-field th:first-child,
.wikitable td:first-child,
.wikitable th:first-child {
	border-radius: var(--zw-border-radius-2) 0px 0px var(--zw-border-radius-2);
}

table.infobox tr.infobox-field th:last-child,
.wikitable td:last-child,
.wikitable th:last-child {
	border-radius: 0px var(--zw-border-radius-2) var(--zw-border-radius-2) 0px;
}

table.infobox tr.infobox-field th:first-child:last-child,
.wikitable td:first-child:last-child,
.wikitable th:first-child:last-child {
	border-radius: var(--zw-border-radius-2) var(--zw-border-radius-2) var(--zw-border-radius-2) var(--zw-border-radius-2);
}

/* References and notes */
ol.references li:target, sup.reference:target {
	background-color: var(--mw-bg-highlight);
}

/* Categories */
.catlinks {
	background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
	border-radius: var(--zw-border-radius-2);
}

/* Script error dialogs and such */
.ui-widget-content {
    background: var(--mw-bg-surface);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
body .ui-dialog .ui-widget-header {
    background: var(--mw-bg-surface) !important;
    border: 0;
    border-bottom: 1px solid var(--mw-border) !important;
    border-radius: 0;
    color: var(--mw-text);
    font-weight: bold;
}

/* Editing */
#wpTextbox1 {
	font-size: 14px;
}
div.editOptions, .mw-message-box-warning {
    background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
.mw-message-box-warning p:not(:first-child) {
	color: var(--mw-text-warning);
}
.hidden-link a, .hidden-link a:visited, .hidden-link a.new, .hidden-link a.new:visited { /* Relates to module stack traces - see [[Module:UtilsError]] */
	color: inherit !important;
}
.oo-ui-menuSelectWidget .oo-ui-optionWidget a { /* e.g. "Preview page with this template" dropdown */
	color: #0645ad;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
    color: var(--mw-text-warning);
}
.codeEditor-status-message {
	color: initial;
}
.editHelp .mw-ui-button:not(:disabled) { /* Appears only on mobile for some reason */
    color: var(--mw-link)
}
.editHelp .mw-ui-button:not(:disabled):hover {
    background-color: none;
    color: var(--mw-link-hover);
    text-decoration: underline;
}

/* VisualEditor */
.ve-ui-surface .oo-ui-icon-puzzle {
    filter: var(--mw-text-filter);
}
.ve-ui-surface .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    color: var(--mw-text)
}
.ve-ui-surface .oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
    background-color: var(--mw-bg-link-select-hover);
}
.ve-ui-overlay .oo-ui-popupWidget-popup {
    background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
.ve-ui-overlay .oo-ui-popupWidget-popup .oo-ui-iconElement-icon {
	filter: var(--mw-text-filter);
}
.ve-ui-overlay .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {
	border-bottom-color: var(--mw-border)
}
.ve-ui-overlay .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
    border-bottom-color: var(--mw-bg-surface)
}

/* History */
#pagehistory li.selected {
	background-color: var(--mw-bg-highlight);
	color: var(--mw-text);
}

.updatedmarker {
	background-color: #387500; /* Default color clashes terribly with ZW's Wisdom Blue theme */
}

/* Diffs */
.diff-context {
    background-color: var(--mw-bg-page);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
.diff-addedline {
	background-color: var(--mw-bg-page);
	border-color: var(--mw-text-success);
}
.diff-addedline .diffchange {
	background-color: var(--mw-text-success);
	color: black;
}
.diff-deletedline {
	background-color: var(--mw-bg-page);
	border-color: var(--mw-text-warning);
}
.diff-deletedline .diffchange {
	background-color: var(--mw-text-warning);
	color: black;
}

/* Code */
code, :not(.mw-highlight) > pre {
    background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
.mw-highlight a {
	color: inherit;
}
.mw-highlight.nowrapLines pre {
	white-space: pre;
}

/* Files */
ul#filetoc { /* ul qualification is needed to override styles in Vector and Timeless skins */
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
    padding-left: var(--zw-space-4);
	text-align: left;
}
.mw_metadata td {
    background-color: var(--mw-bg-page);
    border-color: var(--mw-border);
}
.mw_metadata th {
    background-color: var(--mw-bg-header);
    border-color: var(--mw-border);
}
/* For some reason MediaWiki outputs an error about being unable to animate APNG thumbnails despite actually being able to. */
.mw-noanimatethumb {
	display: none;
}

/* Extension:Math */
.mwe-math-fallback-image-inline,
.mwe-math-fallback-image-display {
    filter: var(--mw-text-filter);
}

/* Extension:Popups */
.mwe-popups {
	background-color: var(--mw-bg-surface);
}
.mwe-popups .mwe-popups-container {
    background-color: inherit;
}
.mwe-popups .mwe-popups-extract {
    background-color: inherit;
    color: var(--mw-text);
}
a.mwe-popups-extract:hover {
    color: var(--mw-text);
}
.mwe-popups .mwe-popups-extract[dir='ltr']:after {
    background: none;
}
.mw-ui-icon-reference-generic {
	filter: var(--mw-text-filter);
}
.mw-ui-icon-settings:before {
	filter: var(--mw-text-filter);
}
.mwe-popups .mwe-popups-settings-icon {
    opacity: 1;
}
.mwe-popups .mwe-popups-settings-icon:hover {
    background-color: var(--zw-bg-interactive-hover);
}
.mwe-popups .mwe-popups-thumbnail {
	object-position: top /* So that characters' heads aren't cut off when the preview image is an artwork or model :) */
}
.mwe-popups.mwe-popups-type-reference .mwe-popups-extract .mwe-popups-fade {
	background-image:linear-gradient(rgba(0,0,0,0), var(--zw-bg-header));
}

#mwe-popups-settings {
    background-color: var(--mw-bg-surface);
}
#mwe-popups-settings header {
    border-color: var(--mw-border);
}
#mwe-popups-settings main#mwe-popups-settings-form p {
    color: var(--mw-text);
}
#mwe-popups-settings main#mwe-popups-settings-form form label > span {
    color: var(--mw-text);
}
.mw-ui-icon-popups-close {
    filter: var(--mw-text-filter);
}

/* Main Page */
.page-Main_Page .firstHeading { 
	display: none;
}

/* Talk pages */
.ext-discussiontools-ui-replyWidget .oo-ui-toolbar-bar .oo-ui-iconElement-icon, 
.ext-discussiontools-ui-replyWidget .oo-ui-indicatorElement-indicator {
    filter: var(--zw-text-filter);
}
.ext-discussiontools-ui-replyWidget .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
    background-color: var(--mw-bg-interactive-hover);
}
.ext-discussiontools-ui-replyWidget .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
	background-color: var(--mw-bg-interactive-pressed);
}
.ext-discussiontools-init-replylink-buttons .ext-discussiontools-init-replylink-bracket {
	color: var(--mw-text);
}
.ext-discussiontools-ui-replyWidget-footer {
	color: var(--mw-text);
}
.oo-ui-tabOptionWidget {
	color: var(--mw-text);
}
.ext-discussiontools-ui-targetWidget .ve-ce-surface {
    color: black;
}
.ext-discussiontools-ui-replyWidget-modeTabs .ext-discussiontools-ui-modeTab.oo-ui-widget-disabled {
	color: var(--mw-text-button-frameless);;
	box-shadow: inset 0 -2px 0 0 var(--mw-text-button-frameless);
}
.ext-discussiontools-init-section-subscribe-bracket {
	color: var(--mw-text);
}
.ext-discussiontools-init-publishedcomment, .ext-discussiontools-init-targetcomment {
    background-color: var(--mw-bg-highlight);
    z-index: -1;
}
.ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) {
    background-color: var(--mw-bg-page);
    color: var(--mw-text);
}
.ext-discussiontools-ui-targetWidget .ve-ce-surface {
    color: var(--mw-text);
}
.ve-ui-desktopContext .ve-ui-linkContextItem .ve-ui-linkContextItem-label .ve-ui-linkContextItem-label-preview {
    color: var(--mw-text-subdued);
}
.ve-ce-linkAnnotation.ve-ce-annotation-active {
    background-color: var(--mw-bg-highlight);
    box-shadow: 0 0 0 1px var(--mw-border);
}
.ext-discussiontools-ui-replyWidget-preview {
    background-color: var(--mw-bg-surface);   
}
.ext-discussiontools-ui-replyWidget-preview:before {
    color: var(--mw-text-subdued);
}

/* Data tables, e.g. Special:CargoTables and Special:AllMessages */
.mw-datatable {
	border-color: var(--mw-border);
}
.mw-datatable th {
	background-color: var(--mw-bg-header);
	border-color: var(--mw-border);
}
.mw-datatable td {
	background-color: transparent;
	border-color: var(--mw-border);
	transition: var(--zw-duration-300);
}
.mw-datatable tr:hover td {
	background-color: var(--mw-bg-highlight);
}

/* JSON data pages such as [[Project:AutoWikiBrowser/CheckPageJSON]] */
.mw-json th, .mw-json td {
    color: black;
}

/* [[Community:Glossary]] */
.page-Community_Glossary h2 {
	border-bottom-width: 3px;
	font-weight: bold;
}

/* Special:AllMessages */
#mw-allmessagestable tbody:hover td {
	background-color: var(--mw-bg-highlight);
}
#mw-allmessagestable .am_actual {
    color: black;
}
#mw-allmessagestable .am_default {
    color: black
}

/* Special:CargoQuery */
div.specialCargoQuery-extraPane {
    background: var(--mw-bg-surface);
    border-color: var(--mw-border);
}
.mw-special-CargoQuery .ui-menu .ui-menu-item a {
	color: var(--mw-text);
}
.mw-special-CargoQuery .oo-ui-popupWidget-popup {
    background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
    color: var(--mw-text);
}
.mw-special-CargoQuery .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {
	border-bottom-color: var(--mw-border)
}
.mw-special-CargoQuery .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
    border-bottom-color: var(--mw-bg-surface)
}


/* Special:CreateAccount */
.mw-number-text, .mw-body-content .mw-number-text h3 {
	color: var(--mw-text);
}

/* Special:Drilldown (Extension:Cargo) */
div.drilldown-filters-wrapper {
    background-color: var(--zw-bg-interactive);
    border-color: var(--zw-border);
    color: var(--mw-text);
}
.drilldown-values-toggle {
    filter: var(--mw-text-filter);
}
.drilldown-tabs .tableName {
    background: var(--zw-bg-interactive);
    border: 1px solid var(--zw-border);
}
.drilldown-tabs a, .drilldown-tabs a:active {
	background-color: var(--zw-bg-interactive);
	border-color: var(--zw-border);
    color: var(--mw-link);
}
.drilldown-tabs li.selected a {
    background-color: var(--zw-bg-interactive-active);
    color: var(--mw-link);
    font-weight: bold;
}
#drilldown-tables-tabs-wrapper {
    border-bottom: none;
}

/* Special:ExpandTemplates */
.mw-special-ExpandTemplates .oo-ui-textInputWidget {
	max-width: inherit;
}
.mw-special-ExpandTemplates #output {
	height: 50rem; /* The textarea is too small by default */
}

/* Special:Preferences */
.oo-ui-labelWidget.oo-ui-inline-help {
	color: var(--mw-text-subdued);
}
.oo-ui-tabSelectWidget-framed, .mw-prefs-buttons {
    background-color: var(--mw-bg-surface);
}
.mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed {
    border-color: var(--mw-border);
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(2n) td {
    background-color: var(--mw-bg-header);
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
    background-color: var(--mw-bg-highlight);
}
.oo-ui-icon-info {
    filter: var(--mw-text-filter);
}
.mw-prefs-tabs .oo-ui-popupWidget-popup {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
}
.mw-prefs-tabs .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
	border-bottom-color: var(--mw-bg-surface);
}
.mw-prefs-tabs .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {
	border-bottom-color: var(--mw-border);
}
.mw-prefs-buttons {
    padding-left: var(--zw-space-3);
}
.oo-ui-checkboxMultiselectInputWidget p {
    margin-top: 0
}
.oo-ui-checkboxMultiselectInputWidget .oo-ui-fieldLayout {
    margin-top: var(--zw-space-1)
}
.oo-ui-fieldsetLayout:target > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
	background-color: var(--zw-bg-highlight);
	outline-color: var(--zw-bg-highlight);
}
#mw-prefs-form .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected,
#mw-prefs-form .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {
    background-color: var(--mw-bg-page);
    color: var(--zw-text)
}

/* Special:Notifications */
.mw-echo-ui-notificationsInboxWidget-toolbarWrapper {
    background: none;
    box-shadow: none;
}

/* Special:RecentChanges */
/* See also [[MediaWiki:Gadget-RecentChangesHighlights.css]] */
.client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {
	border-color: var(--mw-border);	
}
.mw-plusminus-neg {
	color: var(--mw-text-warning);
}
.mw-plusminus-pos {
	color: var(--mw-text-success);
}
.mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend { /* .mw-body qualifier is for Timeless */
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
	border-radius: var(--zw-border-radius-2);
	color: var(--mw-text-color);
}
.unpatrolled {
	color: var(--mw-text-warning);
}
.mw-usertoollinks-contribs-no-edits, .mw-usertoollinks-contribs-no-edits:visited {
	color: var(--mw-redlink);
}
.mw-usertoollinks-contribs-no-edits:hover {
	color: var(--mw-redlink-hover);
	text-decoration-style: dashed;
}

/* Special:ReplaceText */
.ext-replacetext-searchoptions {
    background-color: var(--mw-bg-surface);
    border-color: var(--mw-border);
}

.ext-replacetext-searchoptions .ext-replacetext-divider {
    border-color: var(--mw-border);
}

/* Special:Search */
.mw-body .mw-search-profile-tabs {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
}
.search-types .current a {
	color: var(--mw-text);
	font-weight: bold;
}
.results-info {
	color: var(--mw-text);
}
#mw-searchoptions {
	background-color: var(--mw-bg-surface);
	border-color: var(--mw-border);
}

/* Special:Upload */
.mw-destfile-warning {
    background-color: var(--mw-bg-surface-warn);
    border-color: var(--mw-border-warn);
    color: var(--mw-text-surface-warn);
}
/* We hide the license form field because we do licenses another way (via FileInfo) */
.mw-htmlform-field-Licenses, .mw-upload-editlicenses {
	display: none;
}

/* [[Template:List Notes]] */
/* Ideally these styles would be in [[Template:List Notes/Styles.css]] but TemplateStyles doesn't support strings for list-style-type at the time of writing */
.zw-table-notes--symbol li:nth-child(1) {
	list-style-type: '*';
}
.zw-table-notes--symbol li:nth-child(2) {
	list-style-type: '†';
}
.zw-table-notes--symbol li:nth-child(3) {
	list-style-type: '‡';
}