klimat.app - Dark Mode by Nick2bad4u

/* ==UserStyle==
@name         klimat.app - Dark Mode
@version      2.3
@namespace    klimat.app
@description  Klimat.app Dark Mode
@author       Nick2bad4u@hotmail.com
@homepageURL  https://github.com/Nick2bad4u/UserStyles
@supportURL   https://github.com/Nick2bad4u/UserStyles/issues
@license      UnLicense

@var color backgroundColor "Background Color" #121212
@var color textColor "Text Color" #e0e0e0
@var color headerFooterColor "Header/Footer Color" #1e1e1e
@var color linkColor "Link Color" #bb86fc
@var color linkHoverColor "Link Hover Color" #3700b3
@var color buttonColor "Button Color" #333333
@var color buttonHoverColor "Button Hover Color" #bb86fc
==/UserStyle== */
@-moz-document domain("klimat.app") {
	/* Use the variables for colors */
	:root {
			--backgroundColor: var(backgroundColor);
			--textColor: var(textColor);
			--headerFooterColor: var(headerFooterColor);
			--linkColor: var(linkColor);
			--linkHoverColor: var(linkHoverColor);
			--buttonColor: var(buttonColor);
			--buttonHoverColor: var(buttonHoverColor);
	}

	body {
			background-color: var(--backgroundColor);
			color: var(--textColor);
	}

	header,
	footer,
	.sidebar,
	.content {
			background-color: var(--headerFooterColor);
			color: var(--textColor);
	}

	a,
	.mbn {
			color: var(--linkColor);
	}

	a:hover {
			color: var(--linkHoverColor);
	}

	table {
			background-color: var(--headerFooterColor);
			color: var(--textColor);
	}

	table th,
	table td {
			border: 1px solid #333;
	}

	button,
	input,
	select,
	textarea {
			border: 1px solid #444;
			background-color: var(--buttonColor);
			color: var(--textColor);
	}

	button:hover,
	input:hover,
	select:hover,
	textarea:hover {
			border-radius: 5px;
			background-color: var(--buttonHoverColor);
	}

	::selection {
			background-color: var(--buttonHoverColor);
			color: var(--backgroundColor);
	}

	span {
			color: var(--linkColor);
	}

	.information__left__blk {
			border-color: var(--linkColor);
	}

	#content_wrapper,
	.form-actions,
	#fieldDetails > tbody {
			filter: invert(1) hue-rotate(180deg);
	}

	.modal-backdrop.fade {
			display: none;
			opacity: 0%;
	}
}