/* ===========================================================================
   MÓDULO PAINEIS — Painéis de TV e de desenvolvimento
   ---------------------------------------------------------------------------
   Este arquivo veio do `public/styles.css` na CS2 do `CSS_POR_MODULO_LOOP.md`
   (item 35): são as regras que só esta tela usa. O que é de TODOS (a casca, os
   primitivos, o BI) continua em `styles.css`/sdk-ui, e o mapa de donos é
   `scripts/lib/modulos-do-front.js`. Carregado no `index.html` logo DEPOIS de
   `styles.css` — a ordem é o que preserva a cascata de antes da mudança.
   Regra nova de tela daqui nasce AQUI, não no `styles.css`.
   =========================================================================== */

/* ─── Painéis de TV (SP7 do SESSAO_PAINEL_LOOP.md; mockup M0 3a–3d) ─────────────────────────────
   Só administrador. O interruptor que liga/desliga a sessão de 7 dias de um painel inteiro, as
   duas tabelas e o texto de ajuda. Cores por token (nada de hex): a página é clara como o resto
   do portal. */
.paineis-ajuda { margin: 0; font-size: 0.85rem; color: var(--muted-foreground); max-width: 76ch; }

/* `position: relative` NÃO é enfeite: o checkbox escondido é `position: absolute` e, sem um
   ancestral posicionado, a caixa de contenção dele vira a viewport — ele escapa do
   `.zr-table-wrap` (que rola por dentro) e soma 17 px à PÁGINA a 390 px, medidos. */
.paineis-interruptor { position: relative; display: inline-flex; align-items: center; gap: 0.55rem; cursor: pointer; font-size: 0.85rem; }

.paineis-interruptor input { position: absolute; opacity: 0; width: 1px; height: 1px; }

.paineis-trilho { position: relative; flex: none; width: 2.4rem; height: 1.35rem; border-radius: 999px; background: var(--border); transition: background 0.15s; }

.paineis-trilho::after { content: ""; position: absolute; top: 0.15rem; left: 0.15rem; width: 1.05rem; height: 1.05rem; border-radius: 50%; background: var(--background); box-shadow: 0 1px 2px rgb(0 0 0 / 25%); transition: left 0.15s; }

.paineis-interruptor input:checked + .paineis-trilho { background: var(--primary); }

.paineis-interruptor input:checked + .paineis-trilho::after { left: 1.1rem; }

.paineis-interruptor input:focus-visible + .paineis-trilho { outline: 3px solid color-mix(in oklch, var(--ring) 50%, transparent); outline-offset: 2px; }

.paineis-num { text-align: right; font-variant-numeric: tabular-nums; }

.paineis-quando { font-variant-numeric: tabular-nums; white-space: nowrap; }

.paineis-acoes { display: flex; justify-content: flex-end; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.25rem; }