html.device-tv,
html.device-tv body {
    -webkit-text-size-adjust: 100%;
}

.tv-navigation-mode {
    --tv-focus-color: #f7941d;
    --tv-focus-glow: rgba(247, 148, 29, 0.38);
}

.tv-navigation-mode *:focus {
    outline: none !important;
}

.tv-navigation-mode [data-tv-focusable="true"] {
    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        outline-color 0.16s ease,
        background-color 0.16s ease,
        border-color 0.16s ease;
}

.tv-navigation-mode [data-tv-focusable="true"].is-tv-focused {
    outline: 3px solid var(--tv-focus-color);
    box-shadow:
        0 0 0 4px var(--tv-focus-glow),
        0 14px 38px rgba(0, 0, 0, 0.42);
    z-index: 8;
}

.tv-navigation-mode .op-card.is-tv-focused,
.tv-navigation-mode .op-live-card.is-tv-focused,
.tv-navigation-mode .player-live-primary.is-tv-focused,
.tv-navigation-mode .player-vod-primary.is-tv-focused,
.tv-navigation-mode .player-vod-skip.is-tv-focused,
.tv-navigation-mode .player-vod-icon.is-tv-focused,
.tv-navigation-mode .player-live-control.is-tv-focused,
.tv-navigation-mode .player-live-chip.is-tv-focused,
.tv-navigation-mode .player-live-toolbar-button.is-tv-focused,
.tv-navigation-mode .player-live-pill.is-tv-focused,
.tv-navigation-mode .player-live-directory__item.is-tv-focused,
.tv-navigation-mode .op-filter-btn.is-tv-focused,
.tv-navigation-mode .op-filter-select.is-tv-focused,
.tv-navigation-mode .op-toolbar-input.is-tv-focused,
.tv-navigation-mode .op-btn.is-tv-focused,
.tv-navigation-mode .op-nav-link.is-tv-focused,
.tv-navigation-mode .op-mobile-nav-link.is-tv-focused,
.tv-navigation-mode .op-icon-btn.is-tv-focused,
.tv-navigation-mode .op-avatar.is-tv-focused,
.tv-navigation-mode .header-icon-button.is-tv-focused,
.tv-navigation-mode .nav-link.is-tv-focused,
.tv-navigation-mode .searchbar input.is-tv-focused,
.tv-navigation-mode .searchbar button.is-tv-focused,
.tv-navigation-mode .header-search input.is-tv-focused,
.tv-navigation-mode .header-search button.is-tv-focused,
.tv-navigation-mode .site-footer a.is-tv-focused,
.tv-navigation-mode .op-footer a.is-tv-focused,
.tv-navigation-mode .op-footer-social.is-tv-focused,
.tv-navigation-mode .op-footer-lang.is-tv-focused,
.tv-navigation-mode .player-live-directory__icon.is-tv-focused,
.tv-navigation-mode #playerQualitySelect.is-tv-focused,
.tv-navigation-mode #playerVodQualitySelect.is-tv-focused {
    transform: scale(1.035);
}

.tv-navigation-mode .op-card.is-tv-focused,
.tv-navigation-mode .op-live-card.is-tv-focused {
    border-radius: 28px;
}

.tv-navigation-mode .player-live-directory__item.is-tv-focused {
    background: rgba(247, 148, 29, 0.16);
    border-color: rgba(247, 148, 29, 0.85);
}

.tv-navigation-mode .op-nav-link.is-tv-focused,
.tv-navigation-mode .op-mobile-nav-link.is-tv-focused,
.tv-navigation-mode .site-footer a.is-tv-focused,
.tv-navigation-mode .op-footer a.is-tv-focused,
.tv-navigation-mode .op-footer-social.is-tv-focused,
.tv-navigation-mode .op-footer-lang.is-tv-focused,
.tv-navigation-mode .player-live-pill.is-tv-focused,
.tv-navigation-mode .player-live-directory__icon.is-tv-focused,
.tv-navigation-mode .player-live-toolbar-button.is-tv-focused,
.tv-navigation-mode .player-live-chip.is-tv-focused,
.tv-navigation-mode .player-live-control.is-tv-focused,
.tv-navigation-mode .player-vod-icon.is-tv-focused,
.tv-navigation-mode .player-vod-chip.is-tv-focused,
.tv-navigation-mode .player-vod-skip.is-tv-focused,
.tv-navigation-mode .player-vod-back.is-tv-focused,
.tv-navigation-mode .op-filter-btn.is-tv-focused,
.tv-navigation-mode .op-btn.is-tv-focused,
.tv-navigation-mode .op-icon-btn.is-tv-focused,
.tv-navigation-mode .op-avatar.is-tv-focused,
.tv-navigation-mode .header-icon-button.is-tv-focused {
    border-radius: 999px;
}

.tv-navigation-mode .op-filter-select.is-tv-focused,
.tv-navigation-mode .op-toolbar-input.is-tv-focused,
.tv-navigation-mode .searchbar input.is-tv-focused,
.tv-navigation-mode .header-search input.is-tv-focused,
.tv-navigation-mode #playerQualitySelect.is-tv-focused,
.tv-navigation-mode #playerVodQualitySelect.is-tv-focused {
    background: rgba(247, 148, 29, 0.08);
    border-color: rgba(247, 148, 29, 0.95) !important;
}

.tv-navigation-mode .op-page-loader {
    cursor: none;
}