html.dark body {
	color: #e8e8e8;
	background-color: #0b0b0b;
}

html.dark a[href],
html.dark a[href]:visited {
	color: #6da3f9;
}

html.dark details {
	border-color: #cacaca;
	background-color: #1d2224;
}

html.dark section,
html.dark header,
html.dark #modalPopup {
	border-color: #828282;
	background-color: #303337;
}

html.dark ::placeholder {
	color: white;
	opacity: 0.55;
}

html.dark input,
html.dark select,
html.dark textarea {
	color-scheme: dark;
	accent-color: #0070ff;
	filter: hue-rotate(349deg) contrast(115%) saturate(60%);
}

html.dark select {
	filter: hue-rotate(349deg) contrast(99%) saturate(70%);
}

html.dark option:checked {
	background: #0070ff;
}

html.dark .bannerImg {
	filter: brightness(120%) hue-rotate(170deg) invert(100%);
}

html.dark .navButton {
	filter: brightness(99%) hue-rotate(205deg) invert(100%);
}

html.dark .resetButton,
html.dark .submitButton {
	filter: brightness(90%);
}

html.dark .navButton[disabled] {
	opacity: 0.7;
}


html.dark li.tabItem,
html.dark .tabBox {
	--tabMenu-border-color-active:       #cccccc;
	--tabMenu-border-color-inactive:     #a8a8a8;
	--tabMenu-border-color-hover:        #a8a7a7;
	--tabMenu-border-color-clicked:      #828282;
	--tabMenu-background-color-active:   #43484d;
	--tabMenu-background-color-inactive: #1e1e1e;
	--tabMenu-background-color-hover:    #343535;
	--tabMenu-background-color-clicked:  #171717;
}


html.dark [data-da-hover]:hover::before,
html.dark [data-da-hover].touched::before {
	background-color: #111;
	border-color: #ccc;
	color: #eee;
}


html.dark #modalOverlay {
	background-color: #000a;
}

html.dark #modalTopX {
	color: inherit;
}

html.dark #modalTopX:hover {
	color: #ccc;
	background-color: #0007;
}

html.dark #modalTopX:hover:active {
	color: #ddd;
	background-color: #000f;
}