MediaWiki:Common.css

@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,700;1,400;1,700&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap");
:root {
  --body-main: #e2dbc8;
  --body-light: #d8ccb4;
  --body-mid: #d0bd97;
  --body-dark: #b8a282;
  --body-border: #94866d;
  --body-background-color: #c0a886;
  --button-background: #605443;
  --button-color: #fff;
  --button-border: #3c352a;
  --button-dark: #18140c;
  --button-light: #3a301d;
  --sidebar: #cfc08d;
  --sidebar-text-color: #444444;
  --sidebar-link-color: #442b18;
  --background-text-color: #444;
  --background-link-color: #52351e;
  --search-box: #efeee6;
  --link-color: #936039;
  --redlink-color: #ba0000;
  --text-color: #000;
  --base-text-color: #444e5a;
  --base-heading-color: #444e5a;
  --base-heading-border: #e4eaee;
  --mw-code-background-color: #ddd4bb;
  --ul-list-style-image: url("data:image/svg+xml,%3C?xml version='1.0' encoding='UTF-8'?%3E %3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' width='5' height='13'%3E %3Ccircle cx='2.5' cy='9.5' r='2.5' fill='%234c4c4c'/%3E %3C/svg%3E");
  --body-background-image: url("filepath://wiki-background.png");
}

#mw-page-base {
  background: none;
}

.mw-body {
  background-color: var(--body-main);
  color: var(--text-color);
  border-color: transparent;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.15);
  margin-top: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--text-color);
}

h1,
h2 {
  border-color: var(--sidebar);
}

.mw-body h1,
.mw-body-content h1,
.mw-body-content h2,
.mw-body-content h3,
.mw-body-content h4,
.mw-body-content h5,
.mw-body-content h6 {
  font-family: "PT Serif", "Palatino", "Georgia", serif;
}

.mw-parser-output h2:first-of-type {
  clear: left;
}

pre,
code,
.mw-code {
  color: inherit;
  background-color: var(--mw-code-background-color);
  border: 1px solid var(--body-border);
}

ul {
  list-style-image: var(--ul-list-style-image);
}

.mw-content-ltr ol {
  margin-bottom: 0.8em;
}

dl {
  margin: 0;
}

dd {
  min-width: 17.85em;
}

hr {
  background: none;
  border-color: var(--sidebar);
  border-style: solid;
  border-width: 1px 0 0 0;
  height: initial;
}

.mw-footer li {
  color: var(--background-text-color);
}

.mw-footer a,
.mw-footer a:active,
.mw-footer a:visited {
  color: var(--background-link-color);
}

a,
image a {
  color: var(--link-color);
}

a:visited,
image a:visited,
a:active,
image a:active {
  color: var(--link-color);
}

a.new,
image a.new {
  color: var(--redlink-color);
}

a.new:visited,
image a.new:visited {
  color: var(--redlink-color);
}

.mw-body-content a.external,
.mw-body-content a.extiw {
  color: var(--link-color);
}

.mw-body-content a.external:visited,
.mw-body-content a.extiw:visited,
.mw-body-content a.external:active,
.mw-body-content a.extiw:active {
  color: var(--link-color);
}

.jsPurgeLink a.external {
  color: var(--link-color);
}

:root {
  --admin-blue: #332e75;
  --bearcat-green: #13592e;
  --awb-purple: #933b96;
  --rsw-blue: #438ab6;
  --osrsw-brown: #605443;
}

a[href="/User:Alsatian"],
a[href="/User:Felix Argyle"],
a[href="/User:Saedrup92"] {
  color: var(--admin-blue);
}

a[href="/User:Holroybot"] {
  color: var(--awb-purple);
}

a[href="/User:Mackan"] {
  color: var(--bearcat-green);
}

:root {
  --wikitable-header-bg: var(--body-dark);
  --wikitable-border: var(--body-border);
  --wikitable-bg: var(--body-light);
  --wikitable-bg-lighter: #e9e3d6;
  --wikitable-color: var(--text-color);
  --table-na-background: rgba(255, 255, 255, 0.3);
  --table-na-color: grey;
  --table-yes-background: rgba(0, 255, 0, 0.3);
  --table-yes-color: green;
  --table-no-background: rgba(255, 0, 0, 0.3);
  --table-no-color: red;
  --droptable-text-color: #000;
  --droptable-always-background: #afeeee;
  --droptable-common-background: #56e156;
  --droptable-uncommon-background: #ffed4c;
  --droptable-rare-background: #ff863c;
  --droptable-veryrare-background: #ff6262;
  --droptable-random-background: #ffa3ff;
}

.wikitable {
  background: var(--wikitable-bg);
  color: var(--wikitable-color);
  border-color: var(--wikitable-border);
  box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}

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

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

.tabber .wikitable {
  box-shadow: none;
}

.table-bg-always,
.table-bg-blue {
  background: var(--droptable-always-background);
  color: var(--droptable-text-color);
}

.table-bg-common,
.table-bg-green {
  background: var(--droptable-common-background);
  color: var(--droptable-text-color);
}

.table-bg-uncommon,
.table-bg-yellow {
  background: var(--droptable-uncommon-background);
  color: var(--droptable-text-color);
}

.table-bg-rare,
.table-bg-orange {
  background: var(--droptable-rare-background);
  color: var(--droptable-text-color);
}

.table-bg-veryrare,
.table-bg-red {
  background: var(--droptable-veryrare-background);
  color: var(--droptable-text-color);
}

.table-bg-random,
.table-bg-pink {
  background: var(--droptable-random-background);
  color: var(--droptable-text-color);
}

.table-bg-calc-grey {
  opacity: 0.6;
  background: #94866d;
}

.mw_metadata td,
.mw_metadata th {
  border-color: var(--wikitable-border);
}

.mw_metadata th {
  background-color: var(--wikitable-header-bg);
}

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

.mw-datatable {
  border-color: var(--wikitable-border);
}

.mw-datatable td,
.mw-datatable th {
  border-color: var(--wikitable-border);
}

.mw-datatable th {
  background-color: var(--wikitable-header-bg);
}

.mw-datatable td {
  background-color: var(--wikitable-bg);
}

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

table.alternating-rows tr:nth-child(odd),
table.alternating-cols td:nth-child(odd) {
  background: var(--wikitable-alternating-bg);
}

.table-na {
  background: var(--table-na-background);
  color: var(--table-na-color);
  vertical-align: middle;
  text-align: center;
  -webkit-user-select: none;
  cursor: default;
}

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

.table-positive {
  background: var(--table-yes-background);
}

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

.table-negative {
  background: var(--table-no-background);
}

#mw-allmessagestable .am_actual,
#mw-allmessagestable .am_default {
  background-color: var(--wikitable-bg);
}

#mw-allmessagestable .am_default:hover,
#mw-allmessagestable .am_actual:hover,
#mw-allmessagestable tbody:hover td {
  background-color: var(--wikitable-bg-lighter);
}

table.wikitable td.no-cell-spacing {
  padding: 0;
  height: 0;
}

table.wikitable td.no-cell-spacing table {
  margin: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
}

.no-list-style li {
  list-style: none;
}

.no-list-style ul,
.no-list-style ol,
.no-list-style li {
  margin-left: 0;
}

table.align-right-1 td:nth-of-type(1),
table.align-right-2 td:nth-of-type(2),
table.align-right-3 td:nth-of-type(3),
table.align-right-4 td:nth-of-type(4),
table.align-right-5 td:nth-of-type(5),
table.align-right-6 td:nth-of-type(6),
table.align-right-7 td:nth-of-type(7),
table.align-right-8 td:nth-of-type(8),
table.align-right-9 td:nth-of-type(9),
table.align-right-10 td:nth-of-type(10),
table.align-right-11 td:nth-of-type(11),
table.align-right-12 td:nth-of-type(12),
table.align-right-13 td:nth-of-type(13),
table.align-right-14 td:nth-of-type(14),
table.align-right-15 td:nth-of-type(15),
table.align-right-16 td:nth-of-type(16),
table.align-right-17 td:nth-of-type(17),
table.align-right-18 td:nth-of-type(18),
table.align-right-19 td:nth-of-type(19),
table.align-right-20 td:nth-of-type(20) {
  text-align: right;
}

table.align-center-1 td:nth-of-type(1),
table.align-center-2 td:nth-of-type(2),
table.align-center-3 td:nth-of-type(3),
table.align-center-4 td:nth-of-type(4),
table.align-center-5 td:nth-of-type(5),
table.align-center-6 td:nth-of-type(6),
table.align-center-7 td:nth-of-type(7),
table.align-center-8 td:nth-of-type(8),
table.align-center-9 td:nth-of-type(9),
table.align-center-10 td:nth-of-type(10),
table.align-center-11 td:nth-of-type(11),
table.align-center-12 td:nth-of-type(12),
table.align-center-13 td:nth-of-type(13),
table.align-center-14 td:nth-of-type(14),
table.align-center-15 td:nth-of-type(15),
table.align-center-16 td:nth-of-type(16),
table.align-center-17 td:nth-of-type(17),
table.align-center-18 td:nth-of-type(18),
table.align-center-19 td:nth-of-type(19),
table.align-center-20 td:nth-of-type(20) {
  text-align: center;
}

table.align-left-1 td:nth-of-type(1),
table.align-left-2 td:nth-of-type(2),
table.align-left-3 td:nth-of-type(3),
table.align-left-4 td:nth-of-type(4),
table.align-left-5 td:nth-of-type(5),
table.align-left-6 td:nth-of-type(6),
table.align-left-7 td:nth-of-type(7),
table.align-left-8 td:nth-of-type(8),
table.align-left-9 td:nth-of-type(9),
table.align-left-10 td:nth-of-type(10),
table.align-left-11 td:nth-of-type(11),
table.align-left-12 td:nth-of-type(12),
table.align-left-13 td:nth-of-type(13),
table.align-left-14 td:nth-of-type(14),
table.align-left-15 td:nth-of-type(15),
table.align-left-16 td:nth-of-type(16),
table.align-left-17 td:nth-of-type(17),
table.align-left-18 td:nth-of-type(18),
table.align-left-19 td:nth-of-type(19),
table.align-left-20 td:nth-of-type(20) {
  text-align: left;
}

:root {
  --ooui-text: var(--text-color);
  --ooui-interface: var(--body-light);
  --ooui-interface-border: var(--body-border);
  --ooui-window-background: rgba(255, 255, 255, 0.5);
  --oo-ui-pending-background-image: repeating-linear-gradient(-45deg, var(--search-box), var(--search-box) 20px, var(--body-main) 20px, var(--body-main) 30px);
}

@keyframes stripe {
  100% {
    background-position: 100%;
  }
}
.oo-ui-widget {
  color: var(--ooui-text);
}

.oo-ui-panelLayout-framed {
  border-color: var(--sidebar);
}

.oo-ui-window-content {
  background-color: var(--ooui-interface);
  color: var(--ooui-text);
}

.oo-ui-window-content .oo-ui-window-body,
.oo-ui-window-content .oo-ui-window-head {
  outline-color: var(--ooui-interface-border);
}

.oo-ui-window-content .oo-ui-actionWidget,
.oo-ui-window-content .oo-ui-window-foot {
  border-color: var(--ooui-interface-border);
  outline-color: var(--ooui-interface-border);
}

.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
  border-color: var(--ooui-interface-border);
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
  color: var(--ooui-text);
}

.oo-ui-popupWidget-popup {
  background-color: var(--ooui-interface);
  border-color: var(--ooui-interface-border);
}

.oo-ui-icon-advanced {
  background-image: linear-gradient(transparent, transparent), url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eadvanced%3C/title%3E%3Cpath d=%22M10 2.5a7.5 7.5 0 1 0 7.5 7.5A7.5 7.5 0 0 0 10 2.5zm0 11a3.5 3.5 0 1 1 3.5-3.5 3.5 3.5 0 0 1-3.5 3.5z%22/%3E%3Cpath d=%22M12 3.29L11.5 0h-3L8 3.29a7 7 0 0 1 4 0zM8 16.71L8.5 20h3l.5-3.29a7 7 0 0 1-4 0zm8.16-10.04l2-2.68L16 1.87l-2.68 2a7 7 0 0 1 2.83 2.83zM3.84 13.33L1.87 16 4 18.13l2.68-2a7 7 0 0 1-2.83-2.83zM16.71 12l3.29-.5v-3L16.71 8a7 7 0 0 1 0 4zM3.29 8L0 8.5v3l3.29.5a7 7 0 0 1 0-4zm10.04 8.16l2.68 2L18.13 16l-2-2.68a7 7 0 0 1-2.83 2.83zM6.67 3.84L4 1.87 1.87 4l2 2.68a7 7 0 0 1 2.8-2.84z%22/%3E%3C/svg%3E");
}

.oo-ui-icon-clear {
  background-image: linear-gradient(transparent, transparent), url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclear%3C/title%3E%3Cpath d=%22M10 0a10 10 0 1 0 10 10A10 10 0 0 0 10 0zm5.66 14.24l-1.41 1.41L10 11.41l-4.24 4.25-1.42-1.42L8.59 10 4.34 5.76l1.42-1.42L10 8.59l4.24-4.24 1.41 1.41L11.41 10z%22/%3E%3C/svg%3E");
}

.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:after {
  border-right-color: var(--ooui-interface);
}

.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:before {
  border-right-color: var(--ooui-interface-border);
}

.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:after {
  border-left-color: var(--ooui-interface);
}

.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:before {
  border-left-color: var(--ooui-interface-border);
}

.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
  border-bottom-color: var(--ooui-interface);
}

.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {
  border-bottom-color: var(--ooui-interface-border);
}

.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:after {
  border-top-color: var(--ooui-interface);
}

.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:before {
  border-top-color: var(--ooui-interface-border);
}

.oo-ui-pendingElement-pending {
  background-image: var(--oo-ui-pending-background-image);
  background-size: 200%;
  animation: stripe 6s linear infinite;
}

.oo-ui-windowManager-modal > .oo-ui-dialog {
  background-color: var(--ooui-window-background);
}