/* ==UserStyle==
@name           FANBOX optimized & customizable for wide screens
@description    FANBOX website interface is reworked to offer a cleaner and comfortable experience on desktop, with visual adjustments that adapt to your needs.
@version        1.0.7
@author         BreatFR (https://breat.fr)
@namespace      https://breat.fr
@homepageURL    https://usercssjs.breat.fr/f/fanbox
@updateURL      https://code.breat.fr/f/fanbox/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    text        fontsize        "Custom font size"  1.2rem
@var    checkbox    hidescrollbars  "Hide scrollbars"   1
@var    checkbox    hidecomments    "Hide comments"     0
@var    checkbox    hidecover       "Hide cover"        1
@var    checkbox    hidesupport     "Hide support"      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("fanbox.cc") {
/* =================================
	FANBOX
================================= */
    /* Versions */
    :root {
        --themeversion: 'Theme v1.0.7 by BreatFR (https://breat.fr)';
        --install: ' usercssjs.breat.fr/f/fanbox';
		--help: ' discord.gg/Q8KSHzdBxs';
        --support1: ' ko-fi.com/breatfr ';
        --support2: ' paypal.me/breat';
    }

    @media screen and (min-width: 900px) {
        [class*="Header__Wrapper"]::after,
		[class*="Header__Wrapper"]::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(64px / 2);
            pointer-events: none;
            position: fixed;
            text-align: center;
			top: 0;
            width: auto;
            white-space: pre-line;
            z-index: 9999;
		}
        [class*="Header__Wrapper"]::after {
            content: var(--themeversion) '\A Help: ' url("https://code.breat.fr/share/images/icons/discord.png") var(--help);
			left: 25%;
        }
		[class*="Header__Wrapper"]::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: 25%;
        }
    }

    * {
        box-sizing: border-box;
    }

    /* Custom font size */
    [class*="FeaturedTag__Inner"] > div,
    [class*="LanguageButton__LanguageWrapper"],
    [class*="links__Anchor"],
    [class*="links__Link"],
    [class*="links__LinkToPixivWrapper"],
    [class*="SideMenuForWidthLarge__Wrapper"] *,
    [class*="styled__CommentText"],
    [class*="styled__Description"],
    [class*="styled__UserName"],
    [class*="TextInput__MultiLineInput"],
    [class*="ToggleSwitch__Label"] {
        font-size: fontsize !important;
        line-height: 1.5 !important;
    }

    /* Images corner in posts */
	[class*="styled__EditorWrapper"],
    [class*="styled__Wrapper"] {
        background: transparent !important;
    }
    figure {
        margin: 16px 0 !important;
    }
    article img,
    article video,
    [class*="CreatorPostItem__Wrapper"],
    [class*="FeaturedTag__Wrapper"],
    [class*="PlanItem__Wrapper"],
	[class*="PostItem__Wrapper"],
    [class*="ProfileItem__Thumbnail"] {
        border-radius: 1em;
    }

    [class*="FollowButton__StyledCommonButton"] {
        background: rgb(255, 109, 0);
    }
    [class*="FollowButton__StyledCommonButton"]:hover {
        background: rgb(255, 74, 0);
    }

    if hidescrollbars {
        *,
        :root ::-webkit-scrollbar {
            scrollbar-width: none !important;
            -ms-overflow-style: none !important;
            -moz-overflow-style: none !important;
            -webkit-overflow-style: none !important;
        }
        ::-webkit-scrollbar {
            display: none;
            width: 0;
        }
    }

    if hidesupport {
        [class*="TwoColumnLayout__MainColumn"] {
            width: calc(100% + 284px + 1em);
        }
        [class*="TwoColumnLayout__SideColumn"] {
            display: none;
        }
    }

    if widemode {
        body:has([class*="AppFrame__SideMenuWrapper"]) {
            [class*="AppFrame__Wrapper"] {
                padding-left: 283.13px;
                width: auto;
            }
            [class*="AppFrame__SideMenuWrapper"] {
                width: auto !important;
            }
        }

        body:not(:has([class*="AppFrame__SideMenuWrapper"])) {
            [class*="AppFrame__Wrapper"] {
                padding-left: 0;
                width: auto;
            }
        }

        [class*="AppFrame__Content"] > div,
        [class*="AppFrame__Content"] > main > div,
        [class*="FeaturedTagList__Wrapper"],
        [class*="Footer__Wrapper-sc"] > div,
        [class*="PlanListPage__OuterWrapper-sc"] > div,
        [class*="PostPage__InnerWrapper-sc"] > div:nth-of-type(2),
        [class*="PostPage__OuterWrapper-sc"],
        [class*="ResponsiveWrapper__Outer-sc"] > div,
        [class*="ShopPage__InnerWrapper"],
        [class*="TwoColumnLayout__Wrapper"] {
            max-width: 100% !important;
            width: 100% !important;
        }
        .profile-items,
        [class*="PlanList__List"],
        [class*="PostPage__InnerWrapper-sc"] > div:nth-of-type(2) > div:nth-of-type(1) > div > div,
        [class*="PostPage__OuterWrapper-sc"] > div > div:nth-of-type(2) > div > div,
        [class*="ShopPage__InnerWrapper"] > div > div {
            align-items: center;
            display: flex;
            flex-wrap: wrap;
            gap: 1em;
            justify-content: space-evenly;
        }

        [class*="CreatorPostList__CardsWrapper"] > a,
        [class*="CreatorPostList__InnerWrapper"] > a,
        [class*="ShopPage__InnerWrapper"] > div > div > a {
            border-radius: 1em;
            width: 300px;
        }
        [class*="profile-item-wrapper"] {
            margin: 0 !important;
        }
        [class*="styled__Wrapper"] {
            padding: 0;
        }

        /* Save some place in public draft posts */
        div[data-block="true"]:has(br[data-text="true"]) ~ div[data-block="true"]:has(br[data-text="true"]) {
            display: none;
        }

        /* Menu */
        [class*="HeaderMenuButton__Balloon"] * {
            height: auto;
        }

        /* Plan */
        [class*="PlanItem__Wrapper"] {
            width: calc(33% - 10px);
        }
        [class*="TwoColumnLayout__SideColumn"] [class*="PlanItem__Wrapper"] {
            width: 284px;
        }

        /* Post cover */
        [class*="Cover__StyledFullWidthWrapper"] {
            margin-top: 2em !important;
        }

        /* Tags */
        [class*="FeaturedTag__Wrapper"] {
            display: flex;
            flex-direction: column;
            height: 260px
        }
        [class*="FeaturedTagList__LeftButtonWrapper"],
        [class*="FeaturedTagList__RightButtonWrapper"] {
            height: 260px
        }
        [class*="FeaturedTag__Inner"] {
            display: flex;
            flex-direction: column;
            gap: 1em;
        }
        [class*="FeaturedTagList__ButtonFrame"] {
            height: 3em !important;
            width: 3em !important;
        }
        [class*="FeaturedTagList__LeftButtonWrapper"] svg,
        [class*="FeaturedTagList__RightButtonWrapper"] svg {
            height: 2em;
            width: 2em;
        }

        /* Fee Requirement */
        [class*="styled__Detail"]:has([class*="FeeRequirementBox__Wrapper"]) {
            padding: 16px 16px 24px 16px;
        }
        [class*="CreatorPostItem__FeeRequirementWrapper"] {
            width: 100%;
        }
        [class*="FeeRequirementBox__Wrapper"] {
            display: flex;
            flex-direction: column;
            gap: 1em;
        }

        /* Textarea in comments */
        [class*="styled__Wrapper"],
        [class*="styled__FormWrapper"] {
            align-items: center;
        }
        textarea[placeholder="Leave a comment..."] {
            border-radius: 32px !important;
            padding: 16px 44px 16px 16px !important;
        }

        /* Avatars in comments */
        [class*="styled__Wrapper"] > [class*="UserIcon__Icon"],
        [class*="styled__Wrapper"] > [class*="UserIcon__NoIcon"] {
            aspect-ratio: 1 / 1;
            background-size: cover;
            height: 88px;
            width: auto;
        }

        /* Comments */
        [class*="styled__CommentText"] {
            white-space: normal;
        }
        [class*="styled__CommentThread"] {
            margin-left: 0;
        }

        /* Pagination */
        [class*="PostPage__OuterWrapper"] {
            min-height: 0;
        }
        [class*="AppFrame__Content"] {
            padding-bottom: 1em;
        }
        [class*="CreatorPostList__PaginationWrapper"] {
            padding-top: .5em;
        }
        [class*="CreatorPostList__PaginationWrapper"],
        [class*="CreatorPostList__PaginationWrapper"] > div,
        [class*="CreatorPostList__PaginationWrapper"] > div > div {
            display: flex;
            justify-content: space-evenly;
            padding-top: 0;
            width: 100%;
        }
        [class*="Pagination__MobileWrapper"] {
            display: none !important;
        }
        [class*="Pagination__StyledLink"]:hover {
            background: rgba(16, 16, 16, .3);
            border-radius: 50%;
            color: white;
        }

        /* Footer */
        [class*="FooterLinks__NextPostWrapper"],
        [class*="FooterLinks__PrevPostWrapper"] {
            width: auto;
        }
        [class*="styled__FullWidthWrapper"] {
            margin: 0;
        }
		[class*="styled__FullWidthWrapper"] > div {
			width: 100% !important;
		}
        [class*="Footer__LinksWrapper"] {
            display: flex;
            flex-direction: column;
        }
        [class*="Footer__LinksWrapper"] > div {
            justify-content: space-evenly;
        }
		[class*="FooterLinks__PostListLink"] {
			min-width: fit-content !important;
			padding: 0 1em;
		}
    }

    if !widemode {
        .fanbox-download-btn {
            font-size: .9em !important;
        }
    }

    #kemono-search-button {
        left: 18em !important;
        transform: translateY(50%) !important;
		top: 0 !important;
    }
}

@-moz-document url-prefix("https://www.fanbox.cc/home/pickup"), url-prefix("https://www.fanbox.cc/creators/") {
    /* Creators list */
    if widemode {
        [class*="styled__Wrapper"] {
            display: flex;
            flex-flow: unset;
            flex-direction: column-reverse;
        }
        [class*="styled__Info"] {
            width: 100%;
        }
        [class*="styled__ProfileItemWrapper"] {
            padding-bottom: 16px;
        }
        [class*="styled__ProfileItemWrapper"] > div > div > div > div > div {
            border-radius: .5em;
        }
        [class*="styled__Description"] {
            max-height: unset;
        }
    }
}

@-moz-document regexp("https://www\\.fanbox\\.cc/[^/]+/posts/[^/]+"), regexp("https://.*\\.fanbox\\.cc/posts/.+") {
    /* Post page */
    if hidecomments {
        [class*="PostDetail__OuterWrapper"] {
            display: none;
        }
    }

    if hidecover {
		[class*="AspectRatioFixedWrapper__WrapperWrapper"]:has(> div > a > img[alt="Cover"]),
        [class*="CoverImage__CoverWrapper"],
        [class*="CreatorPageTab__Wrapper"],
        [class*="ResponsiveWrapper__Outer"] {
            display: none !important;
        }
		[class*="Cover__StyledFullWidthWrapper"] {
			margin: 0 !important;
		}
    }
}