/* ==UserStyle==
@name           Microsoft Copilot optimized & customizable for wide screens
@description    Microsoft Copilot website interface is reworked to offer a cleaner and comfortable experience on desktop, with visual adjustments that adapt to your needs.
@version        1.0.10
@author         BreatFR (https://breat.fr)
@namespace      https://breat.fr
@homepageURL    https://usercssjs.breat.fr/m/microsoft-copilot
@updateURL      https://code.breat.fr/m/microsoft-copilot/css/pc.user.css
@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            "Font size"                 1.2rem
@var    checkbox    hidecopilotpro      "Hide Copilot Pro"          1
@var    checkbox    hidedownloadapp     "Hide Download Application" 1
@var    checkbox    hidescrollbars      "Hide scrollbars"           1
@var    checkbox    widemode            "Wide mode"                 1
==/UserStyle== */

/* ==Credits==
Website         https://breat.fr
Bluesky			https://bsky.app/profile/breatfroff.bsky.social
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== */

/* ==Support==
brave Creators  https://publishers.basicattentiontoken.org/c/breatfr
Buy me a coffee https://buymeacoffee.com/breatfr
ko-fi           https://ko-fi.com/breatfr
PayPal          https://paypal.me/breat
==/Support== */

@-moz-document domain("copilot.microsoft.com") {
/* =============================================
    Whole website
============================================= */
    /* Versions */
    :root {
        --themeversion: 'Theme v1.0.10 by BreatFR (https://breat.fr)';
        --install: ' usercssjs.breat.fr/m/microsoft-copilot';
		--help: ' discord.gg/Q8KSHzdBxs';
        --support1: ' ko-fi.com/breatfr ';
        --support2: ' paypal.me/breat';
        --fontsize: fontsize;
    }

    @media screen and (min-width: 900px) {
		main {
			margin-top: 60px !important;
		}
        body::after,
		body::before {
			background: linear-gradient(88.55deg, rgb(139, 109, 255) 22.43%, rgb(254, 132, 132) 92.28%);
            background-clip: text;
            color: transparent;
			display: block;
            font-family: inherit;
            font-size: 1.2rem;
			line-height: calc(60px / 2);
            pointer-events: none;
            position: absolute;
            text-align: center;
			top: 6px;
			transition: left 1s ease;
            width: auto;
            white-space: pre-line;
            z-index: 9999;
		}
		body::after {
            content: var(--themeversion) '\A Help: ' url("https://code.breat.fr/share/images/icons/discord.png") var(--help);
			left: 0;
			transition: left 1s ease;
        }
        html:has([class*="md:w-[52px]"] > [data-testid="sidebar-container"]) body::after {
			left: 15%;
        }
		html:has([class*="md:w-[290px]"] > [data-testid="sidebar-container"]) body::after {
			left: 30%;
        }

		body::before {
            content: 'Install & Infos: ' url("https://code.breat.fr/share/images/icons/breat.fr.png") var(--install) '\A Support me: ' url("https://code.breat.fr/share/images/icons/ko-fi.png") var(--support1) ' · ' url("https://code.breat.fr/share/images/icons/paypal.png") var(--support2);
            right: 15%;
        }
    }

    /* Font size */
    .text-3xs,
    .text-base,
    .text-sm,
    a,
    p,
    span,
 	strong,
 	textarea {
        font-size: fontsize !important;
        line-height: 1.5 !important;
    }

    if hidecopilotpro {
		[data-testid="sidebar-settings-menu"] > div > div:nth-last-of-type(3),
		[data-testid="sidebar-settings-menu"] > div > button:last-of-type,
		[data-testid="sidebar-settings-button"] div[role="button"]:has(>span.truncate),
        button[title*="Copilot Pro"] {
            display: none;
        }
    }

    if hidedownloadapp {
        [data-testid="settings-menu"] > div > div:nth-of-type(3),
        [data-testid="settings-menu"] > div > div:nth-of-type(4) {
            display: none;
        }
    }

    if hidescrollbars {
        * {
            scrollbar-width: none !important;
        }
    }

    if widemode {
        .w-prompt-sign-in,
        .max-w-chat {
            max-width: 100%;
            width: 100%;
        }
        .max-h-\\[110px\\] {
            max-height: unset;
        }
		.truncate {
			max-width: fit-content;
			text-overflow: unset;
		}

		/* Menu */
		div[style="width: 290px;"]:has(>[data-testid="sidebar-container"]),
		[data-testid="sidebar-settings-menu"] {
			max-height: unset;
			width: auto;
			white-space: nowrap;
		}
		[data-testid="sidebar-settings-menu"] button {
			column-gap: 1em;
		}

		/* Homepage shortcuts */
		[data-testid="composer"] > div > div:nth-of-type(2) > div > div {
			justify-content: space-evenly;
		}
		[data-testid="composer"] > div > div:nth-of-type(2) > div > div > button {
			flex-basis: 22%;
			justify-content: center;
		}
    }
}

@-moz-document url-prefix("https://copilot.microsoft.com/chats/") {
/* ================================================================
    Chats
================================================================ */
	if chatmode {
        [data-content="ai-message"],
 		[id*="-user-message"] {
            max-width: 80%;
        }
		[id*="-user-message"] {
			margin-left: auto;
		}
		.max-w-user-text-message {
			max-width: 100%;
		}
    }

    if widemode {
		[data-testid="settings-wrapper"] {
			margin-top: 0;
			margin-inline-end: 0;
			position: fixed;
			right: 1em;
			top: 1.25em;
			z-index: 9999 !important;
		}
		[id*="-user-message"] div:has(div>img) {
			display: flex;
			justify-content: flex-end;
			margin-left: auto;
		}
    }
}

@-moz-document url("https://copilot.microsoft.com/discover") {
/* ===================================================
    Discover page
=================================================== */
    if widemode {
        [data-testid="discover-page"] > div:nth-of-type(2) {
            align-items: flex-start;
            display: flex;
            flex-wrap: wrap;
            gap: 2em;
            justify-content: space-evenly;
            max-width: 100%;
        }
        [data-testid="discover-page"] > div:nth-of-type(2) > section {
            display: flex;
            flex-direction: column;
            width: 100%;
        }
        [data-testid="discover-page"] > div:nth-of-type(2) > section > div {
            align-items: center;
            display: flex;
            flex-flow: wrap;
            justify-content: space-evenly;
        }
        [data-testid="discover-page"] > div:nth-of-type(2) > section > div > div {
            width: 30%;
        }
        [data-testid="discover-page"] > div:nth-of-type(2) > section .max-h-discover-card-large,
        [data-testid="discover-page"] > div:nth-of-type(2) > section .max-h-discover-card-small {
            align-items: center;
            display: flex;
            flex-direction: column;
            height: 26rem;
            justify-content: center !important;
            max-height: 26rem !important;
            text-align: center;
        }
        [data-testid="discover-page"] > div:nth-of-type(2) > section > div > div > div {
            display: flex;
            flex-direction: column;
        }

        [data-testid="discover-page"] > div:nth-of-type(2) > section > div > div img {
            clip-path: var(--clip-path-squircle-36);
            flex: 1 1 auto;
            object-fit: cover;
            width: 100%;
        }
        [data-testid="discover-page"] > div:nth-of-type(2) > section > div > div img[src*="https://img-s-msn-com.akamaized.net"] {
            flex: 0 1 auto;
            height: auto;
            width: fit-content;
        }
    }
}

@-moz-document url-prefix("https://copilot.microsoft.com/discover/weather/"), url-prefix("https://www.msn.com/") {
/* ==========================================================
    Weather page
========================================================== */
    if hidescrollbars {
        * {
            scrollbar-width: none !important;
        }
    }

	if widemode {
		.sectionContainer-DS-EntryPoint1-1 {
			display: flex;
		}
		.weatherContainer-DS-EntryPoint1-1[style="margin-top: 112px;"] {
			display: flex !important;
			flex: 1 1 100% !important;
			margin-bottom: 0 !important;
			margin-top: 1em !important;
			overflow: visible !important;
        }
		#weather-forecast-v3-layout-root {
			padding: 0 1em;
			width: 100%;
		}
		#weather-forecast-v3-layout-root > div {
			display: flex !important;
			flex-direction: column;
			margin-right: 2em;
			padding: 1em 1em 0 1em;
		}
		#weather-forecast-v3-layout-root > div > div {
			width: 100%;
		}
		#weather-forecast-v3-layout-root > div > div,
		#weather-forecast-v3-layout-root > div > div > div,
		#weather-forecast-v3-layout-root > div > div > div > div,
		#weather-forecast-v3-layout-root > div > div > div > div > div {
			max-width: 100% !important;
		}
		#weather-forecast-v3-layout-root > div > div:nth-of-type(3) > div > div > div > div:nth-of-type(2) {
			justify-content: space-evenly;
		}
    }
}

@-moz-document url("https://copilot.microsoft.com/imagine") {
/* ==========================================================
    Imagine page
========================================================== */
    if widemode {
        [data-testid="gallery-page"] > div:nth-of-type(2) {
            padding: 0 1em !important;
        }
    }
}

@-moz-document url("https://copilot.microsoft.com/labs") {
/* =======================================================
    Labs page
======================================================= */
    if widemode {
        .max-w-labs {
            max-width: 100%;
            width: 100%;
        }
    }
}
