/* Minimal React Live TV helpers — legacy custom.css + livetv.css remain primary */

#live-tv-root,
#legacy-live-tv-host {
    min-height: 0;
    width: 100%;
}

#legacy-live-tv-host .liveSectionLoad {
    display: block !important;
}

#legacy-live-tv-host .liveSectionLoad.d-none {
    display: none !important;
}

/* Used by both hosts (LegacyHost.jsx's #legacy-live-tv-host and ReactGuideHost.jsx's plain
   wrapper) to hide the pre-mounted guide while the loading/profiles screen is showing — was
   ID-scoped to only the legacy host, so the React host never actually hid during that window. */
.live-tv-guide-host-hidden {
    display: none !important;
}

#live-tv-menus-home .myaccount-header {
    position: relative;
}

.liveChannels-body #live-tv-menus-home {
    display: none;
}

@media (max-width: 991.98px) {
    .liveChannels-body #live-tv-menus-home {
        display: block;
    }
}

.liveChannels-body .live-tv-mobile-menu-slot {
    display: none;
}

.liveChannels-body .live-tv-mobile-menu-slot .myaccount-header {
    width: 100%;
}

.profileBody .profileScreen {
    margin-top: 0;
}

/* Keep chrome stable during initial profile/loading render (logged-in flow). */
body.profileBody,
body.profileLoadingbody,
body.live-tv-view-profiles,
body.live-tv-view-loading {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

#live-tv-menus-home,
#live-tv-footer-home {
    flex: 0 0 auto;
}

#live-tv-root {
    flex: 1 0 auto;
}

#live-tv-footer-home {
    margin-top: auto;
}

@media (max-width: 991.98px) {
    .profileBody .profileScreen {
        margin-top: 56.59px;
    }
}

/* Match favorite-toast (yellow) — do not override livetv.css with dark toast */
.ad-progress-toast {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    padding: 12px 24px;
    border-radius: 50px;
    background: rgba(255, 171, 37, 0.80);
    backdrop-filter: blur(2px);
    color: #000;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation: slideUpToast 0.3s ease-out;
    pointer-events: none;
}

.ad-progress-toast.show {
    display: flex;
}

.ad-progress-toast.hide {
    animation: slideDownToast 0.3s ease-out forwards;
}

.epgFailed.is-visible,
.noChannelData.is-visible,
.sub-expired.is-visible {
    display: block !important;
}

.profileList ul li:first-child .profileAction .editBtnCol:only-child {
    margin-right: 0;
}

.menuProfiles h4 img.menuManageProfile,
.menuProfiles h4 img.manageProfileIcon {
    cursor: pointer;
}

.profileLoadingbody #live-tv-menus-home,
.profileLoadingbody #live-tv-footer-home,
body.guest-preview.profileLoadingbody #live-tv-footer-home,
body.guest-preview.live-tv-view-loading #live-tv-footer-home {
    display: none !important;
}

.liveVideoContainer {
    position: relative;
}

.liveProgramVideo:has(.live-tv-video-loader.is-visible) .pauseButton,
.video-js:has(.live-tv-video-loader.is-visible) .pauseButton {
    display: none !important;
}

.video-js .live-tv-video-loader.is-visible ~ .pauseButton {
    display: none !important;
}

.liveVideoContainer .vjs-loading-spinner {
    display: none !important;
}

.video-js .live-tv-video-loader {
    z-index: 20;
}

.video-js.vjs-fullscreen .live-tv-video-loader {
    z-index: 2147483645;
}

.video-js .ad-progress-toast,
body > .ad-progress-toast {
    z-index: 2147483647;
}

.alertFullview.is-visible {
    display: block !important;
}

#legacy-live-tv-host .alertFullview.is-visible,
.video-js .alertFullview.is-visible {
    position: absolute;
    inset: 0;
    z-index: 2147483646;
}

:is(
    .trad-guide-player-loader,
    .live-tv-video-loader
) {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.72);
    z-index: 3;
    pointer-events: none;
}

.live-tv-video-loader.is-visible {
    display: flex;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator {
    --size: 60px;
    --tick-w: 6px;
    --tick-h: 20px;
    --color: #f7412c;
    width: var(--size);
    height: var(--size);
    position: relative;
    display: inline-block;
    flex-shrink: 0;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: var(--tick-w);
    height: var(--tick-h);
    margin-left: calc(var(--tick-w) / -2);
    margin-top: calc((var(--size) / -2) + 4px);
    border-radius: 999px;
    background: var(--color);
    transform-origin: center calc((var(--size) / 2) - 4px);
    opacity: 0.14;
    animation: live-tv-atv-8-fade 0.9s linear infinite;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -0.7875s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(2) {
    transform: rotate(45deg);
    animation-delay: -0.675s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(3) {
    transform: rotate(90deg);
    animation-delay: -0.5625s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(4) {
    transform: rotate(135deg);
    animation-delay: -0.45s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(5) {
    transform: rotate(180deg);
    animation-delay: -0.3375s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(6) {
    transform: rotate(225deg);
    animation-delay: -0.225s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(7) {
    transform: rotate(270deg);
    animation-delay: -0.1125s;
}

:is(.trad-guide-player-loader, .live-tv-video-loader) .atv-activity-indicator span:nth-child(8) {
    transform: rotate(315deg);
    animation-delay: 0s;
}

@keyframes live-tv-atv-8-fade {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.14;
    }
}

.vjs-fullscreen .live-tv-video-loader .atv-activity-indicator {
    --size: 80px;
    --tick-w: 8px;
    --tick-h: 25px;
}

/* Live TV modals — render on body so backdrop never covers dialog */
.live-tv-modal-backdrop,
body > .modal-backdrop.show {
    z-index: 10540 !important;
}

.live-tv-modal,
body > .modal.show {
    z-index: 10550 !important;
}

.live-tv-modal .modal-dialog,
body > .modal.show .modal-dialog {
    position: relative;
    z-index: 1;
    pointer-events: auto;
}

.live-tv-overlay.alertFullview,
.live-tv-overlay.updateLoader {
    position: fixed;
    inset: 0;
    z-index: 10500;
}

.live-tv-overlay.updateLoader {
    background-color: #000000d1;
}

body.modal-open {
    overflow: hidden;
}

/* EPG program overflow tooltips — flex child must shrink for scrollWidth check */
.epg-container ul.listings-grid .listings-program .programtreepgcontent {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
}

body > .tooltip.bs-tooltip-top {
    z-index: 1080;
    pointer-events: none;
}

/* Trigger-update refresh: subtle grid tint only (not profileLoading) */
#legacy-live-tv-host .liveSectionLoad.guide-refresh-in-progress {
    position: relative;
}

#legacy-live-tv-host .liveSectionLoad.guide-refresh-in-progress::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.25);
    pointer-events: none;
    z-index: 4;
}

#legacy-live-tv-host .epgGridBottomTint.is-visible {
    opacity: 0.45;
    pointer-events: none;
}

#legacy-live-tv-host .loadingContainer {
    z-index: 6;
}