/* TV da clínica (copiado do protótipo): pensado para ser lido de 3 a 8 metros. Letra grande, contraste alto, nada que pisque. */
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #000; color: #fff; font-family: 'Inter', system-ui, sans-serif; overflow: hidden; cursor: none; }
#tv { position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; }

/* zona de conteúdo 2:1 + rodapé (mesma divisão do NexaSignage: 960 + 120 de 1080) */
.conteudo { position: relative; flex: 8; min-height: 0; overflow: hidden; }
.rodape { flex: 1; min-height: 0; display: flex; align-items: center; padding: 0 3vw; background: #111; font-size: 2.6vh; }
.rodape img { height: 46%; width: auto; }
.rodape .nome { flex: 1; font-family: 'Playfair Display', Georgia, serif; font-size: 3.4vh; }
.rodape .hora { font-weight: 700; font-size: 4.2vh; letter-spacing: .02em; }
.rodape .clima { font-size: 3.6vh; }

.slide { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; justify-content: center; padding: 0 7vw; color: #fff; opacity: 0; transition: opacity .6s; }
.slide.on { opacity: 1; }
.slide .tit { font-family: 'Playfair Display', Georgia, serif; font-size: 7.6vh; line-height: 1.12; max-width: 80%; font-weight: 500; }
.slide .sub { font-size: 3.6vh; opacity: .9; max-width: 75%; margin-top: 2.4vh; font-weight: 400; }
.slide .rot { font-size: 2.6vh; text-transform: uppercase; letter-spacing: .14em; opacity: .85; margin-bottom: 2vh; font-weight: 600; }
.slide .play { width: 12vh; height: 12vh; border-radius: 50%; background: rgba(255,255,255,.18); display: flex; align-items: center; justify-content: center; font-size: 5vh; margin-bottom: 3vh; }
.slide.qr { flex-direction: row; align-items: center; background: #F7F5F2; color: #2B2B2B; }
.slide.qr .qr-img { width: 46vh; height: 46vh; margin-right: 6vw; flex: none; background: #fff; padding: 2vh; border-radius: 2vh; }
.vazio { align-items: center; background: #1F1D1C; }
.vazio img { width: 40%; }

/* faixa "Aperte OK": some sozinha; a TV nunca fica parada esperando alguém */
.faixa { position: fixed; left: 50%; bottom: 14vh; transform: translateX(-50%); background: rgba(0,0,0,.82); border: 2px solid rgba(255,255,255,.25); border-radius: 2vh; padding: 2vh 3.2vw; font-size: 3.2vh; font-weight: 600; text-align: center; transition: opacity .5s; z-index: 5; }
.faixa small { display: block; font-size: 2.2vh; font-weight: 400; opacity: .75; margin-top: .8vh; }
.faixa.some { opacity: 0; }

/* painel de teste (aperte OK depois que a faixa sumir) */
.painel { position: fixed; top: 4vh; right: 3vw; width: 46vw; background: rgba(15,15,15,.94); border: 2px solid #333; border-radius: 2vh; padding: 3vh 2.4vw; font-size: 2.4vh; line-height: 1.5; z-index: 6; display: none; }
.painel.on { display: block; }
.painel h2 { font-family: 'Playfair Display', Georgia, serif; font-weight: 500; font-size: 3.4vh; margin: 0 0 1.6vh; }
.painel .l { display: flex; justify-content: space-between; border-bottom: 1px solid #2a2a2a; padding: .6vh 0; }
.painel .l span:last-child { font-weight: 600; text-align: right; }
.painel .ok { color: #5BD18B; } .painel .ruim { color: #FF8A80; }
.painel small { display: block; margin-top: 1.6vh; opacity: .7; font-size: 2vh; }

/* tela de ligar (código de 4 números) */
.ligar { position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: #1F1D1C; padding: 4vh 6vw; }
.ligar img { height: 12vh; margin-bottom: 5vh; }
.ligar .codigo { font-family: 'Inter', monospace; font-size: 22vh; font-weight: 700; letter-spacing: 3vw; line-height: 1; margin: 3vh 0 4vh; }
.ligar p { font-size: 3.6vh; margin: 1vh 0; max-width: 80vw; }
.ligar .dica { font-size: 2.6vh; opacity: .7; margin-top: 5vh; }
.ligar b { color: #E9C7CF; }
.rodape > * + * { margin-left: 2.2vw; } /* sem gap: navegador de TV antigo não tem gap no flex */
.painel .l span + span { margin-left: 2vw; }
.slide.arte { background-size: cover; background-position: center; background-color: #111; padding: 0; }
.slide.video { padding: 0; background: #000; }
.slide.video video { width: 100%; height: 100%; object-fit: cover; }
.vazio .tit { font-family: 'Playfair Display', Georgia, serif; font-size: 7vh; text-align: center; max-width: none; }
.ligar .codigo { color: #fff; }
/* prévia dentro do sistema (quadro "Ao vivo"): o mouse aparece e nada pede tela cheia */
body.previa { cursor: default; }
