Dark theme for MySKU site (by mitry)

mysku-dark.css

@media (prefers-color-scheme: dark) {

:root {
	color-scheme: light dark;
--bg: #21272B;
--fg: #BBC;
--bg-light: #FFF2;
--bg-dark:  #0002;
--fg-dark:  #BBCD;
--fg-light: #BFBFCF;
--bg-active: #FEC2;
--fg-hn: #284ea2;
}

body, .page-content {
	color: var(--fg) !important;
	background-color: var(--bg) !important;
}

h1, h2, h3, h4, h5, h6,
  .topic .topic-title h1,
  .user-profile h1,
  .topic .topic-footer li.author a,
  .sidebar .block .title {
    color: var(--fg-hn) !important;
}

.page-footer {
	color: var(--fg-light);
}
.page-footer .column .title {
	font-weight: bold;
}

:link {
	color: DodgerBlue !important;
}
:visited {
	color: SteelBlue !important;
}

.page-header .navigator {
	background-color: var(--bg) !important;
}
.page-header .navigator * {
	border: none !important;
}
.page-header .main-part .burger-button-close {
	color: var(--fg-light);;
}

.number, .arrow {
	background-color: var(--bg-light) !important;
}

.comments,
.comment .comment-body .text,
.comments .comment .comment-preview .text,
.comments .header .title
{
	color: var(--fg-light) !important;
}

:is(.topic .topic-content, 
  .comment .comment-body .text,
  .comment .comment-preview .text)
blockquote
{
	color: inherit;
	background-color: var(--bg-light);
}

.comment div.comment-body.state-new {
	background: var(--bg-active) !important;
}

.comment .comment-body .info:has(.user-topic-starter)
{ background-color: var(--bg-active); }
.comment .comment-body .user-topic-starter
{
	background-color: transparent !important;
}

.topic .topic-content pre,
.comment .comment-body .text pre,
.comment .comment-preview .text pre {
	background: DarkGray !important;
}

.topic .topic-controls .button-want-to-buy
  :is(span.number, span.text) {
	color: #282;
}

.spoiler, .spoiler .spoiler-body{
	color: inherit;
	background-color: var(--bg-light) !important;
}

.spoiler .spoiler-title {
	color: var(--fg-hn);
	background-color: var(--bg-dark) !important;
}

.topic .topic-top-tags .list-item-link:after
{
	background: var(--bg);
	border-left-color: var(--bg-light);
}

.block-topic-presenter .block-header .title {
	color: var(--fg-dark);
}
.block-topic-presenter .tab-content .line .rate
{
	background-color: var(--bg-dark);
	border: 1px solid var(--bg-light);
}
.block-topic-presenter .tab-content .line .inner
{
	border: 1px solid var(--bg-light);
}
.block-topic-presenter .tab-content > .line:first-child .inner {
	border-top: 1px solid var(--bg-light);
}

.topic .topic-buttons .button-read-more a,
.topic .topic-buttons .button-coupon-go a,
.topic .topic-content .button-expand-height .label,
.topic .topic-top-tags .list-item-link,
.block-topic-presenter .tab-content .line .inner:hover
{
	color: var(--fg);
	background-color: var(--bg-light);
}

.topic .topic-content .button-expand-height:before {
	background-image: linear-gradient(rgba(255, 255, 255, 0), var(--bg));
}

.block-topic-presenter .tab-content .line .inner
:is(.title, .indicators :is(.view-count, .comment-count)) {
	color: var(--fg-dark);
}

.block-category-catalog li em,
.block-category-catalog li li em {
	color: var(--fg-light);
	background: var(--bg-dark);
}
.entity-profile span.subscription {
	color: var(--fg-light);
}

.topic .topic-footer
  :is(li, li.author, li.date) {
	color: var(--fg-dark);
}

.form-toolbar,
.burger-opened .navigator {
	background-color: var(--bg-dark);
}

.paginator li {
	background: var(--bg-light);
}

.lm a {
	background: var(--bg) !important;
}

}