GOG.com - Dark Theme by pabli

/* ==UserStyle==
@name         GOG.com - Dark Theme
@namespace    https://github.com/pabli24/GOG-Dark
@version      0.3.8
@description  Dark Theme for GOG.com
@author       Pabli (https://github.com/pabli24)
@license      CC-BY-SA-4.0
@homepageURL  https://github.com/pabli24/GOG-Dark
@supportURL   https://github.com/pabli24/GOG-Dark/issues
@preprocessor stylus
@var          checkbox sb       "Dark scrollbar"   1
@var          color    bg1      "Background 1"     #1d1d1d
@var          color    bg2      "Background 2"     #222
@var          color    bg3      "Background 3"     #1e1e1e
@var          color    bgh      "Background hover" #2d2d2d
@var          color    text1    "Text 1"           #ccc
@var          color    text2    "Text 2"           #eee
@var          color    text3    "Text 3"           #bbb
@var          color    text4    "Text 4"           #aaa
@var          color    textw    "Text white"       #fff
@var          color    textb    "Text black"       #000
@var          color    textp    "Text pink"        #fba6ff
@var          color    border1  "Border 1"         rgba(0,0,0,.08)
@var          color    border2  "Border 2"         #242424
@var          color    border3  "Border 3"         #333
==/UserStyle== */

// bg1     #1d1d1d          #ccc
// bg2     #222             #e1e1e1
// bg3     #1e1e1e          #d2d2d2
// bgh     #2d2d2d          #e5e5e5 #ececec
// text1   #ccc             #212121
// text2   #eee             #262626 #1a1a1a
// text3   #bbb             #595959 gray
// text4   #aaa             #4c4c4c #404040
// textw   #fff             #000000
// textb   #000             #ffffff
// textp   #fba6ff          #78387b #86328a
// border1 rgba(0,0,0,.08)
// border2 #242424
// border3 #333

i = !important

@-moz-document regexp("https?:\/\/(www|support)?\.gog\.com\/(?!u|feed|profile).*") {

html, body {
	background: bg1
	color: text1
}

}

@-moz-document domain("gog.com") {

:root {
	color-scheme: dark
}
/* official dark theme /games body.dark-theme */
body {
	--c-background: bg1 i //#212121
	--c-accent: #c99aff i
	--c-accent-supportive: #b370ff i
	--c-accent-contrast: black i
	--c-ui-primary: bg2 i //#303030
	--c-ui-primary--hover-lighten: bgh i //#3d3d3d
	--c-ui-primary--active-lighten: #565656 i
	--c-ui-tertiary: #404040 i
	--c-text-primary: text1 i //#f2f2f2
	--c-text-secondary: text2 i //#ededed
	--c-text-tertiary: #d9d9d9 i
	--c-contrast: white i
	--c-contrast-85: rgba(255, 255, 255, .85) i
	--c-contrast-20: rgba(255, 255, 255, .2) i
	--c-contrast-15: rgba(255, 255, 255, .15) i
	--c-contrast-10: rgba(255, 255, 255, .1) i
	--c-ui-hover: rgba(201, 154, 255, .7) i
	--c-button-primary-disabled-content: rgba(255, 255, 255, .85) i
	--gradient-button-accent-body: linear-gradient(180deg, #d6b2ff, #c99aff) i
	--gradient-button-accent-border: linear-gradient(180deg, #e1c7ff, #c58bff) i
	--gradient-button-accent-disabled: linear-gradient(180deg, rgba(214, 178, 255, .3), rgba(201, 154, 255, .3)) i
	--c-button-accent-content: black i
	--c-button-accent-pressed-body: #c99aff i
	--c-button-accent-pressed-border: #c58bff i
	--c-button-accent-disabled-content: rgba(255, 255, 255, .85) i
	--gradient-button-secondary-body: linear-gradient(180deg, #6b6b6b, #585858) i
	--gradient-button-secondary-border: linear-gradient(180deg, #848484, #585858) i
	--gradient-button-secondary-disabled: linear-gradient(180deg, rgba(242, 242, 242, .3), rgba(237, 237, 237, .3)) i
	--c-button-secondary-content: white i
	--c-button-secondary-pressed-body: #585858 i
	--c-button-secondary-pressed-border: #404040 i
	--c-button-secondary-disabled-content: rgba(255, 255, 255, .85) i
}

if sb {
	//chrome
	::-webkit-scrollbar {
		width: 8px
		height: 8px
		background-color: rgba(0, 0, 0, 0)
	} 
	::-webkit-scrollbar-thumb {
		background-color: #444
	}
	::-webkit-scrollbar-thumb:hover {
		background-color: #777 i
	}
	::-webkit-scrollbar-corner {
		background-color: #444
	}
	//firefox
	html {
		scrollbar-color: #444 bg i
		scrollbar-width: thin i
	}
}

.content, .wrapper {
	background-color: bg1
}

/* text headers titles */
.big-spots__header, .module-header, .module-header__btn.is-active,
.gogmix__title, .product-row__title, .product-tile__title, .header__title>strong,
.news-item {
	color: text2
}

/* search */
.menu-search__result {
	background: bg3
}
.menu-search__result.is-focused, .menu-search__results, .menu-search__results .list--rows {
	background: bg2
}
.menu-search__results-more {
	box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, .1), 0px 1px 3px 0px rgba(255, 255, 255, .1)
	background: bg3
	color: text4
}
.menu-search__results-more:hover {
	background: bgh
}
.menu-product__title {
	color: text2
}
.menu-product .menu-product__price-btn {
	border: 1px solid border3
	color: text2
}
.menu-product {
	border-bottom: 1px solid border3
}
.menu-product:hover {
	background: bgh
}
.highlighted {
	background: #867400
}
.menu-search__no-results {
	background: bg2
}
.menu-search-empty__btn {
	background: bg2
	color: text1
}
.menu-search-empty__btn:hover {
	background: bgh
}
/*  */
.about-gog {
	background: #343e48
}
.about-gog__header {
	background-color: #343e48
}
.about-gog__header:hover {
	background-color: rgba(255, 255, 255, 0.05)
}
.about-gog__header~.about-gog__header {
	border-color: #29323a
}
.about-gog__icon {
	text-shadow: 0 0 30px hsla(0, 0%, 0%, 0.75)
}
.footer__dropdown-item {
	color: text2
}
.carousel-pagination.big-arrows .arrow-icon {
	fill: #fff
}
.carousel-pagination__page {
	background: rgba(255, 255, 255, 0.2)
}
.galaxy-section-wrapper {
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, .1), 0 1px 0 0 rgba(255, 255, 255, .1)
}
.explore-galaxy {
	border-left: 1px solid border3
}
.galaxy-section,
.tooltip-content__text {
	color: text4
}
.galaxy-tooltip__trigger,
.tooltip-content__header {
	color: textp
}
.tooltip-icon-wrapper--icon {
	stroke: textp
}
.custom-section__flashdeals-counter-wrapper {
	border: 2px dashed textp
	color: textp
}

/* price */
.price-btn, .price-text--discount {
	border: 1px solid border3
}
.price-btn, .price-text, .price-text--discount {
	color: text1
}
.price-text--discount {
	background: #38505c
}

.big-spot.is-hovered .price-btn--active,
.btn--green, .is-buyable.gogmix:hover .price-btn--active, .product-row.is-buyable:hover .price-btn--active {
	background: linear-gradient(180deg,#5d7100,#354600)
	color: textw
}
.big-spot.is-hovered .price-btn--active,
.is-buyable.gogmix:hover .price-btn--active, .product-row.is-buyable:hover .price-btn--active {
	border-color: border3
}
/*  */
.product-row--grid,
.list--grid .product-row,
.list--rows--no-border .product-row {
	background: bg2
}
.list--grid .is-owned.gogmix, .list--grid .product-row.is-owned,
.is-owned.gogmix, .product-row.is-owned,
.order__related-games .product-row.is-owned {
	background: bg3
}
.article__related_topics .product-row:first-child {
	border-top: 1px solid bg3
}
.product-tile__label--in-library {
	background: hsla(0, 0%, 10%, 0.7)
	color: text3
}
.product-tile__label--is-wishlisted {
	background: #845810
}
.product-tile__label--is-upcoming {
	background: #0f3854
}
.product-tile__label--in-cart {
	background: #364800
}
.product-tile__content,
.product-tile--active .product-tile__content,
.catalog__body--slide-desktop .product-tile__content,
.catalog__body--slide-desktop .product-tile--active .product-tile__content,
.catalog__body--slide-desktop .product-tile__title,
body .catalog__body--slide-desktop:not(.catalog__body--list-view) .product-tile__content {
	background: bg2
}
.product-tile:hover .product-tile__content {
	background: bgh
}
.product-tile--list.product-tile--active .product-tile__title,
body .catalog__body--slide-desktop:not(.catalog__body--list-view) .product-tile__title,
body .catalog__body--slide-desktop:not(.catalog__body--list-view) .product-tile__price-discounted {
	color: text4
}
.product-tile--list.product-tile--active .product-tile__content,
body .catalog__body--slide-desktop:not(.catalog__body--list-view) .product-tile--active .product-tile__content {
	background: bg2
}
.product-tile--list.product-tile--active {
	border-bottom: 1px solid border3
}
.section-title--with-border {
	border-bottom: 1px solid border3
}
.product-tile--list.product-tile:hover .product-tile__content {
	background: bgh
}
symbol#button-wishlist path {
	stroke: text4
}
symbol#button-wishlist path:hover {
	stroke: #eca125
}
/* discover games */
.section-title__title-wrapper {
	color: text3
}
.tabbed-section__head {
	border-bottom: 1px solid border3
}
.product-tile--list:not(.product-tile--active) {
	border-bottom: 1px solid border3
}
.tabbed-section__tab {
	color: text3
	fill: text3
}
.product-tile--list:not(.product-tile--active) .product-tile__title,
.product-tile__price-discounted, .product-tile__price,
.product-tile__no-buy-block-slug,
.catalog__body--slide-desktop .product-tile__price-discounted,
.catalog__body--slide-desktop .product-tile__no-buy-block-slug,
.product-tile--list.product-tile:hover .product-tile__title {
	color: text4
}
.product-tile__platforms-item {
	fill: text4
}
.icon-wrapper-icon {
	fill: text4
}
.discover-games-more {
	border: 1px solid border3
	background: bg1
}
.discover-games-more__text {
	color: text3
}
.discover-games-more__icon {
	fill: text3
}
/* left column */
.news-item__title {
	color: text1
}
.news-item__info {
	color: text3
}
.news-item:hover {
	background: bgh
}
/* left right background */
.module {
	background: bg2
	color: text1
	box-shadow: 0 1px 5px rgba(0,0,0,.15)
}
/* right column */
.gogmix, .product-row {
	border-top: 1px solid border1
	color: text3
}
.product-row--has-action.gogmix:hover, .product-row--has-card.gogmix:hover, .product-row.product-row--...