/* SPEII NEX 2.8.8.5.3 — Player Cinema Watch Flow Full Fix
   Replaces the old intermediary watch shell with an immersive streaming player.
   Keeps the existing player runtime, Bunny sources, subtitles, ads, Cast and next episode logic. */

body.speii-watch-route,
body.speii-watch-route .page-wrapper,
body.speii-watch-route #main-scrollbar {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    width: 100% !important;
    max-width: none !important;
    overflow-x: hidden !important;
    background: #010208 !important;
}

/* Server-side fallback: the header, sidebar, breadcrumb and footer are not rendered
   by the layout on route watch. These selectors keep legacy cached markup harmless. */
body.speii-watch-route .speii-topbar,
body.speii-watch-route .speii-sidebar,
body.speii-watch-route .breadcrumb-area,
body.speii-watch-route .footer,
body.speii-watch-route .speii-nex-footer,
body.speii-watch-route #preloader {
    display: none !important;
}

body.speii-watch-route .speii-watch-shell,
body.speii-player-cinema-mode .speii-watch-shell {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #010208 !important;
}

body.speii-watch-route .speii-watch-shell > .container-fluid,
body.speii-watch-route .speii-cinema-stage-row,
body.speii-watch-route .speii-cinema-stage-row > [class*="col-"] {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.speii-watch-route .speii-cinema-stage {
    position: relative !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #010208 !important;
    box-shadow: none !important;
}

body.speii-watch-route .speii-cinema-toolbar--overlay {
    position: absolute !important;
    z-index: 120 !important;
    top: clamp(12px, 2.2vw, 28px) !important;
    left: clamp(12px, 2.2vw, 30px) !important;
    right: clamp(12px, 2.2vw, 30px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 0 !important;
    pointer-events: none !important;
}

body.speii-watch-route .speii-cinema-back,
body.speii-watch-route .speii-cinema-toolbar__title {
    pointer-events: auto !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    background: rgba(2,4,12,.62) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.38) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}

body.speii-watch-route .speii-cinema-back {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    color: #fff !important;
    padding: 11px 15px !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

body.speii-watch-route .speii-cinema-toolbar__title {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 1px !important;
    color: #fff !important;
    padding: 9px 13px !important;
    border-radius: 12px !important;
}
body.speii-watch-route .speii-cinema-toolbar__title strong { font-size: 14px !important; }
body.speii-watch-route .speii-cinema-toolbar__title small { color: rgba(255,255,255,.68) !important; font-size: 11px !important; }

/* True cinema viewport: the actual player opens immediately in a full-page stage. */
body.speii-watch-route .main-video {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100vw !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: #000 !important;
}

body.speii-watch-route .main-video > video.video-player,
body.speii-watch-route .main-video > .plyr,
body.speii-watch-route .main-video > .plyr .plyr__video-wrapper,
body.speii-watch-route .main-video > .plyr video,
body.speii-watch-route .main-video .video-player {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100dvh !important;
    min-height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    background: #000 !important;
}

body.speii-watch-route .main-video > .plyr,
body.speii-watch-route .main-video > .plyr .plyr__video-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Secondary information stays available below the fold without disturbing playback. */
body.speii-watch-route .speii-watch-info,
body.speii-watch-route .speii-series-nav,
body.speii-watch-route .event--tab,
body.speii-watch-route .tab-content,
body.speii-watch-route .movie-section {
    max-width: 1480px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.speii-watch-route .speii-watch-info {
    margin-top: 0 !important;
    padding: 22px clamp(16px, 3vw, 36px) !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(8,10,22,.98), rgba(5,7,17,.98)) !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
}

body.speii-watch-route .speii-series-nav,
body.speii-watch-route .event--tab,
body.speii-watch-route .tab-content,
body.speii-watch-route .movie-section {
    padding-left: clamp(14px, 3vw, 34px) !important;
    padding-right: clamp(14px, 3vw, 34px) !important;
}

body.speii-watch-route .movie-section { padding-top: 26px !important; padding-bottom: 54px !important; }

/* Ad, release lock and next-episode layers remain embedded inside the viewport. */
body.speii-watch-route .ad-video.speii-ad-active,
body.speii-watch-route .speii-release-lock,
body.speii-watch-route .speii-next-episode-overlay,
body.speii-watch-route .main-video-lock {
    border-radius: 0 !important;
}

@media (max-width: 720px) {
    body.speii-watch-route .speii-cinema-toolbar--overlay {
        top: 10px !important;
        left: 10px !important;
        right: 10px !important;
    }
    body.speii-watch-route .speii-cinema-back { padding: 9px 12px !important; font-size: 13px !important; }
    body.speii-watch-route .speii-cinema-toolbar__title { display: none !important; }
    body.speii-watch-route .main-video { min-height: 100svh !important; height: 100svh !important; }
}
