/* ============================================
   PLANEA TV - Optimizaciones para SmartTV
   ============================================ */

/* Detección de SmartTV y dispositivos TV */
@media tv, 
       (min-width: 1920px) and (min-height: 1080px),
       (pointer: coarse) and (min-width: 1280px) {
    
    /* Optimizaciones generales para TV */
    html, body {
        overflow: hidden;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    /* Reproductor optimizado para TV */
    .featured-player {
        max-width: 100%;
        margin: 0 auto;
        padding: 20px;
    }

    .featured-player-title {
        font-size: 36px;
        margin-bottom: 24px;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
    }

    .featured-player .video-js {
        min-height: 600px;
        border-radius: 16px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6);
    }

    /* Controles más grandes para control remoto */
    .vjs-control-bar {
        height: 60px !important;
        padding: 10px !important;
    }

    .vjs-big-play-button {
        width: 80px !important;
        height: 80px !important;
        line-height: 80px !important;
        font-size: 40px !important;
        border-radius: 50% !important;
    }

    /* Botones más grandes y accesibles */
    .vjs-play-control,
    .vjs-volume-panel,
    .vjs-fullscreen-control {
        width: 50px !important;
        height: 50px !important;
        font-size: 24px !important;
    }

    /* Lista de canales optimizada para TV */
    #listcanales {
        gap: 20px;
        padding: 20px;
        max-height: 85vh;
    }

    .channelListItem-0-2-140 {
        padding: 15px;
        margin: 8px;
        border-width: 3px;
        transition: all 0.2s ease;
    }

    .channelListItem-0-2-140:focus {
        outline: 4px solid #934fff;
        outline-offset: 4px;
        transform: scale(1.08);
    }

    /* Texto más legible a distancia */
    .featured-player-title,
    .channelListItem-0-2-140 {
        font-size: 24px;
        font-weight: 600;
    }

    /* Scrollbar más visible */
    .custom-scroll::-webkit-scrollbar {
        width: 16px;
        height: 16px;
    }

    .custom-scroll::-webkit-scrollbar-thumb {
        background: #934fff;
        border: 2px solid #121212;
    }
}

/* SmartTV específico - Resoluciones comunes */
@media tv and (min-width: 1920px) and (min-height: 1080px) {
    .featured-player .video-js {
        min-height: 720px;
    }
}

@media tv and (min-width: 3840px) {
    .featured-player-title {
        font-size: 48px;
    }

    .featured-player .video-js {
        min-height: 1080px;
    }

    .vjs-control-bar {
        height: 80px !important;
    }

    .vjs-big-play-button {
        width: 120px !important;
        height: 120px !important;
        line-height: 120px !important;
        font-size: 60px !important;
    }
}

/* Optimización para navegación con control remoto */
@media tv, (pointer: coarse) {
    /* Asegurar que los elementos focusables sean visibles */
    a:focus,
    button:focus,
    .channelListItem-0-2-140:focus {
        outline: 4px solid #934fff;
        outline-offset: 4px;
        box-shadow: 0 0 20px rgba(147, 79, 255, 0.6);
    }

    /* Mejorar contraste para TV */
    .featured-player-title {
        text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.9);
    }

    /* Asegurar que el video ocupe el espacio disponible */
    .featured-player .video-js {
        width: 100%;
        max-width: 100%;
    }

    /* Cursor pointer para indicar que es clickeable */
    .featured-player .video-js,
    .featured-player video {
        cursor: pointer !important;
    }

    /* Asegurar que el video tenga foco visible */
    .featured-player .video-js:focus {
        outline: 4px solid #934fff;
        outline-offset: 4px;
        box-shadow: 0 0 30px rgba(147, 79, 255, 0.8);
    }
}

/* Estilos cuando está en pantalla completa */
.featured-player .video-js:-webkit-full-screen,
.featured-player .video-js:-moz-full-screen,
.featured-player .video-js:-ms-fullscreen,
.featured-player .video-js:fullscreen {
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    border-radius: 0 !important;
}

/* Optimización para pantalla completa en SmartTV */
@media tv, (pointer: coarse) {
    .featured-player .video-js:-webkit-full-screen,
    .featured-player .video-js:-moz-full-screen,
    .featured-player .video-js:-ms-fullscreen,
    .featured-player .video-js:fullscreen {
        background: #000 !important;
    }

    /* Controles más grandes en pantalla completa */
    .featured-player .video-js:-webkit-full-screen .vjs-control-bar,
    .featured-player .video-js:-moz-full-screen .vjs-control-bar,
    .featured-player .video-js:-ms-fullscreen .vjs-control-bar,
    .featured-player .video-js:fullscreen .vjs-control-bar {
        height: 80px !important;
        font-size: 28px !important;
    }
}

/* Optimización para SmartTV con WebOS, Tizen, etc. */
@media (min-width: 1280px) and (min-height: 720px) and (pointer: coarse) {
    body {
        font-size: 18px;
    }

    .featured-player-title {
        font-size: 32px;
    }
}

