/* ===================== TV MODE (LG webOS, SmartTV) ===================== */
.tv-mode body {
    font-size: 20px;
}

.tv-mode #header {
    min-height: 80px;
    padding: 8px 32px;
}

.tv-mode .header-button {
    padding: 10px 18px;
    font-size: 14px;
}

.tv-mode #sidebar {
    width: 30%;
}

.tv-mode #main-content {
    width: 70%;
}

.tv-mode .channel-item {
    padding: 14px;
    font-size: 1rem;
}

.tv-mode .channel-name {
    font-size: 1rem;
}

.tv-mode .channel-program {
    font-size: 0.85rem;
}

.tv-mode .channel-program--current {
    color: #ffffff;
}

.tv-mode .channel-item.tv-focus {
    outline: 3px solid var(--accent-color);
    outline-offset: 2px;
}

.tv-mode .recording-controls {
    display: none !important;
}

.tv-mode .search-container {
    display: none !important;
}

.tv-mode #epg-container {
    font-size: 0.95rem;
}

.tv-mode #player-container {
    aspect-ratio: 16 / 9;
    /* Нижняя граница высоты, если WebView некорректно считает aspect-ratio */
    min-height: 200px;
    position: relative;
    box-sizing: border-box;
}

/* ===================== TV MODE (HTML ROOT ENHANCEMENTS) ===================== */
html.tv-mode body {
    cursor: default;
}

html.tv-mode #header {
    min-height: 92px;
}

html.tv-mode #sidebar {
    box-shadow: none;
    width: 38%;
}

html.tv-mode #main-content {
    width: 62%;
}

/* Крупные элементы управления для ТВ */
html.tv-mode .header-button {
    font-size: 15px;
    padding: 10px 18px;
}

html.tv-mode #group-filter,
html.tv-mode #search {
    font-size: 16px;
    padding: 10px 14px;
}

/* Список каналов — крупнее карточки, иконки, текст, прогресс */
html.tv-mode .channel-item {
    padding: 18px 20px;
    min-height: 88px;
    margin-bottom: 10px;
    border-radius: 8px;
}

html.tv-mode .channel-logo {
    width: 56px;
    height: 56px;
    min-width: 56px;
    min-height: 56px;
    margin-right: 14px;
    border-radius: 6px;
}

html.tv-mode .channel-name {
    font-size: 1.2rem;
    margin-bottom: 6px;
}

html.tv-mode .channel-progress-container {
    height: 10px;
    margin: 6px 0 4px;
    border-radius: 999px;
}

html.tv-mode .channel-progress-bar {
    border-radius: 999px;
}

html.tv-mode .channel-epg-overlay {
    margin-top: 6px;
}

/* Программа передач (EPG) — крупнее текст для ТВ */
html.tv-mode #epg-container {
    font-size: 1.05rem;
    padding: 20px 22px;
}

html.tv-mode #epg-container .epg-program-list {
    gap: 10px;
}

html.tv-mode #epg-container .epg-program-item {
    font-size: 1.1rem;
    padding: 14px 18px;
    border-radius: 8px;
}

html.tv-mode #epg-container .epg-program-time {
    font-size: 1rem;
    min-width: 130px;
}

html.tv-mode #epg-container .epg-program-title {
    font-size: 1.1rem;
    padding-left: 16px;
}

/* Текущая/следующая передача на карточке канала */
html.tv-mode .channel-program {
    font-size: 1.12rem;
    margin-bottom: 4px;
}

html.tv-mode .channel-next {
    font-size: 1rem;
    margin-top: 2px;
}

/* Укрупняем элементы управления VenomPlayer через базовый размер шрифта */
html.tv-mode #player {
    font-size: 28px;
}

/* Ещё больше увеличиваем интерактивные области внутри плеера */
html.tv-mode #player button,
html.tv-mode #player [role="button"] {
    min-height: 44px;
    min-width: 44px;
}

/* На ТВ показываем кнопку «Настройки» */
html.tv-mode #open-settings {
    display: inline-flex !important;
}

/* Субтитры на ТВ полностью скрыты: и через JS (textTracks.mode=disabled), и через CSS на случай рендера браузером */
html.tv-mode #player video::cue,
html.tv-mode #player-container video::cue {
    display: none !important;
    visibility: hidden !important;
}
html.tv-mode #player [class*="caption"],
html.tv-mode #player [class*="subtitle"],
html.tv-mode #player [class*="text-track"],
html.tv-mode #player [class*="textTrack"],
html.tv-mode #player-container [class*="caption"],
html.tv-mode #player-container [class*="subtitle"],
html.tv-mode #player-container [class*="text-track"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Дополнительно скрываем любые кнопки управления субтитрами по aria-label */
html.tv-mode #player [aria-label*="Subtitles"],
html.tv-mode #player [aria-label*="subtitles"],
html.tv-mode #player [aria-label*="Субтитры"],
html.tv-mode #player [aria-label*="CC"],
html.tv-mode #player [aria-label*="cc"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

:root.tv-mode {
    /* можно донастроить специально под ТВ */
}

/* Диалоги — крупнее для D-pad и аэромыши (webOS) */
html.tv-mode .dialog {
    font-size: 1.15rem;
    max-width: min(92vw, 920px);
}

html.tv-mode .dialog-header,
html.tv-mode .dialog-body,
html.tv-mode .dialog-footer {
    padding: 18px 22px;
}

html.tv-mode .dialog-tab {
    font-size: 1.05rem;
    padding: 12px 18px;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

html.tv-mode .dialog-tab:focus-visible,
html.tv-mode .dialog-tab.tv-focus {
    outline: 3px solid var(--accent-color);
    outline-offset: 2px;
}

html.tv-mode .form-input,
html.tv-mode .btn {
    font-size: 1.05rem;
    min-height: 48px;
    padding: 12px 18px;
}

html.tv-mode #header button.tv-focus,
html.tv-mode #header .lang-btn.tv-focus {
    outline: 3px solid var(--accent-color);
    outline-offset: 2px;
}

html.tv-mode #group-filter.tv-focus,
html.tv-mode #favorites-filter-btn.tv-focus {
    outline: 3px solid var(--accent-color);
    outline-offset: 2px;
}

/* Крупнее переключатель языка и заголовок */
html.tv-mode .lang-btn {
    font-size: 1rem;
    min-width: 44px;
    min-height: 44px;
    padding: 8px 12px;
}

html.tv-mode #app-title {
    font-size: 1.35rem;
}

/* Удобные цели для пульта и аэромыши */
html.tv-mode #header .header-button,
html.tv-mode #filter-controls .header-button {
    min-height: 48px;
    min-width: 48px;
}

/* Аэромышь webOS / курсор в браузере — явный указатель на кликабельных элементах */
html.tv-mode button,
html.tv-mode .dialog-tab,
html.tv-mode select,
html.tv-mode .channel-item,
html.tv-mode .lang-btn {
    cursor: pointer;
}

/**
 * Часть TV WebView не даёт высоту блоку только по aspect-ratio, если внутри
 * только position:absolute — контейнер схлопывается (звук есть, видео не видно).
 */
@supports not (aspect-ratio: 1) {
    .tv-mode #player-container,
    html.tv-mode #player-container {
        aspect-ratio: auto;
        height: 0;
        padding-bottom: 56.25%;
        min-height: 0;
    }
}

/* Слой декодирования видео на старых Chromium TV */
html.tv-mode #player-container.iptv-mvx-host video.tv-player-video {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}