MediaWiki:Modern.css

/* Base colors */
:root {
    --primary-color: #2E8B57; /* Sea Green - softer than original */
    --secondary-color: #556B2F; /* Dark Olive Green */
    --accent-color: #DAA520; /* Goldenrod - softer gold */
    --background-light: #FFFDF5; /* Very light cream */
    --text-color: #333333; /* Dark gray instead of pure black */
    --link-color: #1E6F9F; /* Pleasant blue */
    --sidebar-bg: #F5F5F5; /* Light gray */
    --border-color: #DDDDDD; /* Light gray border */
}

/* Modern skin adjustments */
body {
    background-color: var(--primary-color);
    color: var(--text-color);
    font-family: sans-serif;
    line-height: 1.6;
}

#mw_main,
#p-personal,
#mw_header,
.os-suggest {
    font-size: 130%;
}

/* Header */
#mw_header {
    background-color: var(--primary-color);
    color: white;
}

/* Personal toolbar */
#p-personal {
    background-color: var(--primary-color);
    border-bottom: 1px solid var(--border-color);
    border-top: 1px solid var(--border-color);
}

#p-personal ul {
    background-color: var(--primary-color);
}

#p-personal li a {
    color: white;
}

#p-personal li a:hover {
    color: var(--accent-color);
}

#p-personal li:hover {
    background-color: var(--secondary-color);
}

/* Main content */
#content {
    background-color: var(--background-light);
    border: 1px solid var(--border-color);
    color: var(--text-color);
}

/* Sidebar */
#mw_portlets {
    background-color: var(--sidebar-bg);
    border-right: 1px solid var(--border-color);
}

.mw-portlet > label,
.portlet h3 {
    background-color: var(--secondary-color);
    color: white;
    border-color: var(--primary-color);
}

/* Links */
a {
    color: var(--link-color);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a:visited {
    color: #5D3A9B; /* Purple for visited links */
}

/* Tables of contents */
#toc,
.toc {
    background-color: var(--background-light);
    border: 1px solid var(--border-color);
}

/* Footer */
.mw-footer {
    background-color: var(--primary-color);
    color: white;
}

.mw-footer a {
    color: white;
}

/* Code/preformatted text */
pre, .mw-code {
    background-color: #F8F8F8;
    border: 1px solid var(--border-color);
}

/* Buttons and interactive elements */
input[type="submit"],
input[type="button"] {
    background-color: var(--secondary-color);
    color: white;
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
}

/* Improve readability */
p, li {
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--secondary-color);
    line-height: 1.3;
}