COS.TV Dark theme by savebytes

/* ==UserStyle==
@name         cos.tv
@version      20220327.03.30
@namespace    userstyles.world/user/savebytes
@description  Dark theme for cos.tv videos platform.
(almost 100% dark)
@author       savebytes
@license      MIT
==/UserStyle== */

@-moz-document url-prefix("https://cos.tv/") {
/* Colors config */
:root {
	--main-background-color: #181818;
	--header-background-color: rgb(33, 33, 33);
	--text-color: #ececec;
	--link-color: #3674ff;

	--search-background-color: #121212;
}

/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
	scrollbar-width: auto;
	scrollbar-color: #4d4d4d #1a1a1a;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
	background: #1a1a1a;
	width: 14px;
}


*::-webkit-scrollbar-thumb {
	background-color: #6c6c6c;
	background-clip: padding-box;
	border-left: 2px solid transparent;
	border-right: 2px solid transparent;

	border-radius: 100px;
}

.comp-spinner,
body {
	background-color: var(--main-background-color) !important;
}
}

@-moz-document url("https://cos.tv/") {
/* Main */
.page-home[data-v-21ba1791] {
	background-color: var(--main-background-color);
}


/* Videos */
.item-out li .item-wrapper .bottom-part .face-out .right {
	background-color: var(--header-background-color) !important;
}

.item-out li .item-wrapper .bottom-part .face-out .right > span {
	color: #a6a6a6e0 !important;
}

.go,
.cta {
	background-color: var(--main-background-color) !important;
}
}

@-moz-document url-prefix("https://cos.tv/videos/play/") {
/* Videos settings */

.app-router-view-container {
	background: var(--main-background-color);
}

.page-video-play .play-left {
	background: var(--main-background-color);
}

.comment-wrap,
.comp-video-description,
.follower,
.comp-current-video-info-bar,
.play-rank {
	background: var(--main-background-color) !important;
}

.rank-wrapper[data-v-9978f8d6] {
	background: var(--main-background-color) !important;
}

.rank {
	background: var(--header-background-color) !important;
}

.title {
	color: var(--text-color) !important;
}

.commit-tabs .tab-out .commit-num {
	color: var(--text-color) !important;
}

.content {
	color: var(--text-color) !important;
}

.content > a {
	color: var(--link-color) !important;
}

.follower .face-wrap .creator-icon {
	filter: brightness(0) invert(1);
}

.follower .face-wrap .subscribe.followed {
	color: black !important;
}

.comp-comment-textarea .textarea-wrapper .text-area {
	color: white !important;
}

.comp-comment-textarea .misc .coment-button[type=reset] {
	color: #9d9d9d !important;
}

.comp-emoji-picker .switch-btn-wrapper .btn-switch,
.creator-emoji-wrap .creator-icon {
	filter: brightness(0) invert(1);
}

.comp-emoji-picker .switch-btn-wrapper .btn-switch:hover,
.creator-emoji-wrap .creator-icon:hover {
	filter: brightness(0) invert(0.6);
}

.msg-center-time {
	color: #7b7b7b !important;
}

.video-lists .top .tips-text {
	color: white !important;
}

.video-lists .top .model-tips-content {
	background: var(--header-background-color) !important;
}

.slider-btn-container .switch {
	background: #848484 !important;
}

.learn-more-container .learn-more {
	filter: brightness(0) invert(1);
}

.model-tips-content {
	background: var(--header-background-color) !important;
}

.ticket-rank-list-container {
	background: var(--header-background-color) !important;
}

.ticket-rank-list-container > ul {
	overflow-x: hidden;
}

.ticket-rank-list-container > .top {
	background: var(--main-background-color);

	height: auto;
}

.auto {
	background: transparent !important;
}

.buy-emoji-pop {
	background: var(--main-background-color) !important;
}

.buy-emoji-pop .close img {
	filter: invert(1);
}
}

@-moz-document url-prefix("https://cos.tv/videos/play/") {
/* Video player */
.vjs-has-started .vjs-control-bar {
	background: rgba(0, 0, 0, 0);
}

.vjs-control-bar:before {
	pointer-events: none;
	content: "";
	width: 100%;
	height: 250px;
	position: absolute;
	bottom: 0px;
	
	background: rgb(0,0,0);
	background: linear-gradient(0deg, rgba(0,0,0,0.97) 0%, rgba(0, 0, 0, .16) 45%, rgba(255,255,255,0) 100%);
}

.video-js .vjs-play-progress {
	background-color: #4780ff !important;
}

.video-js .vjs-play-progress:before {
	color: #3674ff !important;
	font-size: 1em;
}

.comp-pop-reward-box .progress-box .progress-container .progress-value {
	height: 90% !important;
	margin: 0 auto !important;
	text-align: center;
}

}

@-moz-document url("https://cos.tv/"), url("https://cos.tv/ucenter/summary"), url-prefix("https://cos.tv/videos/play"), url-prefix("https://cos.tv/subject/home/dist"), url-prefix("https://cos.tv/home"), url-prefix("https://cos.tv/channel/") {
/* Header */
.cos-header {
	background-color: var(--header-background-color) !important;
}

.comp-main-search .search-wrap {
	border-radius: 10px !important;
}

.logo-img {
	object-position: -99999px 99999px;
	background: url("https://i.imgur.com/oqwCVO3.png") no-repeat center;
	background-size: contain;
}

.cos-header .arrow-down:after {
	filter: brightness(0) invert(1);
}

.menu-list-wrapper {
	background: var(--main-background-color) !important;
}

.menu-list-wrapper > .menu-item > a {
	color: var(--text-color) !important;
}

.menu-list-wrapper > .menu-item:hover > a {
	background: var(--header-background-color) !important;
}

.message-center-container .msg-title-container {
	background-color: var(--header-background-color) !important;
}

.msg-list-container {
	background-color: var(--header-background-color) !important;
}

.msg-center-list > li:hover {
	background-color: var(--main-background-color) !important;
}

.msg-reply-container {
	background-color: var(--header-background-color) !important;
}

.reply-list-container .reply-list > li.comment-bgc {
	background-color: var(--header-background-color) !important;
}

.secondary-comment ul > :first-child {
	background-color: var(--main-background-color) !important;
}

.money {
	color: var(--text-color) !important;
}

.out {
	filter: brightness(0) invert(1);
}

.long > .v {
	color: #000 !important;
}

.comp-main-search .search-wrap {
	background-color: var(--search-background-color) !important;
}

.cos-header .header-link.studio {
	border-radius: 10px !important;
}

.comp-main-search .search-wrap .search {
	border-top-right-radius: 10px !important;
	border-bottom-right-radius: 10px !important;
}

.person-info {
	background-color: var(--main-background-color) !important;
}

.strips .strip span.icon .tips p {
	color: var(--text-color) !important;
}

.strips .strip span.icon .tips[data-v-88d256a0] {
	background-color: var(--main-background-color) !important;

	z-index: 999999;
}

.strips > div > span.icon {
	object-position: 9999px 9999px;
	background: url("https://i.imgur.com/pu1tg0a.png") center no-repeat !important;
	background-size: contain !important;
}

.strips .strip span.icon .tips:before {
	border-left: 5px solid rgba(215, 19, 19, 0) !important;
	border-right: 5px solid rgba(227, 24, 24, 0) !important;
	border-bottom: 5px solid var(--header-background-color) !important;
}

.lists {
	background: var(--main-background-color) !important;
	color: var(--text-color) !important;
}

.lists > div:hover {
	background: var(--search-background-color) !important;
}

.cos-header .link-menu-wrapper .link-menu-current[data-v-7dba9dc6] {
	color: var(--text-color) !important;
}

.language-menu-wrapper * {
	color: var(--text-color) !important;
}

.person-info * {
	color: var(--text-color) !important;
}
}

@-moz-document url("https://cos.tv/"), url-prefix("https://cos.tv/videos/play") {
/* General text and others*/
a,
span,
p,
h1,
h2,
h3,
h4,
h5 {
	color: var(--text-color) !important;
}

input {
	color: var(--text-color) !important;
}
}

@-moz-document url-prefix("https://cos.tv/v2/wallet") {
/* Wallet MainNet v2 (the new dashboard)*/
.theme--light.v-app-bar.v-toolbar.v-sheet {
	background-color: var(--header-background-color) !important;
}

.router-link-active > div > .v-image__image {
	background: url("https://i.imgur.com/oqwCVO3.png") no-repeat center !important;
	background-size: contain !important;
}

button.v-app-bar__nav-icon {
	filter: brightness(0) invert(1);
}

.v-toolbar__title {
	color: var(--text-color) !important;
}

span.v-btn__content > i {
	color: #ececec !important;
}

.v-main > .v-main__wrap {
	background: var(--main-background-color) !important;
}

h1 {
	color: var(--text-color) !important;
}

div.v-navigation-drawer__content {
	background: var(--header-background-color) !important;
}

div.v-list * {
	color: white !important;
}

div.v-card {
	background: var(--header-background-color) !important;
}

div.v-list {
	background: var(--header-background-color) !important;
}

div.v-card__title {
	color: white !important;
}

span.v-chip__content {
	color: white !important;
}

div.theme--light.v-data-table {
	background: var(--header-background-color) !important;
}

div.theme--light.v-data-table * {
	color: white !important;
}

tbody > tr:hover {
	background: var(--main-background-color) !important;
}

ul > li > button {
	background: var(--header-background-color) !important;
	color: white !important;
}

button > i {
	color: white !important;
}

.v-card__text * {
	color: white !important;
}

.v-stepper {
	background: var(--header-background-color) !important;
}

.v-stepper * {
	color: white !important;
}

.v-application--is-ltr .theme--light.v-stepper--vertical .v-stepper__content:not(:last-child) {
	border-left: 1px solid rgba(219, 219, 219, .23) !important;
}

.text-truncate {
	color: #c6c6c6 !important;
}

.spacer + span {
	color: #fff;
}

.v-icon {
	color: #fff !important;
}

}