MediaWiki:Common.css

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)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* Usually: 1=Day, 2=Night, 3=OS. This hides 1 and 3 */
#skin-client-prefs-skin-theme .citizen-client-prefs-radio:nth-child(1),
#skin-client-prefs-skin-theme .citizen-client-prefs-radio:nth-child(3) {
    display: none !important;
}

/* 2. Force the remaining options (Night/Pure Black) to stack or center */
#skin-client-prefs-skin-theme form { 
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

/* 3. Ensure the 'Pure Black' toggle (if enabled) also stays visible below 'Night' */
#skin-client-prefs-citizen-feature-pure-black {
    margin-top: 10px;
    border-top: 1px solid var(--border-color-base);
    padding-top: 10px;
}

/* DARK MODE: Your Deep Black-Blue branding */
:root.skin-theme-clientpref-night {
    /* Your specific rgb(3, 7, 30) Background */
    --color-surface-0: rgb(3, 7, 30); 
    --color-surface-1: #0a0e24; /* Slightly lighter shade for cards/boxes */
    --color-surface-2: #141831; /* For inputs/search bars */
    
    /* Fire Accent: Based on your rgb(232, 93, 4) */
    --color-progressive-oklch__l: 65.55%;
    --color-progressive-oklch__c: 0.211;
    --color-progressive-oklch__h: 41.5;

    --color-emphasized: #ffffff;
    --color-base: #f2f2f2;
}

/* APPLY YOUR GRADIENT: This applies your specific fire gradient to the top header bar */
.mw-header {
    background: linear-gradient(45deg, rgb(220, 47, 2) 0%, rgb(232, 93, 4) 50%, rgb(250, 163, 7) 100%) !important;
}

/* Fix text color on the gradient header so it stays readable */
.mw-header .cdx-button, .mw-header .citizen-header-links a {
    color: white !important;
}