/* Complemento do módulo painel/relatórios: larguras das barras (.barra > span) em passos de 5%.
   Necessário porque a CSP bloqueia style inline; app.css define a barra, mas não a largura. */
.barra > span.barra-p0 { width: 0; }
.barra > span.barra-p5 { width: 5%; }
.barra > span.barra-p10 { width: 10%; }
.barra > span.barra-p15 { width: 15%; }
.barra > span.barra-p20 { width: 20%; }
.barra > span.barra-p25 { width: 25%; }
.barra > span.barra-p30 { width: 30%; }
.barra > span.barra-p35 { width: 35%; }
.barra > span.barra-p40 { width: 40%; }
.barra > span.barra-p45 { width: 45%; }
.barra > span.barra-p50 { width: 50%; }
.barra > span.barra-p55 { width: 55%; }
.barra > span.barra-p60 { width: 60%; }
.barra > span.barra-p65 { width: 65%; }
.barra > span.barra-p70 { width: 70%; }
.barra > span.barra-p75 { width: 75%; }
.barra > span.barra-p80 { width: 80%; }
.barra > span.barra-p85 { width: 85%; }
.barra > span.barra-p90 { width: 90%; }
.barra > span.barra-p95 { width: 95%; }
.barra > span.barra-p100 { width: 100%; }
.tabela td .barra { min-width: 80px; margin-top: 6px; }

/* Visão geral: cartão da pausa geral (estado + ação numa linha) */
.cartao-pausa .cartao-corpo > p { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: var(--esp-3); }
.pausa-linha { display: flex; flex-wrap: wrap; gap: var(--esp-3); align-items: flex-end; }
.pausa-linha .campo { flex: 1 1 260px; max-width: 480px; margin-bottom: 0; }
.pausa-linha .botao { height: var(--altura-controle); }
#pausa .cartao-corpo > .alerta { margin-bottom: var(--esp-4); }