/* ==UserStyle==
@name           Twitch.tv Fullsize Video Player
@description    Fullsize video player for Twitch.tv website
@namespace      github.com/ShadyDeth/Twitch-FullsizePlayer
@homepageURL    https://github.com/ShadyDeth/Twitch-FullsizePlayer
@version        1.1.13
@updateURL      https://raw.githubusercontent.com/ShadyDeth/Twitch-FullsizePlayer/master/TwitchFullsizePlayer.user.css
@author         ShadyDeth
@license        GNU-V3.0

@preprocessor stylus

@var select browser "Browser" [
	"Chrome",
	"Brave"
]

@var checkbox rs-avatars "Rounded Square Avatars" 0
@var checkbox hide-extensions "Hide Player Extensions" 0
@var checkbox hide-topblackbar "Hide Top Nav Black Bar" 0
@var checkbox hide-leftsidebar "Hide Left Sidebar" 0
@var checkbox hide-bookmarksbar "Not using Browser Bookmarks Bar" 0

==/UserStyle== */

@-moz-document domain("twitch.tv") {

	:root {
		if browser == "Brave" {
			--channel-info1: 78px;
			--channel-info2: 50px;
			--channel-info3: 110px;
			--channel-info4: 82px;
			--player-size: 35rem;
			--chat-size: -35rem;
		}
		if browser == "Chrome" {
			--channel-info1: 78px;
			--channel-info2: 50px;
			--channel-info3: 110px;
			--channel-info4: 82px;
			--player-size: 35.8rem;
			--chat-size: -35.8rem;
		}
	}

	/* Sitewide Adjustments */
	/* Left nav bar */
	if hide-leftsidebar {
		.side-nav {
			display: none !important;
		}
	}

	/* Top nav bottom border */
	if hide-topblackbar {
		.top-nav__menu {
			box-shadow: var(--shadow-elevation-0) !important;
		}
	}

	/* Rounded User Images */
	if rs-avatars {
		.tw-image-avatar, .tw-halo, .tw-halo:before {
			border-radius: 14% !important;
		}
	}

	/* Hides Extension Overlays */
	if hide-extensions {
		.extensions-dock__layout, .extension-frame-wrapper, .extension-view__iframe, .extensions-video-overlay-size-container {
			display: none !important;
		}
	}
		
	/* Hide Theater Button - This scipt breaks theater mode so we'll just remove the icon*/
	[data-a-target="player-theatre-mode-button"] {
		display: none !important;
	}
	
	/* Directory Top */
	.common-centered-column, .directory-header-new__info {
		max-width: 100% !important;
	}

	/* Video Player Adjustments */
	/* Size Adjustments */
	.video-player .player, .persistent-player, .channel-page__video-player, .highwind-video-player__container--resize-calc, .video-player__container--resize-calc, .video-player__container, .video-player__default-player {
		max-height: calc(100vh) !important;
	}
	
	/* Gradients */
	.top-bar, .pl-controls-top {
		background: linear-gradient(180deg,rgba(0,0,0,.5) 0,rgba(0,0,0,.15) 60%,transparent) !important;
	}
	
	.player-controls, .pl-controls-bottom {
		background: linear-gradient(0deg,rgba(0,0,0,.5) 0,rgba(0,0,0,.15) 60%,transparent) !important;
	}
	
	/* Live Status Gradient */
	.player-streamstatus {
		background: radial-gradient(ellipse farthest-side at 150% -80%,#000 0,transparent 100%) !important;
	}
	
	.preview-card-stat--live, .tw-root--theme-dark .preview-card-stat--live, .tw-root--theme-light .preview-card-stat--live {
		opacity: 0.7 !important;
	}

	/* Channel Adjustments */
	/* Channel Info height options*/
	if hide-leftsidebar == '1' && hide-bookmarksbar == '1' {
		.channel-root__info, .channel-root__info--with-chat {
			margin-top: calc(100vh - var(--channel-info4)) !important;
			transform: unset !important;
		}
	}

	else if hide-leftsidebar == '1' {
		.channel-root__info, .channel-root__info--with-chat {
			margin-top: calc(100vh - var(--channel-info2)) !important;
			transform: unset !important;
		}
	}

	else if hide-bookmarksbar == '1' {
		.channel-root__info, .channel-root__info--with-chat {
			margin-top: calc(100vh - var(--channel-info3)) !important;
			transform: unset !important;
		}
	}

	else {
		.channel-root__info, .channel-root__info--with-chat {
			margin-top: calc(100vh - var(--channel-info1)) !important;
			transform: unset !important;
		}
	}
	
	.channel-root--hold-chat+.persistent-player, .channel-root--watch-chat+.persistent-player, .channel-root__info--with-chat .channel-info-content, .channel-root__player--with-chat, .persistent-player:has(+.channel-root--watch-chat) {
		width: calc(100% - var(--player-size)) !important;
	}

	/* Chat */
	.chat-shell__expanded {
		min-width: var(--player-size) !important;
	}

	.toggle-visibility__right-column--expanded {
		transform: translateX(var(--chat-size)) !important;
	}

	.channel-root__right-column, .channel-root__right-column--expanded {
		width: var(--player-size) !important;
		transform: translateX(var(--chat-size)) translateZ(0px) !important;
	}

	.chat-line__message, .chat-line__moderation, .chat-line__status {
		padding: .5rem 1rem !important;
	}

	.chat-input__textarea textarea {
		overflow: hidden;
	}
}