MediaWiki:Vector.css

/* ========================================================= */
/* Vector 2022 Dark Mode - Custom Skin Overrides             */
/* ========================================================= */

/* ------------------------------ */
/* 1. Base Page & Backgrounds */
/* ------------------------------ */

body,
#mw-head-base,
#mw-page-base {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
}

/* ------------------------------ */
/* 2. Links */
/* ------------------------------ */

a {
    color: #7aa06e !important;
}
a:visited {
    color: #cccccc !important;
}
a:hover {
    color: #a3be8c !important;
}
a.new {
    color: #ffff00 !important;
}

/* ------------------------------ */
/* 3. Content Area */
/* ------------------------------ */

#content,
.vector-body {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

#content h1, #content h2, #content h3,
#content h4, #content h5, #content h6 {
    color: #f0f0f0 !important;
}

#content p, #content ul, #content ol,
#content li, #content dl, #content dd,
#content dt, #content div {
    color: #e0e0e0 !important;
}

#content a, .vector-body a {
    color: #7aa06e !important;
}
#content a:visited {
    color: #cccccc !important;
}
#content a:hover {
    color: #a3be8c !important;
}

/* ------------------------------ */
/* 3.a Custom bullets inside article content only */
/* ------------------------------ */

.ns-0 #content ul,
.ns-0 #content ol {
    list-style: none;
    padding-left: 1.5em;
}

.ns-0 #content ul li::before {
    content: "•";
    color: #7aa06e;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

/* ------------------------------ */
/* 4. Sidebar & Navigation Panel */
/* ------------------------------ */

#mw-panel {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

#mw-panel ul,
#mw-panel ol {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

#mw-panel div.portal {
    background-color: #1a1a1a !important;
    border-color: #444 !important;
}
#mw-panel div.portal h3 {
    color: #f0f0f0 !important;
    border-color: #444 !important;
}
#mw-panel div.body ul li a {
    color: #7aa06e !important;
}
#mw-panel div.body ul li a:visited {
    color: #cccccc !important;
}
#mw-panel div.body ul li a:hover {
    color: #a3be8c !important;
    background-color: #3a3a3a !important;
}
#mw-panel div.body ul li {
    color: #e0e0e0 !important;
}
#mw-panel li.mw-list-item a {
    color: #7aa06e !important;
}
#mw-panel li.mw-list-item a:visited {
    color: #cccccc !important;
}
#mw-list-item a:hover {
    color: #a3be8c !important;
    background-color: #3a3a3a !important;
}
#mw-panel li.mw-list-item {
    background-color: transparent !important;
    color: #e0e0e0 !important;
}

/* ------------------------------ */
/* 4.b Top-right user/login menu dropdown with spacing restored */
/* ------------------------------ */

#pt-userpage, #pt-anonuserpage,
#pt-login, #pt-logout, #pt-createaccount,
#pt-anontalk, #pt-mytalk, #pt-preferences,
#pt-watchlist, #pt-mycontris, #pt-globalwatchlist,
#pt-myalerts, #pt-messages {
    list-style: none !important;
    padding: 0.25em 0.5em !important;
    margin: 0.1em 0 !important;
    display: inline-block !important;
}

/* ------------------------------ */
/* 5. Top Tabs (Read/Edit/History) */
/* ------------------------------ */

#p-views ul li {
    background-color: #3a3a3a !important;
    border-color: #444 !important;
    background-image: none !important;
}
#p-views ul li a {
    color: #e0e0e0 !important;
    background-image: none !important;
}
#p-views ul li.selected {
    background-color: #2a2a2a !important;
    border-color: #444 !important;
}
#p-views ul li.selected a {
    color: #f0f0f0 !important;
}
#p-views ul li:not(.selected):hover {
    background-color: #4a4a4a !important;
}
#p-views ul li:not(.selected):hover a {
    color: #ffffff !important;
}

/* Vector 2022 Tabs */
.vector-menu-tabs,
.vector-menu-tabs a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
    background-image: none !important;
    background-color: #3a3a3a !important;
    color: #e0e0e0 !important;
}

/* Fix for "more" dropdown carrot color */
#p-cactions-label::after {
    content: "▼";
    color: #e0e0e0 !important;
    margin-left: 0.3em;
    font-size: 0.7em;
    vertical-align: middle;
}

/* ------------------------------ */
/* 6. Header & Logo */
/* ------------------------------ */

#mw-head {
    background-color: #1a1a1a !important;
    border-bottom-color: #444 !important;
}
#mw-wiki-logo {
    background-color: transparent !important;
}

/* ------------------------------ */
/* 7. Footer */
/* ------------------------------ */

#footer {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
}
#footer a {
    color: #7aa06e !important;
}
#footer a:visited {
    color: #cccccc !important;
}
#footer a:hover {
    color: #a3be8c !important;
}
#footer li {
    color: #e0e0e0 !important;
}

/* ------------------------------ */
/* 8. Search Input */
/* ------------------------------ */

#searchInput {
    background-color: #ffffff !important;
    color: #333333 !important;
}
#searchInput::placeholder,
#searchInput::-webkit-input-placeholder,
#searchInput::-moz-placeholder,
#searchInput:-ms-input-placeholder,
#searchInput::-ms-input-placeholder {
    color: #666666 !important;
    opacity: 1 !important;
}

/* ------------------------------ */
/* 9. Table of Contents (TOC) */
/* ------------------------------ */

.mw-toc-heading {
    background-color: transparent !important;
    color: #f0f0f0 !important;
}

/* 9.a TOC Bullet Fix */
#toc ul {
    list-style-type: none !important;
    padding-left: 1.5em !important;
}

/* 9.b Remove custom bullets in TOC */
#toc li::before {
    content: none !important;
    display: none !important;
}

/* 9.c TOC Background + Text Color Fix */
#toc {
    background-color: transparent !important;
    color: #e0e0e0 !important;
    border: 1px solid #444 !important;
}

#toc .toctitle {
    background-color: transparent !important;
    color: #f0f0f0 !important;
    border-bottom: none !important;
}

/* 9.d TOC Heading Fix */
#mw-toc-heading {
    background-color: transparent !important;
    color: #f0f0f0 !important;
    padding: 0.25em 0.5em !important;
    margin: 0 !important;
    font-size: 1.2em !important;
}

/* TOC numbering color fix on hover and normal */
#toc .tocnumber {
    color: #7aa06e !important;
    background-color: transparent !important;
    padding: 0 0.2em;
    border-radius: 2px;
}

#toc li:hover .tocnumber,
#toc li.tocsection-highlight .tocnumber {
    color: #a3be8c !important;
    background-color: transparent !important;
}

/* ------------------------------ */
/* 10. Changes List & Legends */
/* ------------------------------ */

.mw-changeslist,
.mw-changeslist-legend {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}
.mw-changeslist-legend .mw-legend {
    color: #e0e0e0 !important;
}

/* ------------------------------ */
/* 11. Editing Interface */
/* ------------------------------ */

#editform,
#wpTextbox1 {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border: 1px solid #555 !important;
}

.divEditOptions,
.editOptions {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

.divEditOptions input,
.divEditOptions textarea,
.divEditOptions select {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border: 1px solid #555 !important;
}

/* ------------------------------ */
/* 12. Custom Blocks (Optional) */
/* ------------------------------ */

.qme-column {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border: 1px solid #83FCDB !important;
    padding: 1em;
}

.qme-heading {
    background-color: #3a3a3a !important;
    color: #f0f0f0 !important;
    border: 1px solid #444 !important;
}

/* ------------------------------ */
/* 13. MediaWiki Image Caption Fix */
/* ------------------------------ */

.thumbcaption {
    color: #000 !important;
}

/* ------------------------------ */
/* 14. Code Blocks (pre, code, .mw-code) */
/* ------------------------------ */

pre,
code,
tt,
kbd,
samp,
.mw-code {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    border: 1px solid #555 !important;
    padding: 0.5em !important;
}

/* ------------------------------ */
/* 15. OOUI Form Field Label Fix */
/* ------------------------------ */

.oo-ui-labelElement-label {
    color: #333 !important;
}

/* ------------------------------ */
/* 16. Special Pages: Remove extra bullets from search profile tabs */
/* ------------------------------ */

.mw-search-profile-tabs .search-types ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ------------------------------ */
/* 17. Restore Normal Bullets Elsewhere (Optional) */
/* ------------------------------ */

/* Uncomment if needed for specific namespaces:
.ns-500 ul, .ns-500 ol,
.ns-4 ul, .ns-4 ol {
    list-style: disc !important;
    padding-left: 2em !important;
}
*/

/* ------------------------------ */
/* 18. Confirm Account Tables Inversion */
/* ------------------------------ */

.mw-confirmaccount-body-0 {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border: 1px solid #444 !important;
}

.mw-confirmaccount-body-0 td,
.mw-confirmaccount-body-0 th {
    border: 1px solid #555 !important;
    padding: 0.3em 0.5em !important;
    color: #e0e0e0 !important;
    background-color: transparent !important;
}

/* Fix list marker color inside confirm account type lists */
.mw-confirmaccount-type-0::marker {
    color: #7aa06e !important;
}

/* ------------------------------ */
/* 19. Admin Warning Message Inversion */
/* ------------------------------ */

.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt {
    background-color: #5a1a2a !important; /* dark reddish purple */
    color: #f5eaea !important; /* very light pink/white text */
    border: 1px solid #aa6688 !important;
    border-radius: 6px;
    padding: 1em;
    margin: 1em 0;
}

.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt p,
.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt ul,
.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt li {
    color: #f5eaea !important;
}

.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt a {
    color: #ffb3c6 !important; /* light pink for links */
    text-decoration: underline;
}

.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt a:hover {
    color: #ffa6bb !important;
}

.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt .cdx-message__icon {
    filter: brightness(0.8) invert(0.9);
}

.cdx-message.cdx-message--block.cdx-message--warning.mw-warning-with-logexcerpt .cdx-message__content {
    color: inherit !important;
}