MediaWiki:Gadget-StepClassic.css

From Step Mods | Change The Game

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
:root {
    --bg-body: #222324;
    --bg-pri: #373f49;
    --bg-sec: #3f4a54;
    --bg-pri-emph: #2e343d;
    --bg-sec-emph: #2f3742;
    --bg-cont: #161619;
    --bg-pri-hd: #262629;
    --bg-sec-hd: #2d2d2e;

    --bg-field-hov: #00000040;
    --bg-menu-hov: #ff90121a;
    --bg-diff-add: #263640;
    --bg-diff-del: #403826;
    --bg-diffch-add: #101840;
    --bg-diffch-del: #301810;
    --bg-msup: #aaa;
    
    --bd-cont-l: var(--bg-pri-hd);
    --bd-cont-lr: #50d080;
    --bd-mid: #464649;
    --bd-widg: #555;
    --bd-dims: #666;
    --bd-dimr2: #777;
    --bd-dimr1: #888;
    --bd-dim: #a0a0a0;
    --bd-adj-dn: #0000000a;
    --bd-dpdn-shd: #ff901226;
    --bd-emph-shd: #ff901240;
    --bd-foc-shd: #ff901299;
    --bd-pri-emph-emph: #ff9012d0;
    --bd-pri-emph: #ff9012;
    --bd-pri-emph-shd: #6a5d50;
    --bd-code-shd: var(--bg-cont);

    --text-pri: #b0b0b0;
    --text-sec: #c0c0c0;
    --text-pri-emph: #eee;
    --text-editor-sel: #68c8784f;
    --text-editor: #68c878;
    --text-contr-l: #fff;
    --text-contr-d: #000;
    --text-diffch-add: var(--bd-cont-lr);
    --text-diffch-del: #80d050;
    
    --text-lnk: #80aacf;
    --text-lnk-hov: #a0caf4;
    --text-lnk-vis: #607a9f;
    --text-lnk-vis-hov: #809ac4;
    --text-lnk-new: #ff5560;
    --text-lnk-new-hov: #f08088;
    --text-lnk-bt: #a0caef;
    --text-lnk-hov-bt: #bae7ff;
    --text-lnk-vis-bt: #809abf; 
    --text-lnk-vis-hov-bt: #a0bae4; 
    
    --btn: #38688f;
    --btn-hov: #ff901200;
    --btn-warn: #cb4848d0;
    --btn-warn-hov: #e04343;
    --btn-text: var(--text-pri-emph);
    --btn-text-hov: #fff;
    
    --clr-mute-red: #ff707750;
    --clr-mute-magent: #d96dc950;
    --clr-mute-purple: #aa88e850;
    --clr-mute-blue: #64a5e350;
    --clr-mute-green: #4bb07350;
    --clr-mute-chartr: #9ead4850;
    --clr-mute-yellow: #e0b43850;
    --clr-mute-salmon: #daaa9950;
    --clr-mute-orange: #ff904750;
    
    --clr-mid-red: #ff707788;
    --clr-mid-magent: #d96dc988;
    --clr-mid-purple: #aa88e888;
    --clr-mid-blue: #64a5e388;
    --clr-mid-green: #4bb07388;
    --clr-mid-chartr: #9ead4888;
    --clr-mid-yellow: #e0b43888;
    --clr-mid-salmon: #daaa9988;
    --clr-mid-orange: #ff904788;
    
    --clr-high-red: #ff7077d0;
    --clr-high-magent: #d96dc9d0;
    --clr-high-purple: #aa88e8d0;
    --clr-high-blue: #64a5e3d0;
    --clr-high-green: #4bb073d0;
    --clr-high-chartr: #9ead48d0;
    --clr-high-yellow: #e0b438d0;
    --clr-high-salmon: #daaa99d0;
    --clr-high-orange: #ff9047d0;
    
    --clr-red: #ff7077;
    --clr-magent: #d96dc9;
    --clr-purple: #aa88e8;
    --clr-blue: #64a5e3;
    --clr-green: #4bb073;
    --clr-chartr: #9ead48;
    --clr-yellow: #e0b438;
    --clr-salmon: #daaa99;
    --clr-orange: #ff9047
}

@media screen and (max-width:767.98px) {
    #p-logo img {
        background-image: url(/_wiki/skins/step/images/delta_classic_sm.png) !important;
    }
}

@media screen and (min-width:768px) {
    #p-logo img {
        background-image: url(/_wiki/skins/step/images/header_classic_logo_sm.png) !important;
    }
}

@media screen and (min-width:994px) {
    #p-logo img {
        background-image: url(/_wiki/skins/step/images/header_classic_logo.png) !important;
    }
}

/***** Theme-specific CSS *****/

/* Color classes */

.hltx {
    color: var(--text-pri-emph) !important
}

.dimtx {
    color: var(--bd-dimr1) !important
}

.dimbg {
    background-color: var(--bd-dim) !important
}

.dimbd {
    border-color: var(--bd-dim) !important
}

.whitetx {
    color: var(--text-contr-l) !important
}

.whitebg {
    background-color: var(--text-contr-l) !important
}

.whitebd {
    border-color: var(--text-contr-l) !important
}

.blacktx {
    color: var(--text-contr-d) !important
}

.blackbg {
    background-color: var(--text-contr-d) !important
}

.blackbd {
    border-color: var(--text-contr-d) !important
}

.magenttx {
    color: var(--clr-magent) !important
}

.mutemagenttx {
    color: var(--clr-mute-magent) !important
}

.midmagenttx {
    color: var(--clr-mid-magent) !important
}

.highmagenttx {
    color: var(--clr-high-magent) !important
}

.magentbg {
    background-color: var(--clr-magent) !important
}

.mutemagentbg {
    background-color: var(--clr-mute-magent) !important
}

.midmagentbg {
    background-color: var(--clr-mid-magent) !important
}

.highmagentbg {
    background-color: var(--clr-high-magent) !important
}

.magentbd {
    border-color: var(--clr-magent) !important
}

.mutemagentbd {
    border-color: var(--clr-mute-magent) !important
}

.midmagentbd {
    border-color: var(--clr-mid-magent) !important
}

.highmagentbd {
    border-color: var(--clr-high-magent) !important
}

.purpletx {
    color: var(--clr-purple) !important
}

.mutepurpletx {
    color: var(--clr-mute-purple) !important
}

.midpurpletx {
    color: var(--clr-mid-purple) !important
}

.highpurpletx {
    color: var(--clr-high-purple) !important
}

.purplebg {
    background-color: var(--clr-purple) !important
}

.mutepurplebg {
    background-color: var(--clr-mute-purple) !important
}

.midpurplebg {
    background-color: var(--clr-mid-purple) !important
}

.highpurplebg {
    background-color: var(--clr-high-purple) !important
}

.purplebd {
    border-color: var(--clr-purple) !important
}

.mutepurplebd {
    border-color: var(--clr-mute-purple) !important
}

.midpurplebd {
    border-color: var(--clr-mid-purple) !important
}

.highpurplebd {
    border-color: var(--clr-high-purple) !important
}

.bluetx {
    color: var(--clr-blue) !important
}

.mutebluetx {
    color: var(--clr-mute-blue) !important
}

.midbluetx {
    color: var(--clr-mid-blue) !important
}

.highbluetx {
    color: var(--clr-high-blue) !important
}

.bluebg {
    background-color: var(--clr-blue) !important
}

.mutebluebg {
    background-color: var(--clr-mute-blue) !important
}

.midbluebg {
    background-color: var(--clr-mid-blue) !important
}

.highbluebg {
    background-color: var(--clr-high-blue) !important
}

.bluebd {
    border-color: var(--clr-blue) !important
}

.mutebluebd {
    border-color: var(--clr-mute-blue) !important
}

.midbluebd {
    border-color: var(--clr-mid-blue) !important
}

.highbluebd {
    border-color: var(--clr-high-blue) !important
}

.greentx {
    color: var(--clr-green) !important
}

.mutegreentx {
    color: var(--clr-mute-green) !important
}

.midgreentx {
    color: var(--clr-mid-green) !important
}

.highgreentx {
    color: var(--clr-high-green) !important
}

.greenbg {
    background-color: var(--clr-green) !important
}

.mutegreenbg {
    background-color: var(--clr-mute-green) !important
}

.midgreenbg {
    background-color: var(--clr-mid-green) !important
}

.highgreenbg {
    background-color: var(--clr-high-green) !important
}

.greenbd {
    border-color: var(--clr-green) !important
}

.mutegreenbd {
    border-color: var(--clr-mute-green) !important
}

.midgreenbd {
    border-color: var(--clr-mid-green) !important
}

.highgreenbd {
    border-color: var(--clr-high-green) !important
}

.chartrtx {
    color: var(--clr-chartr) !important
}

.mutechartrtx {
    color: var(--clr-mute-chartr) !important
}

.midchartrtx {
    color: var(--clr-mid-chartr) !important
}

.highchartrtx {
    color: var(--clr-high-chartr) !important
}

.chartrbg {
    background-color: var(--clr-chartr) !important
}

.mutechartrbg {
    background-color: var(--clr-mute-chartr) !important
}

.midchartrbg {
    background-color: var(--clr-mid-chartr) !important
}

.highchartrbg {
    background-color: var(--clr-high-chartr) !important
}

.chartrbd {
    border-color: var(--clr-chartr) !important
}

.mutechartrbd {
    border-color: var(--clr-mute-chartr) !important
}

.midchartrbd {
    border-color: var(--clr-mid-chartr) !important
}

.highchartrbd {
    border-color: var(--clr-high-chartr) !important
}

.yellowtx {
    color: var(--clr-yellow) !important
}

.muteyellowtx {
    color: var(--clr-mute-yellow) !important
}

.midyellowtx {
    color: var(--clr-mid-yellow) !important
}

.highyellowtx {
    color: var(--clr-high-yellow) !important
}

.yellowbg {
    background-color: var(--clr-yellow) !important
}

.muteyellowbg {
    background-color: var(--clr-mute-yellow) !important
}

.midyellowbg {
    background-color: var(--clr-mid-yellow) !important
}

.highyellowbg {
    background-color: var(--clr-high-yellow) !important
}

.yellowbd {
    border-color: var(--clr-yellow) !important
}

.muteyellowbd {
    border-color: var(--clr-mute-yellow) !important
}

.midyellowbd {
    border-color: var(--clr-mid-yellow) !important
}

.highyellowbd {
    border-color: var(--clr-high-yellow) !important
}

.salmontx {
    color: var(--clr-salmon) !important
}

.mutesalmontx {
    color: var(--clr-mute-salmon) !important
}

.midsalmontx {
    color: var(--clr-mid-salmon) !important
}

.highsalmontx {
    color: var(--clr-high-salmon) !important
}

.salmonbg {
    background-color: var(--clr-salmon) !important
}

.mutesalmonbg {
    background-color: var(--clr-mute-salmon) !important
}

.midsalmonbg {
    background-color: var(--clr-mid-salmon) !important
}

.highsalmonbg {
    background-color: var(--clr-high-salmon) !important
}

.salmonbd {
    border-color: var(--clr-salmon) !important
}

.mutesalmonbd {
    border-color: var(--clr-mute-salmon) !important
}

.midsalmonbd {
    border-color: var(--clr-mid-salmon) !important
}

.highsalmonbd {
    border-color: var(--clr-high-salmon) !important
}

.orangetx {
    color: var(--clr-orange) !important
}

.muteorangetx {
    color: var(--clr-mute-orange) !important
}

.midorangetx {
    color: var(--clr-mid-orange) !important
}

.highorangetx {
    color: var(--clr-high-orange) !important
}

.orangebg {
    background-color: var(--clr-orange) !important
}

.muteorangebg {
    background-color: var(--clr-mute-orange) !important
}

.midorangebg {
    background-color: var(--clr-mid-orange) !important
}

.highorangebg {
    background-color: var(--clr-high-orange) !important
}

.orangebd {
    border-color: var(--clr-orange) !important
}

.muteorangebd {
    border-color: var(--clr-mute-orange) !important
}

.midorangebd {
    border-color: var(--clr-mid-orange) !important
}

.highorangebd {
    border-color: var(--clr-high-orange) !important
}

.redtx {
    color: var(--clr-red) !important
}

.muteredtx {
    color: var(--clr-mute-red) !important
}

.midredtx {
    color: var(--clr-mid-red) !important
}

.highredtx {
    color: var(--clr-high-red) !important
}

.redbg {
    background-color: var(--clr-red) !important
}

.muteredbg {
    background-color: var(--clr-mute-red) !important
}

.midredbg {
    background-color: var(--clr-mid-red) !important
}

.highredbg {
    background-color: var(--clr-high-red) !important
}

.redbd {
    border-color: var(--clr-red) !important
}

.muteredbd {
    border-color: var(--clr-mute-red) !important
}

.midredbd {
    border-color: var(--clr-mid-red) !important
}

.highredbd {
    border-color: var(--clr-high-red) !important
}

/***** Wiki/Chameleon *****/

/* Main content */

body {
    background-color: var(--bg-body) !important;
    color: var(--bd-dimr1)
}

.content-container {
    color: var(--text-pri) !important
}

.body-content-container {
    background-color: var(--bg-pri) !important;
    color: var(--text-pri) !important
}

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

#content h1 {
    border-bottom: 1px solid var(--bd-pri-emph)
}

#content h2 {
    border-bottom: 1px solid var(--bd-pri-emph)
}

/* Lists */

ol,
dl,
ul {
    color: var(--text-pri)
}

caption {
    color: var(--text-pri)
}

.mw-content-ltr ol, 
.mw-content-rtl .mw-content-ltr ol,
.mw-content-ltr ul,
.mw-content-rtl .mw-content-ltr ul,
.mw-content-ltr dl,
.mw-content-rtl .mw-content-ltr dl {
    color: var(--text-pri)
}

.mw-content-ltr .hltx ol,
.mw-content-rtl .mw-content-ltr .hltx ol,
.mw-content-ltr .hltx ul,
.mw-content-rtl .mw-content-ltr .hltx ul,
.mw-content-ltr .hltx dl,
.mw-content-rtl .mw-content-ltr .hltx dl {
    color: var(--text-pri-emph)
}

/* Navbar */

[class*="ns-"] .header {
    background: var(--bg-pri)
}


.navbar,
.p-navbar {
    background-color: var(--bg-sec) !important
}

.p-navbar .navbar-nav .nav-link,
.p-navbar .navbar-nav .nav-link:visited,
a.navbar-more-tools::before,
a.navbar-tool-link::before,
a.navbar-userloggedin::before {
    color: var(--text-sec) !important
}

.p-navbar .navbar-nav .nav-link:hover,
.p-navbar .navbar-nav .nav-link:visited:hover,
a.navbar-more-tools:hover::before,
a.navbar-tool-link:hover::before,
a.navbar-userloggedin:hover::before {
    color: var(--text-lnk-hov) !important
}

.p-navbar .navbar-nav .dropdown-menu>div>a:first-child:last-child {
    color: var(--text-pri) !important
}

.p-navbar .navbar-nav .dropdown-menu>div>a:last-child:first-child:hover {
    background: var(--bg-menu-hov) !important;
    color: var(--text-pri) !important
}

a.navbar-more-tools::before,
a.navbar-tool-link::before,
a.navbar-userloggedin::before {
    color: var(--text-sec)
}

.form-control:focus {
    color: var(--bd-dim) !important
}

.input-group>.form-control {
    background-color: var(--bg-pri-hd);
    border: 1px solid var(--bd-cont-l)
}

.p-search .searchGoButton {
    background: var(--bg-pri-hd) !important;
    border-color: var(--bd-cont-l) !important
}

.search-btn::before {
    color: var(--text-sec)
}

.mw-rcfilters-ui-menuSelectWidget-group {
	background: var(--bg-sec) !important
}

.dropdown-item:hover,
.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget:hover,
.p-navbar .navbar-nav .dropdown-menu>div>a:last-child:first-child:hover {
    background-color: var(--bg-menu-hov) !important
}

/* Misc Text */

.mw-rcfilters-ui-itemMenuOptionWidget-label-title,
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc,
.mw-rcfilters-ui-savedLinksListWidget-placeholder.oo-ui-optionWidget .oo-ui-labelElement-label {
    color: var(--text-pri) !important
}

/* tool tips and popups with arrow borders */
.tippy-header {
    background-color: var(--bg-pri) !important;
    border-bottom: 1px solid var(--bd-pri-emph) !important
}

.tippy-tooltip.light-border-theme {
	color: var(--text-sec) !important;
	background-color: var(--bg-sec) !important;
	box-shadow: 0 0 10px var(--bd-emph-shd) !important
}

.tippy-tooltip.light-border-theme[x-placement^="top"] .tippy-arrow,
.tippy-tooltip.light-border-theme[x-placement^="top"] .tippy-arrow:before,
.tippy-tooltip.light-border-theme[x-placement^="top"] .tippy-arrow:after,
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before,
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::after {
    border-top-color: var(--bd-foc-shd) !important
}

.tippy-tooltip.light-border-theme[x-placement^="bottom"] .tippy-arrow,
.tippy-tooltip.light-border-theme[x-placement^="bottom"] .tippy-arrow:before,
.tippy-tooltip.light-border-theme[x-placement^="bottom"] .tippy-arrow:after,
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::before,
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::after,
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::after,
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
    border-bottom-color: var(--bd-foc-shd) !important
}

.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::before,
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::after {
    border-right-color: var(--bd-foc-shd) !important
}

.oo-ui-dropdownInputWidget select {
    border-color: var(--bg-body)
}

.mw-rcfilters-ui-datePopupWidget {
    border-top: 1px solid var(--bd-dimr1) !important
}

.mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title {
    color: var(--bd-dim) !important;
    font-weight: 400 !important
}

/* Block Quotes */

.blockquote {
    background-color: var(--bg-sec-emph);
    border: 1px dotted var(--bd-adj-dn)
}

/* Calendar widget */

.mw-widget-dateInputWidget-calendar {
    background-color:var(--bg-sec) !important;
	box-shadow: 0 0 10px var(--bd-emph-shd) !important
}

.mw-widget-dateInputWidget-calendar:focus {
    box-shadow:inset 0 0 0 1px var(--bd-pri-emph), 0 2px 2px 0 var(--bg-field-hov) !important
}

 .mw-widget-calendarWidget {
    border:1px solid var(--bg-sec)!important
}

.mw-widget-calendarWidget:focus {
	box-shadow: 0 0 10px var(--bd-emph-shd) !important
}

.mw-widget-calendarWidget-day {
    color:var(--text-pri)!important
}

.mw-widget-calendarWidget-day-heading {
    color:var(--text-sec)!important
}

.mw-widget-calendarWidget-day-additional {
    color:var(--bd-dimr2)!important
}

.mw-widget-calendarWidget-day-additional:hover {
    color:var(--bd-dim)!important
}

.mw-widget-calendarWidget-day-today {
    background-color:var(--bg-pri) !important;
    box-shadow:inset 0 0 0 1px var(--bg-pri)!important
}

.mw-widget-calendarWidget-item:hover {
    background: var(--bg-menu-hov) !important;
    color:var(--text-sec)!important
}

.mw-widget-calendarWidget-item-selected {
    background-color:var(--bd-pri-emph)!important;
    color:var(--text-sec)!important
}

.mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-month,
.mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-year,
.mw-widget-calendarWidget-body.mw-widget-calendarWidget-body-duodecade {
    color:var(--text-pri) !important
}

/* Dropdown menus */

.wikiEditor-ui-toolbar .group .tool-select .options,
.autocomplete-suggestions,
.dropdown-menu {
    background-color: var(--bg-sec) !important;
    box-shadow: 0 0 10px var(--bd-emph-shd) !important;
    color: var(--text-pri) !important
}

.autocomplete-suggestion {
	border-bottom: 1px solid var(--bd-widg)
}

.autocomplete-suggestion:hover,
.dropdown-item:hover {
    background-color: var(--bg-menu-hov) !important
}

/* TOC */

.toc,
.mw-warning,
.toccolours {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset
}

.toctogglelabel {
    color: var(--text-lnk)
}

.noautonum .tocnumber {
    color: var(--text-pri)
}

.tocnumber {
  color: var(--text-pri) !important
}

#toc h2 {
    font-size: 1.4rem !important
}

/* Tables */

.mw-datatable td,
.wikitable {
    background-color: var(--bg-sec) !important;
    color: var(--text-pri) !important
}

.mw-datatable>*>tr>th,
.wikitable>*>tr>th {
    background-color: var(--bg-pri-hd) !important;
    border: 1px solid var(--bd-cont-l) !important
}

.mw-datatable>*>tr>td,
.mw-datatable>tr>td,
.wikitable>*>tr>td,
.wikitable>tr>td {
    border: 1px solid var(--bd-dims) !important
}

/* Files Thumbs */

li.gallerybox div.thumb {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset
}

.mw-search-profile-tabs {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset
}

.postedit,
.mw-notification {
    color: var(--text-pri) !important;
    background-color: var(--bg-menu-hov) !important;
    border-color: var(--bd-cont-lr) !important
}

#filetoc {
    border: 1px solid var(--bd-cont-l);
    background-color: var(--bg-pri-hd)
}

.thumbborder {
	border: 1px solid #ff901290
}

/* Diff */

table.diff,
td.diff-ntitle,
td.diff-otitle {
    background-color: var(--bg-pri-hd);
    border-color: var(--bd-adj-dn) !important
}

td.diff-addedline {
    color: var(--text-pri);
    background-color: var(--bg-diff-add)
}

td.diff-deletedline {
    color: var(--text-pri);
    background-color: var(--bg-diff-del)
}

td.diff-context {
    background-color: var(--bg-pri-hd);
    border-color: var(--bd-dim);
    color: var(--text-pri)
}

td.diff-addedline .diffchange {
    background-color: var(--bg-diffch-add);
    color: var(--text-diffch-add)
}

td.diff-deletedline .diffchange {
    background-color: var(--bg-diffch-del);
    color: var(--text-diffch-del)
}

/* Page History */

#pagehistory li.selected {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bd-dim);
    color: var(--bd-dimr1);
    outline: 1px dashed var(--bd-dim)
}

.mw-plusminus-neg {
    color: var(--clr-red)
}

.mw-plusminus-pos {
    color: var(--clr-green)
}

.mw-editform-legacy input#wpSummary {
    background-color: var(--bg-pri-emph);
    color: var(--text-sec)
}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
    background: var(--bg-sec-hd) !important
}

.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {
    color: var(--bd-dim) !important
}

.oo-ui-menuSelectWidget [id*=".ooui"] {
    background: var(--bd-pri-emph)
}

/* tag list items */

.oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed),
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
    background-color: var(--btn) !important;
    border: 1px solid var(--btn);
    color: var(--text-pri-emph)
}

.oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {
    border: 1px solid var(--btn) !important;
    color: var(--text-sec) !important
}

.mw-widgets-datetime-dateTimeInputWidget-handle {
    background-color: var(--bg-pri-hd) !important;
    border-color: var(--bd-adj-dn) !important
}

/* Option sets */

#xmlimport[id*="mw-input-wpExpiry"],
#mw-import-namespace-upload,
#namespace,
#wpLicense,
#wpUploadFile,
#xmlimport {
    background-color: var(--bg-pri-hd) !important;
    color: var(--text-pri) !important;
    border: 1px solid var(--bd-cont-l) !important
}

/* Large option set dropdowns w/list */

.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined .oo-ui-tagMultiselectWidget-handle {
    background-color: var(--bg-pri-hd) !important;
    border-color: var(--bd-cont-l) !important
}

.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle {
    background-color: var(--bg-field-hov) !important
}

.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:focus .oo-ui-tagMultiselectWidget-handle,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle {
    border-color: var(--bg-pri-emph) !important;
    box-shadow: 0 0 5px var(--bd-foc-shd) !important
}

/* Buttons */

#mw-search-toggleall,
#mw-search-togglenone,
#mw-userrights-form1 input[type="submit"],
#wpRunQuery,
.mw-submit input[type="submit"],
.mw-ui-button,
.mw-ui-button.mw-ui-progressive,
.oo-ui-buttonElement-framed.oo-ui-widget-disabled>.oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled>.oo-ui-buttonElement-button,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.sitedir-ltr input[type="submit"],
.smw-jsonview-button {
    color: var(--btn-text) !important;
    background-color: var(--btn) !important;
    border: 1px solid var(--btn) !important
}

#mw-search-toggleall:hover,
#mw-search-togglenone:hover,
#mw-userrights-form1 input[type="submit"]:hover,
#wpRunQuery:hover,
.mw-submit input[type="submit"]:hover,
.mw-ui-button.mw-ui-progressive:hover,
.mw-ui-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-disabled>.oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled>.oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
.sitedir-ltr input[type="submit"]:hover,
.smw-jsonview-button:hover {
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%) !important
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive>.oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive>.oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive {
    background-color: var(--btn-warn) !important;
    border-color: var(--btn-warn) !important;
    color: var(--text-sec) !important
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive>.oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive>.oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive:hover {
    background-color: var(--btn-warn-hov) !important;
    border-color: var(--btn-warn-hov) !important;
    color: var(--btn-text-hov) !important
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color>.oo-ui-buttonElement-button,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect-color-none>.oo-ui-buttonElement-button {
    border: 2px solid var(--bd-pri-emph) !important
}

/* Infoboxes (also see .modbox, etc. below) */

.infobox {
    background: var(--bg-sec-hd);
    box-shadow: 0 0 5px 1px var(--bd-emph-shd);
    border-color: var(--bg-sec-hd)
}

/* Tags */

.tag {
    border: 1px solid var(--bg-pri)
}

.tagicon {
    border-right: 1px solid var(--bg-sec-hd)
}

/* Links */

a,
a.external>span,
a[href].external,
a[href].extiw {
    color: var(--text-lnk)
}

a:hover,
a[href].external:hover {
    color: var(--text-lnk-hov)
}

a:visited,
a[href].external:visited {
    color: var(--text-lnk-vis)
}

a:visited:hover,
a[href].external:visited:hover {
    color: var(--text-lnk-vis-hov)
}

a.new,
a[href].new {
    color: var(--text-lnk-new)
}

a.new:hover,
a[href].new:hover {
    color: var(--text-lnk-new-hov)
}

/* warning */
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning,
.mw-message-box-warning {
    color: var(--text-pri-emph) !important;
    background: var(--clr-mute-red) !important;
    border-color: var(--bd-dim) !important
}

.mw-logevent-loglines,
.mw-logline-delete,
.mw-logline-protect {
    color: var(--text-sec) !important
}

.oo-ui-flaggedElement-warning .oo-ui-labelElement-label a,
.mw-logevent-loglines a,
.mw-logline-delete a,
.mw-logline-protect a {
    color: var(--text-lnk-hov) !important
}

.oo-ui-flaggedElement-warning .oo-ui-labelElement-label a:hover,
.mw-logevent-loglines a:hover,
.mw-logline-delete a:hover,
.mw-logline-protect a:hover {
    color: var(--text-lnk-hov-bt) !important
}

.oo-ui-flaggedElement-warning .oo-ui-labelElement-label a:visited,
.mw-logevent-loglines a:visited,
.mw-logline-delete a:visited,
.mw-logline-protect a:visited {
    color: var(--text-lnk-vis-bt) !important
}

.oo-ui-flaggedElement-warning .oo-ui-labelElement-label a:visited:hover,
.mw-logevent-loglines a:visited:hover,
.mw-logline-delete a:visited:hover,
.mw-logline-protect a:visited:hover {
    color: var(--text-lnk-vis-hov-bt) !important
}

/* Visual Editor */

.ve-ce-branchNode-slug.ve-ce-branchNode-blockSlug,
.ve-ce-branchNode-slug.ve-ce-branchNode-newSlug {
    outline: 1px dashed var(--bd-pri-emph)
}

.ve-ce-branchNode-slug.ve-ce-branchNode-blockSlug {
	background: var(--bg-pri)
}

.ve-ce-branchNode-slug.ve-ce-branchNode-blockSlug .oo-ui-buttonElement-button {
	background: var(--bg-menu-hov) !important
}

.ve-init-mw-switchPopupWidget>.oo-ui-popupWidget-popup {
	background-color: var(--bg-pri);
	box-shadow: 0 0 10px var(--bd-emph-shd)
}

.oo-ui-widget-enabled .oo-ui-tool-title {
	color: var(--text-sec)
}

.oo-ui-widget-disabled .oo-ui-tool-title {
	color: var(--bd-dim)
}

.oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link,
.oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
	background-color: var(--btn) !important;
	border-color: var(--btn) !important;
	color: var(--text-sec) !important
}

div.ve-ui-mwMediaDialog-altText input.oo-ui-inputWidget-input:hover {
	background-color: var(--bg-field-hov)
}

.oo-ui-toolbar-bar {
	background-color: var(--bg-sec);
	color: var(--text-pri)
}

.oo-ui-toolbar-bar,
.codeEditor-status {
	background-color: var(--bg-sec);
	background-image: linear-gradient(to bottom,var(--bg-sec) 15px,var(--bg-pri) 40px);
	color: var(--text-sec) !important
}

.oo-ui-toolbar.oo-ui-toolbar-position-top.ve-ui-toolbar.ve-ui-dir-inline-ltr.ve-ui-dir-block-ltr.ve-ui-targetToolbar.ve-ui-positionedTargetToolbar.ve-init-mw-desktopArticleTarget-toolbar.ve-init-mw-desktopArticleTarget-toolbar-open > .oo-ui-toolbar-bar {
	border-bottom: 1px solid var(--bd-widg);
	box-shadow: 0 1px 1px 0 var(--bd-adj-dn)
}

.ve-ui-toolbar-group-format.oo-ui-widget.oo-ui-toolGroup.oo-ui-indicatorElement.oo-ui-popupToolGroup.oo-ui-menuToolGroup.oo-ui-widget-enabled.oo-ui-labelElement,
.ve-ui-toolbar-group-format.oo-ui-widget.oo-ui-toolGroup.oo-ui-widget-disabled.oo-ui-indicatorElement.oo-ui-popupToolGroup.oo-ui-menuToolGroup.oo-ui-labelElement {
	border-left: 1px solid var(--bd-widg);
	border-right: 1px solid var(--bd-widg)
}

.oo-ui-toolbar-actions .oo-ui-widget.oo-ui-widget-enabled.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
	border-right-color: var(--bg-pri-emph)
}

.oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input,
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link {
	color: var(--text-pri) !important
}

.oo-ui-popupToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
	color: var(--text-sec) !important
}

.oo-ui-widget.oo-ui-messageWidget.oo-ui-flaggedElement-error:not(.oo-ui-messageWidget-block) {
	color: var(--clr-red)
}

.ve-ui-mwSaveDialog-summary {
	background-color: var(--bg-pri-hd) !important
}

.ve-ui-mwSaveDialog-options {
	background-color: var(--bg-pri) !important
}

.ve-ui-mwSaveDialog-license {
	color: var(--text-pri) !important
}

.ve-ui-mwTemplatePage-description,
.ve-ui-mwParameterPage-doc-required,
.ve-ui-mwParameterPage-inlineDescription .ve-ui-mwParameterPage-doc-example {
	color: var(--text-pri) !important
}

.ve-ui-expandableContent-toggle.oo-ui-widget.oo-ui-widget-enabled.oo-ui-buttonElement.oo-ui-buttonElement-frameless.oo-ui-iconElement.oo-ui-labelElement.oo-ui-flaggedElement-progressive.oo-ui-buttonWidget {
	background-color: var(--bg-sec-hd)
}

.ve-ui-expandableContent-fade {
	background: linear-gradient(to right,rgba(255,255,255,0) 0,var(--bg-sec-hd) 90%) !important
}

/* link button popup dialog */
.ve-ui-context.ve-ui-desktopContext .oo-ui-popupWidget-popup {
	background-color: var(--bg-pri);
	box-shadow: 0 0 10px var(--bd-emph-shd);
    color: var(--text-sec)
}

.oo-ui-dialog-content.oo-ui-processDialog-content>.oo-ui-window-head,
.oo-ui-dialog-content.oo-ui-processDialog-content>.oo-ui-window-foot {
	outline: 1px solid var(--bd-dim)
}

.oo-ui-dialog-content.oo-ui-processDialog-content>.oo-ui-window-head {
	background-color: var(--bg-pri-hd);
	color: var(--text-sec)
}

.oo-ui-selectWidget-unpressed.oo-ui-tabSelectWidget-frameless {
	box-shadow: inset 0 -1px 0 0 var(--bd-dim)
}

.oo-ui-widget-enabled.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget {
	color: var(--bd-dim);
	box-shadow: inset 0 -1px 0 0 var(--bd-dim)
}

.oo-ui-widget-enabled.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
	color: var(--text-pri);
	box-shadow: inset 0 -2px 0 0 var(--text-sec)
}

.oo-ui-widget-enabled.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
	color: var(--text-pri);
	border-color: var(--bd-pri-emph);
	box-shadow: inset 0 -2px 0 0 var(--bd-pri-emph)
}

.oo-ui-widget-enabled.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover {
	color: var(--text-pri);
	border-color: var(--bd-pri-emph);
	box-shadow: inset 0 -2px 0 0 var(--bd-pri-emph)
}

/* cite button popup dialog */
.ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) {
	background: var(--bg-sec) !important
}

.ve-ui-targetWidget {
	border: 1px solid var(--bd-dim) !important
}

.ve-ui-targetWidget-focused {
	border-color: var(--bd-foc-shd) !important
}

.oo-ui-toolbar-narrow.oo-ui-toolbar-position-top .oo-ui-toolbar-bar::after {
	border-bottom: 1px solid var(--bd-dim) !important
}

/* symbol button popup dialog */
.oo-ui-toolbar-position-top .ve-ui-toolbarDialog-position-above {
	border-top: 1px solid var(--bd-widg) !important
}

.oo-ui-outlineOptionWidget.oo-ui-optionWidget-highlighted {
	background-color: var(--bd-dpdn-shd) !important
}

.ve-init-target .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
	background-color: var(--bg-sec-hd) !important;
	color: var(--text-pri) !important
}

.oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-expanded.oo-ui-bookletLayout-outlinePanel {
	background-color: var(--bg-sec)
}

.ve-ui-specialCharacterPage-character {
	border: 1px solid var(--bd-widg) !important
}

.ve-ui-specialCharacterPage-character:hover {
	background-color: var(--bd-dpdn-shd) !important
}

/* media upload dialog */
.oo-ui-inputWidget.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
    background-color: var(--bd-mid)
}

.oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
    border: 1px dashed var(--bd-foc-shd)
}

.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame .oo-ui-selectFileWidget-dropLabel {
	color: var(--bd-foc-shd)
}

.oo-ui-fieldLayout-header>.oo-ui-labelWidget.oo-ui-inline-help {
	color: var(--bd-dim)
}

.mw-widget-mediaSearchWidget>.oo-ui-searchWidget-query {
	border-bottom: 1px solid var(--bd-dim)
}

.mw-widget-mediaResultWidget-done>.mw-widget-mediaResultWidget-overlay {
	box-shadow: inset 0 0 0 1px var(--bd-dim)
}

.oo-ui-widget-enabled.mw-widget-mediaResultWidget.oo-ui-optionWidget-highlighted,
.oo-ui-widget-enabled.mw-widget-mediaResultWidget.oo-ui-optionWidget-selected {
	border-color: var(--bd-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph)
}

.oo-ui-widget-enabled.mw-widget-mediaResultWidget.oo-ui-optionWidget-highlighted .mw-widget-mediaResultWidget-overlay,
.oo-ui-widget-enabled.mw-widget-mediaResultWidget.oo-ui-optionWidget-selected .mw-widget-mediaResultWidget-overlay {
    box-shadow: 0 0 2px var(--bd-pri-emph)
}

.ve-ui-mwGalleryDialog .oo-ui-widget.ve-ui-mwGalleryDialog-image-container-highlighted {
	box-shadow: inset 0 0 0 0.1em var(--bd-pri-emph)
}

/* table dialog */
.ve-ui-tableLineContext > .oo-ui-iconWidget.oo-ui-widget-enabled.oo-ui-iconElement.oo-ui-iconElement-icon {
	background-color: var(--btn)
}

.ve-ui-tableLineContext-menu>.oo-ui-popupWidget-popup {
	background-color: var(--bg-pri);
	box-shadow: 0 0 10px var(--bd-emph-shd)
}

.oo-ui-widget.ve-ui-contextItem + .ve-ui-contextItem {
	border-top: 1px solid var(--bd-widg)
}

/* insert item dialogs */
.ve-ce-commentNode .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    background: var(--clr-yellow) !important;
    border: 1px solid var(--clr-yellow) !important
}

.ve-ui-previewElement.ve-ui-mwLatexDialog-preview {
	background-color: var(--bg-sec);
    border: 1px dashed var(--bd-foc-shd)
}

.ve-ui-mwLatexDialog-content .oo-ui-layout.oo-ui-bookletLayout-stackLayout h3 {
	color: var(--text-pri)
}

.ve-ui-specialCharacterPage-characters>.ve-ui-mwLatexPage-symbol {
	background-color: var(--bd-dim);
	border: 1px solid var(--bd-dim)
}

.oo-ui-layout.ve-ui-mwLatexDialog-menuLayout > .oo-ui-menuLayout-content {
	border-bottom: 1px solid var(--bd-dim)
}

.oo-ui-layout.ve-ui-mwLatexDialog-menuLayout > .oo-ui-menuLayout-content:hover {
	border-color: var(--bd-pri-emph)
}

.ve-ce-attachedRootNode::selection,
.ve-ce-attachedRootNode ::selection {
	background: var(--bd-foc-shd)
}

.ve-ce-focusableNode-highlight {
	background: var(--bd-foc-shd)
}

/* main edit menu-item colors */
.oo-ui-toolGroup-tools.oo-ui-clippableElement-clippable.oo-ui-floatableElement-floatable.oo-ui-popupToolGroup-tools.oo-ui-toolGroup-enabled-tools.oo-ui-popupToolGroup-active-tools > .oo-ui-tool.oo-ui-tool-active,
.oo-ui-widget.oo-ui-toolGroup.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover,
.oo-ui-widget.oo-ui-toolGroup.oo-ui-widget-enabled.oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
	background-color: var(--bg-sec-hd);
	color: var(--text-sec)
}

.oo-ui-toolGroup-tools.oo-ui-clippableElement-clippable.oo-ui-floatableElement-floatable.oo-ui-popupToolGroup-tools.oo-ui-listToolGroup-tools.oo-ui-toolGroup-enabled-tools.oo-ui-popupToolGroup-active-tools,
.oo-ui-toolGroup-tools.oo-ui-clippableElement-clippable.oo-ui-floatableElement-floatable.oo-ui-popupToolGroup-tools.oo-ui-menuToolGroup-tools.oo-ui-toolGroup-enabled-tools.oo-ui-popupToolGroup-active-tools,
.oo-ui-widget.oo-ui-widget-enabled.oo-ui-labelElement.oo-ui-floatableElement-floatable.oo-ui-popupWidget-anchored.oo-ui-popupWidget.oo-ui-popupTool-popup.oo-ui-popupWidget-anchored-top>.oo-ui-popupWidget-popup {
	background-color: var(--bg-sec);
	box-shadow: 0 0 10px var(--bd-emph-shd)
}

.oo-ui-menuToolGroup-tools.oo-ui-popupToolGroup-active-tools .oo-ui-tool.oo-ui-widget-enabled:hover,
.oo-ui-widget.oo-ui-iconElement.oo-ui-tool-with-icon.oo-ui-tool.oo-ui-widget-enabled:hover {
	background-color: var(--bd-dpdn-shd);
	color: var(--text-sec)
}

.oo-ui-widget.oo-ui-widget-enabled.ve-ui-educationPopup > .mw-pulsating-dot::before,
.oo-ui-widget.oo-ui-widget-enabled.ve-ui-educationPopup > .mw-pulsating-dot::after {
	background-color: var(--bd-pri-emph)
}

.oo-ui-messageDialog-text>.oo-ui-messageDialog-title {
	color: var(--text-sec)
}

.oo-ui-messageDialog-text>.oo-ui-messageDialog-message {
	color: var(--text-pri)
}

.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
	color: var(--text-diffch-add) !important
}

/* Wiki Editor */

.wikiEditor-ui .wikiEditor-ui-top {
	border-bottom: 1px solid var(--bg-msup)
}

#wikiEditor-section-advanced .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
#wikiEditor-section-main .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    background-color: var(--bg-sec)
}

.wikiEditor-ui-top > .wikiEditor-ui-toolbar .section-advanced .group .label,
#wikiEditor-ui-toolbar .tabs span.tab a,
#wikiEditor-ui-toolbar .tabs span.tab a:visited,
#wikiEditor-ui-toolbar .tabs span.tab a.current,
#wikiEditor-ui-toolbar .tabs span.tab a.current:visited {
	color: var(--text-sec)
}

#wikiEditor-ui-toolbar .tabs span.tab a:hover,
#wikiEditor-ui-toolbar .tabs span.tab a:visited:hover,
#wikiEditor-ui-toolbar .tabs span.tab a.current:hover,
#wikiEditor-ui-toolbar .tabs span.tab a.current:visited:hover {
	color: var(--text-pri-emph)
}

#wikiEditor-section-advanced .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
#wikiEditor-section-advanced .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
#wikiEditor-section-advanced .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
#wikiEditor-section-main .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
#wikiEditor-section-main .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
#wikiEditor-section-main .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
	background-image: linear-gradient(to bottom,var(--bg-sec) 15px,var(--bg-pri) 40px) !important
}

.wikiEditor-ui-top > .wikiEditor-ui-toolbar,
.wikiEditor-ui-toolbar .sections .section,
.oo-ui-toolbar-bar,
.codeEditor-status {
	box-shadow: 0 1px 1px 0 var(--bd-adj-dn);
	background-color: var(--bg-sec);
	background-image: linear-gradient(to bottom,var(--bg-sec) 15px,var(--bg-pri) 40px);
	color: var(--text-sec) !important
}

.wikiEditor-ui .wikiEditor-ui-view,
.wikiEditor-ui .wikiEditor-ui-top,
.wikiEditor-ui-toolbar .sections .section,
.wikiEditor-ui-toolbar .group {
	border-color: var(--bd-widg) !important
}

.wikiEditor-ui-toolbar .booklet > .index {
	background-color: var(--bg-sec);
	box-shadow: 0 0 10px var(--bd-emph-shd);
	color: var(--text-pri) !important
}

.wikiEditor-ui-toolbar .booklet > .index > :hover {
	background-color: var(--bd-dpdn-shd) !important
}

.wikiEditor-ui-toolbar .booklet > .index > .current {
	background-color: var(--bg-sec-hd) !important;
	color: var(--text-sec) !important
}

.wikiEditor-ui-toolbar .page-characters div span {
	border-color: var(--bd-widg) !important;
	color: var(--text-pri) !important
}

.wikiEditor-ui-toolbar .page-characters div span:hover {
	background-color: var(--bd-dpdn-shd) !important
}

.wikiEditor-ui-toolbar .page-table th {
	color: var(--text-sec) !important
}

.wikiEditor-ui-toolbar .page-table td {
	color: var(--bd-dim) !important;
	border-top: 1px solid var(--bd-widg) !important
}

.wikiEditor-ui-toolbar .group .tool-select .menu>.options>.option {
	color: var(--text-pri)
}

.wikiEditor-ui-toolbar .group .tool-select .menu>.options>.option:hover {
	background-color: var(--bd-dpdn-shd) !important
}

.ui-widget-header>.ui-dialog-title {
	color: var(--text-sec)
}

.ui-widget.ui-widget-content {
	background: var(--bg-pri);
	box-shadow: 0 0 10px var(--bd-emph-shd)
}

.ui-dialog-buttonpane.ui-widget-content {
	background: var(--bg-pri)
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: var(--text-pri-emph) !important;
    background: var(--btn) !important;
    border: 1px solid var(--btn) !important
}

.ui-widget.ui-widget-content>.ui-widget-content {
	color: var(--text-pri)
}

#wikieditor-toolbar-table-dimensions-rows,
#wikieditor-toolbar-table-dimensions-columns {
	background-color: var(--bg-pri-hd) !important;
	color: var(--text-pri) !important;
	border-color: var(--bd-adj-dn) !important
}

.wikiEditor-ui-top > #msupload-div {
    background: var(--bd-mid);
    border-top: 1px solid var(--bd-widg)
}

.wikiEditor-ui-top > #msupload-div > #msupload-dropzone {
    border: 1px dashed var(--bd-foc-shd);
    color: var(--bd-foc-shd)
}

textarea {
    background-color: var(--bg-sec-hd) !important;
    color: var(--text-editor) !important;
    border-color: var(--bd-dimr2) !important
}

.action-formedit .editOptions {
    border-color: var(--bg-pri-emph)
}

div.editOptions {
    background-color: var(--bg-pri-emph);
    border-color: var(--bg-pri-emph);
	color: var(--text-pri)
}

#editform > .editOptions {
    background-color: var(--bg-pri-emph);
	color: var(--text-pri);
    border-color: var(--bg-pri-emph)
}

div#editpage-specialchars a {
    background-color: var(--bg-pri-emph);
    border-color: var(--bd-dimr2)
}

.mw-specialCiteThisPage-bibliographic {
	background-color: var(--bg-pri)
}

.error {
	color: var(--clr-red)
}

/* API Interface Special Page */

.mw-apisandbox-toolbar {
    background-color: var(--bg-pri-hd) !important;
    border-bottom: 1px solid var(--bd-widg) !important
}

.oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
    background-color: var(--bg-sec-hd) !important;
    color: var(--text-lnk) !important
}

.oo-ui-bookletLayout>.oo-ui-menuLayout-menu {
    border-right: 1px solid var(--bd-widg) !important
}

.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle {
    border-color: var(--bd-dim) !important
}

.oo-ui-toggleSwitchWidget {
    background-color: var(--bd-dimr1) !important;
    border: 1px solid var(--bd-widg) !important
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled {
    background-color: var(--bd-dimr1) !important;
    border-color: var(--bd-widg) !important
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
    border: 1px solid var(--bd-widg) !important;
    background-color: var(--bd-dimr1) !important
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {
    box-shadow: inset 0 0 0 1px var(--bd-pri-emph) !important;
    border-color: var(--bd-pri-emph) !important
}

.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus::before {
	border-color: var(--bd-pri-emph) !important
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {
    background-color: var(--bd-pri-emph) !important;
    border-color: var(--bd-widg) !important
}

.oo-ui-fieldLayout-field .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus::before {
	border-color: var(--bd-pri-emph)
}

.oo-ui-fieldLayout-field .oo-ui-labelWidget.oo-ui-inline-help {
	color: var(--clr-chartr)
}

/* Book sources */
.page-Special_BookSources #ooui-php-2 {
	background-color: var(--bg-pri)
}

/* Search & Replace Text */

#mw-searchoptions,
.ext-replacetext-searchoptions {
    color: var(--text-pri);
    background-color: var(--bg-sec);
    border-color: var(--bg-sec)
}

#mw-searchoptions .divider,
.ext-replacetext-searchoptions .ext-replacetext-divider {
    border-bottom: 1px solid var(--bd-dim)
}

.search-types .current a {
	color: var(--text-pri)
}

/* User Preferences */

#preferences {
    background-color: var(--bg-sec);
    color: var(--text-sec)
}

.oo-ui-tabSelectWidget-framed {
    background-color: var(--bg-sec-hd) !important;
    color: var(--text-pri) !important
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
    background-color: var(--bg-sec) !important;
    color: var(--text-sec) !important
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
    border-top: 2px solid var(--bd-pri-emph) !important
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget {
    color: var(--bd-dimr1)
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget:hover {
    background: var(--bg-sec);
    color: var(--bd-dimr1)
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget .oo-ui-labelElement-label {
    border-top: 2px solid var(--bd-dims)
}

.mw-prefs-buttons {
    background-color: var(--bg-sec);
    border-top: 1px solid var(--bd-dim)
}

.oo-ui-labelWidget.oo-ui-inline-help {
    color: var(--clr-chartr)
}

/* Gadgets */

.mw-json tr {
    background-color: var(--bg-sec-emph)
}

.mw-json th {
    background-color: var(--bg-pri-hd)
}

.mw-json td,
.mw-json th {
    border: 1px solid var(--bg-sec)
}

.mw-json-single-value,
.mw-json-value {
    background-color: var(--bg-pri)
}

.mw-json-empty {
    background-color: var(--bg-sec-hd)
}

/***** Recent/Related Changes *****/

.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
    background-color: var(--bg-pri-emph) !important;
    border: 1px solid var(--bg-pri-emph) !important;
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset !important
}

.mw-rcfilters-ui-filterMenuHeaderWidget-title {
    color: var(--text-pri) !important
}

.mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child):not(.mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk) {
    background-color: var(--bg-sec) !important;
    border-bottom: 1px solid var(--bd-dims) !important
}

.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {
    color: var(--bd-dim) !important
}

.mw-rcfilters-ui-tagItemWidget.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-labelElement-label {
    color: var(--text-pri-emph) !important
}

.oo-ui-widget.oo-ui-widget-enabled.oo-ui-labelElement.oo-ui-optionWidget.oo-ui-decoratedOptionWidget.oo-ui-menuSectionOptionWidget.mw-rcfilters-ui-filterMenuSectionOptionWidget {
    background-color: var(--bg-sec-emph)
}

.mw-rcfilters-ui-filterMenuSectionOptionWidget-header>.mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title.oo-ui-labelElement-label {
    color: var(--text-pri)
}

.mw-rcfilters-ui-menuSelectWidget-noresults {
    color: var(--text-pri)
}

.mw-rcfilters-ui-table.mw-rcfilters-ui-filterMenuHeaderWidget-header {
    background-color: var(--bg-sec-hd);
    border-bottom: 1px solid var(--bd-dims)
}

.mw-rcfilters-ui-menuSelectWidget-footer {
    background-color: var(--bg-sec-hd) !important;
    border-top: 1px solid var(--bd-dims) !important
}

#ooui-311.oo-ui-widget.oo-ui-widget-enabled.oo-ui-selectWidget.oo-ui-floatableElement-floatable.oo-ui-menuSelectWidget.mw-rcfilters-ui-menuSelectWidget.oo-ui-selectWidget-unpressed.mw-rcfilters-ui-menuSelectWidget-view-default,
#ooui-311.mw-rcfilters-ui-menuSelectWidget-view-tags,
#ooui-311.oo-ui-menuSelectWidget {
    box-shadow: 0 0 10px var(--bd-emph-shd)
}

.oo-ui-floatableElement-floatable>.oo-ui-popupWidget-popup {
	background-color: var(--bg-sec);
	box-shadow: 0 0 10px var(--bd-emph-shd);
    color: var(--text-pri)
}

.mw-rcfilters-ui-menuSelectWidget-group>.mw-rcfilters-ui-itemMenuOptionWidget-view-namespaces {
	border-top: 3px solid var(--bd-dims)
}

.mw-rcfilters-collapsed .mw-rcfilters-ui-filterTagMultiselectWidget {
    border-bottom: 1px solid var(--bd-dims)
}

.oo-ui-widget.oo-ui-widget-enabled.oo-ui-labelElement.oo-ui-optionWidget.oo-ui-buttonElement.oo-ui-buttonElement-framed.oo-ui-buttonOptionWidget > .oo-ui-buttonElement-button,
.oo-ui-widget.oo-ui-widget-enabled.oo-ui-labelElement.oo-ui-optionWidget.oo-ui-buttonElement.oo-ui-buttonElement-framed.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
	border-color: var(--bd-dim) !important;
	color: var(--text-sec) !important
}

.oo-ui-widget.oo-ui-widget-enabled.oo-ui-labelElement.oo-ui-optionWidget.oo-ui-buttonElement.oo-ui-buttonElement-framed.oo-ui-buttonOptionWidget > .oo-ui-buttonElement-button:hover,
.oo-ui-widget.oo-ui-widget-enabled.oo-ui-labelElement.oo-ui-optionWidget.oo-ui-buttonElement.oo-ui-buttonElement-framed.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:hover {
	background-color: var(--bg-menu-hov) !important
}

.oo-ui-buttonElement-button[title="Show Active filters area"]>.oo-ui-labelElement-label,
.oo-ui-buttonElement-button[title="Hide Active filters area"]>.oo-ui-labelElement-label {
    color: var(--text-lnk)
}

.oo-ui-buttonElement-button[title="Show Active filters area"]>.oo-ui-labelElement-label:hover,
.oo-ui-buttonElement-button[title="Hide Active filters area"]>.oo-ui-labelElement-label:hover {
    color: var(--text-lnk-hov)
}

.oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
	border-color: var(--bd-pri-emph) !important;
	box-shadow: inset 0 0 0 1px var(--bd-pri-emph),inset 0 0 0 2px var(--bd-foc-shd) !important
}

a.oo-ui-buttonElement-button[title="Learn more about Tagged edits"] {
    background-color: var(--bg-sec-hd) !important;
    border-color: var(--bg-sec-hd) !important
}

.mw-collapsible.mw-collapsed.mw-enhanced-rc.mw-changeslist-line.mw-changeslist-edit.mw-changeslist-ns3012-2_2_0.mw-changeslist-line-watched.mw-made-collapsible {
	background-color: var(--bg-sec-emph)
}

/***** Custom Step *****/

/* Dynamic layout for logo */

[class*="SkyrimLE"] .header,
.ns-3010 .header,
.ns-3011 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_sle.jpg) center 25% no-repeat !important
}

[class*="SkyrimSE"] .header,
.ns-3012 .header,
.ns-3013 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_sse.jpg) center 25% no-repeat !important
}

[class*="SkyrimVR"] .header,
.ns-3014 .header,
.ns-3015 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_svr.jpg) center 25% no-repeat !important
}

[class*="Morrowind"] .header,
.ns-3016 .header,
.ns-3017 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_mor.jpg) center 25% no-repeat !important
}

[class*="Oblivion"] .header,
.ns-3018 .header,
.ns-3019 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_obl.jpg) center 25% no-repeat !important
}

[class*="Fallout3"] .header,
.ns-3020 .header,
.ns-3021 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_ft3.jpg) center 25% no-repeat !important
}

[class*="Fallout4"] .header,
.ns-3022 .header,
.ns-3023 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_ft4.jpg) center 25% no-repeat !important
}

[class*="FalloutNV"] .header,
.ns-3024 .header,
.ns-3025 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_ftv.jpg) center 25% no-repeat !important
}

[class*="Morroblivion"] .header,
.ns-3026 .header,
.ns-3027 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_mob.jpg) center 25% no-repeat !important
}

[class*="BeyondSkyrim"] .header,
.ns-3028 .header,
.ns-3029 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_bys.jpg) center 25% no-repeat !important
}

[class*="Skywind"] .header,
.ns-3030 .header,
.ns-3031 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_skw.jpg) center 25% no-repeat !important
}

[class*="Skyblivion"] .header,
.ns-3032 .header,
.ns-3033 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_skb.jpg) center 25% no-repeat !important
}

[class*="NoMansSky"] .header,
.ns-3040 .header,
.ns-3041 .header {
    background: linear-gradient(2deg, rgba(255, 255, 255, .4), rgba(0, 0, 0, .4)), url(/_wiki/skins/step/images/header_classic_nms.jpg) center 25% no-repeat !important
}

/* Guides */

body.cat-Unofficial_Mod-Build_Guides h1,
body.cat-Official_Mod-Build_Guides h1 {
    background: var(--bg-pri-hd)
}

body.cat-Unofficial_Mod-Build_Guides h1 + div,
body.cat-Official_Mod-Build_Guides h1 + div {
    border-bottom: 3px solid var(--bd-pri-emph)
}

body.cat-Unofficial_Mod-Build_Guides h2,
body.cat-Official_Mod-Build_Guides h2 {
    border-bottom: 2px solid var(--bd-pri-emph)
}

body.cat-Unofficial_Mod-Build_Guides h5,
body.cat-Official_Mod-Build_Guides h5 {
    border-bottom: 3px solid var(--bd-pri-emph)
}

body.cat-Unofficial_Mod-Build_Guides hr,
body.cat-Official_Mod-Build_Guides hr {
    color: var(--text-pri-emph);
    background-color: var(--bg-pri-emph)
}

body.cat-Unofficial_Mod-Build_Guides .steptable th,
body.cat-Official_Mod-Build_Guides .steptable th {
    background-color: var(--bg-sec-hd);
    border-bottom: 1px solid var(--bd-dims);
    border-left: 1px solid var(--bd-mid)
}

body.cat-Unofficial_Mod-Build_Guides .steptable td,
body.cat-Official_Mod-Build_Guides .steptable td {
    border-left: 1px solid var(--bd-dims)
}

body.cat-Unofficial_Mod-Build_Guides .steptable th.first,
body.cat-Unofficial_Mod-Build_Guides .steptable th.second,
body.cat-Unofficial_Mod-Build_Guides .steptable th.third,
body.cat-Unofficial_Mod-Build_Guides .steptable th.fourth,
body.cat-Official_Mod-Build_Guides .steptable th.first,
body.cat-Official_Mod-Build_Guides .steptable th.second,
body.cat-Official_Mod-Build_Guides .steptable th.third,
body.cat-Official_Mod-Build_Guides .steptable th.fourth {
    background-color: var(--bg-sec-hd)
}

body.cat-Unofficial_Mod-Build_Guides .steptable th.core,
body.cat-Official_Mod-Build_Guides .steptable th.core {
    background-color: var(--clr-red)
}

body.cat-Unofficial_Mod-Build_Guides .steptable th.landw,
body.cat-Official_Mod-Build_Guides .steptable th.landw {
    background-color: var(--clr-yellow)
}

body.cat-Unofficial_Mod-Build_Guides .steptable th.pp,
body.cat-Official_Mod-Build_Guides .steptable th.pp {
    background-color: var(--clr-green)
}

body.cat-Unofficial_Mod-Build_Guides .steptable th.enb,
body.cat-Official_Mod-Build_Guides .steptable th.enb {
    background-color: var(--clr-blue)
}

body.cat-Unofficial_Mod-Build_Guides .steptable .detailed,
body.cat-Official_Mod-Build_Guides .steptable .detailed {
    background-color: var(--bg-sec)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow03-Resources,
body.cat-Unofficial_Mod-Build_Guides .steptablerow10-Gameplay-General,
body.cat-Official_Mod-Build_Guides .steptablerow03-Resources,
body.cat-Official_Mod-Build_Guides .steptablerow10-Gameplay-General {
    border-bottom: 1px solid var(--clr-mute-purple)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow09-Fixes,
body.cat-Unofficial_Mod-Build_Guides .steptablerow16-Interface,
body.cat-Official_Mod-Build_Guides .steptablerow09-Fixes,
body.cat-Official_Mod-Build_Guides .steptablerow16-Interface {
    border-bottom: 1px solid var(--clr-mute-magent)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow05-Animation.and.Physics,
body.cat-Unofficial_Mod-Build_Guides .steptablerow13-Gameplay-Immersion,
body.cat-Unofficial_Mod-Build_Guides .steptablerow21-Post-Processing,
body.cat-Official_Mod-Build_Guides .steptablerow05-Animation.and.Physics,
body.cat-Official_Mod-Build_Guides .steptablerow13-Gameplay-Immersion,
body.cat-Official_Mod-Build_Guides .steptablerow21-Post-Processing {
    border-bottom: 1px solid var(--clr-mute-blue)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow04-Foundation,
body.cat-Unofficial_Mod-Build_Guides .steptablerow06-Models.and.Textures,
body.cat-Unofficial_Mod-Build_Guides .steptablerow14-Gameplay-Quests,
body.cat-Official_Mod-Build_Guides .steptablerow04-Foundation,
body.cat-Official_Mod-Build_Guides .steptablerow06-Models.and.Textures,
body.cat-Official_Mod-Build_Guides .steptablerow14-Gameplay-Quests {
    border-bottom: 1px solid var(--clr-mute-green)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow07-Sounds.and.Music,
body.cat-Unofficial_Mod-Build_Guides .steptablerow15-Gameplay-Skills.and.Perks,
body.cat-Official_Mod-Build_Guides .steptablerow07-Sounds.and.Music,
body.cat-Official_Mod-Build_Guides .steptablerow15-Gameplay-Skills.and.Perks {
    border-bottom: 1px solid var(--clr-mute-chartr)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow01-Tools,
body.cat-Unofficial_Mod-Build_Guides .steptablerow11-Gameplay-AI.and.Combat,
body.cat-Unofficial_Mod-Build_Guides .steptablerow19-Utilities,
body.cat-Unofficial_Mod-Build_Guides .steptablerow20-Patches,
body.cat-Official_Mod-Build_Guides .steptablerow01-Tools,
body.cat-Official_Mod-Build_Guides .steptablerow11-Gameplay-AI.and.Combat,
body.cat-Official_Mod-Build_Guides .steptablerow19-Utilities,
body.cat-Official_Mod-Build_Guides .steptablerow20-Patches {
    border-bottom: 1px solid var(--clr-mute-yellow)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow08-Character.Appearance,
body.cat-Unofficial_Mod-Build_Guides .steptablerow18-Lighting.and.Weather,
body.cat-Official_Mod-Build_Guides .steptablerow08-Character.Appearance,
body.cat-Official_Mod-Build_Guides .steptablerow18-Lighting.and.Weather {
    border-bottom: 1px solid var(--clr-mute-orange)
}

body.cat-Unofficial_Mod-Build_Guides .steptablerow02-Extenders,
body.cat-Unofficial_Mod-Build_Guides .steptablerow12-Gameplay-Economy,
body.cat-Unofficial_Mod-Build_Guides .steptablerow17-Locations,
body.cat-Official_Mod-Build_Guides .steptablerow02-Extenders,
body.cat-Official_Mod-Build_Guides .steptablerow12-Gameplay-Economy,
body.cat-Official_Mod-Build_Guides .steptablerow17-Locations {
    border-bottom: 1px solid var(--clr-mute-red)
}

/* Mod recommendations */

.listtable ul {
    background-color: var(--bg-sec)
}

.listtable ul:before,
ul:after {
    border: 1px solid var(--bd-dims)
}

.listtable ul:before {
    background-color: var(--bg-pri-hd);
    border: 1px solid var(--bd-cont-l)
}

.listtable ul:after {
    background-color: var(--bg-pri-hd);
    border: 1px solid var(--bd-cont-l)
}

.listtable li {
    border: 1px solid var(--bd-dims)
}

/* Mod Version Recommendations */

.custom-recommendations {
    background-color: var(--bg-sec)
}

/* MP Game Tiles */

.gametiles p img {
    border: 1px solid var(--bd-dims)
}

/* Game Pages */

.pageHeader {
    background-color: var(--bg-sec-hd)
}

.pageHeader .pageSubHeaderPortal {
    background-color: var(--bg-pri-hd)
}

.pageHeader .pageSubHeader {
    background-color: var(--bg-pri-hd);
    color: var(--bd-dimr1)
}

.guideVersion {
    border-bottom: 1px solid var(--bd-dims);
    border-top: 1px solid var(--bd-dims)
}

.gamehometablecolumnheading {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset;
    color: var(--text-pri) !important
}

.gamehometablerow {
    color: var(--bd-dimr1)
}

.gamehometablerow h4 {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset;
    color: var(--text-pri) !important
}

/* Template:Alert (AlertSmall) */

.stepalert {
    box-shadow: 0 0 15px -2px var(--bg-cont);
    border: 2px solid var(--bd-dim)
}

.stepalert a {
    color: var(--text-lnk-bt)
}

.stepalert a:hover {
    color: var(--text-lnk-hov-bt)
}

.stepalert a[href].external:visited,
.stepalert a:visited {
    color: var(--text-lnk-vis-bt)
}

.stepalert a[href].external:visited:hover,
.stepalert a:visited:hover {
    color: var(--text-lnk-vis-hov-bt)
}

.alert-warning,
.warningbox,
div.warning {
    color: var(--bd-dims) !important;
    background: var(--clr-yellow) !important;
    border-color: var(--clr-mute-yellow) !important
}

/* Template:CategoryModList */

.categorymodlist {
    border: 1px solid var(--bg-pri-emph);
    background: var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset
}

.modnamehd {
    color: var(--clr-orange)
}

.categorymodlist .dimtext {
    color: var(--bd-dimr1)
}

/* Template:Fomod */

table.fomod,
.fomod {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset
}

.fomod li,
table.fomod li {
    background-color: var(--bg-pri);
    border-color: var(--bd-adj-dn)
}

.fomod li li,
table.fomod li li {
    background-color: var(--bg-sec);
    border-color: var(--bd-adj-dn)
}

.fomod li li li li,
table.fomod li li li li {
    background-color: var(--btn);
    border-color: var(--btn);
    color: var(--btn-text)
}

/* Template:Mod */

.modheading {
    background: var(--bg-sec-hd);
    box-shadow: 0 0 3px 1px var(--bd-emph-shd)
}

.modheading>h1 {
    border-bottom: 2px solid var(--bd-pri-emph-emph) !important
}

.modsubheading {
    color: var(--bd-dimr1)
}

.modbox {
    background-color: var(--bg-sec-hd);
    box-shadow: 0 0 5px 1px var(--bd-emph-shd)
}

.infobox .infoattr,
.modbox .infoattr {
    color: var(--bd-dimr1)
}

.infosec {
    border-top: 1px solid var(--bd-pri-emph-emph)
}

/* Template:Spoiler */

.spoiler {
    background: var(--bg-pri-emph);
    border: 1px dotted var(--bd-foc-shd);
    padding: .25em;
    margin-bottom: 1em
}

.spoiler:hover {
	background: var(--bg-menu-hov)
}

.spoiler-content {
    background: var(--bg-sec);
    border: 1px dotted var(--bd-foc-shd);
    color: var(--text-sec)
}

/* Template:CollapsibleTable */

.stepCaption {
    background: var(--bg-pri-emph);
    border-top: 1px dotted var(--bd-foc-shd);
    border-right: 1px dotted var(--bd-foc-shd);
    border-left: 1px dotted var(--bd-foc-shd)
}

.stepCaption>caption {
    color: var(--text-sec)
}

.stepCaption .mw-customtoggle {
    border-bottom: 1px dotted var(--bd-foc-shd)
}

.stepTitle {
    color: var(--bd-pri-emph)
}

/* tooltip container */
.stepCaption .stepTooltip {
    position: relative
}

.stepCaption .stepTooltip:hover {
	background: var(--bg-menu-hov)
}

/* tooltip text */
.stepCaption .stepTooltip .stepTooltipToggle {
	background-color: var(--bd-pri-emph);
	color: var(--text-contr-l)
}

/* show the tooltip text on hover over cell */
.stepContent {
    background: var(--bg-sec);
    border: 1px dotted var(--bd-foc-shd);
    color: var(--text-sec)
}

/* Template:PageHeader */

.pagetitle {
    border-bottom: 1px solid var(--bd-pri-emph)
}

.pagetitle .pagetitle-title {
    color: var(--text-sec)
}

/* Template:Sidebox */

.sideBox {
    border: 1px solid var(--bd-adj-dn);
    box-shadow: 0 0 20px 20px var(--bd-adj-dn) inset
}

.sideBoxHeader {
    color: var(--clr-orange)
}

/* Template:SystemSpecs */

.systemspecs {
    background-color: var(--bg-pri-emph);
    border: 1px solid var(--bg-pri-emph);
    box-shadow: 0 0 2px var(--bd-pri-emph-shd) inset;
    color: var(--text-pri) !important
}

/***** Extensions *****/

/* CategoryTree */

.CategoryTreeToggle {
    color: var(--bd-pri-emph)
}

/* SMW */

.mw-body-content .smw-tabs input.nav-tab:checked + label.nav-label {
    background-color: var(--bg-pri);
    color: var(--text-sec);
    border: 1px solid var(--bd-widg);
    border-top: 2px solid var(--bd-pri-emph);
    border-bottom: 2px solid var(--bd-widg)
}

#tab-content-general input[type="submit"],
#tab-content-maintenance input[type="submit"],
#tab-content-supplement input[type="submit"] {
    color: var(--btn-text);
    background-color: var(--btn);
    border: 1px solid var(--btn)
}

#tab-content-general input[type="submit"]:hover,
#tab-content-maintenance input[type="submit"]:hover,
#tab-content-supplement input[type="submit"]:hover {
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%)
}

.smw-column-header {
    color: var(--text-pri)
}

#formatSelector,
[name="order_num[]"],
[name="p[headers]"],
[name="p[link]"],
input[name="date"] {
    background-color: var(--bg-pri-hd) !important;
    color: var(--text-sec) !important;
    border: 1px solid var(--bd-dim) !important
}

input[name="date"] {
    background-color: var(--bg-field-hov) !important;
    border-color: var(--bd-pri-emph) !important
}

input[name="date"] {
    box-shadow: 0 0 5px var(--bd-foc-shd) !important;
    border-color: var(--bd-pri-emph) !important
}

.smw-ask-toplinks,
.smwb-theme-light .smwb-title {
    background-color: var(--bg-pri-emph) !important
}

.smw-callout-warning,
.smwb-theme-light .smwb-actions,
.smwb-theme-light .smwb-center,
.smwb-theme-light .smwb-prophead,
.smwb-theme-light .smwb-propval {
    background-color: var(--bg-sec) !important
}

.smwb-factbox .smwb-cell,
.smwb-ifactbox .smwb-cell {
    border-top: 1px solid var(--bd-dimr1)
}

.smw-factbox input.nav-tab:checked + label.nav-label {
    background: var(--bg-sec) !important;
    border-top: 2px solid var(--bd-pri-emph) !important;
    border-right: 1px solid var(--bg-sec) !important;
    border-bottom: 1px solid var(--bg-sec) !important;
    border-left: 1px solid var(--bg-sec) !important;
    color: var(--bd-dimr1)
}

.smw-factbox .smwfact {
    background-color: var(--bg-sec);
    color: var(--text-pri) !important;
    border: 1px solid var(--bg-sec)
}

.smwfact .smw-table-row:nth-child(2n) {
    background-color: var(--bg-pri)
}

.smwfact .smw-table-row:nth-child(2n + 1) {
    background-color: var(--bg-sec)
}

.smw-ask-options-row-odd {
    background: var(--bg-sec) !important
}

.smw-ask-options-row-even {
    background: var(--bg-sec-emph)
}

#options-toggle:not(:checked) + #options-list .options-parameter-list::after {
    background-image: linear-gradient(to bottom, var(--bg-body), var(--bg-body) 90%)
}

.smw-tabs .subtab-content,
.smw-tabs section {
    border-color: var(--bd-dims)
}

.smw-ui-pagination .page-link,
.smw-ui-pagination .page-link.link-disabled {
    border-color: var(--bd-dim)
}

.smw-ui-pagination .page-link.link-active {
    border: 2px solid var(--bd-pri-emph)
}

.smw-special-filter-button {
    border: 1px solid var(--bd-dim)
}

.smw-special-filter-button:hover {
    background: 0 0;
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%) !important
}

.smw-callout-info {
    background: var(--bg-sec);
    border-left: 5px solid var(--bd-pri-emph)
}

.smwtable-striped tbody>tr:nth-child(2n + 1) {
    background-color: var(--bg-sec)
}

.smwtable-clean tbody>tr:nth-child(2n) {
    background-color: var(--bg-sec-emph)
}

.smwtable-clean tr>td {
    border-top: 1px solid var(--bd-cont-l)
}

.smw-property-page-results .header-title {
    background-color: var(--bg-pri-hd)
}

.smw-property-page-results .header-row>.header-title {
    border-bottom: 1px solid var(--bd-code-shd)
}

.smw-property-page-results .header-title {
    color: var(--bd-dimr1) !important
}

.smw-ui-input-filter {
    background-color: var(--bg-pri-hd) !important;
    color: var(--text-lnk) !important;
    border-color: var(--bd-adj-dn) !important
}

.smw-ui-input-filter input {
    border-left: 1px solid var(--bd-dimr1) !important;
    color: var(--bd-dimr1) !important
}

.smw-ui-pagination .page-link {
    color: var(--text-pri);
    background-color: var(--bg-pri-hd) !important;
    border-color: var(--bd-adj-dn) !important
}

.smw-ui-pagination:hover .page-link:hover {
    background-color: var(--bg-menu-hov) !important;
    border-color: var(--bd-adj-dn) !important
}

.smw-ui-pagination .page-link.link-active {
    background-color: var(--bg-sec-hd) !important;
    border-color: var(--bd-adj-dn) !important
}

.smwfact {
    background-color: var(--bg-sec) !important;
    border-color: var(--bd-dims) !important
}

.item-count,
.usage-count {
    color: var(--text-pri) !important;
    background-color: var(--bg-pri-emph) !important;
    border: 1px solid var(--bd-pri-emph-shd) !important
}

.smw-property input.nav-tab:checked + label#tab-label-smw-property-constraint.nav-label {
    border-top: 2px solid var(--bd-pri-emph)
}

.smwpre {
    color: var(--bd-dimr1) !important;
    background-color: var(--bg-pri-hd);
    border-color: var(--bd-mid);
    box-shadow: 0 0 5px var(--bg-cont) inset
}

.smw-jsonview-menu {
    background-color: var(--bg-pri-emph) !important;
    border-left: 1px solid var(--bd-adj-dn) !important;
    border-top: 1px solid var(--bd-adj-dn) !important;
    border-right: 1px solid var(--bd-adj-dn) !important
}

.smw-jsonview-menu + pre {
    background-color: var(--bg-pri-hd) !important
}

.smw-jsonview-button-group-left input {
    border: 1px solid var(--text-pri-emph)
}

#smw-jsonview-copy-btn,
#smw-jsonview-toggle-btn {
    background-color: var(--bd-dimr1);
    border: 1px solid var(--bg-pri-emph)
}

#smw-jsonview-copy-btn:hover,
#smw-jsonview-toggle-btn:hover {
    background-color: var(--text-sec)
}

.smw-json-container>.jsonview .string {
    color: var(--clr-green) !important
}

.smw-json-container>.jsonview .prop {
	color: var(--clr-magent)
}

#mw-prefsection-smw .oo-ui-fieldsetLayout-header .oo-ui-labelElement-label {
    color: var(--text-sec)
}

fieldset#mw-prefsection-smw-general-options,
fieldset#mw-prefsection-smw-extended-search-options,
fieldset#mw-prefsection-smw-srf-eventcalendar-options,
fieldset#mw-prefsection-smw-srf-datatables-options,
fieldset#mw-prefsection-smw-ask-options,
fieldset#mw-prefsection-smw-srf {
    border-top: 1px solid var(--bd-dim)
}

#ask-help>.smw-modal-content {
	background-color: var(--bg-sec-emph);
	border: 1px solid var(--bd-dpdn-shd);
	box-shadow: 0 0 18px var(--bd-emph-shd)
}

#ask-help>.smw-modal-content>.smw-modal-header {
	border-bottom: 1px solid var(--bg-sec-hd);
	background-color: var(--bg-sec-hd)
}

#ask-help>.smw-modal-content>.smw-modal-header>.smw-modal-title {
	color: var(--text-sec)
}

#ask-help>.smw-modal-content>.smw-modal-header>.smw-modal-close:hover {
	color: var(--text-sec)
}

div#ask fieldset,
.smw-ask-search fieldset,
.smw-ask-format fieldset,
.smw-ask-options fieldset {
	border: 1px solid var(--text-pri)
}

.smw-ui-pagination .page-link:hover {
	color: var(--text-lnk-hov)
}

/* Semantic Drilldown */

.mw-body-content #drilldown-categories-wrapper {
	background: var(--bg-pri)
}

.mw-body-content li#categories-header {
	background: var(--bg-sec-hd)
}

.mw-body-content ul#drilldown-categories li.category {
	border-top: 1px var(--bd-dims) solid;
	background: var(--bg-pri)
}

.mw-body-content ul#drilldown-categories li.category:hover {
	background-color: var(--bd-dpdn-shd) !important
}

.mw-body-content ul#drilldown-categories {
	border: 2px var(--bd-dims) solid
}


/* Replace Text */

#powersearch input[type="submit"],
.mw-replacetext-invert {
    color: var(--btn-text);
    background-color: var(--btn);
    border-color: var(--btn)
}

#powersearch input[type="submit"]:hover,
.mw-replacetext-invert:hover {
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%) !important
}

#checkusersubmit,
.mw-htmlform-submit {
    color: var(--btn-text);
    background-color: var(--btn);
    border-color: var(--btn)
}

#checkusersubmit:hover,
.mw-htmlform-submit:hover {
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%)
}

#checkuserform #period {
    background-color: var(--bg-pri-hd) !important;
    color: var(--text-sec) !important;
    border: 1px solid var(--bd-dim) !important
}

/***** Page Forms *****/

/* Multiple instance */

.multipleTemplateInstanceTable .inputSpan input[id*="input"] {
    background: var(--bg-pri-hd) !important;
    color: var(--text-pri) !important;
    border-color: var(--bd-adj-dn) !important
}

.multipleTemplateInstanceTable .inputSpan:hover {
    background-color: var(--bg-pri-hd) !important
}

.multipleTemplateInstanceTable .inputSpan:focus {
    box-shadow: 0 0 5px var(--bd-foc-shd) !important;
    border-color: var(--bd-pri-emph) !important
}

.multipleTemplateInstance {
    background-color: var(--bg-pri-emph) !important;
    border: 1px solid var(--bg-pri-emph) !important
}

option {
    background-color: var(--bg-pri-hd);
    color: var(--text-pri)
}

option:checked {
    background-color: var(--bg-pri-hd) !important
}

/* Option sets */

#category_dropdown,
#formSelector,
#form_dropdown,
#mainTable td select[name*="property_type"],
#property_dropdown,
#sectionname,
#semantic_property_aggregation,
.inputTypeSelector,
.inputSpan>select[id*="input"],
[id*="semantic_property"],
[name*="before"] {
    background-color: var(--bg-pri-hd);
    color: var(--text-pri);
    border: 1px solid var(--bd-dim)
}

/* Token & Other fields */

.pf-select2-container [id*="select2-input"] {
    border: none !important
}

.select2-container--default .select2-selection--multiple,
.select2-container--default .select2-selection--single,
.select2-dropdown,
.select2-search--dropdown .select2-search__field {
    background: var(--bg-pri-hd) !important;
    border-color: var(--bd-adj-dn) !important;
    color: var(--text-pri)
}

.select2-dropdown:hover,
.select2-search--dropdown .select2-search__field:hover {
    background-color: var(--bg-pri-hd) !important
}

.select2-dropdown:focus,
.select2-search--dropdown .select2-search__field:focus {
    box-shadow: 0 0 5px var(--bd-foc-shd) !important;
    border-color: var(--bd-pri-emph) !important
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: var(--bd-pri-emph)
}

.pf-select2-dropdown .select2-results__options .select2-results__option--highlighted {
    background-color: var(--bg-menu-hov)
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--btn) !important;
    border: 1px solid var(--btn) !important;
    color: var(--btn-text)
}

.select2-container--default .select2-search--inline .select2-search__field,
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--text-pri)
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: var(--text-pri-emph)
}

/* Form input */

#ooui-php-2 {
    background-color: var(--bg-sec)
}

#allowed_values input[name="values"],
#ask-query-condition,
#checkreason,
#checktarget,
#createClassForm input,
#id.smw-form-input,
#mainTable [name*="field_name"],
#mainTable td input[name*="allowed_values"],
#mainTable td input[name*="property_name"],
#month,
#mw-checkuser-cidr-res,
#mw-import-comment,
#mw-input-cuSearch,
#mw-interwiki-rootpage-upload,
#mw-searchoptions input[name="category"],
#mw-searchoptions input[name="prefix"],
#mw-userrights-form1 #username,
#sectionname,
#smw-jsonview-search,
#smw-property-input,
#smw-value-input,
#sort_div_0 [class="smw-property-input autocomplete-arrow"],
#usernamePrefix,
#wikieditor-toolbar-replace-replace,
#wikieditor-toolbar-replace-search,
#wpDestFile,
#wpReason,
#year,
.ext-replacetext-searchoptions input[name="category"],
.ext-replacetext-searchoptions input[name="prefix"],
.inputSpan>[id*="input"],
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
.mw-ui-checkbox [type="checkbox"] + label::before,
.mw-ui-checkbox:not(#noop) [type="checkbox"] + label::before,
.mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked + label::before,
.mw-ui-input,
.mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle,
.oo-ui-checkboxInputWidget [type="checkbox"] + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate + span,
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled,
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle,
.oo-ui-radioInputWidget [type="radio"] + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:indeterminate + span,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined .oo-ui-tagMultiselectWidget-handle,
.oo-ui-textInputWidget .oo-ui-inputWidget-input,
.select2-selection--single .select2-match-entire,
.sitedir-ltr input[name="dest"],
.sitedir-ltr input[name="target"],
.smw-table-cell [class="parameter-number-input"],
.smw-table-cell [class="parameter-string-input"],
[name="threshold"],
form select,
input#wpSummary {
    background-color: var(--bg-pri-hd) !important;
    color: var(--text-pri) !important
}

#allowed_values input[name="values"]:hover,
#ask-query-condition:hover,
#checkreason:hover,
#checktarget:hover,
#createClassForm input:hover,
#id.smw-form-input:hover,
#mainTable [name*="field_name"]:hover,
#mainTable td input[name*="allowed_values"]:hover,
#mainTable td input[name*="property_name"]:hover,
#month:hover,
#mw-checkuser-cidr-res:hover,
#mw-import-comment:hover,
#mw-input-cuSearch:hover,
#mw-interwiki-rootpage-upload:hover,
#mw-searchoptions input[name="category"]:hover,
#mw-searchoptions input[name="prefix"]:hover,
#mw-userrights-form1 #username:hover,
#sectionname:hover,
#smw-jsonview-search:hover,
#smw-property-input:hover,
#smw-value-input:hover,
#sort_div_0 [class="smw-property-input autocomplete-arrow"]:hover,
#usernamePrefix:hover,
#wikieditor-toolbar-replace-replace:hover,
#wpDestFile:hover,
#wpReason:hover,
#wpReason:hover,
#year:hover,
.ext-replacetext-searchoptions input[name="category"]:hover,
.ext-replacetext-searchoptions input[name="prefix"]:hover,
.inputSpan>[id*="input"]:hover,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle:hover,
.mw-ui-checkbox [type="checkbox"]:hover + label::before,
.mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked:hover + label::before,
.mw-ui-checkbox:not(#noop) [type="checkbox"]:hover + label::before,
.mw-ui-input:hover,
.mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle:hover,
.oo-ui-checkboxInputWidget [type="checkbox"]:hover + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked:hover + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate:hover + span,
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover,
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover,
.oo-ui-radioInputWidget [type="radio"]:hover + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span:hover + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:indeterminate:hover + span,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled:hover,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle,
.oo-ui-textInputWidget .oo-ui-inputWidget-input:hover,
.select2-selection--single .select2-match-entire:hover,
.sitedir-ltr input[name="dest"]:hover,
.sitedir-ltr input[name="target"]:hover,
.smw-table-cell [class="parameter-number-input"]:hover,
.smw-table-cell [class="parameter-string-input"]:hover,
[name="threshold"]:hover,
form select:hover,
input#wpSummary:hover {
    background-color: var(--bg-field-hov) !important
}

#allowed_values input[name="values"]:focus,
#ask-query-condition:focus,
#checkreason:focus,
#checktarget:focus,
#createClassForm input:focus,
#id.smw-form-input:focus,
#mainTable [name*="field_name"]:focus,
#mainTable td input[name*="allowed_values"]:focus,
#mainTable td input[name*="property_name"]:focus,
#month:focus,
#mw-checkuser-cidr-res:focus,
#mw-import-comment:focus,
#mw-input-cuSearch:focus,
#mw-interwiki-rootpage-upload:focus,
#mw-searchoptions input[name="category"]:focus,
#mw-searchoptions input[name="prefix"]:focus,
#mw-userrights-form1 #username:focus,
#sectionname:focus,
#smw-jsonview-search:focus,
#smw-property-input:focus,
#smw-value-input:focus,
#sort_div_0 [class="smw-property-input autocomplete-arrow"]:focus,
#usernamePrefix:focus,
#wikieditor-toolbar-replace-replace:focus,
#wikieditor-toolbar-replace-search:focus,
#wpDestFile:focus,
#wpReason:focus,
#year:focus,
.ext-replacetext-searchoptions input[name="category"]:focus,
.ext-replacetext-searchoptions input[name="prefix"]:focus,
.inputSpan>[id*="input"]:focus,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle:focus,
.mw-ui-checkbox [type="checkbox"]:focus + label::before,
.mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked:focus + label::before,
.mw-ui-checkbox:not(#noop) [type="checkbox"]:focus + label::before,
.mw-ui-input:focus,
.mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle:focus,
.oo-ui-checkboxInputWidget [type="checkbox"]:focus + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked:focus + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate:focus + span,
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled:focus,
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus,
.oo-ui-radioInputWidget [type="radio"]:focus + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span:focus + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:indeterminate:focus + span,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled:focus,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:focus .oo-ui-tagMultiselectWidget-handle,
.oo-ui-textInputWidget .oo-ui-inputWidget-input:focus,
.select2-selection--single .select2-match-entire:focus,
.sitedir-ltr input[name="dest"]:focus,
.sitedir-ltr input[name="target"]:focus,
.smw-table-cell [class="parameter-number-input"]:focus,
.smw-table-cell [class="parameter-string-input"]:focus,
[name="threshold"]:focus,
form select:focus,
input#wpSummary:focus {
    box-shadow: 0 0 5px var(--bd-foc-shd) !important
}

/* gray out disabled inputs */
.oo-ui-checkboxInputWidget [type="checkbox"]:disabled + span,
.oo-ui-dropdownInputWidget.oo-ui-widget-disabled,
.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle,
.oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle {
    opacity: .5;
    color: var(--bd-dimr1) !important;
    background: var(--bg-pri-hd) !important
}

/* keep checked items highlighted */
.mw-ui-checkbox:not(#noop) [type="checkbox"]:enabled:checked + label::before,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span {
    border: 1px solid var(--bd-pri-emph) !important
}

.oo-ui-menuSelectWidget {
    background: var(--bg-pri-hd) !important;
    border: 1px solid var(--bd-dim)
}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
	background-color: var(--bg-pri-hd)
}

/* exceptions for search bar */
#searchInput {
    border-color: var(--bd-cont-l) !important;
    background-color: var(--bg-pri-hd) !important
}

#searchInput:focus {
    border: 1px solid var(--bd-cont-l) !important;
    color: var(--bd-dim) !important
}

.oo-ui-checkboxInputWidget [type="checkbox"] + span,
.oo-ui-radioInputWidget [type="radio"] + span {
    background-color: var(--bg-pri-hd) !important
}

.oo-ui-checkboxInputWidget [type="checkbox"]:hover + span,
.oo-ui-radioInputWidget [type="radio"]:hover + span {
    border: 1px solid var(--bd-pri-emph) !important
}

.oo-ui-checkboxInputWidget [type="checkbox"]:focus + span,
.oo-ui-radioInputWidget [type="radio"]:focus + span {
    border-color: var(--bd-pri-emph) !important;
    box-shadow: 0 0 5px var(--bd-foc-shd) !important
}

.oo-ui-checkboxInputWidget [type="checkbox"]:disabled + span {
    border-color: var(--bd-adj-dn)
}

.oo-ui-checkboxInputWidget [type="checkbox"]:disabled:hover + span {
    border: 1px solid var(--bd-adj-dn) !important
}

.mw-ui-checkbox:not(#noop) [type="checkbox"] + label::before,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked:hover + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate:hover + span {
    border-color: var(--bd-pri-emph) !important
}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:indeterminate + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span:hover + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:indeterminate:hover + span {
    border: 3px solid var(--bd-pri-emph) !important
}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked:focus + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate:focus + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:checked + span:focus + span,
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type="radio"]:indeterminate:focus + span {
    box-shadow: 0 0 5px var(--bd-foc-shd) !important;
    border-color: var(--bd-pri-emph) !important
}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:hover + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:focus + span,
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:active + span,
.mw-ui-checkbox [type="checkbox"]:enabled:hover + label::before,
.mw-ui-checkbox [type="checkbox"]:enabled:focus + label::before,
.mw-ui-checkbox [type="checkbox"]:enabled:active + label::before {
	box-shadow: inset 0 0 0 1px var(--bd-pri-emph) !important
}

p [type="button"],
td [type="button"] {
    color: var(--btn-text) !important;
    background: var(--btn) !important;
    border: 1px solid var(--btn) !important
}

p [type="button"]:hover,
td [type="button"]:hover {
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%) !important
}

.fieldBox {
    border: 1px var(--bd-dim) solid !important;
    background: var(--bg-sec) !important
}

div.popupform-container {
    background-color: var(--bg-pri-hd) !important;
    border: 2px solid var(--text-contr-d) !important
}

[name*="Recommendations"],
[name*="Recommendations"]:hover,
[name*="Recommendations"]:focus {
    background-color: var(--bg-sec-hd) !important;
    color: var(--text-editor) !important
}

.formtip {
    color: var(--clr-chartr)
}

.formheading {
    color: var(--clr-orange)
}

/* HeaderTabs */

.ui-widget-header {
    border: 1px solid var(--bg-sec-hd) !important;
    background: var(--bg-sec-hd) !important;
    color: var(--bd-dimr1)
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    background: var(--bg-sec) !important;
    border-top: 2px solid var(--bd-pri-emph) !important;
    border-right: 1px solid var(--bg-sec) !important;
    border-bottom: 1px solid var(--bg-sec) !important;
    border-left: 1px solid var(--bg-sec) !important
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active a {
    color: var(--text-pri) !important
}

.ui-tabs .ui-tabs-nav li {
    background: var(--bg-sec-hd);
    border-top: 2px solid var(--bd-dimr1);
    border-right: 1px solid var(--bg-sec-hd);
    border-bottom: 1px solid var(--bg-sec-hd);
    border-left: 1px solid var(--bg-sec-hd)
}

.ui-tabs .ui-tabs-nav li a {
    color: var(--bd-dimr1) !important
}

.ui-tabs .ui-tabs-nav li a:hover {
    color: var(--bd-dimr1) !important;
    background-color: var(--bg-sec) !important
}

#ooui-php-2 {
	background-color: var(--bg-sec)
}

/* Cite */

.mw-references-wrap {
    font-size: 80%;
    border-top: 1px solid var(--bd-dims)
}

ol.references li:target,
sup.reference:target {
    background-color: var(--bg-menu-hov)
}

.jexcel {
    background-color: var(--bg-sec) !important;
    border-right: 1px solid var(--bd-dimr1) !important;
    border-bottom: 1px solid var(--bd-dimr1) !important
}

.jexcel>thead>tr>td {
    border-top: 1px solid var(--bd-adj-dn) !important;
    border-left: 1px solid var(--bd-adj-dn) !important;
    background-color: var(--bg-sec-hd) !important
}

.jexcel>tbody>tr>td:first-child {
    background-color: var(--bg-sec-hd) !important
}

.jexcel>tbody>tr>td {
    border-top: 1px solid var(--bd-adj-dn) !important;
    border-left: 1px solid var(--bd-adj-dn) !important
}

.jexcel>tbody>tr.dragging>td {
    background-color: var(--bg-sec-emph) !important
}

.jexcel_corner {
    border: 1px solid var(--bd-dimr1) !important
}

.jexcel_page_selected {
    background-color: var(--bg-sec-hd) !important
}

.jexcel>tbody>tr.selected>td:first-child {
    background-color: var(--bg-pri-hd) !important
}

.jexcel .highlight-top.highlight-left {
    -webkit-box-shadow: -1px -1px var(--bd-pri-emph) !important;
    -moz-box-shadow: -1px -1px var(--bd-pri-emph) !important;
    box-shadow: -1px -1px var(--bd-pri-emph) !important
}

.jexcel .highlight-bottom {
    border-bottom: 1px solid var(--bd-adj-dn) !important
}

.jexcel .highlight-right {
    border-right: 1px solid var(--bd-adj-dn) !important
}

.jexcel .highlight-left {
    border-left: 1px solid var(--bd-adj-dn) !important;
    box-shadow: -1px 0 var(--bd-pri-emph) !important
}

.jexcel .highlight-top {
    border-top: 1px solid var(--bd-adj-dn) !important;
    box-shadow: 0 -1px var(--bd-pri-emph) !important
}

.jexcel>thead>tr>td.selected {
    background-color: var(--bd-pri-emph) !important
}

.mw-mmv-post-image {
	color: var(--text-sec)!important;
	background-color: var(--bg-pri-emph)!important
}

.mw-mmv-image-metadata {
	border-top: 1px solid var(--bd-dim);
	background-color: var(--bg-pri-emph)!important
}

.mw-ui-button.mw-ui-progressive:not(:disabled) {
	background-color: var(--btn);
	color: var(--btn-text);
	border-color: var(--btn)
}

.mw_metadata td, .mw_metadata th {
	background-color: var(--bg-pri);
	border: 1px solid var(--bd-dims)
}

.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
	background-color: var(--bg-sec) !important;
	color: var(--text-pri)
}

.tdg-templateDataParamWidget-param-description,
.oo-ui-fieldLayout-disabled > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
	color: var(--text-pri) !important
}

.tdg-templateDataParamWidget-param-alias:first-child {
	background-color: var(--btn) !important
}

.tdg-templateDataParamWidget-param-alias {
	color: var(--btn-text) !important;
	background-color: var(--btn) !important;
	border: solid 1px var(--btn) !important
}

.tdg-templateDataParamWidget-param-alias:hover {
    background-image: linear-gradient(to bottom, var(--btn-hov) 0, var(--bg-menu-hov) 100%) !important
}

.oo-ui-messageDialog-message {
	color: var(--text-pri)
}