/* ==UserStyle==
@name           ChatGPT responsive + customizations
@version        1.0.13
@description    ChatGPT website is more suitable for wide screens.
@author         BreatFR (https://breat.fr)
@namespace      https://gitlab.com/breatfr
@homepageURL    https://gitlab.com/breatfr/chatgpt
@supportURL     https://discord.gg/Q8KSHzdBxs
@license        AGPL-3.0-or-later; https://www.gnu.org/licenses/agpl-3.0.txt
@preprocessor   stylus

@var    checkbox    chatmode 		"Chat mode"			1
@var    text        fontsize        "Custom font size"  1.2rem
@var    checkbox    hidechatgptplus "Hide ChatGPT plus"	1
@var	checkbox	hidescrollbars	"Hide scrollbars"	1
@var    checkbox    widemode        "Wide mode"         1
@downloadURL none
==/UserStyle== */

/* === Credits ===
Website         https://breat.fr
facebook        https://www.facebook.com/breatfroff
mastodon        https://mastodon.social/@breat_fr
telegram        https://t.me/breatfr
vk              https://vk.com/breatfroff
X (twitter)     https://x.com/breatfroff
=== Credits === */

@-moz-document domain("chatgpt.com") {
/* =============================================
    ChatGPT
============================================= */
    /* Versions */
    :root {
        --themeversion: 'Theme v1.0.13 by BreatFR (https://breat.fr)';
        --install1: ' usercssjs.breat.fr ';
        --install2: ' gitlab.com/breatfr/chatgpt';
        --support1: ' ko-fi.com/breatfr ';
        --support2: ' paypal.me/breat';
    }

    @media (min-width: 900px) {
		body::after,
		body::before {
			align-items: center;
            background: linear-gradient(88.55deg, rgb(139, 109, 255) 22.43%, rgb(254, 132, 132) 92.28%);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
			display: flex;
            font-family: inherit;
            font-size: 1.2rem;
			height: 60px;
			line-height: 1.5;
            pointer-events: none;
            position: fixed;
            text-align: center;
			top: 0;
            width: auto;
			z-index: 9999;
		}
		
		html:has(div[style*="width:var(--sidebar-width);"]) body::before,
        html:has(div[style*="width: var(--sidebar-width);"]) body::before {
            content: var(--themeversion);
			left: 25%;
            white-space: wrap;
        }
		html:has(div[style*="width:var(--sidebar-rail-width);"]) body::before,
		html:has(div[style*="width: var(--sidebar-rail-width);"]) body::before {
			content: var(--themeversion);
			left: 15%;
            white-space: wrap;
        }
    
		body::after {
			content: 'Install: ' url("https://gitlab.com/breatfr/kindroid/-/raw/main/images/icon_breat.fr.png") var(--install1) url("https://gitlab.com/breatfr/kindroid/-/raw/main/images/icon_gitlab.png") var(--install2) '\ASupport me: ' url("https://gitlab.com/breatfr/kindroid/-/raw/main/images/icon_ko-fi.png") var(--support1) url("https://gitlab.com/breatfr/kindroid/-/raw/main/images/icon_paypal.png") var(--support2);
			right: 22%;
			white-space: pre-line;
		}
	}
	
	/* Custom font size */
	#prompt-textarea *,
	[data-message-author-role="assistant"] *,
	[data-message-author-role="user"] * {
		font-size: fontsize !important;
		line-height: 1.5 !important;
	}
	
	header {
		background: #181818;
		height: 60px;
		pointer-events: auto;
		position: fixed;
		width: 100%;
	}
	#stage-slideover-sidebar {
		border: 0 !important;
	}
    
    if hidechatgptplus {
		header > div:nth-of-type(1),
		[data-testid="accounts-profile-button"] > div:nth-of-type(2) {
			display: none;
		}
    }
	
	if hidescrollbars {
		* {
            scrollbar-width: none !important;
            -ms-overflow-style: none !important;
            -moz-overflow-style: none !important;
            -webkit-overflow-style: none !important;
        }    
        ::-webkit-scrollbar {
            display: none !important;
            width: 0 !important;
        }
	}
    
    if chatmode {
        :root {
			--user-chat-width: 100%;
		}
		[data-message-author-role="assistant"],
		[data-message-author-role="user"] {
			max-width: 80% !important;
			width: 80% !important;
		}
		[data-message-author-role="user"] {
			margin-left: auto;
		}
    }
    
    if widemode {
		:root {
			--user-chat-width: 100%;
		}
		[data-message-author-role="assistant"],
		[data-message-author-role="user"] {
			max-width: 100% !important;
		}
		[data-message-author-role="assistant"] div {
			width: 100%;
		}
        [class*="[--thread-content-max-width:40rem]"] {
			--thread-content-max-width: 100% !important;
		}	
		article > div,
 		#thread-bottom > div {
			padding: 2em;
		}
		
		div:has(>article) {
			padding-bottom: 0 !important;
		}
        
        pre > div > div:nth-of-type(3) {
            box-sizing: border-box !important;
            max-width: 100% !important;
            overflow: hidden !important;
        }
        code.hljs {
            max-width: 100% !important;
            width: 100% !important;
            white-space: break-spaces !important;
        }
    }
}