User:Zigmasdirigeant/vector-2022.css

html.skin-theme-clientpref-night { color-scheme: dark; --color-base: #cfd2d9; /* Light gray for readability */ --color-base--hover: #ffffff; /* White for hover effect */ --color-emphasized: #ffffff; /* White for emphasized text */ --color-subtle: #9099a1; /* Subtle gray */ --color-inverted: #121212; /* Almost black for inverted text */ --color-progressive: #00ffff; /* Neon blue for progressive actions */ --color-progressive--hover: #00ccff; /* Lighter neon blue for hover */ --color-progressive--active: #0099cc; /* Even lighter neon blue for active state */ --color-destructive: #ff0044; /* Bright neon red for destructive actions */ --color-destructive--hover: #ff3366; /* Lighter neon red for hover */ --color-destructive--active: #ff6699; /* Even lighter neon red for active state */ --color-visited: #cc00ff; /* Neon purple for visited links */ --color-destructive--visited: #b300b3; /* Darker neon purple for visited destructive actions */ --color-error: #ff0044; /* Bright neon red for errors */ --color-warning: #ffcc00; /* Neon yellow for warnings */ --color-success: #00ff99; /* Neon green for success */ --color-notice: #ffffff; /* White for notices */ --color-content-added: #00ffcc; /* Neon teal for added content */ --color-content-removed: #ff3366; /* Neon pink for removed content */ --box-shadow-color-base: #00ff99; /* Neon green for box shadows */ --box-shadow-color-inverted: #000; /* Black for inverted box shadows */ --background-color-interactive: #1a1a1a; /* Dark gray for interactive elements */ --background-color-interactive-subtle: #1c1c1c; /* Slightly lighter dark gray */ --background-color-disabled: #3a3a3a; /* Dark gray for disabled elements */ --background-color-disabled-subtle: #2e2e2e; /* Slightly lighter dark gray for disabled subtle elements */ --background-color-progressive-subtle: #002233; /* Dark blue for progressive subtle elements */ --background-color-destructive-subtle: #330011; /* Dark red for destructive subtle elements */ --background-color-error: #ff0044; /* Bright neon red for errors */ --background-color-error--hover: #ff3366; /* Lighter neon red for error hover */ --background-color-error--active: #ff6699; /* Even lighter neon red for error active state */ --background-color-error-subtle: #330011; /* Dark red for error subtle elements */ --background-color-warning-subtle: #332200; /* Dark yellow for warning subtle elements */ --background-color-success-subtle: #003322; /* Dark green for success subtle elements */ --background-color-notice-subtle: #1c1c1c; /* Dark gray for notice subtle elements */ --background-color-content-added: #004466; /* Dark teal for added content */ --background-color-content-removed: #662233; /* Dark pink for removed content */ --background-color-backdrop-light: rgba(0, 0, 0, 0.65); /* Dark semi-transparent for light backdrop */ --background-color-backdrop-dark: rgba(255, 255, 255, 0.65); /* Light semi-transparent for dark backdrop */ --background-color-base: #121212; /* Almost black for base background */ --background-color-neutral: #1a1a1a; /* Dark gray for neutral background */ --background-color-neutral-subtle: #1c1c1c; /* Slightly lighter dark gray for neutral subtle background */ --background-color-inverted: #ffffff; /* White for inverted background */ --border-color-base: #444; /* Medium gray for base borders */ --border-color-interactive: #9099a1; /* Subtle gray for interactive borders */ --border-color-disabled: #3a3a3a; /* Dark gray for disabled borders */ --border-color-subtle: #3a3a3a; /* Dark gray for subtle borders */ --border-color-muted: #2e2e2e; /* Slightly lighter dark gray for muted borders */ --border-color-inverted: #121212; /* Almost black for inverted borders */ --border-color-error: #ff0044; /* Bright neon red for error borders */ --border-color-error--hover: #ff3366; /* Lighter neon red for error hover borders */ --border-color-warning: #ffcc00; /* Neon yellow for warning borders */ --border-color-success: #00ff99; /* Neon green for success borders */ --border-color-notice: #cfd2d9; /* Light gray for notice borders */ --border-color-content-added: #004466; /* Dark teal for added content borders */ --border-color-content-removed: #662233; /* Dark pink for removed content borders */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-topbanner { background-color: #1a1c1f; /* Dark gray */ border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-banner { background-color: #330011; /* Dark red */ border-color: #ff6699; /* Neon pink */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-left { background-color: #002022; /* Dark teal */ border-color: #004466; /* Dark blue */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-left .mp-h2 { background-color: #004466; /* Dark blue */ border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-right { background-color: #001122; /* Dark blue */ border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-right .mp-h2 { background-color: #00ccff; /* Neon blue */ border-color: #00ffff; /* Neon cyan */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-middle { background-color: #220011; /* Dark purple */ border-color: #ff66cc; /* Neon pink */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-middle .mp-h2 { background-color: #ff66cc; /* Neon pink */ border-color: #ff99cc; /* Light neon pink */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-lower { background-color: #1a0e33; /* Dark purple */ border-color: #a64dff; /* Neon violet */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-lower .mp-h2 { background-color: #a64dff; /* Neon violet */ border-color: #d1a3ff; /* Light neon violet */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-bottom { border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-night .mw-parser-output #mp-bottom .mp-h2 { background-color: #333; /* Dark gray */ border-color: #00ccff; /* Neon blue */ }

@media(prefers-color-scheme: dark) { html.skin-theme-clientpref-os .mw-parser-output #mp-topbanner { background-color: #1a1c1f; /* Dark gray */ border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-banner { background-color: #330011; /* Dark red */ border-color: #ff6699; /* Neon pink */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-left { background-color: #002022; /* Dark teal */ border-color: #004466; /* Dark blue */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-left .mp-h2 { background-color: #004466; /* Dark blue */ border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-right { background-color: #001122; /* Dark blue */ border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-right .mp-h2 { background-color: #00ccff; /* Neon blue */ border-color: #00ffff; /* Neon cyan */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-middle { background-color: #220011; /* Dark purple */ border-color: #ff66cc; /* Neon pink */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-middle .mp-h2 { background-color: #ff66cc; /* Neon pink */ border-color: #ff99cc; /* Light neon pink */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-lower { background-color: #1a0e33; /* Dark purple */ border-color: #a64dff; /* Neon violet */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-lower .mp-h2 { background-color: #a64dff; /* Neon violet */ border-color: #d1a3ff; /* Light neon violet */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-bottom { border-color: #00ccff; /* Neon blue */ }

html.skin-theme-clientpref-os .mw-parser-output #mp-bottom .mp-h2 { background-color: #333; /* Dark gray */ border-color: #00ccff; /* Neon blue */ } }