/*
 * MIT No Attribution
 *
 * Copyright (c) 2023 Hyper
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy of this
 * software and associated documentation files (the "Software"), to deal in the Software
 * without restriction, including without limitation the rights to use, copy, modify,
 * merge, publish, distribute, sublicense, and/or sell copies of the Software, and to
 * permit persons to whom the Software is furnished to do so.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
 * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
 * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
 * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
 * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
 * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */

/* ==UserStyle==
@name           9Anime Theater Mode
@namespace      userstyles.world/user/hyper
@version        1.1.6
@description    Forces the AniWave (9Anime) video player to behave like YouTube's theater mode.
@author         Hyper
@license        MIT-0
@preprocessor   stylus
@var            checkbox hideAlert "Hide Warning Banner" 1
@var            checkbox restrictPlayer "Restrict Player Size" 1
@var            range maxHeight "Player: Max Height" [900, 720, 1080, 10, "px"]
@var            checkbox unrestrictPlayerWidth "Unrestrict Player Width" 1
@var            checkbox restrictContent "Restrict Content Width" 1
@var            range contentWidth "Content: Max Width" [1780, 1280, 1920, 10, "px"]
@var            checkbox excludeHeaderFooter "Exclude Header & Footer" 1
@var            checkbox hideReactions "Hide Disqus Reactions" 1
@homepageURL    https://userstyles.world/style/10403
==/UserStyle== */

/* DEPRECATED: UserCSS Variables
@var            range maxHeight "Player Max Height" [900, 720, 1080, 10, "px"]
@var            select maxHeight "Player Max Size" { "1080p": "1080px", "900p*": "900px", "720p": "720px"}
*/

@-moz-document regexp("^https:\\/\\/aniwave\\.(?:to|ws|vc|li)\\/watch\\/[^/]+(?:\\/[^/]+)?$") {
    /* AniWave (9Anime) Watch Page */

    /* Remove Width Rules */
    div#watch-main > div.container.watch-container, div#watch-second > div.container.watch-container, div#wrapper > footer > div.container, div#wrapper > header > div.container {
        max-width: none !important;
    }

    if restrictContent {
       /* Selectively Reapply Width Rules */
        @media (min-width: contentWidth + 40) {
            unless hideAlert {
                div[role="alert"] {
                    max-width: contentWidth !important;
                    margin-left: "calc(calc(100% - %s) / 2)" % contentWidth !important;
                }
            }

            /* p#malp Belongs to MAL-Sync */
            div#w-servers, div#w-episodes, div#w-info, div#watch-main div.alert.next-episode, section.w-side-section, div#watch-second aside.main, section#w-seasons, p#malp {
                max-width: contentWidth !important;
                margin-left: "calc(calc(100% - %s) / 2)" % contentWidth !important;
            }

            unless excludeHeaderFooter {
                div#wrapper > footer > div.container, div#wrapper > header > div.container {
                    max-width: contentWidth + 20 !important;
                }
            }
        }
    }

    /* Copied from Media Query to Fix Header Spacing */
    header #quick-menu {
        margin-left: 10px !important;
        width: auto !important;
    }
    header #quick-menu > a, header #quick-menu > div {
        margin: 0 10px !important;
    }
    
    /* Restrict Player Size */
    if restrictPlayer {
        maxWidth = (16 / 9) * maxHeight

        /* Restrict Player Height */
        div#w-player > div#player-wrapper > div#player {
            max-height: maxHeight !important;
        }
        div#w-player > div#player-wrapper {
            padding-bottom: "min(%s, 55%)" % maxHeight !important;    
        }
        
        unless unrestrictPlayerWidth {
            /* Restrict Player Width */
            @media (min-width: maxWidth + 40) {
                div#player-wrapper, div#controls {
                    max-width: maxWidth !important;
                    margin-left: "calc(calc(100% - %s) / 2)" % maxWidth !important;
                }
            }
        }
    }
    
    /* Hide Alert Bannner */
    if hideAlert {
        div[role="alert"] {
            display: none !important;
        }
        div#body {
            margin-top: 0 !important;
        }
        div#wrapper > header {
            margin-bottom: 0 !important;
        }
        aside.main {
            margin-top: -20px !important;
        }
    }
    
    /* Hide Expand Button */
    div.ctrl.expand {
        display: none !important;
    }
    
    /* Fix Pop-over Bug with "Add skip time" Button */
    div#controls div.skiptime i {
        pointer-events: none;
    }
    
    /* Unmask Preview Image */
    div#player::before {
        background: none !important;
    }
    
    /* Unstretch Preview Image */
    div#player {
        background-size: contain !important;
        background-repeat: no-repeat !important;
    }
    
    /* Copied from Existing Media Queries that Vertically Isolate Player */
    div.watch-container > div.aside-wrapper {
        display: unset !important;
    }
    div.aside-wrapper > aside.main {
        width: 100% !important;
        padding: 0 !important;
        min-width: unset !important;
        margin-bottom: 30px !important;
    }
    aside.main > div#w-media {
        display: unset !important;
        flex-direction: column !important;
    }
    div#w-media > div#w-episodes {
        width: 100% !important;
        /* Made Unimportant */
        max-width: unset;
        margin-top: 10px !important;
        margin-bottom: 10px !important;
        order: 3 !important;
    }
    div#w-media > div#w-player {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    div#w-episodes > div.body {
        max-height: 300px !important;
        overflow-y: auto !important;
    }
    div#w-episodes > div.body > div.episodes {
        max-height: 300px !important;
        position: unset !important;
        overflow-y: auto !important;
    }
    div.aside-wrapper > aside.sidebar {
        display: unset !important;
        min-width: unset !important;
        width: 100% !important;
        padding: 0 !important;
        background: 0 0 !important;
    }
    section#w-related > div.body > div.tab-content {
        position: static !important;
        max-height: 360px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }
    section#w-related > div.body > div.tab-content > div.inner > div.side.items {
        margin-left: -5px !important;
        margin-right: -5px !important;
    }
    section#w-related > div.body > div.tab-content > div.inner > div.side.items > a.item {
        width: calc(50% - 10px) !important;
        float: left !important;
        margin: 5px !important;
    }
    div#body > div#watch-main {
	    margin-bottom: 0 !important;
    }
}

@-moz-document domain("mp4upload.com") {
    /* mp4upload Player Shennanigans */
    
    /* Get Rid of Inexplicable 8px Margin */
    body {
        margin-bottom: 0 !important;
    }
}

@-moz-document regexp("^https:\\/\\/disqus\\.com\\/embed\\/comments\\/\\?base=default&f=9anime-to&t_i=[^&]+&t_u=https%3A%2F%2Faniwave[^/]+$") {
    /* Disqus Comments Section */

    /* Hide Reactions */
    if hideReactions {
        div#reactions__container {
            display: none !important;
        }
    }
}