Clean Youtube by zero41120

/* ==UserStyle==
@name         Clean Youtube
@version      20240423.08.07
@namespace    https://userstyles.world/user/zero41120
@description  Make YouTube look better
@author       zero41120
@license      No License
==/UserStyle== */
@-moz-document domain("youtube.com") {
    /* Remove unless containers that I personaly never click */
    #teaser-carousel,
    #middle-row,
    #categoryPillParent,
    #voice-search-button,
    #hover-overlays,
    #startSegmentButton,
    #sponsor-button,
    #rich-shelf-header,
    #clarify-box,
    #search-icon-legacy,
    .ytp-paid-content-overlay,
    .ytp-autonav-toggle-button-container,
    .ytp-remote-button,
    .button-container.ytd-rich-shelf-renderer,
    .annotation.annotation-type-custom.iv-branding,
    .ytp-suggested-action-badge,
    .ytp-miniplayer-button,
    .ytp-remote-button.ytp-button,
    .ytd-merch-shelf-renderer,
    .ytd-live-chat-frame,
    .ryd-tooltip-new-design,
    ytd-merch-shelf-item-renderer,
    yt-button-view-model,
    ytd-merch-shelf-renderer,
    cancelSegmentButton,
    ytd-metadata-row-container-renderer,
    ytd-clarification-renderer,
    yt-related-chip-cloud-renderer,
    ytd-badge-supported-renderer,
    ytd-download-button-renderer,
    ytd-statement-banner-renderer,
    ytd-clarification-renderer,
    ytd-mini-guide-renderer,
    a.ytp-next-button.ytp-button,
    ytd-video-description-infocards-section-renderer,
    yt-horizontal-list-renderer #right-arrow,
    ytd-reel-shelf-renderer #title-container {
        display: none !important;
    }

    /* Why is everything round conor? */
    #thumbnail,
    #description,
    #time-status,
    #ytd-player,
    #container.ytd-searchbox {
        border-radius: 0px !important;
    }

    #top-row,
    #dismissible,
    #container.ytd-searchbox {
        border: none !important;
    }

    #dismissible {
        margin-bottom: 0px !important;
    }

    #description,
    #description-inner,
    ytd-thumbnail-overlay-time-status-renderer {
        margin: 0px !important;
    }

    .badge-shape-wiz--default.badge-shape-wiz--overlay {
        background-color: black;
    }

    #secondary {
        margin-top: 5px !important;
    }


    ytd-watch-metadata[flex-menu-enabled] #actions.ytd-watch-metadata ytd-menu-renderer.ytd-watch-metadata {
        justify-content: normal;
    }

    .ytd-comments-header-renderer {
        align-items: flex-end !important;
        justify-content: space-between;
    }

    #logo,
    #center, 
    #buttons > ytd-button-renderer,
    #dislike-button,
    #reply-button-end,
    #button.ytd-topbar-menu-button-renderer,
    yt-button-shape.ytd-menu-renderer,
    .yt-sort-filter-sub-menu-renderer,
    .ytd-subscribe-button-renderer,
    .ytd-notification-topbar-button-renderer {
        opacity: 0;
        transition: opacity 0.1s ease-in-out;
    }

    #logo:hover,
    #center:hover,
    #buttons > ytd-button-renderer:hover,
    #dislike-button:hover,
    #reply-button-end:hover,
    #button.ytd-topbar-menu-button-renderer:hover,
    yt-button-shape.ytd-menu-renderer:hover,
    .yt-sort-filter-sub-menu-renderer:hover,
    .ytd-subscribe-button-renderer:hover,
    .ytd-notification-topbar-button-renderer:hover {
        opacity: 1;
    }

    a[href^="/hashtag"],
    .yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--text,
    #more-button,
    #more-replies {
        color: #c4c4c4 !important;
    }

    #description.ytd-watch-metadata {
        background: none;
    }

    button[data-tooltip-target-id="ytp-autonav-toggle-button"] {
        pointer-events: none !important;
    }

    ytd-watch-metadata {
        padding: 0 0 25px 0;
        border-bottom: 1px solid #c4c4c4;
    }

    ytd-menu-renderer {
        flex-direction: row-reverse;
        gap: 0.5rem;
    }

    #secondary {
        padding-top: 0 !important;
    }

    .ytp-right-controls,
    ytd-topbar-logo-renderer {
        filter: grayscale(100%);
    }

    .metadata.ytd-compact-video-renderer {
        display: block;
        height: 100%;
    }

    a.yt-simple-endpoint.ytd-compact-video-renderer {
        display: grid;
        height: 100%;
    }

    #collapse.ytd-text-inline-expander {
        position: absolute;
        top: 0;
        right: 0;
        margin-top: 0;
        background: #272727;
        padding: 0.5rem 1rem;
        border-radius: 18px;
    }
}