/* ── BI INUGG ──────────────────────────────────────────────────────────────── * Mesma linguagem visual das telas de indicador do Ponto (Includes/header.php * do Ponto: card elevado, barra de seções fixa, entrada suave dos painéis, * View Transitions). Copiado (não importado) porque cada módulo tem deploy e * assets próprios. * ─────────────────────────────────────────────────────────────────────────── */ :root { --primary: #0d6efd; --bi-fundo: #f4f6fb; --bi-borda: #e5e8ee; --bi-texto-suave: #64748b; --bi-marca: #1a237e; --bi-risco: #dc3545; --bi-he: #0d6efd; } @media (min-width: 992px) and (max-width: 1440px) { html { font-size: 14px; } } @media (min-width: 1441px) and (max-width: 1599.98px) { html { font-size: 15px; } } *, *::before, *::after { box-sizing: border-box; } body { font-family: 'Inter', sans-serif; background: var(--bi-fundo); min-height: 100vh; overflow-x: hidden; } html { animation: _pgIn .2s ease both; } @keyframes _pgIn { from { opacity: 0; } to { opacity: 1; } } /* ---- Menu lateral (mesmo layout da sidebar do Ponto: Ponto/app/Views/Includes/header.php) ---- */ :root { --sidebar-width: 270px; } body.bi-com-menu { padding-left: var(--sidebar-width); transition: padding-left .3s ease; } body.bi-com-menu.sidebar-fechada { padding-left: 0; } .bi-sidebar { position: fixed; top: 0; left: 0; width: var(--sidebar-width); height: 100vh; background: #fff; border-right: 1px solid #dee2e6; z-index: 1040; overflow-y: auto; display: flex; flex-direction: column; transition: transform .3s ease; view-transition-name: bi-sidebar; } .bi-sidebar::-webkit-scrollbar { width: 6px; } .bi-sidebar::-webkit-scrollbar-thumb { background: #ced4da; border-radius: 3px; } @media (min-width: 992px) { body.sidebar-fechada .bi-sidebar { transform: translateX(-100%); } } .sidebar-toggle-btn { position: fixed; top: 14px; left: 14px; z-index: 1100; background: var(--bi-marca); color: #fff; border: none; border-radius: 50%; width: 42px; height: 42px; font-size: 1.4rem; cursor: pointer; display: flex; align-items: center; justify-content: center; } /* Com o menu aberto no desktop, o botão fica dentro da sidebar (canto direito do logo) e não cobre o conteúdo. */ @media (min-width: 992px) { body.bi-com-menu:not(.sidebar-fechada) .sidebar-toggle-btn { left: calc(var(--sidebar-width) - 56px); width: 36px; height: 36px; font-size: 1.15rem; } } .bi-sidebar .accordion { --bs-accordion-border-width: 0; --bs-accordion-border-radius: 0; } .bi-sidebar .accordion-item { border: 0; background: transparent; } .bi-sidebar .accordion-button { background: transparent !important; color: #212529 !important; border-radius: 10px; padding: .6rem .75rem; font-weight: 500; font-size: .92rem; box-shadow: none !important; } .bi-sidebar .accordion-button > .bi { font-size: 1.15rem; color: var(--primary); } .bi-sidebar .accordion-button:hover { background: #f3f5f9 !important; } .bi-sidebar .accordion-button:not(.collapsed) { background: #eef1f6 !important; font-weight: 600; } .bi-sidebar .accordion-body { margin: .2rem 0 .5rem 1.35rem; padding: 0 0 0 .5rem !important; border-left: 2px solid #e5e8ee; } .bi-sidebar .accordion-body .btn-link { padding: .35rem .6rem; border-radius: 8px; font-size: .84rem; color: #374151; text-decoration: none; white-space: normal; line-height: 1.3; } .bi-sidebar .accordion-body .btn-link:hover, .bi-sidebar .accordion-body .btn-link:focus { color: var(--primary); background: #f0f4ff; } .bi-sidebar .accordion-body .btn-link.ativo { font-weight: 600; color: #fff; background: var(--primary); } .bi-sidebar .accordion-body .btn-link.ativo i { color: #fff !important; opacity: 1 !important; } .sidebar-secao { padding: 1rem .75rem .35rem; font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #9aa3b2; } .sidebar-busca { position: relative; } .sidebar-busca .bi-search { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: #9aa3b2; font-size: .85rem; pointer-events: none; } .sidebar-busca .form-control { padding-left: 2rem; border-radius: 8px; background: #f3f5f9; border-color: transparent; } .sidebar-busca .form-control:focus { background: #fff; border-color: var(--primary); box-shadow: none; } .sidebar-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 1030; } @media (max-width: 991.98px) { body.bi-com-menu { padding-left: 0; } .bi-sidebar { transform: translateX(-100%); } .bi-sidebar.active { transform: translateX(0); } .sidebar-backdrop.active { display: block; } /* O botão flutuante ocupa o canto superior esquerdo: folga em cima do conteúdo. */ body.bi-com-menu .bi-container { padding-top: 4rem; } } /* Menu fechado no desktop: o botão flutuante fica sobre o conteúdo — folga à esquerda do título. */ @media (min-width: 992px) { body.bi-com-menu.sidebar-fechada .bi-container { padding-left: 4.5rem; } } /* ---- Área principal (mesmo "card branco" das telas do Ponto) ---- */ .bi-container { background: #fff; padding: 1.25rem 1.75rem; min-height: 100vh; } @media (max-width: 991.98px) { .bi-container { padding-left: 1rem; padding-right: 1rem; } } /* ---- Cards ---- */ .card-bi { border-radius: 10px; box-shadow: 0 4px 12px rgba(0,0,0,.08); transition: transform .2s, box-shadow .2s; border: none; } .card-bi:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,.13); } .card-bi i { transition: transform .25s ease; } .card-bi:hover i { transform: scale(1.2); } .card-bi-estatico:hover { transform: none; box-shadow: 0 4px 12px rgba(0,0,0,.08); } .card-bi-estatico:hover i { transform: none; } /* ---- Cabeçalho e barra de filtros (mesmos elementos nomeados das telas de indicador) ---- */ .bi-cabecalho-indicador { view-transition-name: bi-cabecalho-indicador; } .bi-barra-filtros { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; view-transition-name: bi-barra-filtros; } .bi-barra-filtros::-webkit-scrollbar { display: none; } .bi-chip-filtro { display: inline-flex; align-items: center; gap: .3rem; padding: .2rem .65rem; border-radius: 2rem; background: #eef2ff; color: #3730a3; font-size: .78rem; white-space: nowrap; } /* ---- Barra de seções: Resumo · Quando · Onde · Quem · Por quê ---- */ .ind-secoes { position: sticky; top: 0; z-index: 1020; display: flex; gap: .15rem; overflow-x: auto; scrollbar-width: none; margin: 0 0 1rem; padding-top: .25rem; background: #fff; border-bottom: 1px solid var(--bi-borda); view-transition-name: ind-secoes; } .ind-secoes::-webkit-scrollbar { display: none; } .ind-secoes button { border: 0; border-bottom: 3px solid transparent; background: transparent; padding: .6rem 1rem; font-weight: 500; color: #6c757d; white-space: nowrap; transition: color .15s ease, border-color .15s ease; } .ind-secoes button:hover { color: #212529; } .ind-secoes button:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; border-radius: 6px; } .ind-secoes button[aria-selected="true"] { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; } .ind-secoes button .bi { margin-right: .35rem; } /* Painel oculto NÃO usa display:none: altura zero + visibility, pra os gráficos medirem a largura certa. */ .ind-secao-painel { animation: indSecaoEntra .24s cubic-bezier(.22,.61,.36,1) both; } .ind-secao-painel.ind-oculto { height: 0; overflow: hidden; visibility: hidden; margin: 0; padding: 0; border: 0; animation: none; } @keyframes indSecaoEntra { from { opacity: 0; transform: translateY(6px); } } /* ---- KPIs: número entra contando, cartão entra em cascata ---- */ .bi-kpi { animation: biKpiEntra .35s cubic-bezier(.22,.61,.36,1) both; } .bi-kpi:nth-child(2) { animation-delay: .05s; } .bi-kpi:nth-child(3) { animation-delay: .1s; } .bi-kpi:nth-child(4) { animation-delay: .15s; } @keyframes biKpiEntra { from { opacity: 0; transform: translateY(8px); } } .bi-kpi-valor { font-size: 1.5rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; } /* ---- Matriz 2×2 (risco × hora extra) ---- */ .bi-matriz { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; } .bi-matriz-celula { border-radius: .6rem; padding: .6rem .75rem; border: 1px solid var(--bi-borda); background: #fff; min-width: 0; } .bi-matriz-celula .bi-matriz-num { font-size: 1.4rem; font-weight: 700; line-height: 1; } .bi-matriz-celula.critico { border-left: 4px solid #dc3545; background: #fff5f5; } .bi-matriz-celula.risco_sem_excesso { border-left: 4px solid #fd7e14; } .bi-matriz-celula.excesso_sem_risco { border-left: 4px solid #ffc107; } .bi-matriz-celula.controlado { border-left: 4px solid #198754; } /* ---- Texto colorido em tabela (nunca badge em célula — convenção das tabelas do Ponto) ---- */ .bi-nivel-Trivial, .bi-nivel-Tolerável, .bi-q-controlado { color: #198754; } .bi-nivel-Moderado, .bi-q-excesso_sem_risco { color: #b8860b; } .bi-nivel-Substancial, .bi-q-risco_sem_excesso { color: #fd7e14; } .bi-nivel-Intolerável, .bi-q-critico { color: #dc3545; } .bi-q-amostra_insuficiente, .bi-q-sem_avaliacao, .bi-q-sem_ponto { color: #6c757d; } /* ---- Legenda própria de gráfico (cores por nível de risco + linhas de referência) ---- */ .bi-legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: .35rem 1.1rem; font-size: .78rem; color: #475569; margin-top: .4rem; } .bi-legenda span { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; } .bi-legenda .bi-legenda-grupo { flex-wrap: wrap; gap: .35rem .7rem; white-space: normal; } .bi-legenda-cor { display: inline-block; width: .75rem; height: .75rem; border-radius: 2px; } .bi-legenda-linha { display: inline-block; width: 1.4rem; border-top: 2px solid; } .bi-legenda-traco { display: inline-block; width: 2px; height: .9rem; vertical-align: middle; } /* ---- Mapa setor × atividade (Atividades × Risco): célula vermelha = uma atividade só passando de 60% (monotonia) ---- */ .bi-mapa-atividades td, .bi-mapa-atividades th { white-space: nowrap; } .bi-mapa-monotonia { background: #dc3545; color: #fff; } /* ---- Barra por colaborador com a média da empresa marcada (cards "peso da hora extra" e "dias perdidos") ---- */ .bi-barra-media { position: relative; height: .6rem; background: #e9ecef; border-radius: .3rem; margin: .25rem 0 .1rem; } .bi-barra-media-valor { height: 100%; border-radius: .3rem; transition: width .5s ease; } .bi-barra-media-traco { position: absolute; top: -.25rem; bottom: -.25rem; width: 2px; margin-left: -1px; border-radius: 1px; } @media (prefers-reduced-motion: reduce) { .bi-barra-media-valor { transition: none; } } /* ---- Destaque de categoria (aba Por quê): valores na ponta do radar + linha marcada na tabela ---- */ #hrPorqueCorpo tr, #hrSetoresCorpo tr { cursor: pointer; transition: background-color .2s ease; } #hrPorqueCorpo tr:hover, #hrSetoresCorpo tr:hover { background: #f5f8ff; } #hrPorqueCorpo tr.bi-linha-destaque > td, #hrSetoresCorpo tr.bi-linha-destaque > td { background: #eaf1ff; } #hrPorqueCorpo tr.bi-linha-destaque > td:first-child, #hrSetoresCorpo tr.bi-linha-destaque > td:first-child { box-shadow: inset 4px 0 0 #0d6efd; font-weight: 600; } .bi-radar-tick { cursor: pointer; transition: fill .2s ease; } .bi-radar-tick:hover { fill: #0d6efd; } .bi-radar-valor { animation: biValorEntra .25s ease both; } @keyframes biValorEntra { from { opacity: 0; } } .bi-categorias-menu { min-width: 19rem; } .bi-categorias-lista { max-height: 16rem; overflow-y: auto; } .bi-categorias-lista .form-check { font-size: .82rem; margin-bottom: .15rem; } /* ---- Pirâmide (aba Onde): hora extra à esquerda, risco à direita ---- */ .bi-piramide-titulos { display: flex; font-size: .75rem; color: #64748b; font-weight: 600; } .bi-piramide-titulos > div { flex: 1 1 0; } /* ---- Painel de decisão ---- */ .bi-fato { display: flex; gap: .5rem; padding: .45rem 0; border-bottom: 1px dashed var(--bi-borda); } .bi-fato:last-child { border-bottom: 0; } .bi-fato .bi-fato-marca { width: .55rem; height: .55rem; border-radius: 50%; margin-top: .4rem; flex-shrink: 0; } .bi-fato .bi-fato-marca.ruim { background: #dc3545; } .bi-fato .bi-fato-marca.atencao { background: #ffc107; } .bi-fato .bi-fato-marca.boa { background: #198754; } .bi-fato a { white-space: nowrap; } /* ---- Carregando (esqueleto pulsante) ---- */ .bi-esqueleto { background: linear-gradient(90deg, #eef1f6 25%, #f7f8fb 37%, #eef1f6 63%); background-size: 400% 100%; animation: biEsqueleto 1.2s ease infinite; border-radius: .4rem; } @keyframes biEsqueleto { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } } /* ---- Login ---- */ /* Login: fundo no html, sem o fade da página inteira (piscava branco ao vir de outro login) e com transição cruzada entre os logins da INUGG — mesmo fundo do Ponto, NR-1 e Portal. */ @view-transition { navigation: auto; } html:has(.bi-login) { animation: none; min-height: 100%; background: #056eec linear-gradient(180deg, #203c55 0%, #056eec 50%, #3dcab1 100%) no-repeat; background-size: 100% 100%; } body:has(.bi-login) { background: transparent; } /* ---- Login: mesmo layout do login do Ponto (Ponto/app/Views/login.php) — gradiente INUGG, logo à esquerda, formulário à direita ---- */ .bi-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; background: transparent; } .bi-login-card { display: flex; width: 1070px; max-width: 100%; min-height: 520px; border-radius: 10px; box-shadow: 0 5px 18px rgba(0,0,0,.3); overflow: hidden; animation: biKpiEntra .4s cubic-bezier(.22,.61,.36,1) both; } .bi-login-marca { width: 45%; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 2rem; gap: 1.5rem; } .bi-login-marca img { max-width: 180px; height: auto; border-radius: 8px; } .bi-login-selo { background: rgba(255,255,255,.2); color: #fff; border-radius: 20px; padding: .35rem 1rem; font-size: .9rem; font-weight: 600; letter-spacing: .05em; } .bi-login-form { width: 55%; background: #fff; padding: 2.5rem; display: flex; flex-direction: column; justify-content: center; color: #212529; } .bi-login-form h1 { font-weight: 700; font-size: 1.75rem; margin-bottom: .4rem; color: #0d6efd; } .bi-login-form .bi-login-subtitulo { color: #6c757d; font-size: .95rem; margin-bottom: 1.5rem; } .bi-login-form label { font-weight: 600; margin-bottom: .4rem; color: #212529; } .bi-login-form .form-control { border-radius: 6px; padding: .55rem 1rem; font-size: 1rem; } .bi-login-form .form-control:focus { border-color: #0d6efd; box-shadow: 0 0 0 3px rgba(13,110,253,.18); } .bi-login-entrar { width: 100%; padding: .75rem; font-weight: 600; border-radius: 6px; margin-top: .5rem; } .bi-login-outros { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid #e9ecef; display: flex; gap: .6rem; flex-wrap: wrap; } .bi-login-outros a { flex: 1; min-width: 150px; border: 1px solid #ced4da; color: #495057; background: #fff; padding: .55rem .75rem; border-radius: 6px; font-weight: 600; font-size: .9rem; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; transition: all .2s; } .bi-login-outros a:hover { border-color: #0d6efd; color: #0d6efd; background: #f0f6ff; } @media (max-width: 768px) { .bi-login { align-items: flex-start; padding-top: 2rem; } .bi-login-card { flex-direction: column; min-height: 0; max-width: 440px; } .bi-login-marca { width: 100%; padding: 1.5rem; flex-direction: row; gap: 1rem; } .bi-login-marca img { max-width: 120px; } .bi-login-form { width: 100%; padding: 1.75rem 1.5rem; } } @media (max-width: 420px) { .bi-login-marca { display: none; } } /* ---- Transições de página (View Transitions API) ---- */ ::view-transition-old(root) { animation: biVtSai .16s ease both; } ::view-transition-new(root) { animation: biVtEntra .28s cubic-bezier(.22,.61,.36,1) both; } @keyframes biVtSai { to { opacity: 0; } } @keyframes biVtEntra { from { opacity: 0; transform: translateY(6px); } } @media (prefers-reduced-motion: reduce) { html, .ind-secao-painel, .bi-kpi, .bi-login-card, .bi-radar-valor { animation: none !important; } .ind-secoes button, .card-bi, .card-bi i { transition: none; } .card-bi:hover { transform: none; } ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; } } /* ---- Resumo do grupo filtrado (aba Por quê com 1 setor/função) ---- */ .bi-resumo-grupo { border: 1px solid var(--bi-borda); border-radius: .6rem; padding: .45rem .8rem; min-width: 9.5rem; background: #fff; animation: biKpiEntra .3s cubic-bezier(.22,.61,.36,1) both; } .bi-resumo-grupo .bi-resumo-rotulo { font-size: .72rem; color: var(--bi-texto-suave); } .bi-resumo-grupo .bi-resumo-valor { font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums; } /* ---- Faixa informativa (categorias que recortam a nota do radar por setor) ---- */ .bi-faixa-info { border-left: 4px solid #dc3545; background: #fff5f5; border-radius: .5rem; padding: .45rem .75rem; animation: indSecaoEntra .25s cubic-bezier(.22,.61,.36,1) both; } /* ---- Recolher/abrir card (shared/recolher-cards.js) — círculo azul com ^, como nos indicadores do Ponto ---- */ .bi-recolher-botao { width: 2rem; height: 2rem; border-radius: 50%; border: 0; background: var(--primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(13,110,253,.35); transition: transform .2s ease, background-color .2s ease; } .bi-recolher-botao:hover { background: #0b5ed7; } .bi-recolher-botao:focus-visible { outline: 2px solid #0b5ed7; outline-offset: 2px; } .bi-recolher-botao .bi { transition: transform .3s ease; } .bi-card-recolhido .bi-recolher-botao .bi { transform: rotate(180deg); } .bi-recolhivel { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .3s ease; } .bi-recolhivel > div { overflow: hidden; min-height: 0; } .bi-recolhivel.recolhido { grid-template-rows: 0fr; } @media (prefers-reduced-motion: reduce) { .bi-recolhivel, .bi-recolher-botao .bi { transition: none; } } /* ---- Comparação Lado A × Lado B (cópia do visual das telas de indicador do Ponto: cor fixa por lado, selo de modo ativo) ---- */ .ind-badge-comparacao { display: inline-flex; align-items: center; padding: .25rem .7rem; border-radius: 2rem; background: linear-gradient(135deg, #6f42c1, #563d7c); color: #fff; font-size: .78rem; font-weight: 600; white-space: nowrap; } .ind-lado-card { --c: #1d79f5; border: 1px solid #e5e8ee; border-top: 4px solid var(--c); border-radius: .6rem; padding: .7rem 1rem; background: #fff; } .ind-lado-card.lado-b { --c: #6f42c1; } .ind-lado-card h6 { margin: 0 0 .45rem; font-size: .9rem; font-weight: 700; color: var(--c); } .ind-lado-card h6 small { font-weight: 400; color: #64748b; } .ind-lado-card p { margin: 0 0 .2rem; font-size: .85rem; color: #334155; } .ind-cor-a { color: #1d79f5; } .ind-cor-b { color: #6f42c1; } /* ---- Modo comparação em todas as abas (comparar-abas.js): a aba mostra só os blocos .bi-cmp (Lado A × Lado B) ---- */ .ind-secao-painel:not(.bi-modo-cmp) > .bi-cmp { display: none !important; } .ind-secao-painel.bi-modo-cmp > :not(.bi-cmp) { display: none !important; } .bi-cmp-carregando { color: var(--bi-texto-suave); font-size: .85rem; padding: .75rem 0; } /* Coluna "Variação" da comparação Cenário A × B (comparar-lados.js): seta + diferença + variação %. Sem badge em célula. */ .bi-var { display: inline-flex; align-items: baseline; gap: .3rem; font-weight: 600; font-variant-numeric: tabular-nums; } .bi-var .bi { font-size: .8em; } .bi-var-pct { font-weight: 400; font-size: .85em; opacity: .8; } /* ---- Comparação Cenário A × B: layout do card do Resumo (02/10/2026) ---- */ .bi-cenario { --c: #1d79f5; display: flex; align-items: center; gap: .6rem; height: 100%; border: 1px solid #e5e8ee; border-left: 4px solid var(--c); border-radius: .5rem; padding: .45rem .8rem; background: #fff; } .bi-cenario.lado-b { --c: #6f42c1; } .bi-cenario-nome { font-weight: 700; color: var(--c); font-size: .9rem; white-space: nowrap; } .bi-cenario-periodo { font-size: .8rem; color: #334155; font-variant-numeric: tabular-nums; white-space: nowrap; } .bi-cenario-filtros { font-size: .78rem; color: #64748b; margin-left: auto; text-align: right; } .bi-cmp-cartao { height: 100%; border: 1px solid #e5e8ee; border-radius: .6rem; padding: .7rem .9rem; background: #fff; } .bi-cmp-cartao-rotulo { font-size: .7rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: #64748b; } .bi-cmp-cartao-valores { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem 1.1rem; margin: .3rem 0 .2rem; } .bi-cmp-cartao-valor { font-size: 1.3rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; color: #1e293b; } .bi-cmp-cartao-valor small { font-size: .68rem; font-weight: 700; margin-right: .3rem; } .bi-cmp-cartao-valor.sem-dado { white-space: nowrap; font-size: .9rem; font-weight: 500; font-style: italic; color: #94a3b8; } .bi-cmp-cartao-var { font-size: .82rem; min-height: 1.2rem; } .bi-cmp-subtitulo { font-size: .72rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: #64748b; margin-bottom: .35rem; } .bi-cmp-tabela { border-top: 1px solid #e5e8ee; } .bi-cmp-tabela thead th { font-size: .75rem; font-weight: 600; color: #475569; border-bottom-width: 1px; background: transparent; } .bi-cmp-tabela td, .bi-cmp-tabela tbody th { padding-top: .4rem; padding-bottom: .4rem; font-variant-numeric: tabular-nums; } .bi-cmp-tabela tr.bi-cmp-grupo th { background: #f8fafc; font-size: .7rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: #64748b; padding-top: .5rem; } .bi-cmp-tabela tr.bi-cmp-grupo .bi-cmp-aviso { float: right; text-transform: none; letter-spacing: 0; font-weight: 500; font-style: italic; color: #94a3b8; } @media (max-width: 575.98px) { .bi-cenario { flex-wrap: wrap; row-gap: .1rem; } .bi-cenario-filtros { flex-basis: 100%; margin-left: 0; text-align: left; } .bi-cmp-tabela tr.bi-cmp-grupo .bi-cmp-aviso { float: none; display: block; margin-top: .15rem; } } /* ---- Absenteísmo × Risco: perguntas do Resumo e selo de consistência ---- */ .bi-pergunta { padding: .6rem 0; border-bottom: 1px dashed var(--bi-borda); } .bi-pergunta:last-child { border-bottom: 0; padding-bottom: 0; } .bi-pergunta-titulo { font-size: .78rem; font-weight: 600; color: #475569; margin-bottom: .15rem; } .bi-selo-nivel { display: inline-flex; align-items: center; justify-content: center; min-width: 6.5rem; padding: .3rem .7rem; border-radius: 2rem; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; background: #f1f5f9; color: #475569; } .bi-selo-nivel.boa { background: #e8f6ee; color: #146c43; } .bi-selo-nivel.atencao { background: #fff5dc; color: #8a6100; } .bi-selo-nivel.ruim { background: #fdecec; color: #b42323; } .bi-q-risco_sem_ausencia { color: #fd7e14; } .bi-q-ausencia_sem_risco { color: #b8860b; } /* Atividades × Jornada × Risco: quadrantes com "atividade fora do horário registrado" no lugar do excesso. */ .bi-matriz-celula.risco_sem_fora { border-left: 4px solid #fd7e14; } .bi-matriz-celula.fora_sem_risco { border-left: 4px solid #ffc107; } .bi-q-risco_sem_fora { color: #fd7e14; } .bi-q-fora_sem_risco { color: #b8860b; } .bi-q-sem_atividade { color: #6c757d; } .bi-link-quem { white-space: nowrap; font-size: .78rem; } /* ---- Card inteiro clicável para abrir/recolher (shared/recolher-cards.js, 09/10/2026) ---- */ .bi-card-recolhido { cursor: pointer; } .bi-card-recolhido:hover { box-shadow: 0 6px 16px rgba(13,110,253,.16); } .bi-recolher-cabecalho { cursor: pointer; } /* Controles do cabeçalho (abas de recorte, selects, chaves) só com o card aberto. */ .bi-card-recolhido .bi-recolher-controles { display: none !important; } /* ===== SELECT customizado (Assets/JS/shared/select-dropdown.js): a lista nativa do