Kick improvements by pabli

/* ==UserStyle==
@name         Kick improvements
@namespace    https://github.com/pabli24
@version      1.0.1
@description  Kick.com improvements
@author       Pabli (https://github.com/pabli24)
@homepageURL  https://userstyles.world/style/18122/kick-improvements
@supportURL   https://userstyles.world/style/18122/kick-improvements
@license      MIT
@preprocessor stylus

@var checkbox _changeBg               "Change background color" 0
@var color    _bg                     "" #000

@var checkbox _squareAvatars          "Square avatars" 1

@var checkbox _hideTopSection         "Main page - hide top section with autoplaying channel previews" 0

@var checkbox _volumeSlider           "Player - volume slider always visible" 1
@var checkbox _theatreModeSidebar     "Player - show sidebar on hover in theatre mode" 1

@var checkbox _homeToNavbar           "Sidebar - move 'Home Browse Following' to navbar" 1
@var checkbox _sidebarNoPadding       "Sidebar - smaller padding" 1
@var checkbox _sidebarFullGameNames   "Sidebar - fully visible game names..." 1
@var checkbox _hideSidebarRecommended "Sidebar - hide recommended channels" 0
@var number   _sidebarWidth           "Sidebar - width (px)" ['px', 188, -1, null, 1]

@var number   _navbarHeight           "Navbar - height (px)" ['px', 45, -1, null, 1]

@var number   _chatWidth              "Chat - width (px)" ['px', 340, -1, null, 1]
@var number   _chatWidthTheatreMode   "Chat - width in theatre mode (px)" ['px', 290, -1, null, 1]
@var checkbox _hideTopChat            "Chat - hide top panel" 0
@var checkbox _chatNoPadding          "Chat - smaller padding" 1

@var checkbox _hideChannel            "Hide channels" 0
@var text     _channel                "" "'eddie, trainwreckstv'"
@var checkbox _hideCategory           "Hide categories" 0
@var text     _category               "" "'asmr, body-art'"
@var checkbox _hideGamblingCategory   "Hide all gambling categories" 0

==/UserStyle== */

i = !important

@-moz-document domain("kick.com") {
	
	:root {
		if _navbarHeight != -1px {
			--navbar-height: _navbarHeight // 60px
		}
		if _sidebarWidth != -1px {
			--sidebar-expanded-width: _sidebarWidth // 256px
		}
		if _chatWidth != -1px {
			--chat-width: _chatWidth // 340px
		}
		if _chatWidthTheatreMode != -1px {
			[data-theatre="true"] {
				--chat-width: _chatWidthTheatreMode // 340px
			}
		}
	}
	
	if _homeToNavbar {
		nav {
			z-index: 401 i
		}
		#sidebar-wrapper {
			> ul {
				position: fixed
				z-index: 500 i
				top: 0
				left: var(--sidebar-expanded-width)
				margin: 0
				padding: 0
				width: auto
				height: var(--navbar-height)
				flex-direction: row
				align-items: center
			}
			&.w-\\[var\\(--sidebar-collapsed-width\\)\\] > ul {
				gap: 20px
			}
			div.w-full.px-3 { // hr
				display: none
			}
			> div > div > * {
				padding-top: 0
			}
		}
		if _theatreModeSidebar {
			[data-theatre="true"] #sidebar-wrapper > ul {
				display: none
			}
		}
	}
	
	if _changeBg {
		:root, html {
			background: _bg
		}
		:root {
			--background-color: _bg
		}
		.bg-surface-lower {
			background-color: _bg
		}
		.bg-grey-950 {
			background-color: _bg
		}
		.\\\!bg-surface-tint {
			background-color: rgba(255, 255, 255, .1) i
		}
	}
	
	if _squareAvatars {
		img.rounded-full, div:has(> img.rounded-full) > div, #channel-avatar, div:has(> #channel-avatar) {
			border-radius: 0px
		}
	}
	
	if _hideTopSection {
		main > div > div > div.justify-between {
			display: none
		}
	}
	
	if _hideChannel {
		t = ''
		if _channel != '' {
			_channel = split(',', replace('^\s+|\s+(?=,)|(?<=,)\s+|\s+$', '', _channel))
			for n in _channel {
				t += '[href="/'+ n +'" i],'
			}
			s("a:is("+ t +"),.group\/card:has(a:is("+ t +")) {display: none}")
		}
	}
	
	if _hideCategory {
		t = ''
		if _category != '' {
			_category = split(',', replace('^\s+|\s+(?=,)|(?<=,)\s+|\s+$', '', _category))
			for n in _category {
				t += '[href="/category/'+ n +'" i],'
			}
			s("a:is("+ t +"),.group\/card:has(a:is("+ t +")) {display: none}")
		}
	}
	
	if _hideGamblingCategory {
		gamba = 'slots, casino-simulator, casino-boss-simulator, poker, poker-club, chat-roulette, sports-betting, crypto-and-trading, table-games, the-four-kings-casino-and-slots, hd-poker-texas-holdem-casino, blooming-business-casino, dice'
		t = ''
		gamba = split(',', replace('^\s+|\s+(?=,)|(?<=,)\s+|\s+$', '', gamba))
		for n in gamba {
			t += '[href="/category/'+ n +'" i],'
		}
		s("a:is("+ t +"),.group\/card:has(a:is("+ t +")) {display: none}")
		
		a[data-test="directory-card-gambling"] {
			display: none
		}
	}
	
	if _volumeSlider {
		.group\\/volume .betterhover\\:group-hover\\/volume\\:flex {
			display: flex
		}
	}
	
	if _theatreModeSidebar {
		[data-theatre="true"] #sidebar-wrapper {
			display: block i
			position: fixed
			opacity: 0
			width: 10px
			transition: width 0.3s, opacity 0.5s
			&:hover {
				opacity: 0.9
				width: var(--sidebar-expanded-width)
			}
			&.w-\\[var\\(--sidebar-collapsed-width\\)\\]:hover {
				width: var(--sidebar-collapsed-width)
			}
		}
	}
	
	if _hideTopChat {
		#channel-chatroom > div.items-center:first-child {
			display: none
		}
	}
	
	if _chatNoPadding {
		#chatroom-messages > div > div {
			padding-left: 0
			padding-right: 0
		}
	}
	
	if _sidebarNoPadding {
		#sidebar-wrapper > ul,
		#sidebar-wrapper > div > div > * {
			padding-left: 0
			padding-right: 0
		}
	}
	
	if _sidebarFullGameNames {
		#sidebar-wrapper span.text-subtle.truncate.text-xs.font-bold.leading-normal {
			width: fit-content
		}
	}
	
	if _hideSidebarRecommended {
		#sidebar-wrapper > div.no-scrollbar > div > {
			section:last-of-type,
			div:last-of-type {
				display: none
			}
		}
	}
	
}