User:Cake/vector.css

From Path of Exile 2 Wiki
Revision as of 18:29, 1 December 2024 by Cake (talk | contribs) (format and text color change)
Jump to navigation Jump to search

Note: After saving, you have to bypass your browser's cache to see the changes. The simplest method that will work for most users is to hold down the ⇧ Shift key and click the Reload toolbar button. For details and other methods, see Help:Clear your browser cache.

/*
 * This stylesheet modifies the Vector theme.
 *
 * Common styles should go in [[MediaWiki:Common.css]].
 */

/* ===== Fonts ===== */
@font-face {
	font-family: Fontin;
	src:
		local("Fontin Regular"),
		url("/w/media/Fontin-Regular.ttf") format("truetype");
}

@font-face {
	font-family: Fontin;
	src:
		local("Fontin Bold"),
		url("/w/media/Fontin-Bold.ttf") format("truetype");
	font-weight: bold;
}

@font-face {
	font-family: Fontin;
	src:
		local("Fontin Italic"),
		url("/w/media/Fontin-Italic.ttf") format("truetype");
	font-style: italic;
}

@font-face {
	font-family: FontinSmallCaps;
	src:
		local("Fontin SmallCaps"),
		url("/w/media/Fontin-SmallCaps.ttf") format("truetype");
}

/* ===== Variables ===== */
:root {
	color-scheme: dark;

	--default-font: verdana, arial, helvetica, sans-serif;
	--stylized-font: fontin, verdana, arial, helvetica, sans-serif;
	--stylized-smallcaps-font: fontinsmallcaps, verdana, arial, helvetica,
		sans-serif;
	--monospace-font: "Cascadia Code", "Source Code Pro", menlo, consolas,
		"DejaVu Sans Mono", "Liberation Mono", monospace;
	--content-background-color: #544c45;

	/* Equivalent to oklab(70% 0.01 0.05 / 100%) */
	--text-color: #b09b7b;
	--bright-text-color: #dfcf99;
	--subdued-text-color: #5e4f45;

	/* black -> #dfcf99 */
	--bright-text-filter: invert(94%) sepia(12%) saturate(1025%)
		hue-rotate(346deg) brightness(93%) contrast(88%);

	/* Links */
	--link-color: #e4dc75;
	--link-active-color: #f2dcae;
	--red-link-color: #f25749;
	--red-link-active-color: #f2b4ae;

	/* Tables */
	--table-border-color: #1a1812;
	--table-text-color: var(--text-color);
	--table-background-color: #26231b;
	--table-background-color-alt: #211f18;
	--table-header-text-color: var(--text-color);
	--table-header-background-color: #332f24;
	--horizontal-rule-color: #5e4f45;

	/* Image boxes */
	--image-box-border-color: #68604a;
	--image-box-background-color: #201f19;
	--image-box-inner-border-color: #454034;
	--image-box-inner-background-color: #13120f;

	/* Outside of main content area */
	--outer-text-color: #c6bbb3;
	--outer-link-color: #e8e6e3;
	--outer-link-text-shadow: 0 0 0.5rem rgb(0 0 0 / 100%),
		-1px -1px 0 rgb(0 0 0 / 25%), 1px -1px 0 rgb(0 0 0 / 25%),
		-1px 1px 0 rgb(0 0 0 / 25%), 1px 1px 0 rgb(0 0 0 / 25%);
}

/* ===== Body ===== */
@media screen {
	body {
		font-family: var(--default-font);
		background: #000 url("/w/images/9/98/Bg.jpg") no-repeat fixed left top;
		background-size: contain;
	}
}

/* ===== Links ===== */
@media screen {
	a,
	a:visited,
	.mw-parser-output a.extiw,
	.mw-parser-output a.extiw:visited,
	.mw-parser-output a.external,
	.mw-parser-output a.external:visited {
		color: var(--link-color);
	}

	a:active,
	.mw-parser-output a.extiw:active,
	.mw-parser-output a.external:active {
		color: var(--link-active-color);
	}

	a.new,
	a.new:visited {
		color: var(--red-link-color);
	}

	a.new:active {
		color: var(--red-link-active-color);
	}
}

/* ===== Section headings ===== */
@media screen {
	.mw-body h1,
	.mw-body h2,
	.mw-body h3,
	.mw-body h4,
	.mw-body h5,
	.mw-body h6 {
		font-family: var(--stylized-font);
		color: var(--bright-text-color);
	}

	.mw-body h1,
	.mw-body h2 {
		border-bottom-color: var(--horizontal-rule-color);
	}

	/* Edit section and similarly styled links */
	.mw-editsection,
	.mw-editsection-like {
		font-family: var(--default-font);
		font-size: 12px;
		color: var(--subdued-text-color);
	}
}

/* ===== Content elements ===== */
@media screen {
	ul {
		list-style-type: disc;
		list-style-image: unset;
	}

	.mw-body hr {
		color: var(--horizontal-rule-color);
		background-color: var(--horizontal-rule-color);
	}
}

/* ===== Header ===== */
#mw-page-base {
	height: 0;
	background: transparent;
}

#mw-head-base,
#mw-head {
	margin: 0;
	height: 80px;
}

#left-navigation {
	margin-top: 53px;
	margin-bottom: -50px;
	padding-left: 12px;
}

#right-navigation {
	margin-top: 53px;
	margin-right: 16px;
}

/* ===== Menu tabs ===== */
div#mw-head .vector-menu-tabs,
div#mw-head .vector-menu-dropdown {
	background: transparent;
	padding: 0;
	height: 26px;
}

div#mw-head .vector-menu-tabs a,
div#mw-head .vector-menu-dropdown a,
div#mw-head .vector-menu-dropdown .vector-menu-heading {
	color: var(--link-color);
}

div#mw-head .vector-menu-tabs a:active,
div#mw-head .vector-menu-dropdown a:active {
	color: var(--link-active-color);
}

div#mw-head .vector-menu-tabs .new a,
div#mw-head .vector-menu-tabs .new a:visited {
	color: var(--red-link-color);
}

div#mw-head .vector-menu-tabs .new a:active {
	color: var(--red-link-active-color);
}

div#mw-head .vector-menu-tabs li,
div#mw-head .vector-menu-dropdown .vector-menu-heading {
	background-color: transparent;
	background-image: url("/w/images/c/c1/Vector_tab_left.png"),
		url("/w/images/0/07/Vector_tab_right.png");
	background-position:
		left top,
		right top;
	background-repeat: no-repeat;
	background-size: auto;
}

div#mw-head .vector-menu-dropdown .vector-menu-heading {
	margin: 0;
	padding: 0;
	height: 100%;
}

div#mw-head .vector-menu-dropdown .vector-menu-heading::after {
	content: none;
	display: none;
}

div#mw-head .vector-menu-tabs li.selected,
div#mw-head .vector-menu-dropdown:hover .vector-menu-heading,
div#mw-head
	.vector-menu-dropdown
	.vector-menu-checkbox:checked
	+ .vector-menu-heading {
	background-position:
		left bottom,
		right bottom;
}

div#mw-head .vector-menu-tabs li.selected a,
div#mw-head .vector-menu-dropdown:hover .vector-menu-heading span,
div#mw-head
	.vector-menu-dropdown
	.vector-menu-checkbox:checked
	+ .vector-menu-heading
	span {
	background-position: center bottom;
}

div#mw-head .vector-menu-tabs li a,
div#mw-head .vector-menu-dropdown .vector-menu-heading span {
	display: inline-block;
	float: none;
	padding: 0 18px;
	height: 100%;
	font-family: var(--stylized-smallcaps-font);
	font-size: 16px;
	line-height: 26px;
	font-variant-ligatures: none;
	background-color: transparent;
	text-decoration: none;
	background-image: url("/w/images/a/ad/Vector_tab_center.png");
	background-position: center top;
	background-repeat: repeat-x;
	background-clip: content-box;
	background-size: auto;
}

div#mw-head .vector-menu-dropdown .vector-menu-heading span::after {
	content: "";
	display: inline-block;
	margin-right: -6px;
	width: 1em;
	height: 1em;
	vertical-align: middle;
	background-image: url("data:image/svg+xml;utf-8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 320 512'><path d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z' fill='%23f2c462'/></svg>");
	transition: transform 0.15s ease-in;
}

div#mw-head
	.vector-menu-dropdown
	.vector-menu-checkbox:checked
	+ .vector-menu-heading
	span::after {
	transform: rotate(-0.5turn);
}

div#mw-head .vector-menu-dropdown .vector-menu-content {
	right: 0;
	top: 26px;
	border: 1px solid #875b3a;
	border-top-color: #734e32;
	border-radius: 0 0 6px 6px;
	width: fit-content;
	background: linear-gradient(to bottom, #7c5436 0%, #47301e 100%);
	box-shadow: -2px 5px 5px rgb(0 0 0 / 50%);
}

div#mw-head .vector-menu-tabs #ca-unwatch.icon a,
div#mw-head .vector-menu-tabs #ca-watch.icon a {
	width: 42px;
	text-indent: -9999em;
	vertical-align: middle;
}

div#mw-head .vector-menu-tabs #ca-unwatch.icon a::before,
div#mw-head .vector-menu-tabs #ca-watch.icon a::before {
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
}

div#mw-head .vector-menu-tabs #ca-unwatch.icon a::before {
	background-image: url("data:image/svg+xml;utf-8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 576 512'><path d='M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z' fill='%23f2c462'/></svg>");
}

div#mw-head .vector-menu-tabs #ca-watch.icon a::before {
	background-image: url("data:image/svg+xml;utf-8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 576 512'><path d='M528.1 171.5L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6zM388.6 312.3l23.7 138.4L288 385.4l-124.3 65.3 23.7-138.4-100.6-98 139-20.2 62.2-126 62.2 126 139 20.2-100.6 98z' fill='%23f2c462'/></svg>");
}

/* ===== User menu ===== */
@media screen {
	.vector-user-menu-legacy a,
	.vector-user-menu-legacy a:visited {
		color: var(--outer-link-color);
		text-shadow: var(--outer-link-text-shadow);
	}

	.vector-user-menu-legacy #pt-anonuserpage,
	.vector-user-menu-legacy #pt-userpage a {
		background-position: left bottom;
	}
}

/* ===== User menu ===== */
@media screen {
	.vector-user-menu-legacy a,
	.vector-user-menu-legacy a:visited {
		color: var(--outer-link-color);
		text-shadow: var(--outer-link-text-shadow);
	}

	.vector-user-menu-legacy #pt-anonuserpage,
	.vector-user-menu-legacy #pt-userpage a {
		background-position: left bottom;
	}
}

/* ===== Sidebar menu ===== */
@media screen {
	.vector-legacy-sidebar .vector-menu-portal {
		background-color: rgb(0 0 0 / 30%);
	}

	.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading {
		color: var(--outer-text-color);
	}

	.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a,
	.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited {
		color: var(--outer-link-color);
		text-shadow: var(--outer-link-text-shadow);
	}
}

/* ===== Site notice ===== */
@media screen {
	.mw-dismissable-notice {
		margin-bottom: 1em;
		border: 1px solid #80756a;
		border-width: 2px 0;
		border-image-source: linear-gradient(
			to right,
			rgb(136 125 98 / 0%) 10%,
			rgb(136 125 98 / 100%) 20% 80%,
			rgb(136 125 98 / 0%) 90%
		);
		border-image-slice: 1;
		padding: 0.8em 1em;
		color: #b2a78e;
		background: transparent
			linear-gradient(
				to right,
				transparent 10%,
				rgb(0 0 0 / 15%) 20% 80%,
				transparent 90%
			);
	}

	.sitedir-ltr .mw-dismissable-notice-body,
	.sitedir-rtl .mw-dismissable-notice-body {
		margin: 0.5em 6em 0.5em 0;
	}

	.mw-dismissable-notice-close {
		margin: 0.5em 0;
	}

	.mw-dismissable-notice #localNotice {
		margin: 0;
	}
}

@media screen and (width >= 45em) {
	.sitedir-ltr .mw-dismissable-notice-body,
	.sitedir-rtl .mw-dismissable-notice-body {
		margin-left: 20%;
		margin-right: 20%;
	}
}

/* ===== Content area ===== */
@media screen {
	.mw-body {
		border: 2px solid #4c3c2c;
		border-image-source: radial-gradient(
			at top center,
			#736445,
			#3d3326,
			#402f27,
			#3f372a,
			#0c0b09
		);
		border-image-slice: 1;
		color: var(--text-color);
		background: var(--content-background-color)
			radial-gradient(
				circle at top center,
				#282117 0,
				#17140e 14em,
				#0f0d09 100%
			);
		box-shadow: 0 1.5rem 3rem rgb(0 0 0 / 50%);
	}
}

/* ===== Footer ===== */
@media screen {
	.mw-footer li {
		color: var(--outer-text-color);
	}

	.mw-footer a {
		color: var(--outer-link-color);
		text-shadow: var(--outer-link-text-shadow);
	}
}

/* ===== Revision history ===== */
#pagehistory li {
	border: 1px solid transparent;
	padding: 0;
}

#pagehistory li.selected {
	outline: none;
	border: 1px dashed #16678a;
	color: inherit;
	background-color: #191b1c;
}

/* ===== Table of contents ===== */
@media screen {
	.toc,
	.toccolours {
		background: #141414;
		border-color: #a38d6d;
	}

	.toctogglelabel {
		color: var(--link-color);
	}

	.tocnumber {
		color: #72777d;
	}
}

/* ===== Thumbnail/framed images ===== */
@media screen {
	figure[typeof~="mw:File/Thumb"],
	figure[typeof~="mw:File/Frame"],
	figure[typeof~="mw:File/Thumb"] > figcaption,
	figure[typeof~="mw:File/Frame"] > figcaption {
		border-color: var(--image-box-border-color);
		background-color: var(--image-box-background-color);
	}

	figure[typeof~="mw:File/Thumb"]
		> a:first-child
		> :first-child:not(.mw-broken-media),
	figure[typeof~="mw:File/Frame"]
		> a:first-child
		> :first-child:not(.mw-broken-media),
	figure[typeof~="mw:File/Thumb"]
		> span:first-child
		> :first-child:not(.mw-broken-media),
	figure[typeof~="mw:File/Frame"]
		> span:first-child
		> :first-child:not(.mw-broken-media) {
		border-color: var(--image-box-inner-border-color);
		background-color: var(--image-box-inner-background-color);
	}

	.mw-content-ltr
		figure[typeof~="mw:File/Thumb"]:not([typeof~="mw:Error"])
		> a.mw-file-description::after {
		filter: invert(1);
	}
}

/* ===== Gallery images ===== */
@media screen {
	li.gallerybox div.thumb {
		border-color: var(--image-box-border-color);
		background-color: var(--image-box-background-color);
	}
}

#catlinks {
	border: 1px solid #503a1e;
	background-color: #130f0a;
}

.catlinks li {
	border-left: 1px solid #a38d6d;
}

/* ===== Standard tables ===== */
@media screen {
	.wikitable {
		color: var(--table-text-color);
		background-color: var(--table-background-color);
	}

	.wikitable > tr > th,
	.wikitable > * > tr > th {
		color: var(--bright-text-color);
		background-color: var(--table-header-background-color);
	}

	.wikitable > tr:nth-child(even) > td,
	.wikitable > * > tr:nth-child(even) > td {
		background-color: var(--table-background-color-alt);
	}

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

/* ===== Table sorting arrows ===== */
.client-js
	.sortable:not(.jquery-tablesorter)
	> *
	> tr:first-child
	> th:not(.unsortable),
.jquery-tablesorter th.headerSort {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='21' height='9'%3e%3cpath d='m14.5 5-4 4-4-4zm0-1-4-4-4 4z' fill='%23dfcf99'/%3e%3c/svg%3e");
}

.jquery-tablesorter th.headerSortUp {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='21' height='4'%3e%3cpath d='m6.5 4 4-4 4 4z' fill='%23dfcf99'/%3e%3c/svg%3e");
}

.jquery-tablesorter th.headerSortDown {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='21' height='4'%3e%3cpath d='m14.5 0-4 4-4-4z' fill='%23dfcf99'/%3e%3c/svg%3e");
}

/* ===== File metadata table ===== */
@media screen {
	.mw_metadata {
		color: var(--table-text-color);
	}

	.mw_metadata th,
	.mw_metadata td {
		border: 1px solid var(--table-border-color);
	}

	.mw_metadata th {
		color: var(--bright-text-color);
		background-color: var(--table-header-background-color);
	}

	.mw_metadata td {
		background-color: var(--table-background-color);
	}
}

/* ===== Revision comparison ===== */
.diff-lineno,
.diff td.diff-marker {
	color: var(--bright-text-color);
}

.mw-diff-movedpara-left::after,
.mw-diff-movedpara-right::after {
	color: var(--bright-text-color);
}

.diff td {
	padding: 0.15em 0.3em;
}

.diff-addedline,
.diff-deletedline,
.diff-context {
	border-radius: 0.3em;
}

.diff-editfont-monospace .diff-addedline,
.diff-editfont-monospace .diff-deletedline,
.diff-editfont-monospace .diff-context {
	font-family: var(--monospace-font);
}

.diff-context {
	border-color: #2c2b2b;
	color: var(--subdued-text-color);
	background: #141414;
}

.diff-deletedline {
	border-color: #894a17;
	background: #191b1c;
}

.diff-deletedline .diffchange {
	color: var(--bright-text-color);
	background: #4d3420;
}

.diff-addedline {
	border-color: #16678a;
	background: #191b1c;
}

.diff-addedline .diffchange {
	color: var(--bright-text-color);
	background: #203f4c;
}

/* ===== Code-like elements, syntax highlighting, Ace editor ===== */
@media screen {
	pre,
	code,
	tt,
	kbd,
	samp,
	.mw-code,
	.mw-editfont-monospace,
	.wikiEditor-ui .ace_editor {
		font-family: var(--monospace-font);
	}

	pre,
	code,
	.mw-code,
	.ace-tm,
	.mw-highlight {
		color: #cecbc6;
		background-color: #242321;
	}

	pre,
	code,
	.mw-code {
		border: 1px solid #49483e;
	}

	.ace-tm .ace_gutter {
		background: #2e2d2a;
	}

	.mw-content-ltr.mw-highlight-lines pre,
	.mw-content-ltr.content .mw-highlight-lines pre {
		box-shadow: inset 2.75em 0 0 #2e2d2a;
	}

	.ace-tm .ace_gutter-cell,
	.mw-highlight .linenos {
		color: #8f908a;
	}

	.ace-tm .ace_print-margin {
		width: 1px;
		background: #555651;
	}

	.ace-tm .ace_cursor {
		color: #f8f8f0;
	}

	.ace-tm .ace_marker-layer .ace_selection {
		background: #49483e;
	}

	.ace-tm.ace_multiselect .ace_selection.ace_start {
		box-shadow: 0 0 3px 0 #272822;
	}

	.ace-tm .ace_marker-layer .ace_step {
		background: rgb(102 82 0);
	}

	.ace-tm .ace_marker-layer .ace_bracket {
		border: 1px solid #49483e;
		margin: -1px 0 0 -1px;
	}

	.ace-tm .ace_marker-layer .ace_active-line,
	.mw-highlight .hll {
		background: #1e1d1c;
	}

	.ace-tm .ace_gutter-active-line,
	.mw-highlight .hll a .linenos {
		background-color: #282725;
	}

	.ace-tm .ace_gutter-active-line,
	.mw-highlight .hll a .linenos,
	.mw-highlight a:hover .linenos {
		color: #fff;
	}

	.ace-tm .ace_marker-layer .ace_selected-word {
		border: 1px solid #49483e;
	}

	.ace-tm .ace_invisible {
		color: #52524d;
	}

	.ace-tm .ace_constant,
	.ace-tm .ace_entity.ace_name.ace_tag,
	.ace-tm .ace_keyword,
	.ace-tm .ace_meta.ace_tag,
	.ace-tm .ace_storage,
	.mw-highlight .k,
	.mw-highlight .kr,
	.mw-highlight .ow,
	.mw-highlight .nt {
		color: #f92672;
	}

	.ace-tm .ace_keyword.ace_operator,
	.mw-highlight .o {
		color: #828282;
	}

	.ace-tm .ace_punctuation,
	.ace-tm .ace_punctuation.ace_tag,
	.mw-highlight .p,
	.mw-highlight .nc,
	.mw-highlight .nf,
	.mw-highlight .nv,
	.mw-highlight .nd {
		color: inherit;
	}

	.ace-tm .ace_constant.ace_character,
	.ace-tm .ace_constant.ace_language,
	.ace-tm .ace_constant.ace_numeric,
	.ace-tm .ace_constant.ace_other,
	.mw-highlight .mi,
	.mw-highlight .mf,
	.mw-highlight .mh,
	.mw-highlight .kc {
		color: #ae81ff;
	}

	.ace-tm .ace_invalid {
		color: #f8f8f0;
		background-color: #f92672;
	}

	.ace-tm .ace_invalid.ace_deprecated {
		color: #f8f8f0;
		background-color: #ae81ff;
	}

	.ace-tm .ace_support.ace_constant,
	.ace-tm .ace_support.ace_function,
	.mw-highlight .bp {
		color: #66d9ef;
	}

	.ace-tm .ace_fold {
		border-color: #f8f8f2;
		background-color: #a6e22e;
	}

	.ace-tm .ace_storage.ace_type,
	.ace-tm .ace_support.ace_class,
	.ace-tm .ace_support.ace_type,
	.mw-highlight .kd,
	.mw-highlight .kp,
	.mw-highlight .kt {
		font-style: italic;
		color: #66d9ef;
	}

	.ace-tm .ace_entity.ace_name.ace_function,
	.ace-tm .ace_entity.ace_other,
	.ace-tm .ace_entity.ace_other.ace_attribute-name,
	.ace-tm .ace_variable,
	.ace-tm .ace_comment.ace_doc.ace_tag,
	.ace-tm .ace_constant.ace_library,
	.mw-highlight .nb,
	.mw-highlight .nn {
		color: #a6e22e;
	}

	.ace-tm .ace_variable.ace_parameter,
	.mw-highlight .cp {
		font-style: italic;
		color: #fd971f;
	}

	.ace-tm .ace_string,
	.mw-highlight .s,
	.mw-highlight .s1,
	.mw-highlight .s2,
	.mw-highlight .se,
	.mw-highlight .sx {
		color: #e6db74;
	}

	.ace-tm .ace_comment,
	.ace-tm .ace_comment.ace_doc,
	.mw-highlight .c,
	.mw-highlight .c1,
	.mw-highlight .cm {
		color: #75715e;
	}

	.ace-tm .ace_indent-guide {
		filter: brightness(0.5);
	}
}

/* ===== Cargo ===== */
@media screen {
	.cargo-pagevalues-tableinfo {
		border: none;
		background-color: var(--content-background-color);
	}

	.mw-datatable,
	.mw-datatable th,
	.mw-datatable td {
		border: 1px solid var(--table-border-color);
	}

	.mw-datatable th {
		color: var(--bright-text-color);
		background-color: var(--table-header-background-color);
	}

	.mw-datatable td,
	.mw-datatable tr:hover td {
		background-color: var(--table-background-color);
	}

	.mw-datatable > tr:nth-child(even) > td,
	.mw-datatable > * > tr:nth-child(even) > td {
		background-color: var(--table-background-color-alt);
	}

	.mw-datatable th .oo-ui-iconElement-icon {
		filter: var(--bright-text-filter);
	}

	table.cargoTable th,
	table.cargoTable td {
		border: 1px solid var(--table-border-color);
	}

	table.cargoTable th {
		color: var(--bright-text-color);
		background-color: var(--table-header-background-color);
	}

	table.cargoTable.noMerge tr:nth-child(even),
	table.cargoTable.mergeSimilarCells td.even {
		background-color: var(--table-background-color);
	}

	table.cargoTable.noMerge tr:nth-child(odd),
	table.cargoTable.mergeSimilarCells td.odd {
		background: var(--table-background-color-alt);
	}
}

/* ===== Category tree ===== */
.CategoryTreeEmptyBullet {
	color: var(--subdued-text-color);
}

.CategoryTreeToggle {
	color: var(--link-color);
}