/*
 * ==========================================================
 * GENIUS MOVIES
 * SMART TV / 10-FOOT UI V1
 *
 * Active ONLY when:
 * html[data-gm-tv="1"]
 * ==========================================================
 */


/* =========================================================
   GLOBAL TV BASE
   ========================================================= */

html[data-gm-tv="1"]{
    scroll-behavior:smooth;
}

html[data-gm-tv="1"],
html[data-gm-tv="1"] body{
    min-width:0 !important;
    min-height:100% !important;
}

html[data-gm-tv="1"] body{
    font-size:19px !important;
    line-height:1.48 !important;
    overflow-x:hidden !important;
}


/*
 * Leave an overscan-safe visual area.
 * We don't force body padding because heroes/player
 * may intentionally be full width.
 */

html[data-gm-tv="1"] main{
    scroll-padding-top:110px !important;
    scroll-padding-bottom:80px !important;
}


/* =========================================================
   REMOTE FOCUS
   ========================================================= */

html[data-gm-tv="1"] a:focus,
html[data-gm-tv="1"] button:focus,
html[data-gm-tv="1"] input:focus,
html[data-gm-tv="1"] select:focus,
html[data-gm-tv="1"] textarea:focus,
html[data-gm-tv="1"] video:focus,
html[data-gm-tv="1"] [tabindex]:focus,
html[data-gm-tv="1"] [role="button"]:focus{
    outline:4px solid #ffffff !important;
    outline-offset:5px !important;

    box-shadow:
        0 0 0 3px rgba(0,0,0,.72),
        0 0 0 8px rgba(255,255,255,.24),
        0 14px 35px rgba(0,0,0,.36)
        !important;

    position:relative;
    z-index:80;
}


html[data-gm-tv="1"][data-gm-theme="light"] a:focus,
html[data-gm-tv="1"][data-gm-theme="light"] button:focus,
html[data-gm-tv="1"][data-gm-theme="light"] input:focus,
html[data-gm-tv="1"][data-gm-theme="light"] select:focus,
html[data-gm-tv="1"][data-gm-theme="light"] textarea:focus,
html[data-gm-tv="1"][data-gm-theme="light"] [tabindex]:focus{
    outline-color:#111 !important;
}


/* Cards grow slightly when selected */

html[data-gm-tv="1"] .movie-card:focus,
html[data-gm-tv="1"] .cinematic-card:focus,
html[data-gm-tv="1"] .gm-home-live-card:focus,
html[data-gm-tv="1"] .gm-poster-choice:focus,
html[data-gm-tv="1"] .gm-rec-card:focus,
html[data-gm-tv="1"] .channel-card:focus,
html[data-gm-tv="1"] .live-channel-card:focus{
    transform:scale(1.045) !important;
    z-index:70 !important;
}


/* Show poster play overlay with TV focus too */

html[data-gm-tv="1"]
.movie-card:focus
.poster-overlay,

html[data-gm-tv="1"]
.cinematic-card:focus
.poster-overlay{
    opacity:1 !important;
    visibility:visible !important;
}


/* =========================================================
   HEADER / NAV
   ========================================================= */

html[data-gm-tv="1"] .site-header,
html[data-gm-tv="1"] header{
    min-height:78px;
}


html[data-gm-tv="1"] .site-header a,
html[data-gm-tv="1"] header nav a,
html[data-gm-tv="1"] header button{
    min-height:48px;
    min-width:48px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    font-size:18px;
}


/*
 * Smart TV doesn't need phone bottom navigation.
 */

html[data-gm-tv="1"] .gm-real-bottom-nav,
html[data-gm-tv="1"] .gm-global-mobile-nav,
html[data-gm-tv="1"] .gm-mobile-bottom-nav,
html[data-gm-tv="1"] .mobile-bottom-nav{
    display:none !important;
}


/* =========================================================
   SEARCH / FILTERS / FORMS
   ========================================================= */

html[data-gm-tv="1"] input,
html[data-gm-tv="1"] select,
html[data-gm-tv="1"] textarea{
    min-height:52px !important;

    font-size:18px !important;

    padding-top:10px !important;
    padding-bottom:10px !important;
}


html[data-gm-tv="1"] button,
html[data-gm-tv="1"] .btn,
html[data-gm-tv="1"] .button{
    min-height:50px;
}


html[data-gm-tv="1"] .browse-tabs a,
html[data-gm-tv="1"] .chip-row a,
html[data-gm-tv="1"] .chip,
html[data-gm-tv="1"] .filter-chip{
    min-height:48px !important;

    padding:
        11px
        20px
        !important;

    font-size:17px !important;
}


/* =========================================================
   MOVIE / CONTENT GRIDS
   ========================================================= */

html[data-gm-tv="1"] .movie-grid,
html[data-gm-tv="1"] .cinematic-grid{
    display:grid !important;

    grid-template-columns:
        repeat(
            auto-fill,
            minmax(180px,1fr)
        )
        !important;

    gap:
        28px
        24px
        !important;

    padding-left:3.2vw !important;
    padding-right:3.2vw !important;
}


html[data-gm-tv="1"] .movie-card,
html[data-gm-tv="1"] .cinematic-card{
    border-radius:14px !important;

    transition:
        transform .14s ease,
        box-shadow .14s ease
        !important;

    scroll-margin:
        125px
        40px
        !important;
}


html[data-gm-tv="1"] .movie-card h3,
html[data-gm-tv="1"] .cinematic-card h3{
    font-size:18px !important;
    line-height:1.32 !important;
}


html[data-gm-tv="1"] .movie-info{
    padding-top:12px !important;
}


html[data-gm-tv="1"] .card-meta{
    font-size:15px !important;
}


/* =========================================================
   HOME HERO / FEATURED
   ========================================================= */

html[data-gm-tv="1"] .gm-featured-root-v3,
html[data-gm-tv="1"] .gm-featured-root,
html[data-gm-tv="1"] .cinematic-hero,
html[data-gm-tv="1"] .home-hero{
    min-height:500px !important;
}


html[data-gm-tv="1"] .gm-featured-actions-row-v3 a,
html[data-gm-tv="1"] .gm-featured-actions-row-v3 button,
html[data-gm-tv="1"] .gm-featured-play-v3,
html[data-gm-tv="1"] .gm-featured-details-v3{
    min-width:170px !important;
    min-height:54px !important;

    font-size:18px !important;
}


html[data-gm-tv="1"] .gm-poster-choice{
    min-width:94px;
    min-height:132px;

    scroll-margin:
        110px
        70px;
}


/* =========================================================
   HOME LIVE TV RAIL
   ========================================================= */

html[data-gm-tv="1"] .gm-home-live-row{
    gap:22px !important;

    padding-top:12px !important;
    padding-bottom:18px !important;

    scroll-behavior:smooth !important;
}


html[data-gm-tv="1"] .gm-home-live-card{
    min-width:210px !important;

    scroll-margin:
        120px
        70px;
}


html[data-gm-tv="1"] .gm-live-scroll-wrap{
    overflow:visible;
}


/* =========================================================
   DETAIL PAGE
   ========================================================= */

html[data-gm-tv="1"] .gm-detail-showcase-v2{
    min-height:680px !important;

    display:flex !important;
    align-items:center !important;
}


html[data-gm-tv="1"] .gm-detail-inner{
    width:92vw !important;
    max-width:1680px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding:
        48px
        0
        !important;

    gap:44px !important;
}


html[data-gm-tv="1"] .gm-detail-poster{
    width:250px !important;
    min-width:220px !important;
}


html[data-gm-tv="1"] .gm-detail-title,
html[data-gm-tv="1"] .gm-detail-showcase-v2 h1{
    font-size:44px !important;
    line-height:1.1 !important;
}


html[data-gm-tv="1"] .gm-detail-overview,
html[data-gm-tv="1"] .gm-detail-description{
    max-width:900px !important;

    font-size:19px !important;
    line-height:1.58 !important;
}


html[data-gm-tv="1"] .gm-detail-actions{
    gap:18px !important;

    margin-top:26px !important;
}


html[data-gm-tv="1"] .gm-detail-actions a,
html[data-gm-tv="1"] .gm-detail-actions button,
html[data-gm-tv="1"] .gm-detail-play,
html[data-gm-tv="1"] .gm-circle-action{
    min-height:56px !important;
    min-width:150px;

    font-size:18px !important;
}


html[data-gm-tv="1"] .gm-detail-genres span,
html[data-gm-tv="1"] .gm-detail-cast span{
    font-size:16px !important;
}


/* Seasons / episodes */

html[data-gm-tv="1"] .seasons{
    max-width:1680px;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:4vw !important;
    padding-right:4vw !important;
}


html[data-gm-tv="1"] .seasons a,
html[data-gm-tv="1"] .seasons button{
    min-height:52px;

    font-size:17px;
}


/* =========================================================
   MOVIE / EPISODE PLAYER
   ========================================================= */

html[data-gm-tv="1"] .gwatch{
    width:100% !important;
    max-width:1780px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding:
        28px
        3.5vw
        70px
        !important;
}


html[data-gm-tv="1"] .gwatch h1{
    font-size:28px !important;
    line-height:1.22 !important;
}


html[data-gm-tv="1"] .gplayer{
    width:100% !important;

    border-radius:12px !important;
}


html[data-gm-tv="1"] .gplayer video,
html[data-gm-tv="1"] .gplayer .plyr,
html[data-gm-tv="1"] .gplayer .plyr__video-wrapper{
    width:100% !important;

    max-height:76vh !important;
}


html[data-gm-tv="1"] .gm-player-foot{
    min-height:64px;

    display:flex;
    align-items:center;

    gap:20px;
}


html[data-gm-tv="1"] .gm-stream-state{
    font-size:16px !important;
}


html[data-gm-tv="1"] .gm-player-actions{
    display:flex;
    gap:14px;

    flex-wrap:wrap;
}


html[data-gm-tv="1"] .gm-action,
html[data-gm-tv="1"] .gm-retry{
    min-height:50px !important;
    min-width:130px !important;

    display:inline-flex !important;
    align-items:center;
    justify-content:center;

    padding:
        10px
        20px
        !important;

    font-size:17px !important;
}


/* Up Next */

html[data-gm-tv="1"] .gm-upnext{
    scroll-margin-top:110px;
}


html[data-gm-tv="1"] .gm-upnext h2{
    font-size:25px !important;
}


html[data-gm-tv="1"] .gm-rec-list{
    gap:16px !important;
}


/* Plyr controls */

html[data-gm-tv="1"] .plyr__controls button{
    min-width:46px !important;
    min-height:46px !important;
}


html[data-gm-tv="1"] .plyr__control{
    transform:none;
}


/* =========================================================
   LIVE TV PAGE
   ========================================================= */

html[data-gm-tv="1"] .live-tv-page,
html[data-gm-tv="1"] .gm-live-tv-page,
html[data-gm-tv="1"] .live-page{
    font-size:18px;
}


html[data-gm-tv="1"] .live-tv-grid,
html[data-gm-tv="1"] .channel-grid,
html[data-gm-tv="1"] .gm-live-grid{
    gap:20px !important;
}


html[data-gm-tv="1"] .channel-card,
html[data-gm-tv="1"] .live-channel-card,
html[data-gm-tv="1"] .gm-live-channel-card{
    min-height:90px;

    scroll-margin:
        120px
        60px;
}


html[data-gm-tv="1"] #gm-live-tv-page-notice,
html[data-gm-tv="1"] .gm-live-tv-page-notice{
    font-size:17px !important;
}


/* Live TV player */

html[data-gm-tv="1"] .live-player,
html[data-gm-tv="1"] .gm-live-player,
html[data-gm-tv="1"] .live-tv-player{
    max-height:78vh;
}


html[data-gm-tv="1"] .live-player video,
html[data-gm-tv="1"] .gm-live-player video,
html[data-gm-tv="1"] .live-tv-player video{
    max-height:78vh !important;
}


/* =========================================================
   MODALS / CONSENT / NOTICES
   ========================================================= */

html[data-gm-tv="1"] [role="dialog"]{
    font-size:18px;
}


html[data-gm-tv="1"] [role="dialog"] button,
html[data-gm-tv="1"] [role="dialog"] a{
    min-height:50px;
}


/* =========================================================
   720P TV
   ========================================================= */

@media
(max-height:800px){

    html[data-gm-tv="1"] body{
        font-size:17px !important;
    }


    html[data-gm-tv="1"] .movie-grid,
    html[data-gm-tv="1"] .cinematic-grid{
        grid-template-columns:
            repeat(
                auto-fill,
                minmax(155px,1fr)
            )
            !important;

        gap:
            20px
            18px
            !important;
    }


    html[data-gm-tv="1"] .gm-detail-showcase-v2{
        min-height:540px !important;
    }


    html[data-gm-tv="1"] .gm-detail-poster{
        width:205px !important;
        min-width:190px !important;
    }


    html[data-gm-tv="1"] .gm-detail-title,
    html[data-gm-tv="1"] .gm-detail-showcase-v2 h1{
        font-size:35px !important;
    }


    html[data-gm-tv="1"] .gplayer video,
    html[data-gm-tv="1"] .gplayer .plyr{
        max-height:72vh !important;
    }
}


/* =========================================================
   4K / VERY LARGE TV
   ========================================================= */

@media
(min-width:2000px){

    html[data-gm-tv="1"] body{
        font-size:23px !important;
    }


    html[data-gm-tv="1"] .movie-grid,
    html[data-gm-tv="1"] .cinematic-grid{
        grid-template-columns:
            repeat(
                auto-fill,
                minmax(230px,1fr)
            )
            !important;

        gap:
            38px
            32px
            !important;
    }


    html[data-gm-tv="1"] .movie-card h3,
    html[data-gm-tv="1"] .cinematic-card h3{
        font-size:22px !important;
    }


    html[data-gm-tv="1"] .gm-detail-poster{
        width:330px !important;
    }


    html[data-gm-tv="1"] .gm-detail-title,
    html[data-gm-tv="1"] .gm-detail-showcase-v2 h1{
        font-size:58px !important;
    }


    html[data-gm-tv="1"] .gm-action,
    html[data-gm-tv="1"] .gm-retry,
    html[data-gm-tv="1"] .gm-detail-actions a,
    html[data-gm-tv="1"] .gm-detail-actions button{
        min-height:66px !important;

        font-size:21px !important;
    }
}


/* =========================================================
   TV MODE MARKER
   ========================================================= */

html[data-gm-tv="1"] body:after{
    content:"";

    position:fixed;

    width:1px;
    height:1px;

    pointer-events:none;
    opacity:0;
}

