/* ==========================================================================
   Pré-visualização do dia (ts/modules/painel-dia/painel-tv.ts) — o Painel do Dia em formato de TV, dentro da Programação.
   Tela de 1920×1080 reduzida por transform; tudo com prefixo tv-. As barras da linha do tempo reaproveitam as classes pd- (painel-dia.css).
   ========================================================================== */
html[data-previa-dia] #programacaoPeriodoTopo, html[data-previa-dia] #programacaoBuscaTopo, html[data-previa-dia] #btnProgramacaoDistribuir, html[data-previa-dia] #btnProgramacaoJanela, html[data-previa-dia] #btnProgramacaoTv, html[data-previa-dia] #programacaoLegendaTopo { display: none !important; }
.tv-raiz { position: fixed; inset: 0; z-index: 9000; overflow: hidden; background: var(--pd-fundo); border-radius: 0; }
.tv-palco { width: 1920px; height: 1080px; transform-origin: 0 0; position: absolute; overflow: hidden; font-size: 19px; background: var(--pd-fundo); color: var(--pd-txt); }
.tv-top { height: 88px; display: flex; align-items: center; gap: 26px; padding: 0 44px; background: #152e50; color: #fff; border-bottom: 6px solid var(--pd-ouro); }
.tv-lg { width: 52px; height: 52px; border-radius: 18px; background: var(--pd-ouro); color: #152e50; display: flex; align-items: center; justify-content: center; font-size: 26px; flex: none; }
.tv-top h1 { margin: 0; font-family: 'Handel Gothic D', Inter, sans-serif; font-weight: 800; font-size: 31px; letter-spacing: .01em; color: #fff; line-height: 1.1; }
.tv-top small { font-size: 17px; color: #b8c7de; display: block; font-weight: 600; }
.tv-info { display: flex; align-items: center; gap: 30px; margin-left: 20px; font-size: 19px; font-weight: 700; color: #e6eefb; }
.tv-info i { color: var(--pd-ouro); margin-right: 10px; }
.tv-info .tv-vivo { display: inline-flex; align-items: center; color: #6ee7b7; }
.tv-info .tv-vivo i { width: 12px; height: 12px; border-radius: 50%; background: #10b981; margin-right: 10px; animation: pd-p 1.8s infinite; }
.tv-dir { margin-left: auto; display: flex; align-items: center; gap: 28px; }
.tv-relogio b { font-size: 53px; line-height: 1; color: #fff; letter-spacing: -.03em; font-variant-numeric: tabular-nums; font-weight: 800; }
.tv-relogio b small { display: inline; font-size: 24px; color: #b8c7de; letter-spacing: 0; }
.tv-sair { width: 50px; height: 50px; border-radius: 18px; border: 2px solid rgba(255,255,255,.25); background: rgba(255,255,255,.1); color: #fff; font-size: 22px; cursor: pointer; flex: none; }
.tv-sair:hover, .tv-sair:focus-visible { background: var(--pd-ouro); border-color: var(--pd-ouro); color: #152e50; outline: 0; }
.tv-conteudo { position: absolute; left: 44px; right: 44px; top: 108px; bottom: 74px; display: flex; flex-direction: column; gap: 16px; }
.tv-kpis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.tv-kpi { background: var(--pd-card); border: 2px solid var(--pd-borda); border-radius: 22px; padding: 12px 22px; display: flex; flex-direction: column; gap: 0; }
.tv-kpi small { font-size: 15px; font-weight: 900; text-transform: uppercase; letter-spacing: .05em; color: var(--pd-suave); }
.tv-kpi b { font-size: 52px; line-height: 1.05; color: var(--pd-azul); letter-spacing: -.03em; }
.tv-kpi b em { font-style: normal; font-size: 34px; color: var(--pd-suave); }
.tv-kpi span { font-size: 16px; color: var(--pd-suave); font-weight: 700; }
.tv-kpi.al { border-color: #ef4444; } .tv-kpi.al b { color: #dc2626; }
.tv-area { position: relative; flex: 1; min-height: 0; }
.tv-slide { position: absolute; inset: 0; }
.tv-card { background: var(--pd-card); border: 2px solid var(--pd-borda); border-radius: 26px; overflow: hidden; }
.tv-tl { position: absolute; left: 0; top: 0; bottom: 0; right: 420px; padding: 16px 22px; }
.tv-ch { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 10px; }
.tv-ch b { white-space: nowrap; font-size: 19px; text-transform: uppercase; letter-spacing: .06em; color: var(--pd-azul); }
.tv-ch small { white-space: nowrap; font-size: 16px; color: var(--pd-suave); }
.tv-leg { flex-basis: 100%; display: flex; gap: 8px 22px; font-size: 14px; white-space: nowrap; font-weight: 700; color: var(--pd-suave); }
.tv-leg i { display: inline-block; width: 16px; height: 16px; border-radius: 5px; margin-right: 6px; vertical-align: -2px; }
.tv-corpo { position: relative; }
.tv-eixo { display: grid; grid-template-columns: 290px 1fr; height: 34px; }
.tv-eixo .pd-horas { height: 34px; }
.tv-eixo .pd-horas span { top: 4px; font-size: 15px; }
.tv-lanes { position: relative; }
.tv-lanes .pd-lane { grid-template-columns: 290px 1fr; height: var(--tv-lane, 84px); border-top: 2px solid var(--pd-grade); border-bottom: 0; }
.tv-lanes .pd-av { width: 46px; height: 46px; font-size: 17px; }
.tv-lanes .pd-quem { gap: 12px; }
.tv-lanes .pd-quem .pd-carga { color: var(--pd-azul); font-weight: 800; font-size: 14px; }
.tv-lanes .pd-quem b { font-size: 20px; max-width: 215px; }
.tv-lanes .pd-quem small { font-size: 15px; }
.tv-lanes .pd-pista { background-image: linear-gradient(90deg, var(--pd-grade) 2px, transparent 2px); }
.tv-lanes .pd-seg { top: calc((var(--tv-lane, 84px) - 40px) / 2 + 4px); height: 40px; border-radius: 14px; font-size: 17px; gap: 10px; padding: 0 16px; min-width: 56px; }
.tv-lanes .pd-agu, .tv-lanes .pd-prg { border-width: 3px; }
.tv-lanes .pd-prev { border-width: 3px; }
.tv-lanes .pd-fora { top: 2px; font-size: 14px; max-width: 420px; }
.tv-lanes .pd-fora.baixo { top: calc(var(--tv-lane, 84px) - 18px); }
.tv-lanes .pd-fora b { font-size: 14px; }
.tv-lanes .pd-occ { top: calc((var(--tv-lane, 84px) - 40px) / 2 - 2px); width: 30px; height: 30px; font-size: 14px; }
.tv-lanes .pd-livre { display: none; }
.tv-agora { position: absolute; top: 0; bottom: 0; width: 4px; background: #ef4444; z-index: 5; pointer-events: none; }
.tv-agora span { position: absolute; top: -4px; left: 50%; transform: translateX(-50%); background: #ef4444; color: #fff; font-weight: 900; font-size: 14px; padding: 3px 12px; border-radius: 9px; white-space: nowrap; }
.tv-vazio { padding: 80px 20px; text-align: center; color: var(--pd-suave); display: flex; flex-direction: column; gap: 8px; font-size: 19px; }
.tv-vazio b { font-size: 26px; color: var(--pd-azul); }
.tv-lado { position: absolute; right: 0; top: 0; bottom: 0; width: 400px; display: flex; flex-direction: column; gap: 16px; }
.tv-bloco { padding: 22px 26px; }
.tv-bloco h3 { margin: 0 0 12px; font-size: 19px; text-transform: uppercase; letter-spacing: .06em; color: var(--pd-azul); display: flex; gap: 12px; align-items: center; }
.tv-badge { background: #dc2626; color: #fff; border-radius: 999px; padding: 0 14px; font-size: 17px; }
.tv-al { display: flex; gap: 16px; padding: 14px 16px; border-radius: 18px; margin-bottom: 10px; font-size: 17px; }
.tv-al b { display: block; color: #0f172a; }
.tv-al small { font-size: 14px; color: #475569; }
.tv-al.r { background: #fef2f2; } .tv-al.a { background: #fffbeb; } .tv-al.ok { background: #ecfdf5; }
.tv-ai { width: 44px; height: 44px; border-radius: 14px; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 19px; flex: none; color: #b45309; }
.tv-al.r .tv-ai { color: #dc2626; } .tv-al.ok .tv-ai { color: #059669; }
.tv-mais { margin: 6px 0 0; font-size: 16px; color: var(--pd-suave); font-weight: 700; }
.tv-pr { display: flex; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 2px solid var(--pd-grade); font-size: 18px; }
.tv-pr:last-child { border: 0; }
.tv-pr time { font-weight: 900; color: var(--pd-azul); width: 70px; font-size: 17px; line-height: 1.15; }
.tv-pr time small { display: block; font-size: 13px; color: var(--pd-suave); }
.tv-pr span { flex: 1; font-weight: 800; color: var(--pd-azul); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-tag { color: #fff; border-radius: 10px; padding: 4px 12px; font-size: 14px; font-weight: 900; text-transform: uppercase; font-style: normal; white-space: nowrap; }
.tv-rodape { position: absolute; left: 44px; right: 44px; bottom: 16px; height: 44px; display: flex; align-items: center; gap: 20px; font-size: 16px; color: var(--pd-suave); font-weight: 700; }
.tv-funil { margin-left: auto; }
.tv-dias { display: inline-flex; align-items: center; gap: 10px; }
.tv-dias button { height: 44px; min-width: 44px; padding: 0 16px; border-radius: 14px; border: 2px solid var(--pd-borda); background: var(--pd-card); color: var(--pd-azul); font: inherit; font-weight: 800; font-size: 16px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; text-transform: capitalize; }
.tv-dias button:hover, .tv-dias button:focus-visible { background: var(--pd-ouro); border-color: var(--pd-ouro); color: #152e50; outline: 0; }
.tv-dias .tv-dia.hoje { background: #152e50; border-color: #152e50; color: var(--pd-ouro); }
.tv-leg .pd-b-prev { border: 2px dashed #60a5fa; background: transparent; }