/**
 * tv-mode.css
 *
 * Ajustes de diseño específicos para ver el sitio desde el sofá con un
 * control remoto (Smart TV, TV box, Android TV) — lo que en diseño se
 * conoce como "10-foot UI": la persona ve la pantalla desde ~3 metros de
 * distancia, no a 30cm como en un celular o monitor.
 *
 * Todo lo de acá vive dentro de @media (pointer: none) — la forma
 * estándar en CSS de detectar "no hay mouse ni dedo, sólo D-pad/control
 * remoto" (a diferencia de (pointer: coarse) que es touch, y
 * (pointer: fine) que es mouse). Esto significa que NADA de este archivo
 * afecta a quien entra desde un navegador normal de celular/computadora:
 * sólo se activa en el contexto real de TV, sin importar la resolución
 * de pantalla.
 */
@media (pointer: none) {

    /* =============================================================================
       FOCO MUCHO MÁS VISIBLE
       =============================================================================
       El foco de teclado normal (borde rojo fino) se pensó para verse de
       cerca. Desde 3 metros de distancia necesita ser mucho más notorio:
       la tarjeta/botón con foco crece un poco y brilla fuerte, para que
       nunca haya dudas de dónde está parado el control remoto. */
    a:focus-visible,
    button:focus-visible,
    [tabindex]:focus-visible {
        outline: 4px solid #ff2c2c !important;
        outline-offset: 4px !important;
        box-shadow: 0 0 0 8px rgba(255, 44, 44, 0.35), 0 0 30px rgba(255, 44, 44, 0.6) !important;
        transform: scale(1.06);
        z-index: 20;
        position: relative;
        transition: transform 0.15s ease, box-shadow 0.15s ease;
    }

    a:focus-visible .sp-thumbnail-wrapper,
    a:focus-visible .sp-category-thumbnail-wrapper,
    a:focus-visible .sp-search-thumbnail-wrapper {
        box-shadow: 0 0 0 4px #ff2c2c !important;
    }

    /* =============================================================================
       MÁRGENES SEGUROS (overscan) — que nada quede cortado en el borde
       =============================================================================
       Muchas TVs (sobre todo más viejas) recortan un poco los bordes de la
       imagen. Un margen del 3% de respiro evita que texto o botones
       queden pegados/cortados en el borde de la pantalla. Esto es lo
       único que queda del "modo TV" aparte del foco: a pedido explícito,
       el resto del diseño en TV debe verse exactamente igual que en
       escritorio (el ancho de referencia ya se fuerza a 1280px desde
       functions.php, así que los mismos breakpoints de siempre aplican
       sin agrandar nada de más). */
    body {
        padding: 2vh 3vw !important;
        box-sizing: border-box;
    }

}