/*! Argus Analytics (c) 2026 Allan Nogueira. Todos os direitos reservados. Software licenciado: uso permitido somente a empresas com contrato de licenca vigente. Copia, distribuicao, modificacao ou engenharia reversa sem autorizacao do autor sao proibidas. */
/* Tema igual ao relatório do Power BI: fundo cinza, faixas pretas, verde-água, grafite, salmão e amarelo. */
:root {
    --fundo: #eef1f1;
    --painel: #ffffff;
    --faixa: #1c2541;
    --texto: #1f2430;
    --texto-2: #6b6a5f;
    --borda: #c3cbcb;
    --verde: #255f85;
    --grafite: #1c2541;
    --salmao: #b5473f;
    --amarelo: #f2c80f;
    --linha-par: #f4f6f6;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    background: var(--fundo);
    color: var(--texto);
    font-family: "Segoe UI", "DIN", Arial, sans-serif;
    font-size: calc(13px * var(--esc, 1));
}

/* ---------- topo */
.topo {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 10px 20px;
    background: var(--fundo);
    border-bottom: 2px dotted #9a9a9a;
}
.marca { display: flex; align-items: center; gap: 8px; }
.marca-nome { font-weight: 700; font-size: calc(17px * var(--esc, 1)); line-height: 1.05; text-align: right; letter-spacing: .5px; }
.marca-slogan { border-left: 2px solid var(--texto); padding-left: 8px; font-weight: 700; font-size: calc(13px * var(--esc, 1)); line-height: 1.05; }
.topo-titulo { flex: 1; font-size: calc(18px * var(--esc, 1)); font-weight: 600; }
.topo nav { display: flex; align-items: center; gap: 16px; }
.topo nav a { color: var(--grafite); font-weight: 600; text-decoration: none; border: 1px solid var(--grafite); padding: 5px 12px; border-radius: 4px; background: #fff; }
.topo nav a:hover { background: var(--grafite); color: #fff; }
.atualizado { color: var(--texto-2); font-size: calc(12px * var(--esc, 1)); }

/* ---------- botão e resumo dos filtros */
.botao-filtro {
    position: relative;
    background: none;
    border: 0;
    color: var(--texto);
    cursor: pointer;
    padding: 4px;
    line-height: 0;
}
.botao-filtro:hover { color: var(--verde); }
.qtd-filtros {
    position: absolute;
    top: -4px;
    right: -6px;
    background: var(--salmao);
    color: #fff;
    border-radius: 9px;
    font-size: calc(11px * var(--esc, 1));
    line-height: 17px;
    min-width: 17px;
    padding: 0 4px;
    text-align: center;
}
.resumo-filtros { font-size: calc(12px * var(--esc, 1)); font-weight: 400; color: var(--texto-2); margin-top: 2px; }

/* ---------- painel de filtros (menu oculto, como no Power BI) */
.pf-fundo {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: rgba(0, 0, 0, .25);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 70px 16px 16px;
    overflow: auto;
}
.pf-fundo[hidden] { display: none; }
.pf-caixa {
    position: relative;
    width: min(1480px, 100%);
    background: #e6e6e6;
    border: 2px solid #252423;
    border-radius: 16px;
    padding: 18px 70px 18px 22px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
}
.pf-fechar {
    position: absolute;
    top: 14px;
    right: 18px;
    background: none;
    border: 0;
    font-size: calc(34px * var(--esc, 1));
    line-height: 1;
    cursor: pointer;
    color: #000;
}
.pf-linha { display: grid; gap: 10px; margin-bottom: 16px; align-items: start; }
.pf-l1 { grid-template-columns: 3fr 1.3fr; }
.pf-l2 { grid-template-columns: 1.5fr 1.5fr 1.5fr 0.6fr 1fr; }
.pf-l3 { grid-template-columns: 3fr 1fr 1fr 1fr; }
.pf-l4 { grid-template-columns: 2.5fr 0.9fr 1fr 1fr 1fr; }
.pf-l5 { grid-template-columns: 2fr 1fr auto; margin-bottom: 0; }
.pf-caixa .filtro { min-width: 0; }
.pf-caixa .seletor, .pf-caixa .filtro select, .pf-caixa .filtro input[type=search] {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #c3cbcb;
    border-radius: 0;
    color: var(--texto-2);
    max-width: none;
}

.filtro { display: flex; flex-direction: column; min-width: 150px; position: relative; }
.filtro > label, .filtro .rotulo {
    background: var(--faixa);
    color: #fff;
    font-size: calc(11px * var(--esc, 1));
    text-transform: uppercase;
    text-align: center;
    padding: 3px 8px;
    border-radius: 4px 4px 0 0;
}
.filtro select, .filtro input[type=search], .filtro .seletor {
    border: 1px solid var(--borda);
    border-top: 0;
    border-radius: 0 0 4px 4px;
    background: #fff;
    padding: 6px 8px;
    font: inherit;
    min-height: 31px;
}
.filtro-periodo { min-width: 250px; }
.filtro-periodo .datas { display: flex; align-items: center; gap: 4px; margin-top: 4px; }
.filtro-periodo .datas input { font: inherit; border: 1px solid var(--borda); border-radius: 4px; padding: 3px 4px; width: 118px; }
.filtro-acoes { flex-direction: row; gap: 6px; min-width: auto; }

.seletor { cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 220px; user-select: none; }
.seletor::after { content: "▾"; float: right; margin-left: 6px; color: var(--texto-2); }
.lista-opcoes {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 20;
    width: 320px;
    max-height: 340px;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 4px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}
.lista-opcoes input[type=search] { margin: 6px; padding: 5px 7px; border: 1px solid var(--borda); border-radius: 4px; font: inherit; }
.lista-opcoes .itens { overflow: auto; padding: 0 6px 6px; }
.lista-opcoes label { display: flex; gap: 6px; padding: 3px 2px; cursor: pointer; align-items: flex-start; }
.lista-opcoes label:hover { background: var(--linha-par); }
.lista-opcoes .rodape { display: flex; justify-content: space-between; border-top: 1px solid var(--borda); padding: 5px 8px; }
.lista-opcoes .rodape button { background: none; border: 0; color: var(--grafite); cursor: pointer; font-weight: 600; }

.botao {
    background: var(--grafite);
    color: #fff;
    border: 0;
    border-radius: 4px;
    padding: 7px 16px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}
.botao:hover { background: #0f1629; }
.botao:disabled { opacity: .5; cursor: default; }
.botao-claro { background: #fff; color: var(--grafite); border: 1px solid var(--grafite); }
.botao-claro:hover { background: var(--linha-par); }

.aviso { margin: 0 20px 10px; padding: 10px 14px; border-radius: 6px; background: #fde7e9; color: #a4262c; border: 1px solid #f1bbbc; }

/* ---------- cards */
.cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    padding: 0 20px 14px;
}
.card {
    background: #ffffff;
    border: 1px solid #c3cbcb;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, .25);
    text-align: center;
}
.card-titulo { background: var(--faixa); color: #fff; font-size: calc(12px * var(--esc, 1)); text-transform: uppercase; padding: 3px 6px; }
.card-valor { font-size: calc(19px * var(--esc, 1)); font-weight: 700; padding: 7px 6px 8px; white-space: nowrap; }
.card-valor.negativo { color: var(--salmao); }

/* ---------- painéis */
.painel {
    background: var(--painel);
    margin: 0 20px 16px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 2px 3px 6px rgba(0, 0, 0, .25);
    border: 1px solid #c3cbcb;
}
.painel-titulo {
    background: var(--faixa);
    color: #fff;
    text-align: center;
    padding: 6px 10px;
    font-size: calc(14px * var(--esc, 1));
    position: relative;
}
.painel-acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    align-items: center;
    margin-top: 5px;
    font-size: calc(12px * var(--esc, 1));
}
.painel-acoes button {
    background: #fff;
    color: var(--texto);
    border: 0;
    border-radius: 3px;
    padding: 2px 9px;
    cursor: pointer;
    font: inherit;
}
.painel-acoes button:hover { background: var(--verde); color: #fff; }
.so-sem-venda { display: inline-flex; gap: 4px; align-items: center; margin: 0 8px; cursor: pointer; }

.grade {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
    gap: 0;
    padding: 0;
}
.grade .painel { margin-right: 20px; }

/* ---------- matriz */
.matriz-rolagem { overflow: auto; max-height: 70vh; }
.matriz { border-collapse: collapse; width: 100%; font-size: calc(12px * var(--esc, 1)); }
.matriz th {
    position: sticky;
    top: 0;
    background: #fff;
    border-bottom: 2px solid var(--verde);
    padding: 6px 8px;
    text-align: right;
    font-weight: 600;
    white-space: nowrap;
    z-index: 2;
}
.matriz th.col-nome { text-align: left; min-width: 360px; }
.matriz td { padding: 3px 8px; text-align: right; white-space: nowrap; border-bottom: 1px solid #eee; }
.matriz td.col-nome { text-align: left; white-space: normal; border-right: 1px solid var(--verde); }
.matriz tbody tr:nth-child(even) { background: var(--linha-par); }
.matriz tbody tr:hover { background: #e3ecf2; }
.matriz tr.n1 td { font-weight: 700; }
.matriz tr.n2 td.col-nome { padding-left: 24px; }
.matriz tr.n3 td.col-nome { padding-left: 40px; }
.matriz tr.n4 td.col-nome { padding-left: 56px; color: var(--texto-2); }
.matriz .alternar { display: inline-block; width: 16px; cursor: pointer; color: var(--grafite); font-weight: 700; user-select: none; }
.matriz tfoot td { font-weight: 700; border-top: 2px solid var(--texto); background: #fff; position: sticky; bottom: 0; }
.sem-venda { color: var(--salmao); font-weight: 700; }
.negativo { color: var(--salmao); }

/* ---------- barras */
.barras { padding: 10px 14px 14px; max-height: 420px; overflow: auto; }
.barra { display: grid; grid-template-columns: 170px 1fr; align-items: center; gap: 8px; margin: 4px 0; }
.barra-nome { text-align: right; font-size: calc(11px * var(--esc, 1)); color: var(--texto-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barra-trilho { display: flex; align-items: center; gap: 6px; }
.barra-cor { height: 16px; background: var(--verde); border-radius: 1px; min-width: 2px; }
.barra-cor.negativa { background: var(--salmao); }
.barra-valor { font-size: calc(11px * var(--esc, 1)); white-space: nowrap; }

/* ---------- tabelas */
.tabela-rolagem { max-height: 420px; overflow: auto; }
.tabela { border-collapse: collapse; width: 100%; font-size: calc(12px * var(--esc, 1)); }
.tabela th { position: sticky; top: 0; background: #fff; text-align: right; padding: 5px 8px; border-bottom: 2px solid var(--verde); }
.tabela th:first-child, .tabela td:first-child { text-align: left; }
.tabela td { padding: 3px 8px; text-align: right; border-bottom: 1px solid #eee; }
.tabela tbody tr:nth-child(even) { background: var(--linha-par); }
.tabela tfoot td { font-weight: 700; border-top: 2px solid var(--texto); position: sticky; bottom: 0; background: #fff; }

/* ---------- carregando */
.carregando {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, .6);
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    font-size: calc(16px * var(--esc, 1));
    font-weight: 600;
    z-index: 50;
}
.carregando[hidden] { display: none; }
.spinner { width: 28px; height: 28px; border: 4px solid #ccc; border-top-color: var(--verde); border-radius: 50%; animation: gira 0.8s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }

/* ---------- página de atualização */
.pagina-simples .caixa { background: #fff; margin: 20px; padding: 16px 24px; border-radius: 8px; box-shadow: 2px 3px 6px rgba(0,0,0,.2); max-width: 900px; }
.tabela-simples { border-collapse: collapse; margin-bottom: 16px; }
.tabela-simples td, .tabela-simples th { padding: 5px 14px 5px 0; border-bottom: 1px solid #eee; text-align: left; }
.dica { color: var(--texto-2); margin-left: 10px; }
.log { background: #1e1e1e; color: #ddd; padding: 12px; border-radius: 6px; font-size: calc(12px * var(--esc, 1)); max-height: 320px; overflow: auto; white-space: pre-wrap; }

@media (max-width: 900px) {
    .pf-linha { grid-template-columns: 1fr 1fr !important; }
    .pf-caixa { padding-right: 22px; padding-top: 52px; }
}
@media (max-width: 700px) {
    .pf-linha { grid-template-columns: 1fr !important; }
    .topo { flex-wrap: wrap; }
    .grade { grid-template-columns: 1fr; }
    .barra { grid-template-columns: 110px 1fr; }
}

/* =========================================================
   Gaveta lateral de filtros (v3)
   ========================================================= */
.gaveta-fundo { position: fixed; inset: 0; background: rgba(0, 0, 0, .18); z-index: 39; }
.gaveta-fundo[hidden], .gaveta[hidden] { display: none; }
.gaveta {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, 100vw);
    background: #fff;
    z-index: 40;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 24px rgba(0, 0, 0, .22);
    animation: entra .18s ease-out;
}
@keyframes entra { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }
.gaveta-topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--faixa);
    color: #fff;
    padding: 12px 16px;
    font-size: calc(16px * var(--esc, 1));
    font-weight: 600;
}
.gaveta-fechar { background: none; border: 0; color: #fff; font-size: calc(22px * var(--esc, 1)); cursor: pointer; line-height: 1; }
.gaveta-corpo { flex: 1; overflow: auto; padding: 4px 16px 16px; }
.gaveta-rodape {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding: 12px 16px;
    border-top: 1px solid var(--borda);
    background: #faf9f8;
}

.grupo { padding: 12px 0 6px; border-bottom: 1px solid #e3e8e8; }
.grupo:last-child { border-bottom: 0; }
.grupo h4 {
    margin: 0 0 10px;
    font-size: calc(12px * var(--esc, 1));
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--grafite);
    display: flex;
    align-items: center;
    gap: 8px;
}
.grupo h4::after { content: ""; flex: 1; height: 2px; background: var(--verde); opacity: .55; }

.gaveta .campo, .gaveta .filtro { display: block; margin-bottom: 10px; min-width: 0; position: static; }
.campo-rotulo, .gaveta .filtro .rotulo {
    display: block;
    background: none;
    color: var(--texto-2);
    font-size: calc(11.5px * var(--esc, 1));
    text-transform: none;
    text-align: left;
    padding: 0 0 3px;
    border-radius: 0;
}
.campo-datas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

/* Todos os campos com o mesmo visual */
.gaveta .controle, .gaveta .filtro .seletor {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 34px;
    padding: 7px 30px 7px 10px;
    border: 1px solid var(--borda);
    border-radius: 6px;
    background: #fff;
    color: var(--texto);
    font: inherit;
    font-size: calc(13px * var(--esc, 1));
    -webkit-appearance: none;
    appearance: none;
}
.gaveta select.controle, .gaveta .filtro .seletor {
    background-image: linear-gradient(45deg, transparent 50%, #6b6a5f 50%), linear-gradient(135deg, #6b6a5f 50%, transparent 50%);
    background-position: calc(100% - 15px) 14px, calc(100% - 10px) 14px;
    background-size: 5px 5px;
    background-repeat: no-repeat;
    cursor: pointer;
}
.gaveta input.controle { padding-right: 10px; }
.gaveta .filtro .seletor::after { content: none; }
.gaveta .controle:focus, .gaveta .filtro .seletor:focus { outline: 2px solid var(--verde); outline-offset: 0; border-color: var(--verde); }
.gaveta .filtro .seletor.vazio { color: var(--texto-2); }

/* Lista de opções abre logo abaixo do campo, dentro da gaveta */
.gaveta .lista-opcoes {
    position: static;
    width: 100%;
    max-height: 300px;
    margin-top: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}

/* Opções curtas viram botões (ex.: CPF / CNPJ) */
.botoes-opcao { display: flex; gap: 6px; flex-wrap: wrap; }
.botoes-opcao button {
    border: 1px solid var(--grafite);
    background: #fff;
    color: var(--grafite);
    border-radius: 16px;
    padding: 4px 14px;
    font: inherit;
    cursor: pointer;
}
.botoes-opcao button.ativo { background: var(--grafite); color: #fff; }

/* Etiquetas dos itens escolhidos */
.etiquetas { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.etiqueta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    background: #e3ecf2;
    border: 1px solid var(--verde);
    color: #1c2541;
    border-radius: 14px;
    padding: 1px 4px 1px 9px;
    font-size: calc(12px * var(--esc, 1));
}
.etiqueta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.etiqueta button {
    border: 0;
    background: none;
    color: #1c2541;
    cursor: pointer;
    font-size: calc(13px * var(--esc, 1));
    line-height: 1;
    padding: 0 3px;
}
.etiqueta button:hover { color: var(--salmao); }

/* Barra de filtros ativos no topo do dashboard */
.chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 20px 0; align-items: center; }
.chips:empty { display: none; }
.chips .etiqueta { background: #fff; }
.chips .etiqueta.fixa { border-color: var(--grafite); color: var(--grafite); background: #fff; padding-right: 9px; }
.chips .etiqueta b { font-weight: 600; margin-right: 2px; }
.chips .limpar-tudo { border: 0; background: none; color: var(--grafite); text-decoration: underline; cursor: pointer; font: inherit; font-size: calc(12px * var(--esc, 1)); }

/* Espaço para a última linha da matriz não ficar atrás do total */
.matriz tbody tr.espaco td { height: 26px; border: 0; background: #fff; }
/* Hierarquia Ano > Mês > Dia nas listas de datas */
.lista-opcoes label.nivel0 { font-weight: 400; }
.lista-opcoes label.nivel1 { padding-left: 20px; }
.lista-opcoes label.nivel2 { padding-left: 40px; color: var(--texto-2); }
.lista-opcoes .dica { margin: 6px 2px; display: block; }
/* ---------- Calendário de meses de fechamento */
.periodo { border: 1px solid var(--borda); border-radius: 8px; padding: 10px; background: #fff; }
.periodo-resumo { font-weight: 600; color: var(--texto); margin-bottom: 2px; }
.periodo-resumo small { display: block; font-weight: 400; color: var(--texto-2); font-size: calc(12px * var(--esc, 1)); }
.periodo-atalhos { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0 10px; }
.periodo-atalhos button {
    border: 1px solid var(--borda); background: #faf9f8; color: var(--texto); border-radius: 14px;
    padding: 2px 10px; font: inherit; font-size: calc(12px * var(--esc, 1)); cursor: pointer;
}
.periodo-atalhos button:hover { border-color: var(--verde); }
.periodo-atalhos button.ativo { background: var(--grafite); border-color: var(--grafite); color: #fff; }
.periodo-ano { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.periodo-ano span { font-weight: 700; font-size: calc(15px * var(--esc, 1)); }
.periodo-ano button {
    border: 1px solid var(--borda); background: #fff; border-radius: 6px; width: 30px; height: 28px;
    font-size: calc(18px * var(--esc, 1)); line-height: 1; cursor: pointer; color: var(--grafite);
}
.periodo-ano button:hover { background: var(--linha-par); }
.periodo-meses { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.periodo-meses button {
    border: 1px solid #e3e8e8; background: #fff; border-radius: 6px; padding: 7px 2px 5px;
    font: inherit; cursor: pointer; color: var(--texto); line-height: 1.15;
}
.periodo-meses button small { display: block; font-size: calc(10px * var(--esc, 1)); color: var(--texto-2); }
.periodo-meses button:hover { border-color: var(--verde); }
.periodo-meses button.futuro { color: #c3cbcb; }
.periodo-meses button.atual { border-color: var(--grafite); }
.periodo-meses button.dentro { background: #e3ecf2; border-color: #b7cbda; }
.periodo-meses button.ponta { background: var(--verde); border-color: var(--verde); color: #fff; font-weight: 600; }
.periodo-meses button.ponta small, .periodo-meses button.ponta.futuro { color: #fff; }
.periodo-meses button.ancora { box-shadow: 0 0 0 2px var(--grafite) inset; }
.periodo-dica { font-size: calc(11.5px * var(--esc, 1)); color: var(--texto-2); margin-top: 6px; min-height: 15px; }
.periodo-exato { margin-top: 8px; }
.periodo-exato summary { cursor: pointer; color: var(--grafite); font-size: calc(12.5px * var(--esc, 1)); font-weight: 600; }
.periodo-exato .campo-datas { margin-top: 8px; }
/* ---------- Topo v6: título à esquerda, logo no centro, botões à direita, sem linha tracejada */
.topo {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    padding: 12px 20px 10px;
    border-bottom: 0;
}
.topo-esq { min-width: 0; }
.topo .topo-titulo { font-size: calc(20px * var(--esc, 1)); font-weight: 600; flex: none; }
.topo .marca { justify-self: center; }
.topo .marca-nome { font-size: calc(20px * var(--esc, 1)); }
.topo .marca-slogan { font-size: calc(15px * var(--esc, 1)); }
.topo nav { justify-self: end; }
.topo .chips { padding: 6px 0 0; }
.chips .etiqueta { font-size: calc(12px * var(--esc, 1)); max-width: 520px; }

/* ---------- Matriz 40% mais baixa */
.matriz-rolagem { max-height: 42vh; }

/* ---------- Gráficos de baixo: 4 lado a lado, como no Power BI */
.grade { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding: 0 20px 20px; }
.grade .painel { margin: 0; display: flex; flex-direction: column; height: 380px; }
.grade .painel > :not(.painel-titulo) { flex: 1; min-height: 0; }
.grade .tabela-rolagem, .grade .barras { max-height: none; }
@media (max-width: 1300px) { .grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .grade { grid-template-columns: 1fr; } }

/* Pizza */
.pizza-caminho { flex: none !important; display: flex; gap: 6px; align-items: center; padding: 6px 10px 0; font-size: calc(12px * var(--esc, 1)); min-height: 26px; }
.pizza-caminho button { border: 1px solid var(--borda); background: #fff; border-radius: 4px; cursor: pointer; padding: 1px 8px; font: inherit; }
.pizza-caminho .dica { margin: 0; }
.pizza { display: flex; align-items: center; justify-content: center; padding: 4px; }
.pizza svg { width: 100%; height: 100%; }
.pizza path { cursor: pointer; stroke: #fff; stroke-width: 1; }
.pizza path:hover { opacity: .85; }
.pizza text { font-size: 10.5px; fill: #6b6a5f; font-family: "Segoe UI", Arial, sans-serif; }
.pizza polyline { fill: none; stroke: #939082; stroke-width: .8; }

/* Ranking */
.ranking { display: flex; flex-direction: column; height: 100%; padding: 10px 12px 6px; }
.ranking-linhas { flex: 1; overflow: auto; }
.rk { display: grid; grid-template-columns: 34% 1fr; align-items: center; gap: 6px; margin: 3px 0; }
.rk-nome { text-align: right; font-size: calc(10.5px * var(--esc, 1)); color: var(--texto-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-trilho { display: flex; align-items: center; gap: 5px; min-width: 0; }
.rk-cor { height: 18px; background: var(--verde); min-width: 2px; }
.rk-cor.negativa { background: var(--salmao); }
.rk-valor { font-size: calc(10.5px * var(--esc, 1)); color: var(--texto-2); white-space: nowrap; }
.rk-eixo { display: grid; grid-template-columns: 34% 1fr; gap: 6px; font-size: 10px; color: #939082; border-top: 1px solid #e3e8e8; padding-top: 3px; }
.rk-eixo div { display: flex; justify-content: space-between; padding-right: 30%; }
/* ---------- Seleção (filtragem cruzada) */
.matriz tbody tr:not(.espaco), .tabela tbody tr, .rk { cursor: pointer; }
.matriz tbody tr.selecionada, .tabela tbody tr.selecionada { background: #cfdde8 !important; }
.matriz tbody tr.selecionada td.col-nome { box-shadow: inset 4px 0 0 var(--verde); }
.tabela tbody tr.apagado td { color: #c3cbcb; }
.rk.apagado { opacity: .35; }
.rk.selecionada .rk-nome { color: var(--texto); font-weight: 700; }
.rk:hover .rk-cor { filter: brightness(1.1); }
.chips .etiqueta.selecao { background: var(--grafite); border-color: var(--grafite); color: #fff; }
.chips .etiqueta.selecao button { color: #fff; }

/* ---------- Página inteira numa tela (cada visual com a própria rolagem) */
.cards { gap: 10px; padding: 0 20px 10px; }
.card-titulo { font-size: calc(11px * var(--esc, 1)); padding: 2px 6px; }
.card-valor { font-size: calc(17px * var(--esc, 1)); padding: 4px 6px 5px; }
.painel-titulo { padding: 4px 10px; font-size: calc(13px * var(--esc, 1)); }
.painel-acoes { margin-top: 3px; }
.topo { padding: 8px 20px 6px; }
.topo .marca-nome { font-size: calc(18px * var(--esc, 1)); }
.topo .marca-slogan { font-size: calc(13px * var(--esc, 1)); }

@media (min-width: 1000px) and (min-height: 640px) {
    html, body { height: 100%; }
    body { display: flex; flex-direction: column; overflow: hidden; }
    body > .topo, body > .cards, body > .aviso { flex: none; }
    body > section.painel { flex: 1 1 0; min-height: 170px; display: flex; flex-direction: column; margin-bottom: 10px; }
    body > section.painel .matriz-rolagem { flex: 1; min-height: 0; max-height: none; }
    body > .grade { flex: 0 0 35vh; min-height: 220px; padding-bottom: 10px; }
    .grade .painel { height: 100%; }
}
/* ---------- Botão expandir / recolher tudo da matriz */
.painel-acoes .botao-expandir {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--verde);
    color: #fff;
    border: 0;
    border-radius: 14px;
    padding: 3px 13px 3px 10px;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .35);
    transition: background .15s, transform .1s;
}
.painel-acoes .botao-expandir:hover { background: #1d4e6e; color: #fff; }
.painel-acoes .botao-expandir:active { transform: scale(.97); }
.painel-acoes .botao-expandir svg { transition: transform .2s ease; }
.painel-acoes .botao-expandir[aria-pressed="true"] { background: #fff; color: var(--grafite); }
.painel-acoes .botao-expandir[aria-pressed="true"]:hover { background: #e3ecf2; }
.painel-acoes .botao-expandir[aria-pressed="true"] svg { transform: rotate(180deg); }
.painel-acoes .separador { width: 1px; height: 16px; background: #939082; margin: 0 4px; }
/* ---------- Título e linha de contexto (v9) */
.titulo-bloco { display: flex; align-items: center; gap: 10px; }
.titulo-barra { width: 5px; align-self: stretch; min-height: 38px; border-radius: 3px; background: linear-gradient(var(--verde), #1c2541); }
.titulo { margin: 0; font-size: calc(21px * var(--esc, 1)); font-weight: 700; letter-spacing: -.2px; line-height: 1.15; color: #1c2541; }
.subtitulo { font-size: calc(12px * var(--esc, 1)); color: var(--texto-2); margin-top: 1px; letter-spacing: .2px; }

.contexto { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.ctx-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    background: #fff;
    border: 1px solid #c3cbcb;
    border-radius: 6px;
    padding: 3px 8px;
    font-size: calc(12px * var(--esc, 1));
    color: var(--texto-2);
    white-space: nowrap;
}
.ctx-item svg { color: #939082; flex: none; }
.ctx-rotulo { color: #939082; }
.ctx-valor { color: var(--texto); font-weight: 600; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.ctx-item.ativo { border-color: var(--verde); background: #e3ecf2; }
.ctx-item.ativo svg { color: var(--verde); }
.ctx-limpar { border: 0; background: none; color: #939082; cursor: pointer; font-size: calc(12px * var(--esc, 1)); padding: 0 0 0 2px; line-height: 1; }
.ctx-limpar:hover { color: var(--salmao); }
.ctx-mais {
    border: 1px dashed var(--grafite);
    background: none;
    color: var(--grafite);
    border-radius: 6px;
    padding: 3px 9px;
    font: inherit;
    font-size: calc(12px * var(--esc, 1));
    font-weight: 600;
    cursor: pointer;
}
.ctx-mais:hover { background: #fff; }
.topo .chips:empty { display: none; }
.topo .chips { padding-top: 5px; }
/* ---------- Paleta Fonseca (marinho #1C2541 · azul-aço #255F85 · cinza-azulado #C3CBCB · oliva #939082) */
.card { box-shadow: 0 1px 3px rgba(28, 37, 65, .18); border-radius: 8px; }
.card-valor { color: var(--grafite); }
.painel { box-shadow: 0 1px 4px rgba(28, 37, 65, .16); }
.matriz tbody tr:hover, .tabela tbody tr:hover { background: #e3ecf2; }
.matriz tr.n1 td { color: var(--grafite); }
.titulo-barra { background: linear-gradient(#255f85, #1c2541); }
.subtitulo { color: #939082; }
.painel-acoes .botao-expandir { background: #255f85; }
.painel-acoes .separador { background: #4a5a7a; }
.rk-cor { background: #255f85; }
.sem-venda { color: #b5473f; }
.qtd-filtros { background: #255f85; }
.botao-filtro:hover { color: #255f85; }
.topo nav a { border-radius: 6px; }
/* ---------- Estrutura da opção A (Grafite elegante) com a paleta Fonseca */
:root { --fundo: #f3f5f6; }
body { background: var(--fundo); }
.topo { background: var(--fundo); }
/* Cards brancos com filete azul-aço em cima, sem faixa escura */
.card { background: #fff; border: 1px solid #dde3e4; border-top: 3px solid #255f85; border-radius: 8px; }
.card-titulo { background: none; color: #6b6a5f; font-size: calc(11px * var(--esc, 1)); letter-spacing: .5px; padding: 6px 6px 0; }
.card-valor { font-size: calc(18px * var(--esc, 1)); padding: 2px 6px 7px; }
.card-valor.negativo { color: #b5473f; }
/* Quadros: borda leve, título marinho */
.painel { border: 1px solid #dde3e4; border-radius: 8px; }
.painel-titulo { background: #1c2541; letter-spacing: .2px; }
/* Linha de contexto do topo */
.ctx-item { border-color: #dde3e4; }
.ctx-item.ativo { border-color: #255f85; background: #e3ecf2; }
.ctx-item.ativo svg { color: #255f85; }
/* Matriz: cabeçalho com filete azul-aço, linhas pares bem claras */
.matriz th, .tabela th { border-bottom-color: #255f85; color: #1c2541; }
.matriz tbody tr:nth-child(even), .tabela tbody tr:nth-child(even) { background: #f6f8f8; }
.matriz td.col-nome { border-right-color: #c3cbcb; }
/* =========================================================
   Login, cadastros, logs e menu do usuário (v12)
   ========================================================= */

/* ---------- Login */
.pagina-login {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: radial-gradient(circle at 20% 15%, #2a3a63 0%, #1c2541 45%, #141a2f 100%);
}
.login-caixa {
    width: min(400px, 100%);
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .35);
}
.login-topo { display: flex; justify-content: center; padding: 26px 20px 18px; background: #f3f5f6; border-bottom: 3px solid #255f85; }
.login-topo .marca-nome { font-size: calc(22px * var(--esc, 1)); }
.login-topo .marca-slogan { font-size: calc(15px * var(--esc, 1)); }
.login-form { display: flex; flex-direction: column; gap: 12px; padding: 24px 28px 26px; }
.login-form h1 { margin: 0; font-size: calc(20px * var(--esc, 1)); color: #1c2541; }
.login-sub { margin: -6px 0 4px; color: #6b6a5f; font-size: calc(13px * var(--esc, 1)); }
.login-rodape { margin: 2px 0 0; color: #939082; font-size: calc(12px * var(--esc, 1)); text-align: center; }
.login-form label, .form-vertical label { display: flex; flex-direction: column; gap: 4px; font-size: calc(12.5px * var(--esc, 1)); color: #6b6a5f; }
.login-form input, .form-vertical input[type=text], .form-vertical input[type=email], .form-vertical input[type=password],
.form-vertical select, .filtros-logs input, .filtros-logs select {
    font: inherit;
    font-size: calc(14px * var(--esc, 1));
    color: #1f2430;
    padding: 9px 11px;
    border: 1px solid #c3cbcb;
    border-radius: 7px;
    background: #fff;
}
.login-form input:focus, .form-vertical input:focus, .form-vertical select:focus, .filtros-logs input:focus, .filtros-logs select:focus {
    outline: 2px solid #255f85;
    outline-offset: 0;
    border-color: #255f85;
}
.botao-largo { width: 100%; padding: 11px; font-size: calc(15px * var(--esc, 1)); margin-top: 4px; }
.botao { background: #1c2541; display: inline-block; text-decoration: none; text-align: center; }
.botao:hover { background: #255f85; }

/* ---------- Mensagens */
.msg { padding: 9px 12px; border-radius: 7px; font-size: calc(13px * var(--esc, 1)); margin-bottom: 12px; }
.msg-ok { background: #e6f2ea; color: #1e5b33; border: 1px solid #b9dcc4; }
.msg-erro { background: #f8e5e3; color: #8c2f28; border: 1px solid #e9bdb8; }
.msg-info { background: #e3ecf2; color: #1c2541; border: 1px solid #b7cbda; }

/* ---------- Páginas administrativas */
.pagina-admin { overflow: auto !important; height: auto !important; display: block !important; }
.admin { padding: 6px 20px 30px; max-width: 1300px; margin: 0 auto; }
.cartao { background: #fff; border: 1px solid #dde3e4; border-radius: 10px; padding: 16px 20px; margin-bottom: 16px; box-shadow: 0 1px 4px rgba(28, 37, 65, .08); }
.cartao h2 { margin: 0 0 12px; font-size: calc(16px * var(--esc, 1)); color: #1c2541; }
.cartao-estreito { max-width: 720px; }
.cartao-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.cartao-topo h2 { margin: 0; }
.contador { background: #e3ecf2; color: #255f85; border-radius: 10px; padding: 1px 8px; font-size: calc(12px * var(--esc, 1)); margin-left: 4px; }
.form-vertical { display: flex; flex-direction: column; gap: 12px; }
.form-linha { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-vertical label.check, .check { flex-direction: row !important; align-items: center; gap: 8px !important; color: #1f2430 !important; font-size: calc(13px * var(--esc, 1)) !important; cursor: pointer; }
.form-vertical fieldset { border: 1px solid #dde3e4; border-radius: 8px; padding: 10px 14px; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.form-vertical legend { color: #1c2541; font-weight: 600; font-size: calc(13px * var(--esc, 1)); padding: 0 4px; }
.lista-lojas { display: flex; flex-direction: column; gap: 4px; padding-left: 22px; }
.acoes { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; align-items: center; }
.dica { color: #939082; font-size: calc(12px * var(--esc, 1)); margin: 0; }

.tabela-admin-rolagem { overflow: auto; max-height: 65vh; }
.tabela-admin { width: 100%; border-collapse: collapse; font-size: calc(13px * var(--esc, 1)); }
.tabela-admin th { position: sticky; top: 0; background: #fff; text-align: left; color: #1c2541; padding: 8px 10px; border-bottom: 2px solid #255f85; white-space: nowrap; }
.tabela-admin td { padding: 7px 10px; border-bottom: 1px solid #e3e8e8; vertical-align: top; }
.tabela-admin tbody tr:hover { background: #f6f8f8; }
.tabela-admin tr.inativo td { color: #939082; }
.acoes-linha { white-space: nowrap; text-align: right; }
.acoes-linha a, .acoes-linha button.link { margin-left: 10px; color: #255f85; text-decoration: none; font-weight: 600; font-size: calc(12.5px * var(--esc, 1)); }
.acoes-linha form { display: inline; }
button.link { background: none; border: 0; cursor: pointer; padding: 0; font: inherit; }
button.link.perigo, .acoes-linha button.link.perigo { color: #b5473f; }
.selo { display: inline-block; background: #eef1f1; color: #4a5a7a; border-radius: 10px; padding: 1px 8px; font-size: calc(11.5px * var(--esc, 1)); margin: 1px 0; }
.selo-ok { background: #e6f2ea; color: #1e5b33; }
.selo-off { background: #f3e9e7; color: #8c2f28; }
.nowrap { white-space: nowrap; }

/* Logs */
.filtros-logs { display: grid; grid-template-columns: 150px 150px 1fr 1fr; gap: 10px 12px; align-items: end; }
.filtros-logs label { display: flex; flex-direction: column; gap: 4px; font-size: calc(12.5px * var(--esc, 1)); color: #6b6a5f; }
.filtros-logs .largo { grid-column: 1 / 3; }
.filtros-logs .acoes { grid-column: 3 / 5; }
.resumo-logs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
.paginacao { display: flex; gap: 12px; align-items: center; font-size: calc(13px * var(--esc, 1)); color: #6b6a5f; }
.paginacao a { color: #255f85; font-weight: 600; text-decoration: none; }
.tabela-logs .detalhe { max-width: 620px; word-break: break-word; }
.acao { display: inline-block; border-radius: 10px; padding: 1px 9px; font-size: calc(12px * var(--esc, 1)); background: #eef1f1; color: #1f2430; white-space: nowrap; }
.acao-alerta { background: #f8e5e3; color: #8c2f28; }
.acao-admin { background: #e3ecf2; color: #255f85; }
.acao-sessao { background: #eeede8; color: #5c5a4e; }

/* ---------- Menu do usuário (canto superior direito) */
.menu-usuario { position: relative; }
.menu-usuario summary { list-style: none; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 3px 6px; border-radius: 8px; }
.menu-usuario summary::-webkit-details-marker { display: none; }
.menu-usuario summary:hover { background: #e3e8e8; }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: #1c2541; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: calc(12.5px * var(--esc, 1)); }
.menu-nome { display: flex; flex-direction: column; font-size: calc(12.5px * var(--esc, 1)); font-weight: 600; color: #1c2541; line-height: 1.2; max-width: 170px; }
.menu-nome small { font-weight: 400; color: #939082; font-size: calc(11px * var(--esc, 1)); }
.menu-lista {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 60;
    min-width: 220px;
    background: #fff;
    border: 1px solid #dde3e4;
    border-radius: 10px;
    box-shadow: 0 10px 28px rgba(28, 37, 65, .2);
    padding: 6px;
    display: flex;
    flex-direction: column;
}
.menu-lista a, .menu-lista button {
    display: block;
    text-align: left;
    padding: 8px 10px;
    border-radius: 6px;
    color: #1f2430;
    text-decoration: none;
    font: inherit;
    font-size: calc(13px * var(--esc, 1));
    background: none;
    border: 0;
    cursor: pointer;
    width: 100%;
}
.menu-lista a:hover, .menu-lista button:hover { background: #e3ecf2; color: #1c2541; }
.menu-lista form { border-top: 1px solid #e3e8e8; margin-top: 4px; padding-top: 4px; }
.menu-lista form button { color: #b5473f; }
.topo nav .menu-usuario summary, .topo nav .menu-lista a { border: 0; background: none; padding: 3px 6px; font-weight: inherit; }
.topo nav .menu-lista a { padding: 8px 10px; }
.topo nav .menu-lista a:hover { background: #e3ecf2; color: #1c2541; }

@media (max-width: 800px) {
    .form-linha, .filtros-logs, .resumo-logs { grid-template-columns: 1fr; }
    .filtros-logs .largo, .filtros-logs .acoes { grid-column: auto; }
    .menu-nome { display: none; }
}
/* Páginas com rolagem normal */
.pagina-simples { overflow: auto !important; height: auto !important; display: block !important; }

.login-contato { margin: -6px 0 0; text-align: center; font-size: calc(12.5px * var(--esc, 1)); font-weight: 600; color: #255f85; }

/* ---------- Atualizar Dados: tudo numa tela (log à direita) */
.atualizar-grade { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 16px; height: calc(100vh - 120px); min-height: 420px; }
.atualizar-esq { display: flex; flex-direction: column; gap: 16px; min-height: 0; }
.atualizar-grade .cartao { margin-bottom: 0; }
.cartao-flex { display: flex; flex-direction: column; min-height: 0; }
.atualizar-esq .cartao-flex { flex: 1; }
.cartao-flex .tabela-admin-rolagem { flex: 1; max-height: none; min-height: 0; }
.atualizar-log .log { flex: 1; max-height: none; margin: 0; min-height: 0; }
.tabela-admin .num { text-align: right; }
.selo-estado { font-size: calc(12px * var(--esc, 1)); font-weight: 700; padding: 4px 12px; border-radius: 999px; background: #e3e8e8; color: #1c2541; }
.selo-estado.ok { background: #dcebf3; color: #255f85; }
.selo-estado.erro { background: #f6e1df; color: #b5473f; }
.selo-estado.andamento { background: #ecebe5; color: #6b6a5f; }
.resumo-importacao { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.resumo-importacao div { background: #f4f6f6; border-radius: 8px; padding: 8px 10px; }
.resumo-importacao span { display: block; font-size: calc(11px * var(--esc, 1)); color: #6b6a5f; text-transform: uppercase; letter-spacing: .3px; }
.resumo-importacao b { display: block; margin-top: 3px; font-size: calc(14px * var(--esc, 1)); color: #1c2541; }
.atualizar-acao { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.atualizar-acao .dica { margin: 0; }
@media (max-width: 900px) {
    .atualizar-grade { grid-template-columns: 1fr; height: auto; }
    .atualizar-log .log { max-height: 60vh; }
}

/* ---------- Tela inicial (menus) */
.inicio-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; align-items: start; margin-top: 6px; }
.inicio-grade .cartao { margin-bottom: 0; }
.menu-bloco h2 { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; border-bottom: 2px solid #255f85; }
.menu-icone { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 9px; background: #1c2541; color: #fff; }
.menu-itens { display: flex; flex-direction: column; gap: 6px; }
.menu-item { display: block; text-decoration: none; padding: 10px 12px; border-radius: 8px; border: 1px solid transparent; color: #1c2541; transition: background .15s, border-color .15s; }
.menu-item b { display: block; font-size: calc(14px * var(--esc, 1)); }
.menu-item span { display: block; font-size: calc(12px * var(--esc, 1)); color: #6b6a5f; margin-top: 2px; }
.menu-item:hover { background: #eef4f8; border-color: #c3cbcb; }
.menu-item:hover b { color: #255f85; }
.inicio-rodape { color: #939082; font-size: calc(12px * var(--esc, 1)); margin: 18px 2px 0; }

/* Menu do usuário agrupado e botão Início */
.menu-lista .menu-grupo { font-size: calc(10.5px * var(--esc, 1)); font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: #939082; padding: 8px 10px 2px; border-top: 1px solid #e3e8e8; margin-top: 4px; }
.topo nav .menu-lista a.menu-inicio { font-weight: 600; }
.topo nav a.botao-inicio { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; }
.topo nav a.botao-inicio svg { width: 18px; height: 18px; }
@media (max-width: 700px) { .topo nav a.botao-inicio span { display: none; } }

/* ---------- Menu em mosaico (Início e botão ☰) */
.mosaico [hidden], .mosaico[hidden] { display: none !important; }
.mosaico-blocos { display: grid; grid-template-columns: repeat(auto-fill, 150px); gap: 14px; justify-content: center; padding: 18px 0; }
.mosaico-bloco {
    --cor: #255f85;
    width: 150px; height: 150px; border: 0; border-radius: 10px; cursor: pointer; font: inherit;
    background: var(--cor); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
    box-shadow: 0 2px 6px rgba(28, 37, 65, .18); transition: transform .15s, box-shadow .15s, filter .15s;
}
.mosaico-bloco:hover { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(28, 37, 65, .28); filter: brightness(1.08); }
.mosaico-bloco.fixo { cursor: default; transform: none; filter: none; width: 140px; height: 140px; }
.mosaico-icone svg { width: 56px; height: 56px; stroke-width: 1.7; }
.mosaico-nome { font-weight: 700; font-size: calc(14px * var(--esc, 1)); text-align: center; padding: 0 8px; line-height: 1.2; }

.submenu { display: flex; gap: 34px; background: #1c2541; color: #fff; border-radius: 12px; padding: 24px 28px; margin: 18px 0; box-shadow: 0 6px 20px rgba(28, 37, 65, .25); }
.submenu-lado { display: flex; flex-direction: column; gap: 14px; flex: none; }
.submenu-lado .mosaico-bloco { box-shadow: 0 0 0 1px rgba(255, 255, 255, .25); }
.submenu-voltar { background: #255f85; color: #fff; border: 0; border-radius: 6px; padding: 9px 12px; font: inherit; font-weight: 700; cursor: pointer; }
.submenu-voltar:hover { background: #2f74a1; }
.submenu-links { flex: 1; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 4px 26px; align-content: start; }
.submenu-links a { display: block; text-decoration: none; color: #fff; padding: 12px 10px; border-bottom: 1px solid rgba(195, 203, 203, .22); border-radius: 6px 6px 0 0; }
.submenu-links a b { display: block; font-size: calc(16px * var(--esc, 1)); font-weight: 500; }
.submenu-links a span { display: block; font-size: calc(12px * var(--esc, 1)); color: #c3cbcb; margin-top: 3px; }
.submenu-links a:hover { background: rgba(255, 255, 255, .08); }
.submenu-links a:hover b { color: #8fc1e0; }
/* divisão sutil dentro de um grupo do menu (ex.: Marketing › Externo / Interno) */
.submenu-secao { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; margin: 14px 0 0; font-size: calc(11px * var(--esc, 1));
    font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(195, 203, 203, .75); }
.submenu-secao:first-child { margin-top: 0; }
.submenu-secao::after { content: ''; flex: 1; height: 1px; background: rgba(195, 203, 203, .18); }

/* Versão sobreposta (botão ☰) */
.mosaico.sobreposto { position: fixed; inset: 0; z-index: 2000; background: rgba(28, 37, 65, .55); padding: 74px 24px 24px; overflow: auto; backdrop-filter: blur(2px); }
.mosaico.sobreposto .mosaico-blocos { background: #f3f5f6; border-radius: 12px; padding: 22px; max-width: 1000px; margin: 0 auto; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }
.mosaico.sobreposto .submenu { max-width: 1100px; margin: 0 auto; }
.botao-menu { position: relative; z-index: 2001; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 0; border-radius: 8px; background: #1c2541; color: #fff; cursor: pointer; margin-right: 2px; }
.botao-menu:hover, .botao-menu.ativo { background: #255f85; }
@media (max-width: 700px) {
    .mosaico-blocos { grid-template-columns: repeat(auto-fill, 120px); }
    .mosaico-bloco { width: 120px; height: 120px; }
    .submenu { flex-direction: column; padding: 18px; }
    .submenu-lado { flex-direction: row; align-items: center; }
    .submenu-lado .mosaico-bloco { width: 100px; height: 100px; }
}

/* ---------- Boas-vindas (tela Início) */
.boas-vindas {
    position: relative; overflow: hidden; border-radius: 14px; margin: 8px 0 22px;
    background: linear-gradient(120deg, #1c2541 0%, #22385c 55%, #255f85 100%); color: #fff;
    box-shadow: 0 6px 20px rgba(28, 37, 65, .18);
}
.boas-vindas::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: #939082; }
.boas-vindas-arte { position: absolute; right: 0; top: 0; height: 100%; width: 46%; color: #c3cbcb; opacity: .16; }
.boas-vindas-texto { position: relative; padding: 26px 34px 22px; max-width: 760px; }
.boas-vindas-data { font-size: calc(12px * var(--esc, 1)); letter-spacing: .6px; text-transform: uppercase; color: #c3cbcb; }
.boas-vindas h2 { margin: 6px 0 8px; font-size: calc(26px * var(--esc, 1)); font-weight: 600; letter-spacing: .2px; }
.boas-vindas-lead { margin: 0 0 6px; font-size: calc(16px * var(--esc, 1)); color: #eef1f1; }
.boas-vindas-lead b { color: #fff; font-weight: 700; }
.boas-vindas-sub { margin: 0; font-size: calc(13.5px * var(--esc, 1)); line-height: 1.5; color: #c3cbcb; max-width: 640px; }
.boas-vindas-rodape { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(195, 203, 203, .22); }
.boas-vindas-selo { display: inline-flex; align-items: center; gap: 8px; font-size: calc(12px * var(--esc, 1)); background: rgba(255, 255, 255, .1); padding: 5px 12px; border-radius: 999px; }
.boas-vindas-selo .ponto { width: 8px; height: 8px; border-radius: 50%; background: #8fd19e; box-shadow: 0 0 0 3px rgba(143, 209, 158, .2); }
.boas-vindas-selo .ponto.alerta { background: #e0a39d; box-shadow: 0 0 0 3px rgba(181, 71, 63, .25); }
.boas-vindas-autor { font-size: calc(12px * var(--esc, 1)); color: #c3cbcb; font-style: italic; }
.inicio-secao { margin: 0 2px 4px; font-size: calc(12px * var(--esc, 1)); font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: #939082; }
.inicio-secao + .mosaico .mosaico-blocos { justify-content: start; padding-top: 8px; }
@media (max-width: 700px) {
    .boas-vindas-texto { padding: 20px 20px 18px; }
    .boas-vindas h2 { font-size: calc(21px * var(--esc, 1)); }
    .boas-vindas-arte { width: 70%; opacity: .1; }
}
.menu-lista .menu-grupo:first-child { border-top: 0; margin-top: 0; }

/* ---------- Login em dois lados: apresentação do Argus + formulário */
.login-caixa.login-dupla { width: min(920px, 100%); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.login-apresentacao {
    position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
    padding: 38px 36px 26px; color: #fff; background: linear-gradient(150deg, #1c2541 0%, #22385c 55%, #255f85 100%);
}
.login-apresentacao::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: #939082; }
.login-arte { position: absolute; right: 0; bottom: 0; width: 100%; height: 55%; color: #c3cbcb; opacity: .12; }
.login-apresentacao-texto, .login-autor { position: relative; }
.login-etiqueta { font-size: calc(11.5px * var(--esc, 1)); letter-spacing: .8px; text-transform: uppercase; color: #c3cbcb; }
.login-apresentacao h2 { margin: 8px 0 10px; font-size: calc(30px * var(--esc, 1)); font-weight: 700; letter-spacing: .3px; }
.login-lead { margin: 0 0 10px; font-size: calc(15.5px * var(--esc, 1)); color: #eef1f1; }
.login-desc { margin: 0; font-size: calc(13px * var(--esc, 1)); line-height: 1.55; color: #c3cbcb; }
.login-destaques { list-style: none; margin: 20px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.login-destaques li { position: relative; padding-left: 22px; font-size: calc(13px * var(--esc, 1)); color: #eef1f1; }
.login-destaques li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 8px; height: 8px; border-radius: 2px; background: #8fc1e0; box-shadow: 0 0 0 3px rgba(143, 193, 224, .18); }
.login-autor { margin: 0; padding-top: 14px; border-top: 1px solid rgba(195, 203, 203, .22); font-size: calc(11.5px * var(--esc, 1)); font-style: italic; color: #c3cbcb; }
.login-lado-form { display: flex; flex-direction: column; justify-content: center; }
.login-dupla .login-topo { background: #fff; border-bottom: 0; padding: 30px 28px 6px; }
@media (max-width: 760px) {
    .login-caixa.login-dupla { grid-template-columns: 1fr; width: min(420px, 100%); }
    .login-apresentacao { padding: 24px 24px 18px; gap: 14px; }
    .login-apresentacao h2 { font-size: calc(24px * var(--esc, 1)); }
    .login-desc, .login-destaques { display: none; }
}

/* ---------- Painel de Uso */
.uso-periodo { display: flex; align-items: center; gap: 6px; margin: 4px 0 14px; flex-wrap: wrap; }
.uso-periodo a { text-decoration: none; color: #1c2541; border: 1px solid #c3cbcb; background: #fff; padding: 5px 14px; border-radius: 999px; font-size: calc(13px * var(--esc, 1)); font-weight: 600; }
.uso-periodo a.ativo, .uso-periodo a:hover { background: #1c2541; border-color: #1c2541; color: #fff; }
.uso-periodo .dica { margin-left: 6px; }
.uso-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.uso-kpi { background: #fff; border: 1px solid #dde3e4; border-top: 3px solid #255f85; border-radius: 8px; padding: 10px 14px; }
.uso-kpi span { display: block; font-size: calc(11px * var(--esc, 1)); text-transform: uppercase; letter-spacing: .4px; color: #6b6a5f; }
.uso-kpi b { display: block; font-size: calc(24px * var(--esc, 1)); color: #1c2541; margin-top: 4px; }
.uso-kpi.alerta { border-top-color: #b5473f; }
.uso-kpi.alerta b { color: #b5473f; }
.uso-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.uso-grade .cartao { margin-bottom: 0; }
.uso-largo { grid-column: 1 / -1; }
.uso-legenda { font-size: calc(12px * var(--esc, 1)); color: #6b6a5f; display: flex; align-items: center; gap: 6px; }
.uso-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-left: 8px; }
.uso-legenda i.l, .uso-barra .l { background: #1c2541; }
.uso-legenda i.c, .uso-barra .c { background: #8fb3cc; }
.uso-colunas { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 3px; height: 170px; align-items: end; }
.uso-col, .uso-hora { display: flex; flex-direction: column; align-items: center; height: 100%; min-width: 0; }
.uso-barra { flex: 1; width: 100%; display: flex; flex-direction: column-reverse; justify-content: flex-start; background: #f4f6f6; border-radius: 3px 3px 0 0; overflow: hidden; }
.uso-barra span { display: block; width: 100%; }
.uso-col small, .uso-hora small { font-size: calc(9.5px * var(--esc, 1)); color: #939082; margin-top: 3px; white-space: nowrap; height: 12px; }
.uso-colunas .uso-col:nth-child(even) small { visibility: hidden; }
.uso-horas { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); gap: 3px; height: 170px; }
.uso-ranking { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) 46px; align-items: center; gap: 10px; padding: 5px 0; border-bottom: 1px solid #eef1f1; }
.uso-ranking-nome { font-size: calc(13px * var(--esc, 1)); color: #1c2541; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uso-ranking-nome small { display: block; color: #939082; font-size: calc(11px * var(--esc, 1)); }
.uso-ranking-trilho { height: 10px; background: #f4f6f6; border-radius: 5px; overflow: hidden; }
.uso-ranking-trilho span { display: block; height: 100%; background: linear-gradient(90deg, #255f85, #1c2541); border-radius: 5px; }
.uso-ranking b { text-align: right; font-size: calc(13px * var(--esc, 1)); color: #1c2541; }
@media (max-width: 900px) { .uso-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .uso-grade { grid-template-columns: 1fr; } }

/* ---------- Senha temporária */
.senha-temp { border-left: 4px solid #255f85; }
.senha-temp-valor { display: flex; align-items: center; gap: 12px; margin: 8px 0 10px; }
.senha-temp-valor code { font-size: calc(22px * var(--esc, 1)); letter-spacing: 2px; background: #eef4f8; color: #1c2541; padding: 6px 16px; border-radius: 6px; border: 1px dashed #255f85; }
.acoes-linha form { display: inline; }
/* ---------- Aviso de dados desatualizados (Início) */
.alerta-dados { display: flex; align-items: center; gap: 14px; background: #fbefed; border: 1px solid #e8c3bf; border-left: 4px solid #b5473f; color: #5c2420; border-radius: 10px; padding: 12px 16px; margin: -8px 0 20px; font-size: calc(13.5px * var(--esc, 1)); }
.alerta-dados > div { flex: 1; }
.alerta-icone { flex: none; width: 28px; height: 28px; border-radius: 50%; background: #b5473f; color: #fff; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
/* ---------- Botões de exportação da matriz */
.exportar-grupo { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding-left: 10px; border-left: 1px solid rgba(255, 255, 255, .3); }
.exportar-grupo[hidden] { display: none; }

/* ---------- Relatório para PDF (impressão) */
.relatorio-impressao { display: none; }
@media print {
    @page { size: A4 landscape; margin: 10mm; }
    html, body.imprimindo { height: auto !important; overflow: visible !important; display: block !important; background: #fff !important; }
    body.imprimindo > *:not(.relatorio-impressao) { display: none !important; }
    body.imprimindo .relatorio-impressao { display: block; font-family: "Segoe UI", Arial, sans-serif; color: #1f2430; font-size: 9pt; }
    .relatorio-impressao * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .rel-topo { display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 2.5pt solid #1c2541; padding-bottom: 6pt; margin-bottom: 6pt; }
    .rel-titulo { font-size: 17pt; font-weight: 700; color: #1c2541; }
    .rel-sub { color: #6b6a5f; font-size: 8.5pt; margin-top: 2pt; }
    .rel-marca b { font-size: 12pt; letter-spacing: .5pt; color: #1c2541; border-left: 4pt solid #939082; padding-left: 6pt; }
    .rel-filtros { display: flex; flex-wrap: wrap; gap: 3pt 14pt; font-size: 8pt; color: #3d4250; margin-bottom: 8pt; }
    .rel-filtros b { color: #1c2541; }
    .rel-cards { display: grid; grid-template-columns: repeat(9, 1fr); gap: 5pt; margin-bottom: 10pt; }
    .rel-cards div { border: 0.75pt solid #dde3e4; border-top: 2.5pt solid #255f85; border-radius: 4pt; padding: 4pt 5pt; }
    .rel-cards span { display: block; font-size: 6.5pt; text-transform: uppercase; color: #6b6a5f; }
    .rel-cards b { display: block; font-size: 9.5pt; color: #1c2541; margin-top: 2pt; white-space: nowrap; }
    .relatorio-impressao h3 { font-size: 10.5pt; color: #1c2541; margin: 8pt 0 4pt; }
    .rel-tabela { width: 100%; border-collapse: collapse; font-size: 7.5pt; }
    .rel-tabela thead { display: table-header-group; }
    .rel-tabela tr { page-break-inside: avoid; }
    .rel-tabela th { background: #1c2541; color: #fff; padding: 4pt 3pt; font-weight: 600; text-align: right; }
    .rel-tabela th:first-child, .rel-tabela td:first-child { text-align: left; }
    .rel-tabela td { padding: 2.5pt 3pt; border-bottom: 0.5pt solid #e3e8e8; text-align: right; white-space: nowrap; }
    .rel-tabela td:first-child { white-space: normal; }
    .rel-tabela tr.n1 td { background: #dde8f0; font-weight: 700; color: #1c2541; }
    .rel-tabela tr.n2 td { font-weight: 600; }
    .rel-tabela tr.n2 td:first-child { padding-left: 10pt; }
    .rel-tabela tr.n3 td:first-child { padding-left: 20pt; }
    .rel-tabela tr.n4 td:first-child { padding-left: 30pt; color: #6b6a5f; }
    .rel-tabela tfoot td { font-weight: 700; background: #eef1f1; border-top: 1.5pt double #1c2541; }
    .rel-duas { display: grid; grid-template-columns: 1fr 1fr; gap: 14pt; page-break-inside: avoid; margin-top: 4pt; }
    .rel-pessoas { font-size: 7.5pt; }
    .rel-rodape { margin-top: 10pt; padding-top: 4pt; border-top: 0.5pt solid #c3cbcb; font-size: 7pt; color: #939082; text-align: right; }
}

a.mosaico-bloco { text-decoration: none; }

/* Chave "Mostrar: Produto | Fabricante" na matriz */
.alternador { display: inline-flex; border: 1px solid rgba(255, 255, 255, .55); border-radius: 6px; overflow: hidden; }
.painel-acoes .alternador button { border: 0; border-radius: 0; margin: 0; background: transparent; color: #fff; padding: 2px 10px; }
.painel-acoes .alternador button + button { border-left: 1px solid rgba(255, 255, 255, .55); }
.painel-acoes .alternador button.ativo { background: #fff; color: #1c2541; font-weight: 700; }
.painel-acoes .alternador button:not(.ativo):hover { background: rgba(255, 255, 255, .15); }
/* Títulos dos visuais em negrito (as ações ao lado continuam normais) */
.painel-titulo { font-weight: 600; letter-spacing: .3px; }
.painel-titulo .painel-acoes, .painel-titulo .pizza-caminho { font-weight: 400; }

/* ---------- Barra de progresso da importação */
.progresso { margin: 4px 0 16px; padding: 12px 14px; background: #f4f6f6; border-radius: 10px; border: 1px solid #dde3e4; }
.progresso[hidden] { display: none; }
.progresso-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: calc(13px * var(--esc, 1)); color: #1c2541; margin-bottom: 8px; }
.progresso-topo b { font-size: calc(18px * var(--esc, 1)); color: #255f85; }
.progresso-trilho { height: 14px; background: #e3e8e8; border-radius: 999px; overflow: hidden; }
.progresso-trilho span { display: block; height: 100%; border-radius: 999px; transition: width .8s ease;
    background: linear-gradient(90deg, #1c2541, #255f85);
    background-size: 40px 40px; position: relative; }
.progresso-trilho span::after { content: ""; position: absolute; inset: 0; border-radius: 999px;
    background: linear-gradient(115deg, transparent 0 40%, rgba(255, 255, 255, .25) 50%, transparent 60% 100%);
    background-size: 220% 100%; animation: progresso-brilho 1.6s linear infinite; }
@keyframes progresso-brilho { from { background-position: 120% 0; } to { background-position: -120% 0; } }
.progresso-info { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: calc(12px * var(--esc, 1)); color: #6b6a5f; margin-top: 6px; }
/* =========================================================
   Dashboard de Análise Comercial
   ========================================================= */
.cards-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); gap: 8px; }
.cards-11 .card-titulo { font-size: calc(10.5px * var(--esc, 1)); padding: 3px 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cards-11 .card-valor { font-size: calc(15.5px * var(--esc, 1)); padding: 6px 4px 7px; }
@media (max-width: 1400px) { .cards-11 { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 760px) { .cards-11 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.comercial-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 330px; gap: 12px; padding: 0 20px 16px; }
.comercial-grade .painel { margin: 0; display: flex; flex-direction: column; min-height: 0; }
.comercial-grade .painel > :not(.painel-titulo):not(.legenda):not(.pizza-caminho) { flex: 1; min-height: 0; }
.comercial-grade .tabela-rolagem { max-height: none; }
.comercial-grade .c-largo { grid-column: 1 / -1; }
@media (max-width: 1300px) { .comercial-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .comercial-grade { grid-template-columns: 1fr; } }
@media (min-width: 1000px) and (min-height: 640px) {
    body.pagina-comercial > .comercial-grade { flex: 1 1 0; min-height: 0; grid-auto-rows: auto; grid-template-rows: 0.85fr 1fr 1fr; overflow: auto; }
}
@media (min-width: 1300px) and (min-height: 640px) {
    body.pagina-comercial > .comercial-grade { overflow: hidden; }
}

/* Legenda dos gráficos de colunas */
.legenda { flex: none; display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; font-size: calc(11px * var(--esc, 1)); color: #6b6a5f; padding: 4px 8px 0; }
.legenda i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; vertical-align: -1px; }

/* Colunas agrupadas (rolagem horizontal quando há muitas categorias) */
.colunas-rolagem { overflow-x: auto; overflow-y: hidden; padding: 0 8px 4px; }
.colunas { display: flex; align-items: stretch; gap: 6px; height: 100%; min-width: max-content; }
.col-grupo { display: flex; flex-direction: column; width: 78px; flex: none; cursor: pointer; border-radius: 6px; padding: 2px 2px 0; }
.col-grupo:hover { background: #f1f4f6; }
.col-grupo.selecionada { background: #e3ecf2; }
.col-grupo.apagado { opacity: .35; }
.col-barras { position: relative; flex: 1; display: flex; gap: 3px; justify-content: center; min-height: 60px; margin-top: 52px; }
.col-barras > .col-barra { position: absolute; width: 14px; border-radius: 2px 2px 0 0; }
.col-barras > .col-barra:nth-child(1) { left: calc(50% - 32px); }
.col-barras > .col-barra:nth-child(2) { left: calc(50% - 16px); }
.col-barras > .col-barra:nth-child(3) { left: calc(50% + 0px); }
.col-barras > .col-barra:nth-child(4) { left: calc(50% + 16px); }
.colunas-ticket .col-barras > .col-barra:nth-child(1) { left: calc(50% - 17px); width: 16px; }
.colunas-ticket .col-barras > .col-barra:nth-child(2) { left: calc(50% + 1px); width: 16px; }
.col-barra.neg { border-radius: 0 0 2px 2px; }
.col-rotulo { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%) rotate(-90deg); transform-origin: center; white-space: nowrap;
    font-size: calc(9.5px * var(--esc, 1)); color: #3d4250; margin-bottom: 26px; width: 0; display: flex; justify-content: center; }
.col-nome { flex: none; font-size: calc(10px * var(--esc, 1)); text-align: center; line-height: 1.15; height: 36px; overflow: hidden; color: #1c2541; padding-top: 4px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-transform: uppercase; }

/* Tabelas numéricas */
.tabela-num td, .tabela-num th { white-space: nowrap; }
.tabela-num td.col-nome { white-space: normal; min-width: 150px; text-align: left; }
.tabela-num tbody tr { cursor: pointer; }
.tabela-num td.forte { font-weight: 700; }
.tabela-num tr.sub td { color: #6b6a5f; font-size: calc(11px * var(--esc, 1)); }
.tabela-num tr.sub td.col-nome { padding-left: 26px; }
.tabela-num tr.n1 td { font-weight: 600; }
.tabela-num tr.n2 td.col-nome { padding-left: 22px; }
.tabela-num tr.n3 td { color: #6b6a5f; }
.tabela-num tr.n3 td.col-nome { padding-left: 40px; }
.tabela-num .alternar { display: inline-block; width: 16px; cursor: pointer; color: #1c2541; font-weight: 700; user-select: none; }
.tabela-num thead tr:nth-child(2) th { top: 24px; }
.tabela-num .negativo { color: #b5473f; }

/* Pizza: nome da fatia em destaque */
.pizza text.pz-nome { fill: #1c2541; font-weight: 600; }
/* ---------- Banco de Dados */
.aviso-banco { background: #fdf6e3; border: 1px solid #ead9a6; border-left: 4px solid #c9a227; color: #5a4a1a; border-radius: 8px; padding: 10px 14px; font-size: calc(13px * var(--esc, 1)); margin: 4px 0 14px; }
.banco-grade { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 16px; align-items: start; }
.banco-tabelas { padding: 12px; position: sticky; top: 10px; max-height: calc(100vh - 140px); overflow: auto; margin: 0; }
.banco-tabelas h2 { margin-bottom: 8px; }
.banco-tabelas a { display: flex; justify-content: space-between; align-items: center; gap: 8px; text-decoration: none; color: #1c2541; padding: 7px 9px; border-radius: 7px; font-size: calc(13px * var(--esc, 1)); }
.banco-tabelas a small { display: block; color: #939082; font-size: calc(11px * var(--esc, 1)); margin-top: 1px; }
.banco-tabelas a em { font-style: normal; font-size: calc(11.5px * var(--esc, 1)); color: #6b6a5f; background: #eef1f1; border-radius: 10px; padding: 1px 7px; white-space: nowrap; }
.banco-tabelas a:hover { background: #eef4f8; }
.banco-tabelas a.ativo { background: #1c2541; color: #fff; }
.banco-tabelas a.ativo small, .banco-tabelas a.ativo em { color: #c3cbcb; background: rgba(255, 255, 255, .12); }
.banco-principal .cartao { margin-bottom: 14px; }
.banco-busca { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 10px; }
.banco-busca input[type=search] { flex: 1; min-width: 200px; padding: 7px 10px; border: 1px solid #c3cbcb; border-radius: 6px; font: inherit; }
.banco-busca select { padding: 7px 8px; border: 1px solid #c3cbcb; border-radius: 6px; font: inherit; }
.banco-busca a { color: #255f85; font-weight: 600; text-decoration: none; font-size: calc(13px * var(--esc, 1)); }
.banco-dados .tabela-admin-rolagem { max-height: calc(100vh - 330px); }
.tabela-banco th a { color: #1c2541; text-decoration: none; }
.tabela-banco td { white-space: nowrap; font-size: calc(12.5px * var(--esc, 1)); }
.tabela-banco td.banco-acoes, .tabela-banco th.banco-acoes { position: sticky; left: 0; background: #fff; z-index: 1; box-shadow: 1px 0 0 #e3e8e8; }
.tabela-banco td.banco-acoes a { color: #255f85; font-weight: 600; text-decoration: none; margin-right: 8px; }
.tabela-banco td.banco-acoes form { display: inline; }
.tabela-banco tr.editando td { background: #e3ecf2; }
.tabela-banco .nulo { color: #c3cbcb; font-style: italic; }
.form-banco-campos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 14px; margin-bottom: 8px; }
.form-banco-campos label { display: flex; flex-direction: column; gap: 3px; font-size: calc(12.5px * var(--esc, 1)); color: #1c2541; font-weight: 600; }
.form-banco-campos label small { color: #939082; font-weight: 400; }
.form-banco-campos input { padding: 6px 9px; border: 1px solid #c3cbcb; border-radius: 6px; font: inherit; font-weight: 400; }
.form-banco-campos input:focus { outline: 2px solid #8fb3cc; border-color: #255f85; }
.paginacao { margin-top: 10px; }
@media (max-width: 900px) { .banco-grade { grid-template-columns: 1fr; } .banco-tabelas { position: static; max-height: 260px; } }
/* ---------- Visual expandido (janela flutuante) */
.botao-foco { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; gap: 4px;
    background: rgba(255, 255, 255, .12); color: #fff; border: 1px solid rgba(255, 255, 255, .35); border-radius: 5px;
    padding: 2px 6px; cursor: pointer; font: inherit; font-size: calc(12px * var(--esc, 1)); font-weight: 600; line-height: 1.2; }
.botao-foco:hover { background: #fff; color: #1c2541; }
.painel-titulo:has(.painel-acoes) .botao-foco { top: 6px; transform: none; }
.comercial-grade .painel-titulo { padding-right: 40px; padding-left: 40px; }
.foco-fundo { position: fixed; inset: 0; background: rgba(28, 37, 65, .55); z-index: 1400; backdrop-filter: blur(2px); }
.foco-fundo[hidden] { display: none; }
.comercial-grade .painel.foco { position: fixed; top: 4vh; left: 3vw; right: 3vw; bottom: 4vh; z-index: 1500; margin: 0;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .45); border-radius: 12px; animation: foco-abrir .18s ease-out; }
@keyframes foco-abrir { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }
.painel.foco .painel-titulo { font-size: calc(16px * var(--esc, 1)); padding-top: 9px; padding-bottom: 9px; }
.painel.foco .tabela { font-size: calc(13.5px * var(--esc, 1)); }
.painel.foco .tabela td, .painel.foco .tabela th { padding: 5px 10px; }
.painel.foco .tabela-num thead tr:nth-child(2) th { top: 28px; }
.painel.foco .pizza svg { max-height: 100%; }
.painel.foco .pizza text { font-size: 9px; }
.painel.foco .col-grupo { width: 110px; }
.painel.foco .col-nome { font-size: calc(11.5px * var(--esc, 1)); height: 44px; }
.painel.foco .col-rotulo { font-size: calc(11px * var(--esc, 1)); }
.painel.foco .legenda { font-size: calc(13px * var(--esc, 1)); padding-top: 8px; }
body.com-foco { overflow: hidden; }
/* ---------- Andamento por arquivo (tela Atualizar Dados) */
.tabela-arquivos .col-andamento { width: 42%; }
.mini-barra { height: 8px; background: #e3e8e8; border-radius: 999px; overflow: hidden; }
.mini-barra span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #1c2541, #255f85); transition: width .8s ease; }
.mini-texto { display: block; font-size: calc(11px * var(--esc, 1)); color: #6b6a5f; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.tabela-arquivos tr.arq-ok .mini-barra span { background: #4f9a6e; }
.tabela-arquivos tr.arq-ok .mini-texto { color: #4f9a6e; }
.tabela-arquivos tr.arq-baixando td:first-child, .tabela-arquivos tr.arq-gravando td:first-child { font-weight: 700; color: #255f85; }
.tabela-arquivos tr.arq-baixando .mini-barra span, .tabela-arquivos tr.arq-gravando .mini-barra span { position: relative; }
.tabela-arquivos tr.arq-baixando .mini-barra span::after, .tabela-arquivos tr.arq-gravando .mini-barra span::after { content: ""; position: absolute; inset: 0;
    background: linear-gradient(115deg, transparent 0 40%, rgba(255, 255, 255, .35) 50%, transparent 60% 100%); background-size: 220% 100%; animation: progresso-brilho 1.6s linear infinite; }
.tabela-arquivos tr.arq-aguardando td:first-child { color: #939082; }
.tabela-arquivos td.anterior, .anterior-amostra { color: #a9b0b0; font-style: italic; }
.legenda-arquivos { margin: 6px 0 0; font-size: calc(11.5px * var(--esc, 1)); }
.atualizar-acao form { display: inline; margin: 0; }
.atualizar-acao form[hidden] { display: none; }
.botao-parar { background: #b5473f; }
.botao-parar:hover { background: #8f342e; }
/* ---------- Análise Comercial: tabelas compactas e títulos de coluna quebrando linha (sem rolagem lateral) */
.tabela-num thead { position: sticky; top: 0; z-index: 2; background: #fff; }
.tabela-num th { position: static; background: #fff; }
.tabela-num thead tr:nth-child(2) th { top: auto; }
.comercial-grade .painel:not(.foco) .tabela-num th { white-space: normal; line-height: 1.15; vertical-align: bottom; font-size: calc(10.5px * var(--esc, 1)); padding: 4px 5px; }
.comercial-grade .painel:not(.foco) .tabela-num td { font-size: calc(11px * var(--esc, 1)); padding: 3px 5px; }
.comercial-grade .painel:not(.foco) .tabela-num td.col-nome { min-width: 0; font-size: calc(10.5px * var(--esc, 1)); line-height: 1.2; }
.comercial-grade .painel:not(.foco) .tabela-num tr.n2 td.col-nome { padding-left: 16px; }
.comercial-grade .painel:not(.foco) .tabela-num tr.n3 td.col-nome { padding-left: 28px; }

/* Botão Expandir/Recolher tudo dentro do título */
.comercial-grade .painel-acoes .botao-expandir { padding: 1px 10px; font-size: calc(11.5px * var(--esc, 1)); }

/* ---------- Colunas agrupadas com zoom */
.col-grupo { width: var(--col-w, 78px); }
.colunas { --col-w: 78px; }
.col-barras { display: flex; gap: 2px; padding: 0 3px; }
.col-slot { position: relative; flex: 1; min-width: 4px; }
.col-slot > .col-barra { position: absolute; left: 0; right: 0; width: auto; }
.col-barra.cortada::before { content: ""; position: absolute; top: -4px; left: 0; right: 0; height: 7px;
    background: repeating-linear-gradient(135deg, #fff 0 3px, transparent 3px 6px); }
.col-zero { position: absolute; left: 0; right: 0; height: 1px; background: #939082; }
.colunas-rolagem { cursor: grab; user-select: none; }
.colunas-rolagem.arrastando { cursor: grabbing; }
.zoom { display: inline-flex; align-items: center; gap: 8px; margin-left: 10px; padding-left: 10px; border-left: 1px solid rgba(255, 255, 255, .3); }
.zoom label { display: inline-flex; align-items: center; gap: 3px; cursor: pointer; }
.zoom label span { font-size: calc(13px * var(--esc, 1)); opacity: .9; }
.zoom input[type=range] { width: 74px; accent-color: #8fb3cc; cursor: pointer; }
.painel-acoes .zoom-zerar { padding: 0 6px; font-size: calc(13px * var(--esc, 1)); line-height: 1.3; }

/* ---------- Menu Exportar (topo) */
.menu-exportar { position: relative; }
.menu-exportar[hidden] { display: none; }
.botao-exportar { list-style: none; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 600; font-size: calc(13px * var(--esc, 1));
    color: #1c2541; border: 1px solid #1c2541; border-radius: 6px; padding: 5px 11px; background: #fff; }
.botao-exportar::-webkit-details-marker { display: none; }
.botao-exportar:hover, .menu-exportar[open] .botao-exportar { background: #1c2541; color: #fff; }
.menu-exportar-lista { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; background: #fff; border: 1px solid #dde3e4;
    border-radius: 10px; box-shadow: 0 10px 28px rgba(28, 37, 65, .18); padding: 6px; min-width: 250px; }
.menu-exportar-lista button { display: block; width: 100%; text-align: left; background: none; border: 0; border-radius: 7px; padding: 8px 10px; cursor: pointer; font: inherit; color: #1c2541; }
.menu-exportar-lista button small { display: block; color: #6b6a5f; font-size: calc(11.5px * var(--esc, 1)); }
.menu-exportar-lista button:hover { background: #eef4f8; }

/* ---------- PDF da Análise Comercial */
@media print {
    .rel-cards-11 { grid-template-columns: repeat(11, 1fr) !important; }
    .rel-cards-11 b { font-size: 8.5pt !important; }
    .rel-graficos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10pt; margin: 4pt 0 6pt; page-break-inside: avoid; }
    .rel-graficos svg { width: 100%; height: auto; max-height: 62mm; }
    .rel-graficos text { font-size: 9px; fill: #3d4250; font-family: "Segoe UI", Arial, sans-serif; }
    .rel-graficos text.pz-nome { fill: #1c2541; font-weight: 600; }
    .rel-graficos polyline { fill: none; stroke: #939082; stroke-width: .8; }
    .rel-graficos path { stroke: #fff; stroke-width: 1; }
    .rel-bloco { page-break-inside: auto; margin-top: 6pt; }
    .rel-copia td, .rel-copia th { font-size: 7pt; padding: 2pt 3pt; }
    .rel-copia thead { display: table-header-group; }
    .rel-copia tr.n1 td { background: #dde8f0; font-weight: 700; }
    .rel-copia tr.n2 td:first-child { padding-left: 9pt; }
    .rel-copia tr.n3 td:first-child, .rel-copia tr.sub td:first-child { padding-left: 18pt; color: #6b6a5f; }
    .rel-copia tr.apagado td { color: inherit; }
}
.tabela-num tr.dica-expandir td { text-align: center !important; font-size: calc(10.5px * var(--esc, 1)) !important; color: #939082; font-style: italic; background: #f7f9f9; cursor: default; }

/* =========================================================
   Barras de rolagem com espaço próprio (não ficam por cima da informação)
   ========================================================= */
.tabela-rolagem, .matriz-rolagem, .colunas-rolagem, .tabela-admin-rolagem, .barras, .log, .gaveta-corpo,
.lista-opcoes .itens, .abc-lista, .banco-tabelas {
    scrollbar-gutter: stable;
    scrollbar-width: thin;                        /* Firefox */
    scrollbar-color: #b7c2c6 #f1f4f5;
}
.tabela-rolagem::-webkit-scrollbar, .matriz-rolagem::-webkit-scrollbar, .colunas-rolagem::-webkit-scrollbar,
.tabela-admin-rolagem::-webkit-scrollbar, .barras::-webkit-scrollbar, .log::-webkit-scrollbar, .gaveta-corpo::-webkit-scrollbar,
.lista-opcoes .itens::-webkit-scrollbar, .abc-lista::-webkit-scrollbar, .banco-tabelas::-webkit-scrollbar { width: 9px; height: 9px; }
.tabela-rolagem::-webkit-scrollbar-track, .matriz-rolagem::-webkit-scrollbar-track, .colunas-rolagem::-webkit-scrollbar-track,
.tabela-admin-rolagem::-webkit-scrollbar-track, .barras::-webkit-scrollbar-track, .gaveta-corpo::-webkit-scrollbar-track,
.lista-opcoes .itens::-webkit-scrollbar-track, .abc-lista::-webkit-scrollbar-track, .banco-tabelas::-webkit-scrollbar-track { background: #f1f4f5; }
.tabela-rolagem::-webkit-scrollbar-thumb, .matriz-rolagem::-webkit-scrollbar-thumb, .colunas-rolagem::-webkit-scrollbar-thumb,
.tabela-admin-rolagem::-webkit-scrollbar-thumb, .barras::-webkit-scrollbar-thumb, .log::-webkit-scrollbar-thumb, .gaveta-corpo::-webkit-scrollbar-thumb,
.lista-opcoes .itens::-webkit-scrollbar-thumb, .abc-lista::-webkit-scrollbar-thumb, .banco-tabelas::-webkit-scrollbar-thumb {
    background: #b7c2c6; border-radius: 6px; border: 2px solid #f1f4f5; }
.tabela-rolagem::-webkit-scrollbar-corner, .matriz-rolagem::-webkit-scrollbar-corner, .tabela-admin-rolagem::-webkit-scrollbar-corner { background: #f1f4f5; }
/* Folga para a barra horizontal não cobrir a linha de total nem os nomes do gráfico */
.colunas-rolagem { padding-bottom: 10px; }

/* ---------- Cards: variação contra o período anterior */
.card-var { font-size: calc(11px * var(--esc, 1)); padding: 0 4px 6px; margin-top: -4px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-var span { font-weight: 700; }
.card-var small { color: #939082; margin-left: 4px; font-size: calc(10px * var(--esc, 1)); }
.card-var.bom span { color: #3f8a5c; }
.card-var.ruim span { color: #b5473f; }
.card-var.igual span { color: #939082; }

/* ---------- Ordenação pelos títulos das colunas */
.tabela-num th.ordenavel { cursor: pointer; user-select: none; }
.tabela-num th.ordenavel:hover { color: #255f85; text-decoration: underline; }
.tabela-num th.ordenavel.ativo { color: #255f85; }
.tabela-num th .seta { font-size: calc(9px * var(--esc, 1)); }

/* ---------- Curva ABC */
.abc { display: flex; flex-direction: column; min-height: 0; padding: 4px 8px 6px; gap: 4px; }
.abc[hidden], .pizza[hidden], .pizza-caminho[hidden], .alternador[hidden] { display: none !important; }
.abc-resumo { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; font-size: calc(11px * var(--esc, 1)); }
.abc-classe { border-radius: 999px; padding: 2px 9px; color: #fff; }
.abc-classe b { font-size: calc(12px * var(--esc, 1)); }
.abc-classe.abc-A, .abc-selo.abc-A { background: #1c2541; }
.abc-classe.abc-B, .abc-selo.abc-B { background: #255f85; }
.abc-classe.abc-C, .abc-selo.abc-C { background: #b9b6a8; color: #1c2541; }
.abc-grafico-caixa { flex: 1; min-height: 90px; }
.abc-grafico { width: 100%; height: 100%; display: block; }
.abc-barra { cursor: pointer; }
.abc-barra:hover { opacity: .8; }
.abc-barra.apagado { opacity: .3; }
.abc-linha { fill: none; stroke: #b5473f; stroke-width: 2; vector-effect: non-scaling-stroke; }
.abc-guia { stroke: #939082; stroke-dasharray: 4 3; stroke-width: 1; vector-effect: non-scaling-stroke; }
.abc-eixo { font-size: 10px; fill: #6b6a5f; }
.abc-nota { text-align: center; font-size: calc(10.5px * var(--esc, 1)); margin: 0; }
.abc-selo { display: inline-block; min-width: 20px; text-align: center; border-radius: 4px; color: #fff; font-weight: 700; font-size: calc(11px * var(--esc, 1)); padding: 0 5px; }
.painel.foco .abc-grafico-caixa { flex: 0 0 38%; }
.painel.foco .abc-lista { flex: 1; min-height: 0; overflow: auto; }

/* ---------- Expandir visual também no Dashboard de Campanhas */
body > section.painel .painel-titulo, .grade .painel .painel-titulo { padding-right: 40px; padding-left: 40px; }
body > section.painel.foco, .grade .painel.foco { position: fixed; top: 4vh; left: 3vw; right: 3vw; bottom: 4vh; z-index: 1500;
    margin: 0 !important; height: auto !important; display: flex; flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .45); border-radius: 12px; animation: foco-abrir .18s ease-out; }
body > section.painel.foco .matriz-rolagem { flex: 1; min-height: 0; max-height: none; }
.grade .painel.foco > :not(.painel-titulo) { flex: 1; min-height: 0; }
.grade .painel.foco .rk-nome { font-size: calc(13px * var(--esc, 1)); }
/* ---------- Barra de título numa linha só (título · controles · botão expandir) */
.painel-titulo.titulo-linha { display: flex; align-items: center; gap: 8px; text-align: left; padding: 4px 6px 4px 12px !important; min-height: 30px; }
.titulo-linha .titulo-texto { flex: 1 1 auto; min-width: 40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.titulo-linha .painel-acoes { margin: 0; flex: none; flex-wrap: nowrap; }
.titulo-linha .botao-foco { position: static; transform: none; flex: none; padding: 2px 5px; }
.titulo-linha .zoom { margin-left: 4px; padding-left: 8px; gap: 5px; }
.titulo-linha .zoom input[type=range] { width: 52px; }
.titulo-linha .botao-expandir { white-space: nowrap; }
.painel.foco .painel-titulo.titulo-linha { padding: 8px 10px 8px 16px !important; }

/* =========================================================
   Detalhe (drill-through): menu do botão direito e janela de pedidos/orçamentos
   ========================================================= */
.menu-detalhe { position: fixed; z-index: 3000; background: #fff; border: 1px solid #dde3e4; border-radius: 10px; padding: 6px; min-width: 250px; max-width: 340px;
    box-shadow: 0 12px 32px rgba(28, 37, 65, .22); animation: foco-abrir .12s ease-out; }
.menu-detalhe-titulo { font-size: calc(11px * var(--esc, 1)); color: #939082; padding: 4px 10px 6px; border-bottom: 1px solid #eef1f1; margin-bottom: 4px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; letter-spacing: .3px; }
.menu-detalhe button { display: block; width: 100%; text-align: left; background: none; border: 0; border-radius: 7px; padding: 7px 10px; cursor: pointer; font: inherit; color: #1c2541; }
.menu-detalhe button b { display: block; font-size: calc(13px * var(--esc, 1)); font-weight: 600; }
.menu-detalhe button small { display: block; color: #6b6a5f; font-size: calc(11px * var(--esc, 1)); }
.menu-detalhe button:hover { background: #eef4f8; }

.detalhe-fundo { position: fixed; inset: 0; background: rgba(28, 37, 65, .55); z-index: 2400; backdrop-filter: blur(2px); }
.detalhe-janela { position: fixed; top: 4vh; left: 3vw; right: 3vw; bottom: 4vh; z-index: 2500; background: #fff; border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .45); display: flex; flex-direction: column; overflow: hidden; animation: foco-abrir .18s ease-out; }
.detalhe-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #1c2541; color: #fff; padding: 10px 14px 10px 18px; }
.detalhe-titulo { font-size: calc(16px * var(--esc, 1)); font-weight: 600; }
.detalhe-sub { font-size: calc(12px * var(--esc, 1)); color: #c3cbcb; margin-top: 2px; }
.detalhe-fechar { position: static; transform: none; }
.detalhe-corpo { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 12px 16px 14px; gap: 10px; }
.detalhe-carregando { margin: auto; color: #6b6a5f; font-size: calc(14px * var(--esc, 1)); }
.detalhe-ferramentas { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.detalhe-abas { display: inline-flex; border: 1px solid #c3cbcb; border-radius: 8px; overflow: hidden; }
.detalhe-abas button { border: 0; background: #fff; padding: 6px 14px; cursor: pointer; font: inherit; font-weight: 600; color: #1c2541; }
.detalhe-abas button + button { border-left: 1px solid #c3cbcb; }
.detalhe-abas button.ativo { background: #1c2541; color: #fff; }
.detalhe-abas button.ativo .contador { background: rgba(255, 255, 255, .2); color: #fff; }
.detalhe-busca { flex: 1; min-width: 220px; padding: 7px 10px; border: 1px solid #c3cbcb; border-radius: 7px; font: inherit; }
.detalhe-resumo { display: flex; flex-wrap: wrap; gap: 8px; }
.detalhe-resumo > span { background: #f4f6f6; border-radius: 8px; padding: 5px 12px; }
.detalhe-resumo small { display: block; font-size: calc(10.5px * var(--esc, 1)); color: #6b6a5f; text-transform: uppercase; letter-spacing: .3px; }
.detalhe-resumo b { font-size: calc(14px * var(--esc, 1)); color: #1c2541; }
.detalhe-resumo .detalhe-limite { background: #fdf6e3; color: #5a4a1a; font-size: calc(12px * var(--esc, 1)); align-self: center; }
.detalhe-tabela { flex: 1; min-height: 0; overflow: auto; max-height: none; border: 1px solid #eef1f1; border-radius: 8px; }
.detalhe-lista { font-size: calc(12.5px * var(--esc, 1)); }
.detalhe-lista th { white-space: nowrap; }
.detalhe-lista td { white-space: nowrap; }
.detalhe-lista td.txt { text-align: left; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.detalhe-lista th:nth-child(-n+8) { text-align: left; }
.detalhe-lista .detalhe-seta { width: 18px; color: #255f85; text-align: center; }
.detalhe-lista tr.detalhe-linha { cursor: pointer; }
.detalhe-lista tr.detalhe-linha:hover td { background: #eef4f8; }
.detalhe-lista tr.aberta td { background: #e3ecf2; font-weight: 600; }
.detalhe-lista tr.detalhe-sub > td { background: #f7f9f9; padding: 6px 10px 10px 30px; }
.detalhe-itens-tabela { width: auto; min-width: 70%; font-size: calc(12px * var(--esc, 1)); background: #fff; border: 1px solid #e3e8e8; }
.detalhe-itens-tabela th { position: static; background: #eef1f1; }
.detalhe-itens-tabela td.txt { text-align: left; }
.detalhe-itens-tabela tr.fora td { color: #a9b0b0; }
.detalhe-ferramentas .botao.botao-claro { background: #fff; color: #1c2541; border: 1px solid #1c2541; }
.detalhe-ferramentas .botao.botao-claro:hover { background: #1c2541; color: #fff; }
.detalhe-itens-tabela td { color: #1f2430; }
.detalhe-itens-tabela tr.fora td { color: #a9b0b0; }
.card-var.bom-queda span { color: #3f8a5c; }

/* "SEM VENDA" sempre em vermelho, em qualquer nível da matriz */
.matriz td.sem-venda, .matriz tr.n1 td.sem-venda, .matriz tbody tr.selecionada td.sem-venda { color: #b5473f; font-weight: 700; }

/* Divisória da 1ª coluna da matriz contínua (cabeçalho, linhas e total), sem "degrau" */
.matriz td.col-nome, .matriz th.col-nome, .matriz tfoot td:first-child { border-right: 0; box-shadow: inset -1px 0 0 #c3cbcb; }
.matriz tbody tr.selecionada td.col-nome { box-shadow: inset 4px 0 0 var(--verde), inset -1px 0 0 #c3cbcb; }
/* Bordas independentes por célula: com cabeçalho fixo, a borda mesclada desalinhava (degrau sob a 1ª coluna) */
.matriz, .tabela, .tabela-admin { border-collapse: separate; border-spacing: 0; }

/* ---------- Monitoramento LEM */
.comercial-grade .c-meio { grid-column: span 2; }
@media (max-width: 1300px) { .comercial-grade .c-meio { grid-column: 1 / -1; } }
.tabela-comissao td.txt { text-align: left; }
.tabela-comissao th:nth-child(-n+5) { text-align: left; }
/* ---------- Unidades de Negócio */
.aviso-unidade { background: #eef4f8; border: 1px solid #c9dbe7; border-left: 4px solid #255f85; color: #1c2541; border-radius: 8px; padding: 10px 14px; font-size: calc(13px * var(--esc, 1)); margin: 4px 0 12px; }
.alerta-unidade { background: #fdf6e3; border: 1px solid #ead9a6; border-left: 4px solid #c9a227; border-radius: 8px; padding: 9px 14px; margin-bottom: 12px; font-size: calc(13px * var(--esc, 1)); color: #5a4a1a; }
.alerta-unidade summary { cursor: pointer; }
.etiquetas-unidade { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.unidades-grade { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 16px; align-items: start; }
.unidades-lista { padding: 12px; margin: 0; position: sticky; top: 10px; }
.unidades-lista a { display: block; text-decoration: none; color: #1c2541; padding: 9px 10px; border-radius: 8px; margin-top: 4px; border: 1px solid transparent; }
.unidades-lista a small { display: block; color: #6b6a5f; font-size: calc(11.5px * var(--esc, 1)); margin-top: 1px; }
.unidades-lista a:hover { background: #eef4f8; }
.unidades-lista a.ativo { background: #1c2541; color: #fff; }
.unidades-lista a.ativo small { color: #c3cbcb; }
.unidades-lista a.inativa { opacity: .6; }
.form-unidade { margin: 0 0 10px; }
.form-unidade h3 { font-size: calc(14px * var(--esc, 1)); color: #1c2541; margin: 16px 0 8px; }
.form-unidade .form-linha { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.form-unidade .form-linha label { display: flex; flex-direction: column; gap: 3px; font-size: calc(12.5px * var(--esc, 1)); color: #6b6a5f; flex: 1; min-width: 200px; }
.form-unidade .form-linha label.check { flex-direction: row; align-items: center; flex: none; min-width: 0; color: #1c2541; }
.form-unidade input[type=text], .unidade-ferramentas input[type=search] { padding: 7px 10px; border: 1px solid #c3cbcb; border-radius: 6px; font: inherit; }
.unidade-lojas { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 4px 14px; }
.unidade-lojas label { font-size: calc(12.5px * var(--esc, 1)); }
.unidade-lojas b { color: #255f85; margin-right: 4px; }
.unidade-vend-topo { margin-top: 14px; }
.unidade-vend-topo h3 { margin: 0; }
.unidade-ferramentas { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: calc(12.5px * var(--esc, 1)); }
.unidade-ferramentas input[type=search] { min-width: 220px; }
.unidade-vend { max-height: 52vh; }
.unidade-vend tr.marcado td { background: #eef4f8; }
.unidade-vend td.vend-lojas .selo { margin-right: 3px; }
.excluir-unidade { text-align: right; margin-top: 4px; }
@media (max-width: 900px) { .unidades-grade { grid-template-columns: 1fr; } .unidades-lista { position: static; } }
/* Botão claro (Cancelar etc.): uma regra posterior de .botao escurecia o fundo e escondia o texto */
.botao.botao-claro { background: #fff; color: #1c2541; border: 1px solid #1c2541; }
.botao.botao-claro:hover { background: #eef4f8; color: #1c2541; }

/* ---------- Unificar Vendedores e vendedores no perfil */
.sugestoes-vend .sugestao-linha { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid #eef1f1; }
.sugestoes-vend .sugestao-linha > div { flex: 1; }
.sugestoes-vend .sugestao-linha small { display: block; margin-top: 3px; }
.busca-perfil { width: 100%; padding: 7px 10px; border: 1px solid #c3cbcb; border-radius: 6px; font: inherit; margin: 6px 0; }
.lista-vend-perfil { max-height: 240px; overflow: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 2px 12px;
    border: 1px solid #eef1f1; border-radius: 6px; padding: 6px 8px; scrollbar-width: thin; }
.lista-vend-perfil label { font-size: calc(12.5px * var(--esc, 1)); }
.lista-vend-perfil label[hidden] { display: none; }
.unidades-lista small.membros span { display: block; }
.unidades-lista a.ativo small.membros { color: #c3cbcb; }

/* ---------- Botão Voltar (ao lado do menu) */
.botao-voltar { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-right: 6px;
    border: 2px solid #1c2541; border-radius: 50%; background: #fff; color: #1c2541; cursor: pointer;
    box-shadow: 0 2px 6px rgba(28, 37, 65, .15); transition: background .15s, color .15s, transform .15s, box-shadow .15s; }
.botao-voltar svg { transition: transform .15s; }
.botao-voltar:hover { background: #255f85; border-color: #255f85; color: #fff; box-shadow: 0 4px 12px rgba(37, 95, 133, .35); }
.botao-voltar:hover svg { transform: translateX(-2px); }
.botao-voltar:active { transform: scale(.94); }
.botao-voltar:focus-visible { outline: 3px solid #8fb3cc; outline-offset: 2px; }
/* Botão Voltar: à direita do menu, mesmo formato (quadrado arredondado) */
.botao-voltar { width: 42px; height: 42px; border-radius: 8px; margin: 0 2px 0 -2px; border: 2px solid #1c2541; box-shadow: none; }
.botao-voltar:hover { box-shadow: none; }
/* Botão Voltar: opção E (retorno, fundo azul-aço) */
.botao-voltar { background: #255f85; color: #fff; border: 0; }
.botao-voltar:hover { background: #1d4e6e; color: #fff; }
.botao-voltar:hover svg { transform: translateX(-1px); }
/* Filtros: itens fora da unidade selecionada (desfocados, mas selecionáveis) */
.lista-opcoes .separador-unidade { font-size: calc(10.5px * var(--esc, 1)); text-transform: uppercase; letter-spacing: .5px; color: #939082; padding: 8px 10px 3px; border-top: 1px dashed #c3cbcb; margin-top: 4px; }
.lista-opcoes label.fora-unidade { opacity: .45; }
.lista-opcoes label.fora-unidade:hover, .lista-opcoes label.fora-unidade:has(input:checked) { opacity: 1; }
.vend-perfil-ferramentas { display: flex; align-items: center; gap: 12px; }
.vend-perfil-ferramentas .busca-perfil { flex: 1; }
.lista-vend-perfil label.vend-inativo { color: #939082; }

/* Atualizar Dados: textos longos do andamento não alargam a tela (cortam com "…") */
.atualizar-grade, .atualizar-esq, .atualizar-esq .cartao { min-width: 0; }
.progresso { min-width: 0; overflow: hidden; }
.progresso-topo { min-width: 0; }
.progresso-topo #prog-etapa { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.progresso-topo b { flex: none; }
.tabela-arquivos { table-layout: fixed; width: 100%; }
.tabela-arquivos th:first-child, .tabela-arquivos td:first-child { width: 30%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tabela-arquivos .col-andamento { width: 38%; }
.tabela-arquivos td.col-andamento { overflow: hidden; }
.tabela-arquivos .mini-texto { max-width: 100%; }
.tabela-arquivos th.num, .tabela-arquivos td.num { width: 16%; }
/* ---------- Logotipo Argus (olho formado por pontos de dados) */
.argus-marca { display: inline-flex; align-items: center; gap: 12px; color: #1c2541; }
.argus-olho { width: 54px; height: auto; flex: none; }
.argus-texto { display: flex; flex-direction: column; line-height: 1; font-family: "Segoe UI", Arial, sans-serif; }
.argus-nome { font-size: calc(24px * var(--esc, 1)); font-weight: 700; letter-spacing: 2.4px; }
.argus-sub { margin-top: 5px; font-size: calc(9px * var(--esc, 1)); font-weight: 400; letter-spacing: 1.2px; color: #255f85; }
.argus-escuro { color: #fff; }
.argus-escuro .argus-sub { color: #8fb3cc; }
.argus-grande { display: flex; width: max-content; margin: 0 0 18px; }
.argus-grande .argus-olho { width: 72px; }
.argus-grande .argus-nome { font-size: calc(30px * var(--esc, 1)); letter-spacing: 3px; }
.argus-grande .argus-sub { font-size: calc(11px * var(--esc, 1)); letter-spacing: 1.5px; margin-top: 6px; }
.argus-banner { display: flex; width: max-content; margin: 0 0 12px; }
@media (max-width: 760px) {
    .argus-grande .argus-olho { width: 56px; }
    .argus-grande .argus-nome { font-size: calc(26px * var(--esc, 1)); }
}
.contato-fone { display: inline-flex; align-items: center; gap: 5px; margin-left: 4px; white-space: nowrap; }
.bandeira-br { width: 17px; height: 12px; flex: none; border-radius: 2px; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .15); }
.icone-whatsapp { width: 13px; height: 13px; flex: none; color: #25a35a; opacity: .75; }
.contato-link { color: inherit; text-decoration: none; border-radius: 6px; padding: 2px 6px; transition: background .15s; }
.contato-link:hover { background: #eef3f7; }
.contato-link:hover .icone-whatsapp { opacity: 1; }
.contato-fone { gap: 6px; }
.bandeira-br { width: 20px; height: 14px; }
.icone-whatsapp { width: 16px; height: 16px; opacity: .85; }

/* ---------- Argus junto da marca do cliente */
.argus-topo { display: inline-flex; align-items: center; flex: none; padding-right: 12px; margin-right: 4px; border-right: 1px solid rgba(28, 37, 65, .14); }
.argus-mini { gap: 6px; }
.argus-mini .argus-olho { width: 28px; }
.argus-mini .argus-nome { font-size: calc(12.5px * var(--esc, 1)); letter-spacing: 1.6px; }
.argus-mini .argus-sub { display: none; }
@media (max-width: 1100px) { .argus-mini .argus-texto { display: none; } }
@media (max-width: 700px) { .argus-topo { display: none; } }
.mosaico.sobreposto .mosaico-cabeca { display: flex; justify-content: center; max-width: 1000px; margin: -56px auto 16px; }
.mosaico-cabeca .argus-olho { width: 44px; }
.mosaico-cabeca .argus-nome { font-size: calc(20px * var(--esc, 1)); }
.marca-logo { display: block; max-height: 44px; max-width: 200px; object-fit: contain; }
@media print {
    .rel-rodape { display: flex; justify-content: flex-end; align-items: center; gap: 5pt; }
    .rel-olho { width: 16pt; height: auto; }
}

/* Ajuste automático da largura das colunas também no visual expandido */
.painel.foco .col-grupo { width: var(--col-w, 110px); }
/* Análise Comercial: 9 indicadores (sem Bruto e Bruto − Dev) */
.cards-11 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
@media (max-width: 1400px) { .cards-11 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 760px) { .cards-11 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media print { .rel-cards-11 { grid-template-columns: repeat(9, 1fr) !important; } }
/* Pizza: linha guia na cor da fatia, mais visível, com ponto na fatia e no rótulo */
.pizza polyline.pz-guia, .rel-graficos polyline.pz-guia { stroke-width: 1.3; stroke-linejoin: round; stroke-linecap: round; }
.pizza circle.pz-ponto, .rel-graficos circle.pz-ponto { stroke: #fff; stroke-width: .8; pointer-events: none; }
.pizza polyline.pz-guia, .pizza circle.pz-ponto, .rel-graficos polyline.pz-guia, .rel-graficos circle.pz-ponto { filter: brightness(.78) saturate(1.2); }
.abc-tabela thead th:nth-child(2) { text-align: left; }

/* ---------- PDF: folha sem margem (sem cabeçalho/rodapé do navegador), margens no próprio relatório,
   tabelas curtas lado a lado e gráficos mais compactos */
@media print {
    @page { size: A4 landscape; margin: 0; }
    .rel-pagina { width: 100%; border-collapse: collapse; }
    .rel-pagina > thead > tr > td, .rel-pagina > tfoot > tr > td { padding: 0; border: 0; }
    .rel-margem { height: 9mm; }
    .rel-pagina > tbody > tr > td.rel-conteudo { padding: 0 11mm; vertical-align: top; border: 0; text-align: left; }
    .rel-graficos { gap: 8pt; margin: 2pt 0 4pt; }
    .rel-graficos svg { max-height: 50mm; }
    .rel-graficos h3 { margin: 2pt 0 2pt; }
    .rel-cards { margin-bottom: 6pt; }
    .relatorio-impressao h3 { font-size: 9.5pt; margin: 6pt 0 3pt; }
    .rel-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 4pt 14pt; align-items: start; }
    .rel-grade .rel-bloco { break-inside: avoid; page-break-inside: avoid; margin-top: 2pt; }
    .rel-estreito .rel-tabela { width: 62%; }
    .rel-emissao { margin-top: 10pt; padding-top: 4pt; border-top: 0.75pt solid #1c2541; font-size: 7.5pt; color: #3d4250; }
    .rel-emissao + .rel-rodape { margin-top: 2pt; border-top: 0; padding-top: 0; }
}
/* A regra .col-nome é do rótulo das colunas do gráfico de barras; nas células de tabela do PDF e da lista ABC
   ela deixava cada linha com 36px e o texto centralizado */
.relatorio-impressao td.col-nome, .relatorio-impressao th.col-nome, .abc-tabela td.col-nome {
    display: table-cell; height: auto; overflow: visible; text-align: left; line-height: 1.25; text-transform: none;
    font-size: inherit; -webkit-line-clamp: unset; }
.abc-tabela td.col-nome { padding-top: 4px; padding-bottom: 4px; }
/* PDF: título da tabela dentro do cabeçalho (repete nas folhas) e preso às 4 primeiras linhas */
@media print {
    .rel-tabela th.rel-tab-titulo, .rel-copia th.rel-tab-titulo { background: #fff !important; color: #1c2541 !important; text-align: left !important;
        font-size: 9.5pt !important; font-weight: 700; padding: 6pt 0 3pt !important; border: 0 !important; white-space: normal; }
    tbody.rel-primeiras { break-inside: avoid; page-break-inside: avoid; }
}
/* Filtro fixado pelo perfil de acesso */
.seletor.travado { cursor: default; background: #eef1f1; color: #1c2541; border-style: dashed; }
.seletor.travado:hover { border-color: inherit; }
/* Perfis e usuários: alcance dos dados e vínculo com o ERP */
.alcance-opcao { align-items: flex-start; gap: 8px; margin: 4px 0; }
.alcance-opcao input { margin-top: 3px; }
#vinculo .rotulo-campo { display: block; font-weight: 600; margin: 10px 0 4px; }
#vinculo details { margin-top: 10px; }
#vinculo summary { cursor: pointer; font-weight: 600; }
.dica.dica-destaque { color: #255f85; font-weight: 600; }
/* Ordenação do gráfico de colunas, no título do visual */
.ordem-colunas { display: inline-flex; align-items: center; gap: 0; border: 1px solid rgba(255, 255, 255, .55); border-radius: 6px; overflow: hidden; color: #fff; }
.ordem-colunas[hidden] { display: none !important; }
.ordem-colunas svg { margin: 0 2px 0 7px; opacity: .85; flex: none; }
.ordem-colunas select { appearance: none; -webkit-appearance: none; background: transparent; color: #fff; border: 0; border-radius: 0; margin: 0;
    padding: 2px 8px 2px 4px; font: inherit; font-weight: 600; cursor: pointer; outline: none; }
.ordem-colunas select option { color: #1c2541; background: #fff; }
.ordem-colunas button { border: 0; border-left: 1px solid rgba(255, 255, 255, .55); border-radius: 0; margin: 0; background: transparent; color: #fff;
    padding: 2px 9px; font-weight: 700; cursor: pointer; min-width: 28px; }
.ordem-colunas select:hover, .ordem-colunas button:hover { background: rgba(255, 255, 255, .15); }
.ordem-colunas select:focus-visible, .ordem-colunas button:focus-visible { box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .6); }
.selo.selo-alerta { background: #fdecea; color: #b5473f; border: 1px solid #f1c4bf; cursor: help; }

/* =========================================================
   Dashboard Curva ABC
   ========================================================= */
.cards-abc { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.cards-abc .card-titulo { font-size: calc(10.5px * var(--esc, 1)); padding: 3px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cards-abc .card-valor { font-size: calc(15.5px * var(--esc, 1)); padding: 5px 6px 2px; }
.cards-abc .card-sub { font-size: calc(10.5px * var(--esc, 1)); color: #6b6a5f; padding: 0 6px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cards-abc .card-classe { border-top-color: var(--cor-classe); }
@media (max-width: 1300px) { .cards-abc { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .cards-abc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) {
    body.pagina-comercial.painel-abc > .comercial-grade.abc-grade { grid-template-rows: 1fr 1.15fr; }
}
.abc-faixas { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.abc-faixas input { width: 42px; padding: 1px 3px; border-radius: 4px; border: 1px solid rgba(255, 255, 255, .55); background: transparent; color: #fff; font: inherit; text-align: center; }
.abc-faixas input:focus { outline: none; background: rgba(255, 255, 255, .15); }
.abc-pareto { position: relative; min-height: 0; display: flex; flex-direction: column; }
.abc-pareto svg { flex: 1; min-height: 0; width: 100%; height: 100%; }
.abc-faixa { opacity: .07; }
.abc-faixa-A { fill: #1c2541; } .abc-faixa-B { fill: #255f85; } .abc-faixa-C { fill: #939082; } .abc-faixa-S { fill: #b5473f; }
.abc-faixa-rotulo { font-size: 12px; font-weight: 700; fill: #6b6a5f; opacity: .8; }
.abc-pareto .abc-linha { fill: none; stroke: #b5473f; stroke-width: 2; vector-effect: non-scaling-stroke; }
.abc-pareto .abc-guia { stroke: #939082; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.abc-pareto .abc-eixo { font-size: 12px; fill: #6b6a5f; }
.abc-pareto .abc-barra { cursor: pointer; }
.abc-pareto .abc-barra.esmaecido { opacity: .25; }
.abc-pareto .abc-barra.marcado { stroke: #e0a100; stroke-width: 2; vector-effect: non-scaling-stroke; }
.abc-nota { text-align: center; padding: 2px 0; }
.abc-mini { overflow: auto; padding: 6px 10px; }
.abc-barras { display: flex; flex-direction: column; gap: 8px; }
.abc-barras-rotulo { display: flex; align-items: center; gap: 6px; font-size: calc(12px * var(--esc, 1)); font-weight: 600; color: #1c2541; margin-bottom: 2px; }
.abc-barras-linha { display: grid; grid-template-columns: 92px 1fr 54px; align-items: center; gap: 6px; font-size: calc(11px * var(--esc, 1)); color: #3d4250; }
.abc-barras-trilho { height: 10px; background: #eef1f1; border-radius: 5px; overflow: hidden; }
.abc-barras-valor { display: block; height: 100%; border-radius: 5px; }
.abc-barras-valor.claro { opacity: .45; }
.abc-barras-num { text-align: right; font-variant-numeric: tabular-nums; }
.abc-selo { display: inline-block; min-width: 18px; padding: 0 4px; border-radius: 4px; color: #fff; font-size: calc(10.5px * var(--esc, 1)); font-weight: 700; text-align: center; line-height: 16px; }
.abc-busca { width: 150px; padding: 1px 8px; border-radius: 5px; border: 1px solid rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .12); color: #fff; font: inherit; }
.abc-busca::placeholder { color: rgba(255, 255, 255, .7); }
.abc-lista-tabela td.abc-ant { white-space: nowrap; }
.abc-lista-tabela td.abc-ant.sobe span { color: #3f8a5c; }
.abc-lista-tabela td.abc-ant.cai span { color: #b5473f; }
.abc-lista-tabela tr.abc-sem td { color: #8a5650; }
.abc-lista-tabela tr.abc-mais td { text-align: center; padding: 8px; }
.abc-lista-tabela th.txt, .abc-lista-tabela td.txt { text-align: left; }
.abc-lista-tabela tbody tr { cursor: pointer; }
@media print {
    .rel-cards-abc { grid-template-columns: repeat(6, 1fr) !important; }
    .rel-cards-abc small { display: block; font-size: 6.5pt; color: #6b6a5f; margin-top: 1pt; }
    .rel-pareto svg { width: 100%; height: 60mm; }
    .relatorio-impressao .abc-barras-linha { grid-template-columns: 70pt 1fr 40pt; font-size: 7.5pt; }
    .relatorio-impressao .abc-barras-trilho { height: 6pt; }
    .rel-abc td.abc-ant span { color: inherit; }
}
/* Lista da Curva ABC: nome numa linha só (texto completo ao passar o mouse) */
.abc-lista-tabela td.col-nome { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 1px; width: 100%; }
.abc-lista-tabela.abc-compacta td:not(.col-nome), .abc-lista-tabela.abc-compacta th { white-space: nowrap; }
.painel.foco .abc-lista-tabela td.col-nome { max-width: 520px; width: auto; }
.abc-lista-tabela td, .abc-lista-tabela td.col-nome { font-size: calc(11px * var(--esc, 1)); text-transform: none; height: auto; display: table-cell; line-height: 1.3; }
/* Curva ABC: exportar só a lista (botão no título do visual) */
.menu-exportar-visual .botao-exportar-visual { list-style: none; display: inline-flex; align-items: center; gap: 5px; cursor: pointer; font-weight: 600;
    border: 1px solid rgba(255, 255, 255, .55); border-radius: 6px; padding: 1px 9px; color: #fff; white-space: nowrap; }
.menu-exportar-visual .botao-exportar-visual::-webkit-details-marker { display: none; }
.menu-exportar-visual .botao-exportar-visual:hover, .menu-exportar-visual[open] .botao-exportar-visual { background: rgba(255, 255, 255, .15); }
.menu-exportar-visual .menu-exportar-lista { min-width: 220px; text-align: left; font-weight: 400; }
/* Lista expandida: larguras fixas (sem rolagem para o lado) e quebra de linha nos textos longos */
.abc-lista-tabela.abc-expandida { table-layout: fixed; width: 100%; }
.abc-lista-tabela.abc-expandida th { white-space: normal; line-height: 1.15; vertical-align: bottom; }
.painel.foco .abc-lista-tabela.abc-expandida td.col-nome,
.abc-lista-tabela.abc-expandida td.col-nome, .abc-lista-tabela.abc-expandida td.col-texto {
    white-space: normal; overflow-wrap: anywhere; max-width: none; width: auto; overflow: visible; text-overflow: clip; }
.abc-lista-tabela.abc-expandida td { overflow: hidden; text-overflow: ellipsis; }
.painel.foco .abc-lista-tabela + *, .painel.foco .tabela-rolagem:has(.abc-expandida) { overflow-x: hidden; }
@media print {
    .rel-abc-lista { table-layout: fixed; width: 100%; }
    .rel-abc-lista td, .rel-abc-lista th { white-space: normal !important; overflow-wrap: anywhere; font-size: 6.5pt !important; }
}
.abc-lista-tabela.abc-expandida td.col-nome, .abc-lista-tabela.abc-expandida td.col-texto { overflow-wrap: break-word; word-break: normal; }
.abc-lista-tabela.abc-expandida th { overflow-wrap: break-word; }
.abc-lista-tabela.abc-expandida th { overflow-wrap: normal; word-break: keep-all; hyphens: none; font-size: calc(10.5px * var(--esc, 1)); padding: 4px 3px; }
.abc-lista-tabela.abc-expandida td { padding-left: 3px; padding-right: 3px; }
.abc-lista-tabela.abc-expandida td:first-child { overflow: visible; text-overflow: clip; white-space: nowrap; }
/* Lista expandida da Curva ABC: números com a largura do conteúdo (nada cortado); só os textos quebram linha */
.abc-lista-tabela.abc-expandida { table-layout: auto; }
.abc-lista-tabela.abc-expandida td:not(.txt) { white-space: nowrap; overflow: visible; text-overflow: clip; }
.abc-lista-tabela.abc-expandida th:not(.txt) { white-space: normal; }
/* PDF: marca do cliente igual à do topo da página */
@media print {
    .rel-marca .marca { display: flex; align-items: center; gap: 6pt; color: #1c2541; }
    .rel-marca .marca-nome { font-size: 13pt; font-weight: 700; line-height: 1.05; text-align: right; letter-spacing: .3pt; }
    .rel-marca .marca-slogan { font-size: 9.5pt; font-weight: 700; line-height: 1.05; border-left: 1.5pt solid #1c2541; padding-left: 6pt; }
    .rel-marca .marca-logo { max-height: 14mm; max-width: 50mm; }
    .rel-marca b { border: 0; padding: 0; }
}
/* PDF: margem de 1 cm em todos os lados, repetida em cada folha; cabeçalho das tabelas repetido a cada folha */
@media print {
    @page { size: A4 landscape; margin: 0; }
    body.imprimindo .relatorio-impressao.rel-paginado { box-sizing: border-box; width: 100%; padding: 10mm;
        -webkit-box-decoration-break: clone; box-decoration-break: clone; }
    .rel-paginado table { break-inside: auto; page-break-inside: auto; }
    .rel-paginado thead { display: table-header-group; }
    .rel-paginado tfoot { display: table-footer-group; }
    .rel-paginado tr { break-inside: avoid; page-break-inside: avoid; }
    /* tabelas curtas lado a lado: blocos inteiros (vão para a folha seguinte se não couberem) */
    .rel-paginado .rel-grade { display: block; font-size: 0; }
    .rel-paginado .rel-grade > .rel-bloco { display: inline-block; vertical-align: top; width: 48.5%; font-size: 9pt; margin: 2pt 0 6pt; }
    .rel-paginado .rel-grade > .rel-bloco:nth-child(odd) { margin-right: 3%; }
}
@media print { .rel-abc th:nth-child(2), .rel-abc th.txt { text-align: left !important; } }
/* PDF paginado pelo sistema: cada .rel-folha é uma folha A4 deitada com 1 cm de margem */
@media print {
    html, body.imprimindo { margin: 0 !important; padding: 0 !important; }
    body.imprimindo .relatorio-impressao.rel-paginado { padding: 0 !important; width: auto; }
    .relatorio-impressao.rel-medindo { width: 277mm !important; padding: 0 !important; }
    .rel-folha { box-sizing: content-box; width: 277mm; padding: 10mm; break-after: page; page-break-after: always; }
    .rel-folha:last-child { break-after: auto; page-break-after: auto; }
    .rel-folha > :first-child, .rel-folha > table:first-child { margin-top: 0; }
    .rel-folha table { width: 100%; }
    .rel-folha table.rel-largura-total, .rel-folha > table { width: 100%; }
    .rel-folha .rel-estreito .rel-tabela { width: 62%; }
}
/* Atualizar Dados: usa mais a largura da tela (tabela e mensagens sem cortar títulos) */
main.admin:has(.atualizar-grade) { max-width: 1840px; }
.atualizar-grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 1100px) { .atualizar-grade { grid-template-columns: 1fr; } }

/* =========================================================
   Responsividade: textos proporcionais à resolução, telas fluidas, tablet e celular
   ========================================================= */
/* Escala dos textos (1 = tela de 1600 a 2199 px, a referência atual) */
:root { --esc: 1; }
@media (max-width: 1599px) { :root { --esc: .95; } }
@media (max-width: 1399px) { :root { --esc: .92; } }
@media (min-width: 2200px) { :root { --esc: 1.1; } }
@media (min-width: 2800px) { :root { --esc: 1.25; } }
@media (max-width: 760px) { :root { --esc: 1; } }   /* celular: tamanho normal, para leitura */

/* Telas administrativas: ocupam a largura disponível (com limite para monitores ultralargos) */
.admin { max-width: min(96vw, 2300px); }
main.admin:has(.atualizar-grade) { max-width: min(96vw, 2300px); }
@media (min-width: 2200px) { .admin { padding-left: 28px; padding-right: 28px; } }

/* Títulos dos visuais: se os controles não couberem na mesma linha, descem para a linha de baixo (qualquer tela) */
.painel-titulo.titulo-linha { flex-wrap: wrap; row-gap: 4px; }
.titulo-linha .painel-acoes { flex-wrap: wrap; justify-content: flex-end; row-gap: 4px; max-width: 100%; }

/* Tablet (até 1100 px) */
@media (max-width: 1100px) {
    .topo { grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; padding-left: 14px; padding-right: 14px; }
    .topo .marca-slogan { font-size: calc(11px * var(--esc, 1)); padding-left: 6px; }
    .comercial-grade, .cards { padding-left: 12px; padding-right: 12px; }
    .atualizado { display: none; }
}

/* Celular (até 760 px) */
@media (max-width: 760px) {
    .topo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 8px 10px; }
    .topo .topo-esq { flex: 1 1 100%; min-width: 0; order: 0; }
    .topo .marca { order: 1; }
    .topo .marca-nome { font-size: 13px; }
    .topo nav { order: 2; margin-left: auto; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
    .titulo-bloco { min-width: 0; }
    .titulo-bloco .titulo { font-size: 17px; white-space: normal; }
    .titulo-bloco .subtitulo { display: none; }
    .contexto { flex-wrap: wrap; }
    .comercial-grade { grid-auto-rows: minmax(300px, auto); gap: 10px; padding: 0 8px 12px; }
    .cards { padding: 0 8px 8px; gap: 6px; }
    .titulo-linha .zoom label { display: none; }          /* zoom por controle deslizante: só no computador */
    .titulo-linha .painel-acoes { justify-content: flex-start; }
    .painel.foco, .comercial-grade .painel.foco { top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; border-radius: 0; }
    .detalhe-janela { top: 0; left: 0; right: 0; bottom: 0; border-radius: 0; }
    .gaveta { width: 100vw; max-width: 100vw; }
    .admin { padding-left: 10px; padding-right: 10px; }
    .form-linha { flex-direction: column; }
    .menu-exportar-lista { right: 0; left: auto; max-width: calc(100vw - 20px); }
}
.titulo-linha .titulo-texto { flex: 1 1 0; min-width: 60px; }

/* ---------- Login: segredo do nome Argus (clique no olho do logotipo) */
.argus-grande .argus-olho > circle { transition: transform .18s ease-out; }
.argus-olho.piscando { animation: argus-piscar .45s ease-in-out; transform-origin: 50% 50%; }
@keyframes argus-piscar { 0%, 100% { transform: scaleY(1); } 45%, 55% { transform: scaleY(.08); } }
.argus-segredo { position: fixed; inset: 0; z-index: 9000; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 6px; padding: 24px; cursor: pointer; color: #eef1f1; opacity: 0; transition: opacity .45s ease;
    background: radial-gradient(ellipse at 50% 85%, #22385c 0%, #1c2541 45%, #0e1324 100%); }
.argus-segredo.visivel { opacity: 1; }
.argus-segredo.saindo { opacity: 0; }
.argus-leque { width: min(860px, 92vw); height: auto; max-height: 48vh; overflow: visible; }
.argus-leque .ao-contorno { fill: #0e1324; stroke: #8fb3cc; stroke-width: 1.1; }
.argus-leque .ao-iris { fill: #2e7d8f; }
.argus-leque .ao-pupila { fill: #0e1324; }
.argus-leque .ao-brilho { fill: #fff; opacity: .85; }
.argus-leque .ao-olho { transform-box: fill-box; transform-origin: center; opacity: 0;
    animation: ao-surgir .7s cubic-bezier(.2, .8, .2, 1) forwards, ao-piscar 9s ease-in-out infinite; }
@keyframes ao-surgir { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: scale(1); } }
@keyframes ao-piscar { 0%, 94%, 100% { transform: scaleY(1); } 96.5% { transform: scaleY(.1); } }
.argus-segredo-texto { max-width: 640px; text-align: center; opacity: 0; transform: translateY(10px);
    animation: ao-texto .9s ease 1.4s forwards; font-family: "Segoe UI", Arial, sans-serif; }
@keyframes ao-texto { to { opacity: 1; transform: none; } }
.argus-segredo-sobre { font-size: 13px; letter-spacing: 2.5px; color: #8fb3cc; text-transform: uppercase; }
.argus-segredo h2 { margin: 6px 0 14px; font-size: 34px; font-weight: 700; letter-spacing: 4px; color: #fff; }
.argus-segredo p { margin: 0 0 10px; font-size: 15px; line-height: 1.6; color: #c3cbcb; }
.argus-segredo p.argus-segredo-destaque { color: #fff; font-weight: 600; margin-top: 14px; }
.argus-segredo-rodape { margin-top: 18px; font-size: 11.5px; color: #6f86a3; letter-spacing: .5px; }
@media (max-width: 760px) { .argus-segredo h2 { font-size: 26px; } .argus-segredo p { font-size: 13.5px; } }
@media (prefers-reduced-motion: reduce) { .argus-leque .ao-olho { animation: none; opacity: 1; } .argus-segredo-texto { animation: none; opacity: 1; transform: none; } }

/* ---------- Modo manutenção */
.selo-manutencao { display: inline-block; margin-left: 10px; padding: 2px 9px; border-radius: 999px; background: #b5473f; color: #fff;
    font-size: calc(10.5px * var(--esc, 1)); font-weight: 700; letter-spacing: .4px; text-transform: uppercase; white-space: nowrap; align-self: center; }
.msg.msg-aviso { background: #fff6e0; border: 1px solid #f0d9a0; color: #7a5a12; }
body.pagina-manutencao { min-height: 100vh; margin: 0; display: flex; align-items: center; justify-content: center; padding: 20px;
    background: radial-gradient(ellipse at 50% 30%, #22385c 0%, #1c2541 55%, #0e1324 100%); color: #eef1f1; }
.manutencao-caixa { max-width: 520px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.manutencao-caixa .argus-marca { margin-bottom: 18px; }
.manutencao-icone { color: #8fb3cc; animation: manut-girar 6s ease-in-out infinite; }
@keyframes manut-girar { 0%, 100% { transform: rotate(-12deg); } 50% { transform: rotate(12deg); } }
.manutencao-caixa h1 { margin: 6px 0 4px; font-size: 26px; font-weight: 700; letter-spacing: .5px; color: #fff; }
.manutencao-msg { margin: 0; font-size: 15.5px; line-height: 1.6; color: #c3cbcb; }
.manutencao-prev { margin: 6px 0 0; color: #eef1f1; }
.manutencao-dica { margin: 14px 0 0; font-size: 12px; color: #6f86a3; }
.manutencao-sair { margin-top: 10px; color: #8fb3cc; font-size: 13px; }

/* ---------------------------------------------------------------- Suporte (chamados) */
.selo-chamado { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: calc(11.5px * var(--esc, 1)); font-weight: 700; white-space: nowrap; }
.selo-chamado.st-aberto { background: #fdf0d9; color: #8a5a00; }
.selo-chamado.st-atendimento { background: #dcebf3; color: #255f85; }
.selo-chamado.st-aguardando { background: #efe4f5; color: #6b3d87; }
.selo-chamado.st-fechado { background: #e6f2ea; color: #1e5b33; }
.chamados-resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.chamados-resumo .card { padding: 10px 14px; }
.chamados-filtro { display: flex; gap: 4px; flex-wrap: wrap; }
.chamados-filtro a { padding: 5px 12px; border-radius: 999px; color: #4a5a7a; text-decoration: none; font-size: calc(13px * var(--esc, 1)); border: 1px solid #dde3e4; }
.chamados-filtro a.ativo { background: #1c2541; border-color: #1c2541; color: #fff; }
.tabela-chamados tr.chamado-novidade td { background: #fffaf0; font-weight: 600; }
.tabela-chamados .selo-alerta { margin-left: 6px; }
.chamado-dados { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 4px 0 0; }
.chamado-dados div { min-width: 120px; }
.chamado-dados dt { font-size: calc(11.5px * var(--esc, 1)); color: #6b6a5f; text-transform: uppercase; letter-spacing: .04em; }
.chamado-dados dd { margin: 2px 0 0; font-weight: 600; }
.chamado-linha { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 2px solid #dde3e4; }
.chamado-evento { position: relative; margin: 0 0 16px; padding: 10px 14px; background: #f7f9f9; border: 1px solid #e3e8e8; border-radius: 10px; }
.chamado-evento::before { content: ""; position: absolute; left: -26px; top: 14px; width: 12px; height: 12px; border-radius: 50%; background: #939082; border: 2px solid #fff; }
.chamado-evento.ev-suporte { background: #eef6f4; border-color: #cfe3de; }
.chamado-evento.ev-suporte::before { background: #2f7d6d; }
.chamado-evento.ev-fechamento::before { background: #1e5b33; }
.ev-cabeca { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: calc(13px * var(--esc, 1)); }
.ev-cabeca time { margin-left: auto; color: #6b6a5f; font-size: calc(12px * var(--esc, 1)); }
.ev-status { margin-top: 6px; font-size: calc(12.5px * var(--esc, 1)); color: #4a5a7a; }
.ev-texto { margin-top: 8px; white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
.ev-anexos { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.anexo { display: flex; flex-direction: column; width: 140px; border: 1px solid #dde3e4; border-radius: 8px; background: #fff; overflow: hidden; text-decoration: none; color: #1c2541; }
.anexo img { width: 100%; height: 90px; object-fit: cover; background: #eef1f1; }
.anexo-pdf { height: 90px; display: flex; align-items: center; justify-content: center; background: #f6e1df; color: #b5473f; font-weight: 800; font-size: calc(18px * var(--esc, 1)); letter-spacing: .08em; }
.anexo-nome { padding: 5px 8px; font-size: calc(11.5px * var(--esc, 1)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.anexo-nome small { display: block; color: #6b6a5f; }
.aviso-suporte { display: flex; align-items: flex-start; gap: 14px; background: #eef6f4; border: 1px solid #cfe3de; border-left: 4px solid #2f7d6d; color: #1c3d36; border-radius: 10px; padding: 12px 16px; margin: -8px 0 20px; font-size: calc(13.5px * var(--esc, 1)); }
.aviso-suporte .alerta-icone { background: #2f7d6d; }
.aviso-suporte .alerta-icone svg { width: 18px; height: 18px; }
.aviso-suporte-texto { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.aviso-suporte-texto a { color: #1c3d36; }
.aviso-suporte-texto a small { color: #4f6f68; }
@media (max-width: 760px) {
    .chamados-resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ev-cabeca time { margin-left: 0; width: 100%; }
}

/* ---------------------------------------------------------------- Dashboard de Estoque */
.cards-estoque { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.cards-estoque .card-titulo { font-size: calc(10.5px * var(--esc, 1)); padding: 3px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cards-estoque .card-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) { .cards-estoque { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .cards-estoque { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) and (min-height: 640px) {
    body.pagina-comercial.painel-estoque > .comercial-grade.est-grade { grid-template-rows: 1fr 1.25fr; }
}
.est-barras-caixa { overflow: auto; }
.est-barras { display: flex; flex-direction: column; gap: 5px; padding: 4px 2px; }
.est-barra-linha { display: grid; grid-template-columns: minmax(90px, 34%) 1fr auto; align-items: center; gap: 8px; padding: 3px 6px; border-radius: 6px; font-size: calc(12px * var(--esc, 1)); }
.est-barra-linha.clicavel { cursor: pointer; }
.est-barra-linha.clicavel:hover { background: #eef1f1; }
.est-barra-linha.ativo { background: #e3edf4; box-shadow: inset 3px 0 0 #255f85; }
.est-barra-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #1c2541; }
.est-barra-trilhos { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.est-barra-trilho { display: flex; align-items: center; gap: 6px; min-width: 0; }
.est-barra-valor { display: block; height: 10px; border-radius: 3px; flex: none; max-width: 70%; }
.est-barra-num { font-size: calc(11px * var(--esc, 1)); color: #4a5a7a; white-space: nowrap; font-variant-numeric: tabular-nums; }
.est-barra-extra { font-size: calc(11px * var(--esc, 1)); color: #6b6a5f; white-space: nowrap; }
.est-promo-tabela tr.clicavel { cursor: pointer; }
.est-promo-tabela tr.clicavel:hover td { background: #eef6f4; }
.est-promo-tabela td.col-nome { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.est-lista-tabela tr.est-em-promo td.est-preco-promo { color: #2f7d6d; font-weight: 700; }
.est-lista-tabela tr.est-negativo td { color: #b5473f; }
.est-lista-tabela tr.est-abaixo td:nth-child(5) { color: #8a5a00; font-weight: 700; }
.rel-bloco .est-barra-valor { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
@media print { .est-barras-caixa { overflow: visible; } }

/* ---------------------------------------------------------------- Estoque: sugestão de compra */
@media (min-width: 1000px) and (min-height: 640px) {
    body.pagina-comercial.painel-estoque > .comercial-grade.est-grade { overflow: auto; grid-template-rows: minmax(280px, 1fr) minmax(380px, 1.3fr) minmax(380px, 1.3fr); }
}
.sug-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 2px 4px; font-size: calc(12px * var(--esc, 1)); color: #4a5a7a; flex: none !important; }
.sug-rotulo { font-weight: 600; }
.sug-campo { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.sug-campo select { font: inherit; padding: 2px 6px; border: 1px solid #c9d1d3; border-radius: 6px; background: #fff; }
.sug-resumo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 2px 2px 6px; flex: none !important; }
.sug-chip { display: inline-flex; gap: 4px; align-items: baseline; padding: 2px 9px; border-radius: 999px; font-size: calc(11.5px * var(--esc, 1)); background: #eef1f1; color: #1c2541; white-space: nowrap; }
.sug-chip.cl-A { background: #1c2541; color: #fff; }
.sug-chip.cl-B { background: #255f85; color: #fff; }
.sug-chip.cl-C { background: #d8d6cc; }
.sug-chip.or-E { background: #e3edf4; color: #1c2541; border: 1px solid #b9cfe0; }
.sug-chip.or-V { background: #fff; color: #8a5a00; border: 1px dashed #d5a446; }
.sug-chip.or-D { background: #f6e1df; color: #8c2f28; }
.sug-sep { width: 1px; height: 16px; background: #c9d1d3; margin: 0 2px; }
.sug-nota { flex-basis: 100%; font-size: calc(11.5px * var(--esc, 1)); color: #6b6a5f; }
.sug-tabela td.sug-minimo { white-space: nowrap; }
.tag-min { display: inline-block; margin-left: 5px; padding: 0 6px; border-radius: 999px; font-size: calc(10px * var(--esc, 1)); font-weight: 700; vertical-align: 1px; }
.tag-min.erp { background: #e3edf4; color: #255f85; }
.tag-min.sugerido { background: #fff; color: #8a5a00; border: 1px dashed #d5a446; font-style: italic; }
.sug-tabela td.sug-cob { white-space: nowrap; min-width: 110px; }
.sug-cob-trilho { display: inline-block; width: 64px; height: 8px; border-radius: 4px; background: #eef1f1; vertical-align: middle; overflow: hidden; box-shadow: inset 0 0 0 1px #dde3e4; }
.sug-cob-valor { display: block; height: 100%; background: #2f7d6d; }
.sug-cob-valor.atencao { background: #d5a446; }
.sug-cob-valor.critico { background: #b5473f; }
.sug-cob-num { margin-left: 6px; font-size: calc(11px * var(--esc, 1)); color: #4a5a7a; }
.sug-tabela td.sug-comprar { font-weight: 800; color: #b5473f; white-space: nowrap; }
.sug-tabela tr.sug-V td.sug-comprar { color: #8a5a00; }
.rel-sug-resumo { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.rel-sug-resumo .sug-chip, .sug-cob-valor { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.sug-tabela th.txt { text-align: left; }
.sug-mult { display: block; font-size: calc(10px * var(--esc, 1)); font-weight: 600; color: #6b6a5f; }
.sug-mult.arred { color: #255f85; }

/* ---------------------------------------------------------------- Chamados no celular e campos de texto */
.form-vertical textarea {
    font: inherit; font-size: calc(14px * var(--esc, 1)); color: #1f2430; padding: 9px 11px;
    border: 1px solid #c3cbcb; border-radius: 7px; background: #fff; resize: vertical; width: 100%; box-sizing: border-box;
}
.form-vertical textarea:focus { outline: 2px solid #255f85; outline-offset: 0; border-color: #255f85; }
.form-vertical input[type=file] { max-width: 100%; font-size: calc(13px * var(--esc, 1)); }
@media (max-width: 760px) {
    /* Lista de chamados em cartões (sem rolagem para o lado) */
    .tabela-chamados, .tabela-chamados tbody, .tabela-chamados tr, .tabela-chamados td { display: block; width: auto; }
    .tabela-chamados thead { display: none; }
    .tabela-chamados tr { border: 1px solid #dde3e4; border-radius: 10px; padding: 10px 12px; margin: 0 0 10px; background: #fff; }
    .tabela-chamados tr.chamado-novidade { border-color: #e8c98a; background: #fffaf0; }
    .tabela-chamados tr.chamado-novidade td { background: transparent; }
    .tabela-chamados td { border: 0; padding: 2px 0; white-space: normal; font-size: calc(13px * var(--esc, 1)); }
    .tabela-chamados td[data-rotulo]::before { content: attr(data-rotulo) ": "; color: #6b6a5f; font-weight: 400; }
    .tabela-chamados td.ch-num { float: right; color: #6b6a5f; }
    .tabela-chamados td.ch-assunto { font-size: calc(14.5px * var(--esc, 1)); font-weight: 700; padding: 0 44px 6px 0; }
    .tabela-chamados .selo-alerta { margin: 4px 0 0; display: inline-block; }
    .tabela-admin-rolagem:has(.tabela-chamados) { overflow: visible; }
    .chamados-resumo .card { padding: 6px 8px; }
    .chamados-resumo .card-titulo { font-size: calc(10.5px * var(--esc, 1)); }
    .chamados-resumo .card-valor { font-size: calc(18px * var(--esc, 1)); }
    .cartao-topo:has(.chamados-filtro) { flex-wrap: wrap; gap: 10px; }
    .chamado-cabeca .cartao-topo { flex-direction: column; align-items: flex-start; gap: 8px; }
    .chamado-cabeca h2 { font-size: calc(17px * var(--esc, 1)); overflow-wrap: anywhere; }
    .chamado-dados { gap: 8px 18px; }
    .chamado-dados div { min-width: calc(50% - 10px); }
    .chamado-linha { padding-left: 12px; }
    .chamado-evento { padding: 9px 10px; }
    .chamado-evento::before { left: -20px; }
    .ev-anexos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .anexo { width: auto; }
    .anexo img, .anexo-pdf { height: 70px; }
    .form-vertical .acoes { flex-wrap: wrap; }
    .form-vertical .acoes .botao { flex: 1 1 auto; text-align: center; }
}

/* Sugestão de compra: colunas de valores centralizadas e linhas alinhadas pelo meio */
.sug-tabela td { vertical-align: middle; }
.sug-tabela td.col-nome { height: auto; padding-top: 6px; font-size: inherit; line-height: 1.3; overflow: visible; text-align: left; }
.sug-tabela td.col-nome, .est-lista-tabela td.col-nome { display: table-cell; }


/* Botão de ajuda "?" dos visuais e o quadro com a explicação */
.botao-ajuda { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; margin: 0 2px;
    border: 0; border-radius: 50%; background: transparent; color: rgba(255, 255, 255, .78); cursor: pointer; transition: background .15s, color .15s; }
.botao-ajuda:hover, .botao-ajuda.ativo { background: rgba(255, 255, 255, .16); color: #fff; }
.botao-ajuda:focus-visible { outline: 2px solid #8fb3cc; outline-offset: 1px; }
.ajuda-cards { position: relative; height: 0; z-index: 3; }
.ajuda-cards .botao-ajuda { position: absolute; right: 22px; top: 2px; color: #4a5a7a; background: #fff; box-shadow: 0 1px 3px rgba(28, 37, 65, .25); }
.ajuda-cards .botao-ajuda:hover, .ajuda-cards .botao-ajuda.ativo { background: #1c2541; color: #fff; }
.ajuda-pop { position: fixed; z-index: 1000; background: #fff; color: #1f2430; border: 1px solid #dde3e4; border-top: 3px solid #255f85; border-radius: 10px;
    box-shadow: 0 10px 30px rgba(28, 37, 65, .22); padding: 10px 14px 12px; font-size: calc(12.5px * var(--esc, 1)); line-height: 1.45; max-height: 70vh; overflow: auto; }
.ajuda-pop-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.ajuda-pop-topo b { font-size: calc(13.5px * var(--esc, 1)); color: #1c2541; }
.ajuda-fechar { border: 0; background: transparent; color: #6b6a5f; cursor: pointer; font-size: 14px; padding: 2px 4px; border-radius: 4px; }
.ajuda-fechar:hover { background: #eef1f1; color: #1c2541; }
.ajuda-pop p { margin: 6px 0 0; }
.ajuda-pop p b { color: #255f85; }
@media print { .botao-ajuda, .ajuda-pop, .ajuda-cards { display: none !important; } }
/* Estoque: títulos curtos numa linha só; botões dos visuais compactos */
body.painel-estoque .est-grade .painel-titulo .alternador button { padding-left: 6px; padding-right: 6px; }
.sug-chip.total { background: #fff; border: 1px solid #b5473f; color: #8c2f28; }
.ajuda-cards .botao-ajuda { width: 22px; height: 22px; right: 24px; top: 5px; color: #255f85; background: #e3edf4; box-shadow: none; border: 1px solid #b9cfe0; }
/* Estoque: mesmo alinhamento da Sugestão de Compra nas outras tabelas (nome à esquerda, valores centralizados, linhas pelo meio) */
.est-lista-tabela td, .est-promo-tabela td { vertical-align: middle; }
.est-lista-tabela td.col-nome, .est-promo-tabela td.col-nome { display: table-cell; height: auto; padding-top: 6px; font-size: inherit; line-height: 1.3; overflow: hidden; text-align: left; }

/* Estoque: árvore Seção → Linha → Fabricante → Produto (geral e itens em promoção) */
@media (min-width: 1000px) and (min-height: 640px) {
    body.pagina-comercial.painel-estoque > .comercial-grade.est-grade { grid-template-rows: repeat(3, minmax(340px, 1fr)) minmax(380px, 1.3fr); }
}
.arv-tabela td, .arv-tabela th { vertical-align: middle; }
.arv-tabela td.arv-nome { text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 520px; }
.arv-tabela tr.arv-grupo { cursor: pointer; }
.arv-tabela tr.arv-grupo:hover td { background: #eef3f7; }
.arv-tabela tr.arv-n0 td { font-weight: 700; color: #1c2541; background: #f4f7f8; }
.arv-tabela tr.arv-n1 td { font-weight: 600; }
.arv-tabela tr.arv-n3 td { color: #4a5a7a; }
.arv-seta { display: inline-block; width: 14px; color: #255f85; font-size: calc(10px * var(--esc, 1)); }
.arv-seta.vazia { visibility: hidden; }
.arv-tabela td.arv-txt { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arv-tabela td.arv-pc { white-space: nowrap; min-width: 110px; }
.arv-pc-trilho { display: inline-block; width: 60px; height: 7px; border-radius: 4px; background: #eef1f1; vertical-align: middle; overflow: hidden; box-shadow: inset 0 0 0 1px #dde3e4; }
.arv-pc-valor { display: block; height: 100%; background: #1c2541; }
.arv-pc-num { margin-left: 6px; font-size: calc(11px * var(--esc, 1)); color: #4a5a7a; }
.arv-tabela tr.arv-mais td { text-align: left; color: #6b6a5f; font-style: italic; }
.arv-tabela tfoot tr.total td { font-weight: 700; border-top: 2px solid #1c2541; }
.rel-arv .arv-pc-valor { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* Estoque e Reposição: números à direita, textos à esquerda, categorias curtas (classe, unidade) ao centro */
.est-grade .tabela th.num, .est-grade .tabela td.num { text-align: right; }
.est-grade .tabela th.txt, .est-grade .tabela td.txt { text-align: left; }
.est-grade .tabela th.centro, .est-grade .tabela td.centro { text-align: center; }

/* ---------------------------------------------------------------- Dados › Relacionamentos */
.rel-legenda { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 4px 0 10px; font-size: calc(12.5px * var(--esc, 1)); color: #4a5a7a; }
.rel-tag { display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 8px; font-size: calc(11px * var(--esc, 1)); text-align: center; color: #fff; margin-right: 4px; }
.rel-tag.rel-1 { background: #1c2541; }
.rel-tag.rel-n { background: #2f7d6d; }
.rel-tag.rel-op { background: #fff; color: #8a5a00; border: 1px dashed #d5a446; }
.rel-tag.pk { background: #d5a446; color: #1c2541; border-radius: 3px; }
.rel-tag.fk { background: #8fb3cc; color: #1c2541; border-radius: 3px; }
.rel-tag.gerada { background: #255f85; border-radius: 3px; }
.rel-traco { display: inline-block; width: 26px; border-top: 2px dashed #d5a446; vertical-align: middle; margin-left: 4px; }
.rel-diagrama-caixa { overflow-x: auto; border: 1px solid #e3e8e8; border-radius: 10px; background: #fafbfb; }
.rel-diagrama { display: block; width: 100%; min-width: 980px; height: auto; font-family: inherit; }
.rel-diagrama .rel-linha { fill: none; stroke: #7d8aa3; stroke-width: 1.6; }
.rel-diagrama .rel-linha.opcional { stroke: #d5a446; stroke-dasharray: 6 4; }
.rel-diagrama .rel-bus { stroke-width: 2.4; }
.rel-diagrama g:hover > .rel-linha { stroke: #255f85; stroke-width: 2.6; }
.rel-diagrama .rel-1 rect { fill: #1c2541; } .rel-diagrama .rel-1 text { fill: #fff; }
.rel-diagrama .rel-n rect { fill: #2f7d6d; } .rel-diagrama .rel-n text { fill: #fff; }
.rel-diagrama .rel-op rect { fill: #fff; stroke: #d5a446; stroke-dasharray: 3 2; } .rel-diagrama .rel-op text { fill: #8a5a00; }
.rel-diagrama .rel-1 text, .rel-diagrama .rel-n text, .rel-diagrama .rel-op text { font-size: 11px; font-weight: 700; }
.rel-caixa .corpo { fill: #fff; stroke: #c9d1d3; }
.rel-caixa .topo { fill: #1c2541; }
.rel-caixa.gerada .topo { fill: #255f85; }
.rel-caixa.gerada .corpo { stroke-dasharray: 5 3; stroke: #255f85; }
.rel-caixa .nome { fill: #fff; font-size: 12px; font-weight: 700; }
.rel-caixa .qtd { fill: #c9d6e2; font-size: 10.5px; }
.rel-caixa .campo { fill: #1f2430; font-size: 11px; }
.rel-caixa .campo.com-chave { font-weight: 600; }
.rel-caixa .chave.pk { fill: #d5a446; } .rel-caixa .chave.fk { fill: #8fb3cc; }
.rel-caixa .chave-txt { fill: #1c2541; font-size: 8.5px; font-weight: 700; }
.rel-tipo { display: inline-block; padding: 3px 10px; border-radius: 999px; font-weight: 800; font-size: calc(12.5px * var(--esc, 1)); white-space: nowrap; letter-spacing: .02em; }
.rel-tipo.t-obrig { background: #1c2541; color: #fff; }
.rel-tipo.t-opc { background: #fff8e8; color: #8a5a00; border: 1px dashed #d5a446; }
.rel-tabela td.num, .rel-tabela th.num { text-align: right; white-space: nowrap; }
.rel-tabela td.centro, .rel-tabela th.centro { text-align: center; }
.rel-tabela td.rel-desc { min-width: 170px; color: #4a5a7a; }
.rel-tabela td.rel-lig { min-width: 170px; }
.rel-tabela td.rel-lig code { display: inline-block; margin: 1px 0; white-space: nowrap; }
.rel-tabela td.rel-alerta { color: #b5473f; font-weight: 700; cursor: help; }
.rel-tabela code { font-size: calc(11.5px * var(--esc, 1)); background: #eef1f1; padding: 1px 5px; border-radius: 4px; }
.rel-ajuda { margin: 0; padding-left: 18px; line-height: 1.6; }

/* ---------------------------------------------------------------- Marketing › Arquitetos */
@media (min-width: 1000px) and (min-height: 640px) {
    body.pagina-comercial.painel-arquitetos > .comercial-grade.arq-grade { overflow: auto; grid-template-rows: minmax(330px, 1fr) minmax(400px, 1.3fr); }
}
.arq-grade .tabela th.num, .arq-grade .tabela td.num { text-align: right; }
.arq-grade .tabela th.txt, .arq-grade .tabela td.txt { text-align: left; }
.arq-grade .tabela th.centro, .arq-grade .tabela td.centro { text-align: center; }
.arq-tabela td { vertical-align: middle; }
.arq-tabela td.col-nome { display: table-cell; height: auto; padding-top: 6px; font-size: inherit; line-height: 1.3; overflow: hidden; text-align: left; }
.arq-fan { display: block; color: #6b6a5f; font-size: calc(10.5px * var(--esc, 1)); }
.arq-contato { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }
.arq-contato a { color: #255f85; text-decoration: none; white-space: nowrap; }
.arq-contato a:hover { text-decoration: underline; }
.arq-whats::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #25d366; margin-right: 5px; vertical-align: 1px; }
.arq-email { max-width: 220px; overflow: hidden; text-overflow: ellipsis; display: inline-block; vertical-align: bottom; }
.arq-hoje { display: inline-block; padding: 1px 9px; border-radius: 999px; background: #8a4f7d; color: #fff; font-weight: 700; white-space: nowrap; }
.arq-tabela tr.arq-linha-hoje td { background: #f7eef5; }
.arq-tabela td.arq-queda { color: #b5473f; font-weight: 700; }
.arq-tabela td.arq-alta { color: #1e5b33; font-weight: 700; }
.arq-tabela tr.arq-esfriando td:first-child { box-shadow: inset 3px 0 0 #b5473f; }
/* Arquitetos: ícone do WhatsApp no lugar do ponto verde */
.arq-whats::before { width: 13px; height: 13px; border-radius: 0; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2325D366' d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2z'/%3E%3Cpath fill='%23fff' d='M8.6 7.2c.2-.4.4-.4.6-.4h.5c.2 0 .4 0 .5.4l.8 1.9c.1.2 0 .4-.1.6l-.6.7c-.1.1-.2.3 0 .5.6 1 1.4 1.8 2.5 2.4.2.1.4.1.5-.1l.7-.8c.2-.2.4-.2.6-.1l1.8.9c.2.1.4.2.4.4 0 .5-.2 1.3-.8 1.7-.6.4-1.5.6-2.6.2-1.2-.4-2.6-1.2-3.8-2.6-1-1.2-1.6-2.4-1.7-3.3-.1-.9.4-1.6.7-2z'/%3E%3C/svg%3E"); vertical-align: -2px; }

/* Arquitetos: selo de dias sem compra por faixa e ícone do WhatsApp maior */
.arq-dias { display: inline-block; min-width: 38px; padding: 1px 8px; border-radius: 999px; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }
.arq-dias.f1 { background: #fdf0d9; color: #8a5a00; }
.arq-dias.f2 { background: #fde2cc; color: #a14e0b; }
.arq-dias.f3 { background: #f6d3cf; color: #b5473f; }
.arq-dias.f4 { background: #6e2a33; color: #fff; }
.arq-cor { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; vertical-align: 0; }
.arq-cor.f1 { background: #e6b450; } .arq-cor.f2 { background: #e0833a; } .arq-cor.f3 { background: #c9483f; } .arq-cor.f4 { background: #6e2a33; }
.arq-whats::before { width: 15px; height: 15px; margin-right: 5px; vertical-align: -3px; }
a.argus-topo { text-decoration: none; color: inherit; cursor: pointer; border-radius: 6px; transition: opacity .15s; }
a.argus-topo:hover { opacity: .8; }
a.argus-topo:focus-visible { outline: 2px solid #255f85; outline-offset: 2px; }
.arq-dias.a1 { background: #1e5b33; color: #fff; }
.arq-dias.a2 { background: #dcefe2; color: #1e5b33; }
.arq-cor.a1 { background: #1e5b33; } .arq-cor.a2 { background: #6fbf8a; }
/* Menu do topo (☰): logo dentro do quadro branco, com o botão de fechar */
.mosaico.sobreposto .mosaico-janela { background: #f3f5f6; border-radius: 12px; max-width: 1000px; margin: 0 auto; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); overflow: hidden; }
.mosaico.sobreposto .mosaico-cabeca { display: flex; align-items: center; justify-content: space-between; max-width: none; margin: 0; padding: 12px 18px 12px 22px; border-bottom: 1px solid #dde3e4; }
.mosaico.sobreposto .mosaico-blocos { background: transparent; box-shadow: none; border-radius: 0; max-width: none; }
.mosaico.sobreposto .submenu { margin: 16px; max-width: none; }
.mosaico-cabeca .argus-olho { width: 40px; }
.mosaico-cabeca .argus-nome { font-size: calc(18px * var(--esc, 1)); }
.mosaico-fechar { border: 0; background: transparent; color: #4a5a7a; font-size: 18px; width: 34px; height: 34px; border-radius: 8px; cursor: pointer; }
.mosaico-fechar:hover { background: #e3e8e8; color: #1c2541; }

/* ---------------------------------------------------------------- Cabeçalhos de coluna sempre centralizados (todos os visuais) */
.tabela thead th, .tabela-admin thead th, .matriz thead th, .rel-tabela thead th,
.est-grade .tabela thead th.num, .est-grade .tabela thead th.txt, .arq-grade .tabela thead th.num, .arq-grade .tabela thead th.txt,
.sug-tabela thead th.txt, .arv-tabela thead th:first-child, .rel-tabela thead th.num, .rel-tabela thead th.centro { text-align: center !important; vertical-align: middle; }

/* ---------------------------------------------------------------- Arquitetos: botão e cartão de aniversário */
.arq-cartao-btn { border: 1px solid #b9cfe0; background: #e3edf4; border-radius: 6px; cursor: pointer; font-size: 13px; line-height: 1; padding: 3px 5px; margin-right: 7px; vertical-align: middle; }
.arq-cartao-btn:hover { background: #255f85; border-color: #255f85; }
.arq-cartao-fundo { position: fixed; inset: 0; z-index: 3000; background: rgba(28, 37, 65, .5); display: flex; align-items: center; justify-content: center; padding: 16px; }
.arq-cartao-modal { background: #fff; border-radius: 12px; border-top: 4px solid #255f85; width: min(460px, 100%); padding: 14px 18px 16px; box-shadow: 0 12px 34px rgba(0, 0, 0, .3); display: flex; flex-direction: column; gap: 10px; }
.arq-cartao-topo { display: flex; justify-content: space-between; align-items: center; font-size: calc(15px * var(--esc, 1)); color: #1c2541; }
.arq-cartao-modal label { display: flex; flex-direction: column; gap: 4px; font-size: calc(12.5px * var(--esc, 1)); color: #4a5a7a; font-weight: 600; }
.arq-cartao-modal input, .arq-cartao-modal textarea { font: inherit; font-weight: 400; font-size: calc(14px * var(--esc, 1)); color: #1f2430; padding: 8px 10px; border: 1px solid #c3cbcb; border-radius: 7px; resize: vertical; }
.arq-cartao-acoes { display: flex; justify-content: flex-end; gap: 8px; }
.cartao-aniv-impressao { display: none; }
@page cartao { size: A4 portrait; margin: 0; }
@media print {
    html, body.imprimindo-cartao { height: auto !important; overflow: visible !important; display: block !important; background: #fff !important; margin: 0 !important; }
    body.imprimindo-cartao > *:not(.cartao-aniv-impressao) { display: none !important; }
    body.imprimindo-cartao .cartao-aniv-impressao { display: block; page: cartao; }
}
/* Cartão de aniversário: A4 em pé, nas cores do Argus (azul-marinho, azul, azul-claro e o amarelo de destaque) */
.cartao-aniv { position: relative; box-sizing: border-box; width: 210mm; height: 296mm; overflow: hidden; padding: 44mm 22mm 40mm; background: #fff; border: 0;
    font-family: "Segoe UI", Arial, sans-serif; color: #1c2541; text-align: center; display: flex; flex-direction: column; align-items: center;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
/* Faixa do topo com círculos e filete amarelo */
.cartao-aniv::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 30mm;
    background: radial-gradient(circle at 12% 120%, rgba(143, 179, 204, .35) 0 22mm, transparent 22.3mm),
        radial-gradient(circle at 88% -30%, rgba(143, 179, 204, .28) 0 26mm, transparent 26.3mm), linear-gradient(135deg, #1c2541, #255f85);
    border-bottom: 1.6mm solid #f2c80f; }
/* Círculos suaves no meio da página */
.ca-pontos { position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(circle at 6% 42%, #e3edf4 0 14mm, transparent 14.3mm), radial-gradient(circle at 96% 58%, #e3edf4 0 20mm, transparent 20.3mm),
        radial-gradient(circle at 90% 36%, #eef1f1 0 7mm, transparent 7.3mm), radial-gradient(circle at 10% 70%, #fbf1c4 0 5mm, transparent 5.3mm); }
.ca-topo { position: relative; min-height: 22mm; display: flex; align-items: center; justify-content: center; }
.ca-topo .marca { display: flex; align-items: center; gap: 10px; }
.ca-topo .marca-logo { max-height: 22mm; max-width: 90mm; }
.ca-topo .marca-nome { font-size: 20pt; font-weight: 800; line-height: 1.05; letter-spacing: .04em; color: #1c2541; }
.ca-topo .marca-slogan { font-size: 9pt; line-height: 1.15; color: #4a5a7a; border-left: 1px solid #c3cbcb; padding-left: 10px; text-align: left; }
.ca-titulo { position: relative; margin-top: auto; font-size: 48pt; font-weight: 300; color: #255f85; letter-spacing: .02em; line-height: 1.1; }
.ca-titulo::after { content: ""; display: block; width: 34mm; height: 1.2mm; margin: 7mm auto 0; border-radius: 1mm; background: #f2c80f; }
.ca-nome { position: relative; margin-top: 10mm; font-size: 34pt; font-weight: 800; color: #1c2541; line-height: 1.15; max-width: 170mm; }
.ca-data { position: relative; margin-top: 5mm; font-size: 16pt; color: #255f85; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.ca-msg { position: relative; margin: 18mm auto 0; max-width: 145mm; font-size: 16pt; line-height: 1.6; color: #3a4258; }
.ca-assinatura { position: relative; margin-top: 12mm; margin-bottom: auto; font-size: 14pt; font-style: italic; color: #255f85; }
/* Rodapé azul-marinho com o logo do Argus em branco */
.ca-rodape { position: absolute; left: 0; right: 0; bottom: 0; height: 26mm; display: flex; align-items: center; justify-content: center;
    background: #1c2541; border-top: 1.6mm solid #f2c80f; }
.ca-rodape .argus-marca { transform: scale(.85); }

/* ---------------------------------------------------------------- Arquitetos: coluna "Card" (botão do cartão de aniversário) */
.arq-col-card { width: 1%; white-space: nowrap; }
.arq-col-card .arq-cartao-btn { margin: 0; }

/* ---------------------------------------------------------------- Dados › Aplicativo Android */
.app-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.app-grade .cartao { margin-bottom: 0; }
.app-principal { grid-column: 1 / -1; border-top: 4px solid #255f85; }
.app-cabeca { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.app-cabeca h2 { margin: 0 0 2px; }
.app-icone { width: 64px; height: 64px; border-radius: 16px; flex: none; box-shadow: 0 2px 8px rgba(28, 37, 65, .25); }
.app-versao { margin: 0; color: #6b6a5f; font-size: calc(13px * var(--esc, 1)); }
.app-principal > p { line-height: 1.6; max-width: 900px; }
.app-acao { margin: 16px 0 6px; }
.app-baixar { display: inline-flex; align-items: center; gap: 8px; font-size: calc(15px * var(--esc, 1)); padding: 12px 22px; }
.app-passos, .app-lista { margin: 0; padding-left: 20px; line-height: 1.65; }
.app-passos li, .app-lista li { margin-bottom: 6px; }
.app-digital { display: flex; flex-direction: column; gap: 2px; margin: 8px 0 0; font-size: calc(12.5px * var(--esc, 1)); color: #4a5a7a; }
.app-digital code { font-size: 11.5px; color: #1c2541; background: #f4f6f6; border: 1px solid #dde3e4; border-radius: 6px; padding: 6px 8px; word-break: break-all; line-height: 1.5; }
@media (max-width: 760px) {
    .app-grade { grid-template-columns: 1fr; }
    .app-cabeca { gap: 12px; }
    .app-icone { width: 52px; height: 52px; border-radius: 13px; }
    .app-baixar { width: 100%; justify-content: center; box-sizing: border-box; }
}

/* ---------------------------------------------------------------- Várias empresas: login só com o Argus, escolha e troca de empresa */
.login-topo-argus { justify-content: center; }
.login-dupla .login-topo-argus { display: none; }   /* no computador o Argus já está no painel ao lado */
/* (o Argus aparece só no painel de apresentação, também no celular) */

.pagina-empresas { align-items: flex-start; }
.escolha-caixa { width: min(880px, 100%); margin: 40px auto; padding: 26px 30px 30px; background: #fff; border-radius: 14px; border-top: 4px solid #255f85;
    box-shadow: 0 6px 24px rgba(28, 37, 65, .12); box-sizing: border-box; }
.escolha-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.escolha-sair .link { color: #4a5a7a; }
.escolha-caixa h1 { margin: 0 0 18px; font-size: calc(19px * var(--esc, 1)); color: #1c2541; font-weight: 600; }
.escolha-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.escolha-cartao { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 150px; padding: 18px 14px;
    background: #f7f9f9; border: 1px solid #dde3e4; border-radius: 12px; cursor: pointer; font: inherit; color: #1c2541; text-align: center;
    transition: border-color .15s, box-shadow .15s, transform .15s; }
.escolha-cartao:hover, .escolha-cartao:focus-visible { border-color: #255f85; box-shadow: 0 4px 14px rgba(37, 95, 133, .18); transform: translateY(-2px); outline: none; }
.escolha-cartao.atual { border-color: #255f85; background: #eef4f8; }
.escolha-cartao.inativa { opacity: .7; }
.escolha-marca { min-height: 60px; display: flex; align-items: center; justify-content: center; }
.escolha-marca .marca { display: flex; align-items: center; gap: 8px; }
.escolha-marca .marca-logo { max-height: 56px; max-width: 180px; }
.escolha-nome { font-weight: 600; font-size: calc(14px * var(--esc, 1)); }
.escolha-dica { margin-top: 18px; }
@media (max-width: 760px) {
    .escolha-caixa { margin: 16px; width: auto; padding: 20px 16px 22px; }
    .escolha-grade { grid-template-columns: 1fr 1fr; gap: 10px; }
    .escolha-cartao { min-height: 120px; }
}

/* Início: empresa em uso, com a troca de empresa */
.empresa-atual { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; background: #fff; border: 1px solid #dde3e4; border-left: 4px solid #255f85;
    border-radius: 10px; padding: 12px 18px; margin: 0 0 16px; box-shadow: 0 1px 4px rgba(28, 37, 65, .06); }
.empresa-atual-marca { display: flex; align-items: center; gap: 8px; }
.empresa-atual-marca .marca-logo { max-height: 40px; max-width: 160px; }
.empresa-atual-marca .marca-nome { font-size: calc(13px * var(--esc, 1)); }
.empresa-atual-texto { display: flex; flex-direction: column; flex: 1; min-width: 160px; }
.empresa-atual-rotulo { font-size: calc(12px * var(--esc, 1)); color: #6b6a5f; }
.empresa-atual-texto b { font-size: calc(16px * var(--esc, 1)); color: #1c2541; }
.empresa-troca { display: flex; align-items: center; gap: 8px; }
.empresa-troca label { font-size: calc(12.5px * var(--esc, 1)); color: #4a5a7a; }
.empresa-troca select { font: inherit; padding: 7px 10px; border: 1px solid #c3cbcb; border-radius: 7px; min-width: 200px; background: #fff; }
@media (max-width: 760px) {
    .empresa-troca { width: 100%; }
    .empresa-troca select { flex: 1; min-width: 0; }
}

/* Menu do usuário: empresa em uso */
.menu-lista .menu-empresa { display: block; padding: 4px 10px 6px; font-weight: 600; color: #1c2541; font-size: calc(13px * var(--esc, 1)); }

/* Cadastro de empresas */
.empresas-marca .marca { display: flex; align-items: center; gap: 6px; }
.empresas-marca .marca-logo { max-height: 30px; max-width: 120px; }
.empresas-marca .marca-nome { font-size: 11px; }
.empresas-marca .marca-slogan { display: none; }
.empresa-form fieldset { margin-bottom: 14px; }
.empresa-logo-linha { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 10px; }
.empresa-logo-previa { min-width: 160px; min-height: 60px; display: flex; align-items: center; justify-content: center; padding: 8px 12px;
    border: 1px dashed #c3cbcb; border-radius: 8px; background: #f7f9f9; }
.empresa-logo-previa .marca { display: flex; align-items: center; gap: 8px; }
.empresa-logo-previa .marca-logo { max-height: 50px; max-width: 200px; }

/* Tarja "Em manutenção" no login e na escolha da empresa (sem a marca do cliente) */
.login-selo { display: flex; justify-content: center; margin: 0 0 10px; }
.login-selo .selo-manutencao { margin-left: 0; }
.escolha-marca-argus { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; }

/* Escolha da empresa: Sair e fechar (volta à tela anterior) */
.escolha-acoes { display: inline-flex; align-items: center; gap: 14px; }
.escolha-fechar { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; border: 1px solid #dde3e4;
    color: #4a5a7a; text-decoration: none; font-size: 16px; line-height: 1; background: #fff; }
.escolha-fechar:hover, .escolha-fechar:focus-visible { background: #1c2541; border-color: #1c2541; color: #fff; outline: none; }

/* Celular: blocos de menu do início centralizados na tela */
@media (max-width: 760px) { .inicio-secao + .mosaico .mosaico-blocos { justify-content: center; } }

/* Marca do cliente no topo: centralizada (computador, tablet e celular deitado); no celular em pé, alinhada à esquerda.
   O selo "Em manutenção" fica numa linha própria, abaixo do logo, sem tirá-lo do centro. */
.topo .marca { flex-wrap: wrap; justify-content: center; text-align: center; }
.topo .marca-selo { flex-basis: 100%; line-height: 1; }
.topo .marca-selo .selo-manutencao { margin: 3px 0 0; font-size: 10px; padding: 1px 8px; }
@media (min-width: 761px) and (max-width: 1100px) {
    .topo { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
}
@media (max-width: 760px) and (orientation: landscape) {
    .topo { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 8px; }
    .topo .topo-esq { flex: none; }
    .topo .marca { justify-self: center; }
    .topo nav { margin-left: 0; justify-self: end; }
}
@media (max-width: 760px) and (orientation: portrait) {
    .topo .marca { justify-content: flex-start; text-align: left; }
}

/* ---------------------------------------------------------------- Dashboards › Follow-up de Orçamentos */
@media (min-width: 1000px) and (min-height: 640px) {
    body.pagina-comercial.painel-orcamentos > .comercial-grade.orc-grade { overflow: auto; grid-template-rows: minmax(260px, auto) minmax(420px, 1.4fr) minmax(260px, auto); }
}
.orc-grade .tabela th.num, .orc-grade .tabela td.num { text-align: right; }
.orc-grade .tabela th.txt, .orc-grade .tabela td.txt { text-align: left; }
.orc-grade .tabela th.centro, .orc-grade .tabela td.centro { text-align: center; }
.orc-grade .tabela thead th { text-align: center !important; vertical-align: middle; }
.orc-tabela td { vertical-align: middle; }
.orc-tabela td.col-nome { display: table-cell; height: auto; padding-top: 6px; font-size: inherit; line-height: 1.3; overflow: hidden; text-align: left; }
.orc-idade { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; }
.orc-faixa { display: grid; grid-template-columns: 110px minmax(0, 1fr) 170px; align-items: center; gap: 10px; border: 1px solid transparent; background: none;
    border-radius: 8px; padding: 5px 6px; cursor: pointer; font: inherit; color: #1f2430; text-align: left; }
.orc-faixa:hover { background: #f3f6f8; }
.orc-faixa.ativo { border-color: #255f85; background: #eef4f8; }
.orc-faixa.apagado { opacity: .45; }
.orc-faixa-rot { font-size: calc(12.5px * var(--esc, 1)); color: #4a5a7a; }
.orc-faixa-barra { height: 16px; background: #f1f3f4; border-radius: 4px; overflow: hidden; }
.orc-faixa-barra i { display: block; height: 100%; border-radius: 4px; min-width: 4px; padding: 0; }
.orc-faixa-num { font-size: calc(12.5px * var(--esc, 1)); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.orc-prior { display: inline-block; min-width: 54px; padding: 1px 8px; border-radius: 999px; background: var(--cor); color: #fff; font-weight: 700; font-size: calc(11.5px * var(--esc, 1)); }
.orc-sinais { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.orc-sinal { display: inline-block; padding: 1px 7px; border-radius: 6px; font-size: calc(11px * var(--esc, 1)); white-space: nowrap; border: 1px solid; }
.orc-sinal.promo { background: #fdf0d9; border-color: #f1d08f; color: #8a5a00; }
.orc-sinal.falta { background: #f6d3cf; border-color: #e5aaa3; color: #b5473f; }
.orc-sinal.comprou { background: #dcefe2; border-color: #a9d3b6; color: #1e5b33; }
.orc-sinal.erp { background: #eef1f1; border-color: #c3cbcb; color: #4a5a7a; max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.orc-fup { min-width: 150px; }
.orc-fup small { display: block; color: #4a5a7a; }
.orc-fup small.orc-venc { color: #b5473f; font-weight: 700; }
.orc-sit { display: inline-block; padding: 1px 7px; border-radius: 6px; background: #e3edf4; color: #255f85; font-weight: 600; font-size: calc(11.5px * var(--esc, 1)); }
.orc-sit.sit-ganho { background: #dcefe2; color: #1e5b33; }
.orc-sit.sit-perdido { background: #f6d3cf; color: #b5473f; }
.orc-reg { margin-top: 4px; padding: 3px 9px; font-size: calc(11.5px * var(--esc, 1)); }
.orc-tabela tr.orc-linha-venc td:first-child { box-shadow: inset 3px 0 0 #c98a1e; }
.orc-tabela tr.orc-linha-ganho td { background: #f2f9f4; }
.orc-tabela tr.orc-linha-perdido td { color: #8a8f99; }
.orc-modal { width: min(520px, 100%); max-height: calc(100vh - 32px); overflow: auto; }
.orc-modal select { font: inherit; font-weight: 400; padding: 8px 10px; border: 1px solid #c3cbcb; border-radius: 7px; background: #fff; }
.orc-modal .msg { margin: 0; }
.orc-hist-tit { margin: 6px 0 0; font-size: calc(13px * var(--esc, 1)); color: #1c2541; border-top: 1px solid #e3e8e8; padding-top: 10px; }
.orc-hist { display: flex; flex-direction: column; gap: 8px; font-size: calc(12.5px * var(--esc, 1)); }
.orc-hist-item { border-left: 3px solid #8fb3cc; padding: 2px 0 2px 9px; color: #3a4258; }
.orc-hist-obs { color: #1f2430; margin-top: 2px; white-space: pre-wrap; }
@media (max-width: 760px) {
    .orc-faixa { grid-template-columns: 86px minmax(0, 1fr); }
    .orc-faixa-num { grid-column: 1 / -1; text-align: left; }
}

/* Login: faixa de download do aplicativo Android, logo abaixo da caixa */
.login-coluna { display: flex; flex-direction: column; gap: 14px; width: min(920px, 100%); }
.login-coluna .login-caixa.login-dupla { width: 100%; }
.login-app { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 14px 18px; border-radius: 12px;
    background: rgba(28, 37, 65, .55); border: 1px solid rgba(143, 179, 204, .22); color: #eef1f1; text-decoration: none; font-size: calc(14px * var(--esc, 1)); }
.login-app b { color: #8fb3cc; font-weight: 700; }
.login-app:hover { background: rgba(37, 95, 133, .45); border-color: rgba(143, 179, 204, .45); }
.login-app:hover b { color: #fff; }
@media (max-width: 760px) { .login-coluna { width: min(420px, 100%); } }

/* Follow-up de Orçamentos: os 7 cards numa linha */
.painel-orcamentos .cards-estoque { grid-template-columns: repeat(7, minmax(0, 1fr)); }
@media (max-width: 1100px) { .painel-orcamentos .cards-estoque { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .painel-orcamentos .cards-estoque { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Botão Sair da tela de manutenção (formulário POST com aparência de link) */
.manutencao-sair-form { margin: 0; }
button.manutencao-sair { background: none; border: 0; padding: 4px 8px; font: inherit; font-size: 13px; cursor: pointer; text-decoration: underline; }
button.manutencao-sair:hover { color: #fff; }

/* Marca do cliente completa também no celular e no app Android (nome | slogan), em tamanho menor */
@media (max-width: 760px) {
    .topo .marca { gap: 6px; }
    .topo .marca-slogan { display: block; font-size: 10px; padding-left: 6px; border-left-width: 1.5px; }
}

/* Follow-up: lista sem barra horizontal (os textos quebram linha) e sinais todos com a mesma largura */
.orc-tabela th, .orc-tabela td.txt { white-space: normal; }
.orc-tabela td.col-nome { min-width: 130px; max-width: 220px; }
.orc-sinais { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.orc-sinal, .orc-sinal.erp { width: 116px; max-width: 116px; box-sizing: border-box; text-align: center; overflow: hidden; text-overflow: ellipsis; }
.orc-tabela .arq-contato { flex-direction: column; align-items: flex-start; gap: 2px; }
.orc-tabela .arq-email { max-width: 165px; }
.orc-fup { min-width: 118px; }
/* Valor por seção / fabricante / produto: caminho do drill down */
.orc-sec-caminho { padding: 6px 12px 2px; font-size: calc(12px * var(--esc, 1)); color: #4a5a7a; }
.orc-sec-caminho .link { background: none; border: 0; padding: 0; font: inherit; color: #255f85; cursor: pointer; text-decoration: underline; }
.orc-sec-caminho b { color: #1c2541; }
.orc-sec-desce:hover td { background: #eef4f8; }

/* Login: nome, bandeira, telefone e WhatsApp alinhados pelo centro (vertical) */
.login-contato .contato-link { display: inline-flex; align-items: center; gap: 6px; line-height: 1.2; vertical-align: middle; }
.login-contato .contato-fone { margin-left: 0; line-height: 1; }
.login-contato .contato-fone svg { display: block; }

/* Follow-up: idade dos orçamentos com rolagem vertical quando há muitas faixas (período longo) */
.orc-grade .orc-idade { overflow-y: auto; }
.comercial-grade .painel > .orc-sec-caminho { flex: none !important; }
/* Valor por produto: descrição em até 2 linhas (a completa aparece ao passar o mouse), sem rolagem horizontal */
#t-orc-secao td.txt { white-space: normal; }
#t-orc-secao td.orc-desc { min-width: 160px; }
#t-orc-secao td.orc-desc span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.25; }

/* ---------------------------------------------------------------- Argus PRO: análise com IA */
.botao-analisar { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font: inherit; font-weight: 600; font-size: calc(13px * var(--esc, 1));
    color: #fff; border: 0; border-radius: 6px; padding: 6px 11px; background: linear-gradient(135deg, #255f85, #6a4fa3); box-shadow: 0 1px 3px rgba(28, 37, 65, .25); }
.botao-analisar:hover, .botao-analisar:focus-visible { filter: brightness(1.1); outline: none; }
.botao-analisar.bloqueado { background: #eef1f1; color: #4a5a7a; border: 1px dashed #8fa3b5; box-shadow: none; }
.selo-pro-mini { font-size: 9.5px; font-weight: 800; letter-spacing: .6px; padding: 1px 5px; border-radius: 4px; background: rgba(255, 255, 255, .22); }
.botao-analisar.bloqueado .selo-pro-mini { background: #dde3e4; }
.selo.selo-pro { background: linear-gradient(135deg, #255f85, #6a4fa3); color: #fff; font-weight: 700; letter-spacing: .5px; }
.ia-modal { width: min(760px, 100%); max-height: calc(100vh - 32px); overflow: auto; }
.ia-opcoes { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 6px; }
.ia-opcao { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid #dde3e4; border-radius: 8px; cursor: pointer; }
.ia-opcao:has(input:checked) { border-color: #255f85; background: #eef4f8; }
.ia-opcao.indisponivel { opacity: .55; cursor: not-allowed; }
.ia-opcao-texto { display: flex; flex-direction: column; }
.ia-opcao-texto small { color: #4a5a7a; font-size: calc(12px * var(--esc, 1)); }
.ia-opcao-custo { font-size: calc(12.5px * var(--esc, 1)); font-weight: 600; color: #1c2541; text-align: right; }
.ia-analisando { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 24px 0; }
.ia-cab { display: flex; flex-direction: column; margin-bottom: 8px; }
.ia-cab small { color: #4a5a7a; }
.ia-resumo { background: #f3f6f8; border-radius: 8px; padding: 10px 12px; margin: 0 0 10px; line-height: 1.45; }
.ia-secao { border-left: 4px solid var(--c); padding: 2px 0 2px 12px; margin: 0 0 12px; }
.ia-secao h4 { margin: 0 0 4px; color: var(--c); font-size: calc(13.5px * var(--esc, 1)); }
.ia-secao ul { margin: 0; padding-left: 18px; }
.ia-secao li { margin-bottom: 4px; line-height: 1.4; }
.ia-pos { --c: #2f7d4f; } .ia-neg { --c: #b5473f; } .ia-ate { --c: #c98a1e; } .ia-opo { --c: #255f85; } .ia-sug { --c: #6a4fa3; }
.ia-rodape { margin-top: 6px; }
@media print {
    body.imprimindo-ia > *:not(.ia-fundo) { display: none !important; }
    body.imprimindo-ia .ia-fundo { position: static; background: none; display: block; padding: 0; }
    body.imprimindo-ia .ia-modal { width: auto; max-height: none; overflow: visible; box-shadow: none; border: 0; }
    body.imprimindo-ia .ia-acoes, body.imprimindo-ia .ajuda-fechar { display: none !important; }
    body.imprimindo-ia .ia-secao { break-inside: avoid; }
}
@media (max-width: 760px) { .botao-analisar .selo-pro-mini { display: none; } }
/* opções da IA: anula o padrão de rótulo empilhado das janelas */
.arq-cartao-modal label.ia-opcao { display: grid; flex-direction: row; font-weight: 400; color: #1f2430; }
.arq-cartao-modal .ia-opcao input { width: 16px; height: 16px; padding: 0; margin: 0; accent-color: #255f85; }
.ia-opcao-texto b { color: #1c2541; }
/* PDF da análise com IA: aviso de conteúdo gerado por IA e seções */
@media print {
    .rel-ia-aviso { border: 1pt solid #6a4fa3; background: #f4f1fa; border-radius: 4pt; padding: 6pt 9pt; margin: 2pt 0 10pt; font-size: 8.5pt; color: #2b2f3a;
        -webkit-print-color-adjust: exact; print-color-adjust: exact; break-inside: avoid; }
    .rel-ia-selo { display: inline-block; background: #6a4fa3; color: #fff; font-weight: 700; font-size: 8pt; letter-spacing: .3pt; padding: 2pt 7pt; border-radius: 3pt; margin-bottom: 3pt; }
    .rel-ia-aviso p { margin: 2pt 0; line-height: 1.4; }
    .rel-ia-tit { font-size: 11pt; color: #1c2541; margin: 4pt 0 3pt; }
    .rel-ia-resumo { font-size: 9.5pt; line-height: 1.45; background: #f3f6f8; padding: 6pt 8pt; border-radius: 3pt; margin: 0 0 9pt;
        -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .rel-ia-secao { break-inside: avoid; font-size: 9pt; margin: 0 0 8pt; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .rel-ia-secao h4 { font-size: 10.5pt; margin: 0 0 3pt; }
    .rel-ia-secao li { margin-bottom: 2.5pt; line-height: 1.38; }
    .rel-ia-nota { font-size: 7.5pt; color: #6a4fa3; margin: 8pt 0 0; }
}
@media print {
    /* PDF da análise em pé: topo e rodapé empilham melhor numa folha estreita */
    .rel-retrato .rel-titulo { font-size: 14pt; }
    .rel-retrato .rel-ia-aviso { font-size: 8pt; }
}
@media print {
    /* folha A4 em pé (PDF da análise com IA): 190 mm úteis com 1 cm de margem */
    .relatorio-impressao.rel-retrato.rel-medindo { width: 190mm !important; }
    .rel-retrato .rel-folha { width: 190mm; }
}
@media print {
    /* PDF da análise com IA: texto justificado (aviso, visão geral e itens) */
    .rel-ia-aviso p, .rel-ia-resumo, .rel-ia-secao li { text-align: justify; hyphens: auto; }
}

/* Topo em telas médias (tablet, celular deitado): Analisar e Exportar só com o ícone, para não cobrir a marca do cliente */
@media (max-width: 1100px) {
    .topo .botao-analisar .rotulo-botao, .topo .botao-analisar .selo-pro-mini, .topo .botao-exportar .rotulo-botao { display: none; }
    .topo .botao-analisar, .topo .botao-exportar { padding: 6px 9px; }
}

/* Escolha da empresa no celular: duas empresas por linha, logos centralizados e sem rolagem lateral */
@media (max-width: 760px) {
    .escolha-caixa { margin: 12px; width: auto; max-width: calc(100vw - 24px); padding: 18px 14px 20px; }
    .escolha-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .escolha-cartao { min-width: 0; min-height: 110px; padding: 12px 8px; overflow: hidden; }
    .escolha-marca { width: 100%; min-height: 48px; }
    .escolha-marca .marca { max-width: 100%; justify-content: center; gap: 5px; }
    .escolha-marca .marca-logo { max-width: 100%; max-height: 46px; height: auto; margin: 0 auto; }
    .escolha-marca .marca-nome { font-size: 13px; }
    .escolha-marca .marca-slogan { font-size: 10px; padding-left: 5px; }
    .escolha-nome { font-size: 13px; overflow-wrap: anywhere; }
    .escolha-caixa h1 { font-size: 17px; }
    .escolha-topo .argus-marca .argus-olho { width: 40px; }
}

/* ---------- Margem e Rentabilidade (painel 'margem') */
.mrg-cards { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 1300px) { .mrg-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mrg-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mrg-cards .card-titulo { font-size: calc(10.5px * var(--esc, 1)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mrg-cards .card-valor { font-size: calc(16px * var(--esc, 1)); padding: 3px 6px 1px; }
.mrg-cards .card-sub { font-size: calc(10.5px * var(--esc, 1)); color: #6b6a5f; padding: 0 6px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mrg-cards .card.alerta { border-top-color: var(--salmao); }
.mrg-cards .card.alerta .card-valor { color: var(--salmao); }
.mrg-aviso { margin: 0 20px 10px; padding: 5px 10px; background: #fff8e1; border: 1px solid #f0d98a; border-radius: 6px; font-size: calc(12px * var(--esc, 1)); color: #5c4a12;
    display: flex; gap: 6px 14px; align-items: center; flex-wrap: wrap; }
.mrg-aviso b { font-weight: 700; }
.mrg-aviso-custo { display: inline-flex; align-items: center; gap: 6px; }
.mrg-aviso .alternador { border-color: #c9b26a; }
.mrg-aviso .alternador button { background: #fff; color: #5c4a12; border: 0; padding: 3px 9px; font: inherit; cursor: pointer; }
.mrg-aviso .alternador button.ativo { background: #1c2541; color: #fff; }
.mrg-aviso .botao-ajuda { margin-left: auto; color: #5c4a12; }
body.pagina-comercial.painel-margem > .comercial-grade.mrg-grade { grid-template-rows: none; grid-auto-rows: 370px; overflow: auto; align-content: start; }
.mrg-grade .painel { display: flex; flex-direction: column; min-height: 0; }
.mrg-grade .tabela-rolagem { flex: 1 1 0; min-height: 0; max-height: none; }
.mrg-grade .mrg-caminho, .mrg-grade .mrg-quad-leg, .mrg-grade .mrg-vazio { flex: 0 0 auto !important; }
.mrg-grafico { flex: 1 1 0; min-height: 0; padding: 4px; overflow: hidden; }
.mrg-grafico svg { display: block; }
.mrg-tabela th { white-space: nowrap; text-align: center; cursor: pointer; }
.mrg-tabela td.num { text-align: right; white-space: nowrap; }
.mrg-tabela td.txt { text-align: left; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mrg-tabela tr.clicavel { cursor: pointer; }
.mrg-tabela tr.clicavel:hover td { background: #e8eef5; }
.mrg-pct { display: inline-flex; align-items: center; gap: 6px; justify-content: flex-end; }
.mrg-pct i { display: inline-block; height: 8px; border-radius: 4px; background: #255f85; }
.mrg-pct.baixa { color: var(--salmao); font-weight: 600; }
.mrg-pct.baixa i { background: var(--salmao); }
.mrg-pct.alta { color: #1d7a46; font-weight: 600; }
.mrg-pct.alta i { background: #2e9e5e; }
.mrg-perda { color: var(--salmao); }
.mrg-caminho { padding: 4px 10px; font-size: calc(12px * var(--esc, 1)); background: #f4f6f6; border-bottom: 1px solid #dde3e4; }
.mrg-caminho a { color: #255f85; text-decoration: underline; }
.mrg-caminho small { float: right; color: #777; }
.mrg-quad-leg { display: flex; gap: 12px; flex-wrap: wrap; font-size: calc(11.5px * var(--esc, 1)); padding: 4px 10px 0; color: #444; }
.mrg-quad-leg span::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 4px; vertical-align: -1px; background: var(--c); }
.mrg-dica { position: fixed; pointer-events: none; background: #1c2541; color: #fff; font-size: 12px; padding: 6px 8px; border-radius: 6px; z-index: 50; max-width: 320px; line-height: 1.35; }
.mrg-vazio { margin: 0; padding: 8px 10px; color: #1d7a46; font-size: calc(12.5px * var(--esc, 1)); }
.mrg-rel-grafico svg { width: 100%; height: auto; max-height: 260px; }
@media (max-width: 640px) {
    .mrg-aviso { margin: 0 10px 10px; }
    body.pagina-comercial.painel-margem > .comercial-grade.mrg-grade { grid-auto-rows: 340px; }
    .mrg-caminho small { display: none; }
}

/* ---------- Venda Complementar (painel 'complementar'; usa a base da Margem) */
.cmp-cards { grid-template-columns: repeat(7, minmax(0, 1fr)); }
@media (max-width: 1300px) { .cmp-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 640px) { .cmp-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
body.pagina-comercial.painel-complementar > .comercial-grade.mrg-grade { grid-template-rows: none; grid-auto-rows: 370px; overflow: auto; align-content: start; }
body.pagina-comercial.painel-complementar > .comercial-grade .cmp-lista-painel { grid-row: span 2; }
.cmp-grade .cmp-mapa-caixa, .cmp-grade .cmp-barras { flex: 1 1 0; min-height: 0; overflow: auto; padding: 6px 8px; }
.cmp-nome { display: inline-flex; flex-direction: column; line-height: 1.15; max-width: 100%; }
.cmp-nome > span { overflow: hidden; text-overflow: ellipsis; }
.cmp-nome small { color: #8a8878; font-size: calc(10px * var(--esc, 1)); overflow: hidden; text-overflow: ellipsis; }
.mrg-tabela tr.selecionada td { background: #fff3c4 !important; }
.cmp-chips { display: flex; flex-wrap: wrap; gap: 3px; }
.cmp-chip { display: inline-block; padding: 1px 7px; border-radius: 10px; background: #e8eef5; color: #1c2541; font-size: calc(11px * var(--esc, 1)); white-space: nowrap; max-width: 210px; overflow: hidden; text-overflow: ellipsis; }
.cmp-chip.oferecer { background: #e3f3e8; color: #1d6b3d; font-weight: 600; }
.cmp-lista td.txt { white-space: normal; max-width: 360px; }
.cmp-lista td .arq-contato { display: flex; flex-direction: column; gap: 2px; }
.cmp-mapa { border-collapse: collapse; font-size: calc(11px * var(--esc, 1)); margin: 0 auto; }
.cmp-mapa td { width: 38px; height: 22px; text-align: center; border: 1px solid #fff; font-variant-numeric: tabular-nums; }
.cmp-mapa td.cmp-mapa-diag { background: #f0f2f2; }
.cmp-mapa th.cmp-mapa-lin { text-align: right; padding-right: 6px; font-weight: 600; white-space: nowrap; max-width: 170px; overflow: hidden; text-overflow: ellipsis; }
.cmp-mapa th.cmp-mapa-col { height: 96px; vertical-align: bottom; padding: 0 0 4px; }
.cmp-mapa th.cmp-mapa-col span { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; max-height: 92px; overflow: hidden; text-overflow: ellipsis; font-weight: 600; display: inline-block; }
.cmp-mapa th.cmp-mapa-canto { font-weight: 400; color: #8a8878; font-size: calc(10px * var(--esc, 1)); vertical-align: bottom; text-align: right; padding: 0 6px 4px 0; }
.cmp-barras { display: flex; flex-direction: column; gap: 4px; }
.cmp-barra { display: grid; grid-template-columns: minmax(90px, 34%) 1fr auto; align-items: center; gap: 8px; background: none; border: 0; padding: 3px 4px; border-radius: 5px; cursor: pointer; font: inherit; text-align: left; color: inherit; }
.cmp-barra:hover, .cmp-barra.selecionada { background: #fff3c4; }
.cmp-barra-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.cmp-barra-trilho { height: 12px; background: #eef1f1; border-radius: 6px; overflow: hidden; }
.cmp-barra-trilho span { display: block; height: 100%; background: #2e9e5e; border-radius: 6px; }
.cmp-barra-num { font-size: calc(11.5px * var(--esc, 1)); color: #555; white-space: nowrap; }
.cmp-sel { display: inline-flex; align-items: center; gap: 6px; background: #fff3c4; color: #5c4a12; border-radius: 12px; padding: 2px 4px 2px 10px; font-size: calc(12px * var(--esc, 1)); }
.cmp-sel[hidden] { display: none; }
.cmp-sel button { border: 0; background: #1c2541; color: #fff; border-radius: 50%; width: 18px; height: 18px; cursor: pointer; font-size: 10px; line-height: 18px; padding: 0; }
.cmp-rel td .cmp-chip { background: none; padding: 0 3px; }
@media (max-width: 640px) {
    body.pagina-comercial.painel-complementar > .comercial-grade.mrg-grade { grid-auto-rows: 360px; }
    .cmp-barra { grid-template-columns: minmax(80px, 40%) 1fr; }
    .cmp-barra-num { grid-column: 1 / -1; }
}

/* Margem: itens abaixo do custo sem passar da largura da tela (campos em duas linhas e quebra nos textos longos) */
#t-mrg-abaixo { width: 100%; table-layout: fixed; }
#t-mrg-abaixo th { white-space: normal; line-height: 1.2; }
#t-mrg-abaixo td.txt { white-space: normal; max-width: none; overflow-wrap: anywhere; }
#t-mrg-abaixo th:nth-child(1) { width: 8%; } #t-mrg-abaixo th:nth-child(2) { width: 15%; } #t-mrg-abaixo th:nth-child(3) { width: 17%; }
#t-mrg-abaixo th:nth-child(4) { width: 25%; } #t-mrg-abaixo th:nth-child(5) { width: 6%; } #t-mrg-abaixo th:nth-child(n+6) { width: 9.6%; }
.mrg-duas { display: flex; flex-direction: column; line-height: 1.2; }
.mrg-duas.num { align-items: flex-end; }
.mrg-duas small { color: #7a786b; font-size: calc(10.5px * var(--esc, 1)); font-weight: 400; }
.mrg-duas.mrg-perda > span { font-weight: 700; }
@media (max-width: 900px) { #t-mrg-abaixo { width: 900px; } }

/* Relatórios em PDF com tabela própria: colunas de largura fixa e quebra de linha nos textos longos (nunca passa da folha) */
.rel-tabela.rel-fixa { table-layout: fixed; width: 100%; }
.rel-tabela.rel-fixa th, .rel-tabela.rel-fixa td { white-space: normal; overflow-wrap: anywhere; vertical-align: top; }
.rel-tabela.rel-fixa th { vertical-align: bottom; line-height: 1.15; }
.rel-tabela.rel-fixa th.txt, .rel-tabela.rel-fixa td.txt { text-align: left; }
.rel-tabela.rel-fixa th.num, .rel-tabela.rel-fixa td.num { text-align: right; }
.rel-tabela.rel-fixa small.rel-sub { display: block; color: #6b6a5f; font-size: 0.9em; }

/* LEM: 10 indicadores (o primeiro é a Comissão Sobre Resultado) */
body.painel-lem .cards-11 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
@media (max-width: 1400px) { body.painel-lem .cards-11 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 760px) { body.painel-lem .cards-11 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media print { body.painel-lem .rel-cards-11 { grid-template-columns: repeat(10, 1fr) !important; } }

/* ---------- Fase 2: Metas e Projeção (painel 'metas') e Calendário Comercial (painel 'calendario'); usam a base da Margem */
.met-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 1100px) { .met-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .met-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mrg-cards .card.ok { border-top-color: #2e9e5e; }
.mrg-cards .card.ok .card-valor { color: #1d7a46; }
.mrg-cards .card.atencao { border-top-color: #c9a227; }
.mrg-cards .card.atencao .card-valor { color: #8a6d00; }
.mrg-cards .card.alerta { border-top-color: var(--salmao); }
body.pagina-comercial.painel-metas > .comercial-grade.mrg-grade,
body.pagina-comercial.painel-calendario > .comercial-grade.mrg-grade { grid-template-rows: none; grid-auto-rows: 370px; overflow: auto; align-content: start; }
body.pagina-comercial.painel-calendario > .comercial-grade .c-largo { grid-row: span 1; }
.met-botao { margin-left: auto; padding: 4px 14px; }
.met-pct { display: inline-flex; align-items: center; gap: 6px; justify-content: flex-end; }
.met-pct i { display: inline-block; height: 8px; border-radius: 4px; background: #9fb3c8; }
.met-pct.alta { color: #1d7a46; font-weight: 600; } .met-pct.alta i { background: #2e9e5e; }
.met-pct.media { color: #8a6d00; font-weight: 600; } .met-pct.media i { background: #c9a227; }
.met-pct.baixa { color: var(--salmao); font-weight: 600; } .met-pct.baixa i { background: var(--salmao); }
.ia-modal.met-modal { width: min(880px, calc(100vw - 24px)); max-width: none; }
.met-cad-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 8px 0; }
.met-cad-acoes .alternador { border-color: #c3cbcb; }
.met-cad-acoes .alternador button { background: #fff; color: #1c2541; border: 0; padding: 4px 10px; cursor: pointer; font: inherit; }
.met-cad-acoes .alternador button.ativo { background: #1c2541; color: #fff; }
.met-pct-in { width: 46px; text-align: right; margin: 0 2px 0 6px; padding: 3px 4px; border: 1px solid #c3cbcb; border-radius: 4px; }
.met-cad-tabela { max-height: 52vh; overflow: auto; border: 1px solid #dde3e4; border-radius: 6px; }
.met-cad td.txt { text-align: left; }
.met-cad td, .met-cad th { white-space: nowrap; }
.met-in { width: 130px; text-align: right; padding: 3px 6px; border: 1px solid #c3cbcb; border-radius: 4px; font: inherit; }
.met-in:focus { outline: 2px solid #255f85; }
.cal-grade .cal-caixa { flex: 1 1 0; min-height: 0; overflow: auto; padding: 6px 8px; }
.cal-mapa { border-collapse: collapse; width: 100%; font-size: calc(11.5px * var(--esc, 1)); font-variant-numeric: tabular-nums; }
.cal-mapa th { padding: 4px 6px; font-weight: 600; color: #1c2541; text-align: center; white-space: nowrap; }
.cal-mapa th.txt { text-align: left; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.cal-mapa td { padding: 5px 4px; text-align: center; border: 1px solid #fff; white-space: nowrap; }
.cal-mapa td.cal-vazio { background: #f4f6f6; }
.cal-mapa td.cal-total { font-weight: 700; background: #eef1f1; }
.cal-sobe { color: #1d7a46; } .cal-desce { color: var(--salmao); }

/* PDF: tabela mais larga que a folha → os textos quebram linha (sem vazar para a coluna ao lado) */
.relatorio-impressao table td.rel-q, .relatorio-impressao table th.rel-q { white-space: normal !important; overflow-wrap: anywhere; word-break: normal; }
.relatorio-impressao table td.rel-q *, .relatorio-impressao table th.rel-q * { white-space: normal !important; }
/* ---------- Gestão Comercial › Cadastro de Metas */
.mc { display: flex; flex-direction: column; gap: 12px; }
.mc-topo { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: flex-end; }
.mc-mes { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 12.5px; }
.mc-mes select { min-width: 270px; padding: 6px 8px; font: inherit; font-weight: 400; }
.mc-status { flex: 1; font-size: 12.5px; color: #6b6a5f; min-width: 180px; }
.mc-pendente { color: #b5473f; }
.mc-salvar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 12.5px; }
.mc-salvar select { padding: 4px 6px; font: inherit; }
.mc-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 1100px) { .mc-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mc-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mc-card { background: #fff; border: 1px solid #dde3e4; border-top: 3px solid #255f85; border-radius: 8px; padding: 6px 8px 7px; text-align: center; display: flex; flex-direction: column; gap: 2px; }
.mc-card span { font-size: 10.5px; color: #6b6a5f; text-transform: uppercase; letter-spacing: .4px; }
.mc-card b { font-size: 17px; color: #1c2541; }
.mc-card small { font-size: 10.5px; color: #6b6a5f; }
.mc-card.ok { border-top-color: #2e9e5e; } .mc-card.alerta { border-top-color: var(--salmao); } .mc-card.alerta b { color: var(--salmao); }
.mc-abas { display: flex; gap: 4px; border-bottom: 2px solid #1c2541; margin-bottom: 10px; }
.mc-abas button { border: 0; background: #eef1f1; color: #1c2541; padding: 7px 16px; border-radius: 6px 6px 0 0; font: inherit; font-weight: 600; cursor: pointer; }
.mc-abas button.ativo { background: #1c2541; color: #fff; }
.mc-ferramentas { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin-bottom: 10px; font-size: 12.5px; }
.mc-grupo { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 4px 8px; background: #f4f6f6; border-radius: 6px; }
.mc-grupo select { padding: 3px 4px; font: inherit; }
.mc-grupo .botao { padding: 3px 10px; font-size: 12px; }
#mc-pct { width: 46px; text-align: right; padding: 3px 4px; border: 1px solid #c3cbcb; border-radius: 4px; }
#mc-busca { margin-left: auto; padding: 5px 8px; border: 1px solid #c3cbcb; border-radius: 6px; min-width: 200px; }
.mc-check { display: inline-flex; align-items: center; gap: 4px; }
.mc-tabela-caixa { max-height: calc(100vh - 340px); min-height: 260px; overflow: auto; border: 1px solid #dde3e4; border-radius: 6px; }
.mc-tabela { width: 100%; }
.mc-tabela thead th { position: sticky; top: 0; z-index: 1; cursor: pointer; white-space: nowrap; }
.mc-tabela th.txt, .mc-tabela td.txt { text-align: left; }
.mc-tabela td.txt { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-tabela th { white-space: normal !important; line-height: 1.15; font-size: 11.5px; }
.mc-tabela td.num { text-align: right; white-space: nowrap; }
.mc-tabela tfoot td { position: sticky; bottom: 0; background: #eef1f1; font-weight: 700; border-top: 2px solid #1c2541; }
.mc-tabela tr.mc-inativo td { color: #9a998f; }
.mc-tabela td small { color: #b5473f; }
.mc-in { width: 112px; text-align: right; padding: 4px 6px; border: 1px solid #c3cbcb; border-radius: 4px; font: inherit; background: #fffdf2; }
.mc-in:focus { outline: 2px solid #255f85; background: #fff; }
.mc-bom { color: #1d7a46; font-weight: 600; } .mc-medio { color: #8a6d00; font-weight: 600; } .mc-ruim { color: var(--salmao); font-weight: 600; }
.mc-atencao { color: #b5473f; font-weight: 600; }
@media (max-width: 640px) { #mc-busca { margin-left: 0; width: 100%; } .mc-tabela-caixa { max-height: none; } }

.mc-grupo[hidden] { display: none !important; }
main.admin:has(> .mc) { max-width: none; }
.mc-msg { margin: 0 0 8px; padding: 6px 10px; background: #e3f3e8; color: #1d6b3d; border-radius: 6px; font-size: 12.5px; }

/* Cadastro de Metas no modelo das telas (painel 'metas_cadastro') */
body.pagina-comercial.painel-metas-cadastro > .comercial-grade.mc-grade { grid-template-rows: none; grid-auto-rows: auto; overflow: auto; align-content: start; }
.mc-grade .mc-painel { display: flex; flex-direction: column; min-height: 0; }
.mc-grade .mc-ferramentas, .mc-grade .mc-msg, .mc-grade .mc-dica { flex: 0 0 auto !important; margin-left: 10px; margin-right: 10px; }
.mc-grade .mc-ferramentas { margin-top: 10px; }
.mc-grade .mc-tabela-caixa { flex: 1 1 auto !important; margin: 0 10px; max-height: calc(100vh - 380px); }
.mc-faixa { flex-wrap: wrap; }
.mc-mes-nav { display: inline-flex; align-items: center; gap: 8px; }
.mc-mes-nav .botao { padding: 2px 10px; font-size: 15px; line-height: 1.2; }
.mc-mes-nav b { font-size: 14px; }
.mc-faixa .mc-status { flex: 1; }
.mc-faixa .mc-salvar { margin-left: auto; }
.mc-abas button { background: #fff; color: #1c2541; border: 0; padding: 3px 10px; cursor: pointer; font: inherit; }
.mc-abas button.ativo { background: #1c2541; color: #fff; }
.painel-titulo .mc-abas button.ativo { background: #fff; color: #1c2541; }
.painel-titulo .mc-abas button { background: transparent; color: #fff; }
/* Resultado do Follow-Up (painel 'fup_resultado') */
body.pagina-comercial.painel-fup-resultado > .comercial-grade.mrg-grade { grid-template-rows: none; grid-auto-rows: 360px; overflow: auto; align-content: start; }
body.pagina-comercial.painel-fup-resultado > .comercial-grade .c-largo { grid-row: span 1; }
.fup-grade .cmp-barras { flex: 1 1 0; min-height: 0; overflow: auto; padding: 8px 10px; }
.fup-barra { cursor: default; }
.fup-link { margin-left: auto; padding: 3px 12px; }
.fup-atencao { color: #8a6d00; }

/* Filtros "todos, exceto": a caixa e as etiquetas mostram o que ficou de fora */
.gaveta .seletor.exceto { border-color: #b5473f; color: #8a2f28; background: #fff6f5; }
.etiqueta.exceto { background: #fde8e6; color: #8a2f28; }
.etiqueta.exceto > span::before { content: '≠ '; font-weight: 700; }
.lista-opcoes .exceto-dica { padding: 4px 6px; background: #fff6f5; color: #8a2f28; border-radius: 4px; margin-bottom: 4px; }
.lista-opcoes .rodape button + button { margin-left: 6px; }

/* Calendário: drill down de seção > linha > fabricante */
.cal-grade #cal-caminho { flex: 0 0 auto !important; }
.cal-mapa tr.clicavel { cursor: pointer; }
.cal-mapa tr.clicavel:hover th { color: #255f85; text-decoration: underline; }
.cal-mapa th small.cal-pai { display: block; font-weight: 400; color: #8a8878; font-size: 10px; }

/* PDF da Análise Comercial / LEM: variação de cada card contra o ano anterior */
@media print {
    .rel-cards small.rel-var { display: block; font-size: 6pt; margin-top: 1.5pt; color: #6b6a5f; line-height: 1.2; }
    .rel-cards small.rel-var b { display: inline; font-size: 6.5pt !important; margin: 0; color: #6b6a5f; white-space: nowrap; }
    .rel-cards small.rel-var.bom b { color: #3f8a5c; }
    .rel-cards small.rel-var.ruim b { color: #b5473f; }
}

/* ---------- Endomarketing: Campanhas de Incentivo (ranking e modo TV) e Destaques do Mês */
body.painel-incentivos #chips, body.painel-incentivos #contexto { display: none; }
body.painel-incentivos [hidden], body.painel-destaques [hidden] { display: none !important; }
body.pagina-comercial.painel-incentivos > .comercial-grade.inc-grade, body.pagina-comercial.painel-destaques > .comercial-grade.des-grade { grid-template-rows: none; grid-auto-rows: 400px; overflow: auto; align-content: start; }
/* Destaques: cada seção (vendedores, arquitetos, lojas) numa linha inteira, com os cards dividindo a largura */
body.pagina-comercial.painel-destaques > .comercial-grade.des-grade { grid-auto-rows: auto; }
.des-grade > .painel { height: 400px; }
.des-secoes { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 12px; }
.des-secoes > .painel.des-sec { height: auto; }
.des-sec .painel-titulo .des-sec-sub { font-weight: 400; opacity: .75; }
.des-sec-arquitetos .des-card { border-top-color: #8a4f7d; }
.des-sec-arquitetos .des-valor { color: #8a4f7d; }
.des-sec-unidades .des-card { border-top-color: #255f85; }
.des-sec-unidades .des-valor { color: #255f85; }
.des-outros { list-style: none; padding-left: 0; }
.des-outros li { display: flex; align-items: baseline; gap: 6px; }
.des-outros li i { font-style: normal; color: #9a9a9a; flex: none; }
.des-outros li span { flex: 1; min-width: 0; max-width: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.des-outros li b { float: none; flex: none; white-space: nowrap; }
.des-nome.des-sel, .des-outros li.des-sel span { background: #fff3c4; border-radius: 3px; padding: 0 3px; }
body.pagina-comercial.painel-incentivos-cadastro > .comercial-grade.inc-grade { grid-auto-rows: auto; }
body.pagina-comercial.painel-incentivos-cadastro > .comercial-grade.inc-grade > .painel { height: 400px; }
body.pagina-comercial.painel-incentivos-cadastro > .comercial-grade.inc-grade > .painel.inc-lista-painel { height: auto; max-height: 360px; }
.des-card .des-nome { overflow-wrap: anywhere; }
@media (max-width: 1100px) { .des-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .des-cards { grid-template-columns: minmax(0, 1fr); } }
/* Campanhas: vencedores de cada apuração e lista do cadastro */
.inc-venc-tabela td.inc-venc b { display: block; font-weight: 600; }
.inc-venc-tabela td.inc-venc small { display: block; color: #6b6a5f; }
.inc-tabela tr.inc-rodada-sel td { background: #e8f1f7; }
.inc-tabela tr.inc-futura td { color: #9a9a9a; }
.inc-tabela tr.clicavel { cursor: pointer; }
.inc-tabela tr.clicavel:hover td { background: #f3f7fa; }
body.pagina-comercial.painel-incentivos-cadastro > .comercial-grade.inc-grade > .inc-lista-painel { min-height: 0; }
.inc-tabela th.txt, .inc-tabela td.txt, .inc-tv-tabela td.txt { text-align: left; }
.inc-tabela th.centro, .inc-tabela td.centro { text-align: center; }
.inc-sel-lista label { display: flex; flex-direction: row; align-items: center; gap: 6px; margin: 0; font-weight: 400; }
.inc-sel-lista input { width: auto; margin: 0; }
.arq-cartao-modal label.mc-check { display: flex; flex-direction: row; align-items: center; gap: 6px; }
.arq-cartao-modal label.mc-check input { width: auto; margin: 0; }
.inc-tabela tr.inc-corte td, .inc-tv-tabela tr.inc-corte td { border-bottom: 2px dashed #b7791f; }
.inc-ganha { margin-left: 6px; font-size: 12px; }
.inc-sel-lista label.fora { opacity: .5; }
.inc-premios-campos { display: flex; flex-direction: column; gap: 6px; }
.inc-premios-campos input { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; }
.inc-form .inc-igual { font-size: 13px; }
.inc-campo select:disabled, .inc-campo input:disabled { background: #f1f3f4; color: #777; }
.inc-tv-premios ul { margin: .3em 0 0; padding-left: 1.1em; font-size: .9em; }
.inc-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.inc-escolha { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.inc-escolha select { min-width: 280px; max-width: 520px; padding: 6px 8px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; background: #fff; }
.inc-situacao { color: #555; }
.inc-acoes { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.inc-selo { display: inline-block; padding: 2px 9px; border-radius: 10px; font-size: 12px; font-weight: 700; }
.inc-selo.inc-andamento { background: #e3f3e9; color: #1f7a45; }
.inc-selo.inc-agendada { background: #e6eef5; color: #255f85; }
.inc-selo.inc-encerrada { background: #eceae4; color: #6b6a5f; }
.inc-grade .c-meio { min-height: 300px; }
.inc-tabela td.inc-pos { font-size: 18px; width: 52px; }
.inc-tabela td.inc-nome { font-weight: 600; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inc-tabela td.inc-valor { font-weight: 700; }
.inc-tabela tr.inc-top1 td { background: #fdf6e0; }
.inc-tabela tr.inc-top2 td { background: #f4f6f8; }
.inc-tabela tr.inc-top3 td { background: #fbf1ea; }
.inc-progresso { width: 22%; min-width: 120px; }
.inc-barra-trilho { position: relative; display: block; height: 10px; border-radius: 5px; background: #e8ecee; overflow: visible; }
.inc-barra-trilho > span { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #255f85, #3f86b5); }
.inc-marca-meta { position: absolute; top: -3px; width: 2px; height: 16px; background: #b5473f; }
.inc-corrida { min-height: 260px; }
.inc-regras { padding: 4px 14px 12px; font-size: 13.5px; overflow: auto; }
.inc-tema { white-space: pre-line; background: #f6f8f8; border-left: 3px solid #b7791f; padding: 8px 12px; border-radius: 4px; }
.inc-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; margin: 8px 0; }
.inc-dl dt { font-weight: 700; color: #1c2541; }
.inc-dl dd { margin: 0; color: #444; }
.inc-regras h4 { margin: 12px 0 4px; }
.inc-premios { margin: 0; padding-left: 22px; }
.inc-premios li { margin: 2px 0; }
.inc-vazio { margin: 40px auto; max-width: 560px; text-align: center; background: #fff; border-radius: 10px; padding: 30px 24px; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.inc-vazio-icone { font-size: 48px; }
.inc-vazio b { display: block; font-size: 18px; margin: 8px 0; color: #1c2541; }
.inc-vazio p { color: #555; margin: 0 0 16px; }
.inc-modal { max-width: 720px; width: calc(100vw - 32px); max-height: calc(100vh - 40px); display: flex; flex-direction: column; }
.inc-form { overflow: auto; padding-right: 4px; display: flex; flex-direction: column; gap: 8px; }
.inc-form h4 { margin: 10px 0 0; color: #1c2541; }
.inc-form > input[type=text] { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; }
.inc-campo { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 140px; }
.inc-campo > span { font-weight: 600; font-size: 13px; }
.inc-campo input, .inc-campo select, .inc-campo textarea { padding: 6px 8px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; box-sizing: border-box; width: 100%; }
.inc-linha { display: flex; gap: 10px; flex-wrap: wrap; }
.inc-sel { border: 1px solid #dde3e4; border-radius: 6px; padding: 6px 10px; }
.inc-sel summary { cursor: pointer; display: flex; gap: 10px; align-items: baseline; }
.inc-sel-resumo { color: #555; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inc-sel-corpo { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.inc-sel-corpo input[type=search] { padding: 5px 8px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; }
.inc-sel-lista { max-height: 180px; overflow: auto; display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.inc-sel-corpo .botao { align-self: flex-start; }
/* modo TV: tela cheia, escura, letras grandes */
body.modo-tv { overflow: hidden; }
.inc-tv { position: fixed; inset: 0; z-index: 9000; background: #101828; color: #f2f4f7; display: flex; flex-direction: column; padding: 2vh 2.2vw; box-sizing: border-box; font-size: clamp(14px, 1.6vw, 30px); }
.inc-tv-topo { display: flex; align-items: center; gap: 2vw; border-bottom: 2px solid #2c3a55; padding-bottom: 1.4vh; }
.inc-tv-marca .marca { background: #fff; border-radius: 10px; padding: 6px 12px; }
.inc-tv-marca .marca img { max-height: 7vh; }
.inc-tv-titulo { flex: 1; display: flex; flex-direction: column; }
.inc-tv-titulo small { color: #e0b54a; font-size: .7em; text-transform: uppercase; letter-spacing: .06em; }
.inc-tv-titulo b { font-size: 1.7em; line-height: 1.15; }
.inc-tv-titulo span { color: #9fb3c8; font-size: .8em; }
.inc-tv-hora { font-size: 1.6em; font-weight: 700; color: #9fb3c8; }
.inc-tv-corpo { flex: 1; display: grid; grid-template-columns: 1.25fr 1fr; gap: 2vw; padding-top: 1.6vh; min-height: 0; }
.inc-tv-rank { overflow: hidden; }
.inc-tv-tabela { width: 100%; border-collapse: collapse; }
.inc-tv-tabela th { color: #9fb3c8; font-weight: 600; font-size: .62em; text-transform: uppercase; text-align: left; padding: .3em .5em; }
.inc-tv-tabela th.num { text-align: right; }
.inc-tv-tabela td { padding: .42em .5em; border-bottom: 1px solid #22304a; font-size: .95em; }
.inc-tv-tabela td.num { text-align: right; }
.inc-tv-tabela td.centro { text-align: center; }
.inc-tv-tabela td.inc-nome { font-weight: 700; max-width: 30vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inc-tv-tabela td.inc-valor { font-weight: 800; color: #fff; }
.inc-tv-tabela tr.inc-top1 td { background: rgba(224, 181, 74, .18); }
.inc-tv-tabela tr.inc-top1 td.inc-nome, .inc-tv-tabela tr.inc-top1 td.inc-valor { color: #f5cf6b; font-size: 1.1em; }
.inc-tv-tabela tr.inc-top2 td, .inc-tv-tabela tr.inc-top3 td { background: rgba(159, 179, 200, .08); }
.inc-tv-tabela .inc-progresso { width: 24%; }
.inc-tv-tabela .inc-barra-trilho { height: .55em; background: #22304a; }
.inc-tv-tabela .inc-barra-trilho > span { background: linear-gradient(90deg, #3f86b5, #6fb3e0); }
.inc-tv-tabela tr.inc-top1 .inc-barra-trilho > span { background: linear-gradient(90deg, #c9a227, #f5cf6b); }
.inc-tv-tabela .mc-bom { color: #6fd39a; font-weight: 700; }
.inc-tv-lado { display: flex; flex-direction: column; gap: 1.2vh; min-height: 0; }
.inc-tv-lado h3 { margin: 0; font-size: .8em; color: #e0b54a; text-transform: uppercase; letter-spacing: .06em; }
.inc-tv-grafico svg text { fill: #d6dde6; }
.inc-tv-premios ol { margin: .3em 0 0; padding-left: 1.3em; font-size: .9em; }
.inc-tv-tema { margin: 0; color: #c7d2de; font-size: .75em; white-space: pre-line; max-height: 18vh; overflow: hidden; }
.inc-tv-rodape { display: flex; justify-content: space-between; align-items: center; color: #6f819a; font-size: .6em; padding-top: 1vh; border-top: 1px solid #22304a; }
.inc-tv-sair { background: transparent; color: #9fb3c8; border: 1px solid #3a4a66; border-radius: 6px; padding: .3em .9em; font: inherit; cursor: pointer; }
/* Destaques do Mês */
.des-nota { margin-left: auto; }
.des-cards { display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); gap: 12px; padding: 8px 12px 14px; }
.des-card { position: relative; background: #fff; border: 1px solid #e4e7e8; border-top: 4px solid #b7791f; border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; }
.des-card-topo { display: flex; align-items: center; gap: 8px; color: #6b6a5f; font-size: 12.5px; text-transform: uppercase; letter-spacing: .03em; }
.des-icone { font-size: 22px; }
.des-nome { font-size: 17px; font-weight: 800; color: #1c2541; line-height: 1.2; margin-top: 4px; }
.des-valor { font-size: 20px; font-weight: 700; color: #b7791f; }
.des-det { font-size: 12px; color: #6b6a5f; }
.des-outros { margin: 6px 0 0; padding-left: 22px; font-size: 12.5px; color: #444; }
.des-outros li { display: list-item; }
.des-outros li span { display: inline-block; max-width: 62%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.des-outros li b { float: right; font-weight: 600; }
.des-cartao { margin-top: 8px; align-self: flex-start; font-size: 12.5px; padding: 4px 10px; }
.des-grade .c-meio { min-height: 220px; }
/* cartão de reconhecimento: usa o modelo do cartão de aniversário */
.cartao-des .ca-cat { text-align: center; font-size: 17pt; font-weight: 700; color: #b7791f; margin-top: 4mm; }
.cartao-des .ca-valor { text-align: center; font-size: 15pt; font-weight: 700; color: #1c2541; margin-top: 2mm; }
@media (max-width: 700px) {
    .inc-acoes { margin-left: 0; }
    .inc-escolha select { min-width: 0; max-width: 100%; }
    .inc-tv-corpo { grid-template-columns: 1fr; }
}

/* Destaques do Mês: cards compactos (as três seções cabem numa tela) e o botão do cartão igual em todos, na base e centralizado */
.des-secoes { gap: 8px; }
.des-cards { gap: 10px; padding: 6px 10px 10px; }
.des-card { padding: 8px 10px; gap: 1px; border-top-width: 3px; }
.des-card-topo { gap: 6px; font-size: 10.5px; line-height: 1.2; min-height: 26px; }
.des-icone { font-size: 16px; }
.des-card .des-nome { font-size: 14px; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
.des-valor { font-size: 17px; line-height: 1.2; }
.des-det { font-size: 11px; line-height: 1.25; }
.des-outros { margin: 4px 0 0; padding-left: 0; font-size: 11px; line-height: 1.35; }
.des-outros li { display: flex; align-items: baseline; gap: 5px; }
.des-outros li span { display: block; flex: 1; min-width: 0; max-width: none; }
.des-outros li b { float: none; }
.des-card > :nth-last-child(2) { margin-bottom: 6px; }
.des-card > .des-cartao { margin-top: auto; align-self: center; width: 132px; display: inline-flex; justify-content: center; text-align: center; font-size: 11.5px; padding: 3px 8px; }

/* Permissões organizadas como o menu (Perfis de Acesso e telas adicionais do usuário) */
.perm-grupos { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; margin-top: 6px; }
.perm-grupo { border: 1px solid #e1e5e6; border-top: 3px solid var(--cor, #255f85); border-radius: 8px; padding: 6px 10px 8px; background: #fff; }
.perm-grupo-tit { font-weight: 700; color: var(--cor, #255f85); font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.perm-secao { display: flex; gap: 6px; align-items: center; font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #8a8a8a; margin: 6px 0 2px; }
.perm-secao::after { content: ''; flex: 1; height: 1px; background: #e4e7e8; }
label.perm-item { display: flex; align-items: flex-start; gap: 6px; padding: 3px 0; margin: 0; }
label.perm-item input { margin-top: 3px; flex: none; width: auto; }
.perm-item b { font-weight: 600; }
.perm-item small { display: block; color: #6b6a5f; font-size: 11.5px; line-height: 1.3; font-weight: 400; }
.perm-item .selo-perfil { display: none; }
.perm-item.do-perfil .selo-perfil { display: inline-block; background: #e8f1f7; color: #255f85; }
.perm-item.do-perfil { opacity: .75; }
.perm-extras { border: 1px solid #e1e5e6; border-radius: 8px; padding: 8px 12px; margin: 6px 0; }
.perm-extras summary { cursor: pointer; font-weight: 600; }
.selo-extra { background: #fff3c4; color: #7a5b00; }

/* Perfis de Acesso: largura toda; os campos simples ficam numa largura confortável, as listas usam a tela inteira */
.cartao-perfil .form-vertical > label, .cartao-perfil .form-vertical > p.dica { max-width: 760px; }
.cartao-perfil .perm-grupos { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.cartao-perfil .lista-lojas { columns: 3 260px; }

/* Telas adicionais: alcance dos dados da tela (aparece quando a tela adicional está marcada) */
.perm-item select.perm-alcance { display: block; margin-top: 4px; width: 100%; max-width: 330px; font-size: 12px; padding: 3px 6px; border: 1px solid #c9d2d4; border-radius: 6px; background: #fffdf3; }
.perm-item select.perm-alcance[hidden] { display: none; }
.cartao-perfil .vend-perfil-ferramentas, .cartao-perfil .form-linha { max-width: 760px; }
.cartao-perfil .lista-vend-perfil { columns: 3 260px; }

/* Destaques: faixa do período em três partes; o aviso fica centralizado na largura da tela */
#des-barra { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }
#des-barra > .mc-mes-nav { justify-self: start; }
#des-barra > .des-nota { justify-self: center; margin: 0; text-align: center; max-width: 62vw; }
#des-barra > .des-nota:not(:empty) { background: #fff; border: 1px solid #e6cf8a; border-radius: 6px; padding: 4px 12px; color: #7a5b00; font-size: 12.5px; line-height: 1.35; }
#des-barra > .des-nota:not(:empty)::before { content: 'ⓘ '; font-weight: 700; }
#des-barra > .botao-ajuda { justify-self: end; grid-column: 3; }
@media (max-width: 900px) { #des-barra { grid-template-columns: 1fr auto; } #des-barra > .des-nota { grid-column: 1 / -1; grid-row: 2; max-width: none; } #des-barra > .botao-ajuda { grid-column: 2; grid-row: 1; } }
#des-barra > .des-nota { white-space: pre-line; }

/* Apuração de Campanhas: cards na largura toda, botões e "?" à direita, "Apurar Período" */
body.painel-incentivos #cards.mrg-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 1100px) { body.painel-incentivos #cards.mrg-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { body.painel-incentivos #cards.mrg-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mrg-aviso .inc-acoes .botao-ajuda { margin-left: 4px; }
.inc-acoes { align-items: center; }
.inc-apurar-caixa { position: relative; }
#inc-apurar { white-space: nowrap; }
.inc-apurar-pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; width: 340px; max-height: 440px; overflow: auto; background: #fff; border: 1px solid #d6dcde;
    border-radius: 8px; box-shadow: 0 8px 24px rgba(28, 37, 65, .18); padding: 10px; color: #1c2541; font-size: 13px; }
.inc-apurar-tit { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6b6a5f; margin: 6px 0 4px; }
.inc-apurar-lista { display: flex; flex-direction: column; gap: 2px; }
.inc-apurar-op { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; width: 100%; text-align: left; background: none; border: 1px solid transparent;
    border-radius: 6px; padding: 5px 8px; cursor: pointer; font: inherit; color: #1c2541; }
.inc-apurar-op small { color: #6b6a5f; white-space: nowrap; }
.inc-apurar-op:hover { background: #f3f7fa; }
.inc-apurar-op.ativo { background: #e8f1f7; border-color: #b9cfe0; }
.inc-apurar-datas { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.inc-apurar-datas input { padding: 4px 6px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; }
.inc-apurar-erro { display: block; color: #b5473f; min-height: 1em; margin-top: 4px; }
.inc-apurar-pop .dica { margin: 6px 0 0; font-size: 11.5px; }

/* Modo TV: ranking em duas colunas no topo, a corrida na largura toda, prêmios numa faixa discreta; tudo numa tela, sem rolagem */
.inc-tv { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto auto; height: 100vh; overflow: hidden; }
.inc-tv-rank2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 3vw; padding-top: 1.2vh; align-items: start; }
.inc-tv-rank2.uma { grid-template-columns: 1fr; }
.inc-tv-rank2 .inc-tv-tabela td { padding: .3em .5em; }
.inc-tv-rank2 .inc-tv-tabela td.inc-nome { max-width: 26vw; }
.inc-tv-corrida { display: flex; flex-direction: column; min-height: 0; padding-top: 1.2vh; }
.inc-tv-corrida h3 { margin: 0 0 .4vh; font-size: .7em; color: #e0b54a; text-transform: uppercase; letter-spacing: .06em; }
.inc-tv-corrida .inc-tv-grafico { flex: 1; min-height: 0; }
.inc-tv-premios-faixa { display: flex; gap: 2vw; font-size: .56em; color: #9fb3c8; border-top: 1px solid #22304a; padding: .7vh 0 .2vh; white-space: nowrap; overflow: hidden; }
.inc-tv-premios-faixa > span { overflow: hidden; text-overflow: ellipsis; }
.inc-tv-premios-faixa b { color: #e0b54a; font-weight: 600; }
.inc-tv-premios-faixa .inc-tv-tema { color: #6f819a; max-height: none; white-space: nowrap; flex: 1; }

/* Modo TV: logo em texto (sem imagem) fica no fundo da TV, com o texto e o traço em branco; logo em imagem continua no quadro branco */
.inc-tv-marca .marca:not(:has(img)) { background: transparent; padding: 0; box-shadow: none; }
.inc-tv-marca .marca:not(:has(img)) .marca-nome, .inc-tv-marca .marca:not(:has(img)) .marca-slogan { color: #fff; }
.inc-tv-marca .marca:not(:has(img)) .marca-slogan { border-left-color: #fff; }
.inc-tv-marca .marca-nome { font-size: 1.05em; }
.inc-tv-marca .marca-slogan { font-size: .8em; }

/* Modo TV: as duas colunas do ranking com as mesmas larguras e sem quebrar os valores */
.inc-tv-rank2 .inc-tv-tabela { table-layout: fixed; }
.inc-tv-rank2 .inc-tv-tabela th:nth-child(1) { width: 8%; }
.inc-tv-rank2 .inc-tv-tabela th:nth-child(3) { width: 24%; }
.inc-tv-rank2 .inc-tv-tabela th:nth-child(4) { width: 20%; }
.inc-tv-rank2 .inc-tv-tabela th:nth-child(5) { width: 13%; }
.inc-tv-tabela th, .inc-tv-tabela td.inc-valor, .inc-tv-tabela td.num { white-space: nowrap; }

/* Menu do topo: a tela aberta agora fica marcada no submenu */
.submenu-links a.atual { background: rgba(255, 255, 255, .1); box-shadow: inset 3px 0 0 #8fc1e0; }
.submenu-links a.atual b { color: #8fc1e0; }

/* Apurar Período: com o seletor de período dos filtros, o painel fica um pouco mais largo */
.inc-apurar-pop { width: 400px; max-height: 82vh; }
.inc-apurar-pop .periodo { margin-top: 2px; }
.inc-apurar-acoes { display: flex; justify-content: flex-end; margin-top: 8px; }

/* Análise Comercial: nome embaixo das colunas em no máximo 2 linhas (sem cortar), com espaço para a barra de rolagem horizontal */
.col-nome { font-size: calc(9px * var(--esc, 1)); line-height: 1.2; height: calc(9px * var(--esc, 1) * 2.4 + 5px); -webkit-line-clamp: 2; padding-top: 3px; }
.painel.foco .col-nome { font-size: calc(10.5px * var(--esc, 1)); height: calc(10.5px * var(--esc, 1) * 2.4 + 5px); }
.colunas-rolagem { padding-bottom: 14px; }

/* Destaques do Mês no celular/tablet em pé: 2 ou 3 cards por linha (deitado continua com a linha inteira) */
@media (orientation: portrait) and (max-width: 600px) { .des-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (orientation: portrait) and (min-width: 601px) and (max-width: 1024px) { .des-cards { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }

/* Cadastro de Campanhas: só o cadastro (lista, regras e prêmios); ranking, vencedores, corrida, apuração e modo TV ficam na Apuração de Campanhas */
body.painel-incentivos-cadastro #cards, body.painel-incentivos-cadastro .inc-apurar-caixa, body.painel-incentivos-cadastro #inc-tv,
body.painel-incentivos-cadastro .inc-grade > .painel:has(#t-inc-rank), body.painel-incentivos-cadastro .inc-grade > .painel:has(#t-inc-venc),
body.painel-incentivos-cadastro .inc-grade > .painel:has(#g-inc-corrida) { display: none !important; }
body.painel-incentivos-cadastro .inc-grade > .painel:has(#inc-regras) { grid-column: 1 / -1; height: auto; min-height: 260px; }

/* Cadastro de Campanhas: replicar para unidades */
.inc-repl-tab { width: 100%; }
.inc-repl-tab td { vertical-align: top; padding: 6px 8px; }
.inc-repl-tab input[type=text] { width: 100%; box-sizing: border-box; }
.inc-repl-tab input:disabled { opacity: .55; }

/* Cadastro de Campanhas: Marcar todos / Limpar nas listas do formulário */
.inc-sel-botoes { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.inc-sel-lista .exceto-dica { margin: 2px 0 6px; font-style: italic; }

/* Pop-up de erro (vermelho), acima de qualquer janela */
.erro-pop-fundo { position: fixed; inset: 0; z-index: 9000; background: rgba(28, 37, 65, .45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.erro-pop { background: #fff; border: 2px solid #b5473f; border-radius: 10px; box-shadow: 0 12px 40px rgba(0, 0, 0, .3); max-width: 460px; width: 100%; overflow: hidden; }
.erro-pop-tit { background: #b5473f; color: #fff; font-weight: 700; padding: 10px 16px; font-size: 15px; }
.erro-pop-txt { margin: 0; padding: 16px; color: #8c2f28; font-size: 14px; line-height: 1.45; white-space: pre-line; }
.erro-pop-acoes { display: flex; justify-content: flex-end; padding: 0 16px 14px; }
.erro-pop-acoes .botao { background: #b5473f; border-color: #b5473f; color: #fff; min-width: 80px; }
.msg.erro { background: #f8e5e3; color: #8c2f28; border: 1px solid #e9bdb8; }

/* ================= Pós Venda */
body.painel-posvenda [hidden], body.painel-posvenda-analise [hidden], .pv-modal [hidden] { display: none !important; }
.ajuda-pop { z-index: 3600; }
.pv-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)) auto; gap: 8px; align-items: stretch; }
.mrg-cards:has(.pv-cards-ajuda) { grid-template-columns: repeat(8, minmax(0, 1fr)) auto; }
.pv-cards-ajuda { align-self: start; }
@media (max-width: 1300px) { .pv-cards, .mrg-cards:has(.pv-cards-ajuda) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .pv-cards, .mrg-cards:has(.pv-cards-ajuda) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.card.pv-card-alerta { border-top-color: #8a4f7d; }
.card.pv-card-alerta .card-valor { color: #8a4f7d; }
body.pagina-comercial.painel-posvenda > .comercial-grade.pv-grade { grid-template-rows: none; grid-auto-rows: auto; overflow: auto; align-content: start; }
.pv-grade .pv-lista-painel { min-height: 420px; height: calc(100vh - 250px); }
.pv-grade .pv-pend-painel > .tabela-rolagem { overflow: auto; }
.pv-tabela td, .pv-tabela th { white-space: nowrap; }
.pv-tabela th.txt, .pv-tabela td.txt { text-align: left; }
.pv-tabela td.pv-cli { max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.pv-tabela tr.clicavel { cursor: pointer; }
.pv-tabela tr.clicavel:hover td { background: #f3f6f7; }
.pv-novo { padding: 2px 12px; font-size: calc(12px * var(--esc, 1)); background: #fff; color: #1c2541; border-color: #fff; }
.pv-selo { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 11.5px; font-weight: 600; color: #fff; background: var(--c); white-space: nowrap; }
.pv-pri { display: inline-block; padding: 0 7px; border-radius: 4px; font-size: 11.5px; font-weight: 600; color: var(--c); border: 1px solid var(--c); white-space: nowrap; }
.pv-modal { width: min(980px, 96vw); max-height: 92vh; display: flex; flex-direction: column; }
.pv-modal-acao { width: min(640px, 96vw); }
.pv-modal .arq-cartao-topo { gap: 10px; }
.pv-modal .arq-cartao-topo > b { flex: 1; }
.pv-corpo { overflow: auto; padding: 4px 2px 8px; flex: 1; min-height: 0; }
.pv-busca-venda { display: flex; gap: 8px; margin: 8px 0; }
.pv-busca-venda input { flex: 1; padding: 6px 10px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; font-size: 15px; }
.pv-vendas { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.pv-venda { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border: 1px solid #dde3e4; border-radius: 8px; cursor: pointer; font-size: 13px; }
.pv-venda:has(input:checked) { border-color: #255f85; background: #eef4f8; }
.pv-itens { display: flex; flex-direction: column; gap: 3px; max-height: 190px; overflow: auto; padding: 6px 8px; border: 1px solid #e3e8e8; border-radius: 6px; font-size: 12.5px; }
.pv-anexos-campo { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.pv-anexar { align-self: flex-start; position: relative; overflow: hidden; cursor: pointer; }
.pv-anexar input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.pv-anexos-escolhidos { display: flex; flex-wrap: wrap; gap: 6px; }
.pv-anexo-chip { background: #eef1f1; border-radius: 12px; padding: 2px 4px 2px 10px; font-size: 12px; }
.pv-anexo-chip button { border: 0; background: none; cursor: pointer; color: #b5473f; font-weight: 700; }
.pv-progresso { flex: 1; font-size: 12.5px; color: #255f85; align-self: center; }
.pv-info { display: grid; grid-template-columns: 170px 1fr; gap: 4px 12px; margin: 6px 0 10px; font-size: 13px; }
.pv-info dt { color: #6b6a5f; font-weight: 600; }
.pv-info dd { margin: 0; white-space: pre-line; }
.pv-itens-lista { margin: 0; padding-left: 18px; }
.pv-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid #e3e8e8; border-bottom: 1px solid #e3e8e8; }
.pv-acoes .botao-ajuda { margin-left: auto; color: #255f85; }
.botao.pv-perigo { color: #b5473f; border-color: #e1b7b2; }
.pv-aviso-pend { background: #f5edf3; border: 1px solid #dcc3d5; color: #5e3556; border-radius: 6px; padding: 8px 12px; font-size: 13px; margin: 4px 0 8px; }
.pv-hist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pv-ev { border: 1px solid #e3e8e8; border-left: 4px solid #255f85; border-radius: 6px; padding: 7px 10px; background: #fff; }
.pv-ev-contato { border-left-color: #2e7d5b; }
.pv-ev-pedido_final, .pv-ev-pedido_cancel { border-left-color: #8a4f7d; }
.pv-ev-aprovado_final, .pv-ev-finalizado { border-left-color: #2f7d4f; background: #f3f8f4; }
.pv-ev-reprovado_final, .pv-ev-reprovado_cancel, .pv-ev-aprovado_cancel, .pv-ev-cancelado { border-left-color: #b5473f; }
.pv-ev-topo { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12.5px; }
.pv-ev-topo span { color: #6b6a5f; }
.pv-ev-st { margin-top: 4px; font-size: 12px; }
.pv-ev-txt { margin: 5px 0 0; white-space: pre-line; font-size: 13px; }
.pv-anexos { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.pv-anexo { margin: 0; width: 180px; border: 1px solid #e3e8e8; border-radius: 6px; overflow: hidden; background: #f7f9f9; }
.pv-anexo img, .pv-anexo video { display: block; width: 100%; height: 120px; object-fit: cover; background: #222; }
.pv-anexo .pv-anexo-pdf { display: flex; align-items: center; justify-content: center; height: 120px; font-size: 22px; text-decoration: none; color: #b5473f; }
.pv-anexo figcaption { display: flex; gap: 6px; align-items: center; padding: 3px 6px; font-size: 11px; }
.pv-anexo figcaption span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-anexo-baixar { text-decoration: none; font-weight: 700; color: #255f85; }
.pv-decisao { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
body.pagina-comercial.painel-posvenda-analise > .comercial-grade.pva-grade { grid-template-rows: none; grid-auto-rows: 330px; overflow: auto; align-content: start; }
.pva-meses { overflow: hidden; }
.pva-barras { display: flex; flex-direction: column; gap: 7px; padding: 10px 14px; overflow: auto; }
.pva-barra { display: grid; grid-template-columns: minmax(110px, 38%) 1fr auto; gap: 8px; align-items: center; font-size: 12px; }
.pva-barra-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pva-barra-trilho { height: 12px; background: #eef1f1; border-radius: 6px; overflow: hidden; }
.pva-barra-trilho i { display: block; height: 100%; border-radius: 6px; }
.pva-barra b { font-size: 11.5px; white-space: nowrap; }
.pva-grade .tabela td.pva-nome { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 700px) {
    .pv-info { grid-template-columns: 1fr; gap: 0 0; }
    .pv-info dt { margin-top: 6px; }
    .pv-anexo { width: calc(50% - 4px); }
    .pv-grade .pv-lista-painel { height: auto; }
}

/* Menu em mosaico: até 9 botões por linha (Início e menu ☰) */
.mosaico-blocos { grid-template-columns: repeat(auto-fill, 112px); gap: 12px; max-width: calc(9 * 112px + 8 * 12px); }
.mosaico-bloco { width: 112px; height: 112px; gap: 9px; border-radius: 9px; }
.mosaico-icone svg { width: 42px; height: 42px; }
.mosaico-nome { font-size: calc(12.5px * var(--esc, 1)); padding: 0 6px; }
.mosaico-bloco.fixo { width: 112px; height: 112px; }
.mosaico.sobreposto .mosaico-janela { max-width: calc(9 * 112px + 8 * 12px + 44px); }
.mosaico.sobreposto .mosaico-blocos { max-width: none; justify-content: center; }
@media (max-width: 700px) {
    .mosaico-blocos { grid-template-columns: repeat(auto-fill, 100px); gap: 10px; }
    .mosaico-bloco, .mosaico-bloco.fixo, .submenu-lado .mosaico-bloco { width: 100px; height: 100px; }
    .mosaico-icone svg { width: 36px; height: 36px; }
    .mosaico-nome { font-size: calc(11.5px * var(--esc, 1)); }
}

.mosaico-cabeca-acoes { display: flex; align-items: center; gap: 8px; }
.mosaico-inicio { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; background: #4a5a7a; color: #fff; text-decoration: none; font-weight: 700; font-size: calc(13px * var(--esc, 1)); }
.mosaico-inicio svg { width: 18px; height: 18px; }
.mosaico-inicio:hover { background: #255f85; }

/* Menu em mosaico: os botões crescem com a tela, 9 por linha (6 em telas médias, 3 no celular) */
.mosaico-blocos { grid-template-columns: repeat(9, minmax(0, 1fr)); gap: clamp(8px, 0.9vw, 16px); max-width: none; justify-content: stretch; }
.mosaico-blocos > .mosaico-bloco { width: auto; height: auto; aspect-ratio: 1 / 1; gap: clamp(6px, 0.7vw, 14px); border-radius: 10px; }
.mosaico-blocos .mosaico-icone svg { width: clamp(34px, 3.3vw, 64px); height: clamp(34px, 3.3vw, 64px); }
.mosaico-blocos .mosaico-nome { font-size: clamp(11.5px, 0.95vw, 16px); padding: 0 8px; }
.mosaico-bloco.fixo { width: 130px; height: 130px; }
.mosaico.sobreposto .mosaico-janela { max-width: min(1500px, 100%); }
@media (max-width: 1100px) { .mosaico-blocos { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 700px) {
    .mosaico-blocos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .mosaico-blocos .mosaico-icone svg { width: 36px; height: 36px; }
    .mosaico-blocos .mosaico-nome { font-size: 12px; }
    .mosaico-bloco.fixo, .submenu-lado .mosaico-bloco { width: 100px; height: 100px; }
}

/* Pós Venda: localizar a venda no Novo Chamado (compacto) */
.pv-bv { background: linear-gradient(180deg, #f7f9fa, #eef2f4); border: 1px solid #dde3e4; border-radius: 10px; padding: 10px 14px 10px; }
.pv-bv-topo { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.pv-bv-topo b { color: #1c2541; font-size: 13.5px; letter-spacing: .2px; }
.pv-bv-topo small { color: #939082; font-size: 11.5px; flex: 1; }
.pv-bv-topo .botao-ajuda { color: #255f85; }
.pv-bv-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; }
.pv-bv-campo { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pv-bv-campo > span { font-size: 10.5px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: #6b6a5f; }
.pv-bv-campo input { width: 100%; box-sizing: border-box; padding: 6px 9px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; font-size: 13px; background: #fff; color: #1f2430; }
.pv-bv-campo input:focus { outline: none; border-color: #255f85; box-shadow: 0 0 0 3px rgba(37, 95, 133, .15); }
.pv-bv-periodo { grid-row: span 2; }
.pv-bv-datas { display: flex; align-items: center; gap: 6px; }
.pv-bv-datas input { flex: 1; min-width: 0; }
.pv-bv-datas i { font-style: normal; color: #939082; font-size: 12px; }
.pv-bv-atalhos { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 4px; }
.pv-bv-atalhos button { border: 1px solid #c9d2d4; background: #fff; color: #255f85; border-radius: 12px; padding: 2px 10px; font: inherit; font-size: 11.5px; cursor: pointer; }
.pv-bv-atalhos button:hover { background: #255f85; border-color: #255f85; color: #fff; }
.pv-bv-rodape { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.pv-bv-rodape small { flex: 1; font-size: 11.5px; }
.pv-bv-res { margin-top: 10px; }
.pv-bv-res[hidden], .pv-bv[hidden], .pv-bv-escolhida[hidden] { display: none !important; }
.pv-bv-cont { font-size: 12px; color: #6b6a5f; margin: 0 2px 6px; }
.pv-bv-cont b { color: #1c2541; }
.pv-bv-rolagem { max-height: 290px; overflow: auto; border: 1px solid #e3e8e8; border-radius: 8px; background: #fff; }
.pv-bv-tabela { font-size: 12.5px; }
.pv-bv-tabela td.pv-bv-loja { max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.pv-bv-tabela tbody tr.clicavel:hover td { background: #eef4f8; }
.pv-bv-tem { color: #8a4f7d; font-weight: 700; font-size: 11.5px; white-space: nowrap; }
.pv-bv-vazio { margin: 0; padding: 14px; text-align: center; color: #6b6a5f; background: #fff; border: 1px dashed #c9d2d4; border-radius: 8px; font-size: 13px; }
.pv-bv-escolhida { display: flex; align-items: center; gap: 12px; background: #eef4f8; border: 1px solid #c8d9e5; border-left: 4px solid #255f85; border-radius: 8px; padding: 8px 12px; margin-bottom: 10px; }
.pv-bv-escolhida > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.pv-bv-escolhida small { color: #4a5a7a; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-bv-icone { font-size: 20px; }
@media (max-width: 760px) {
    .pv-bv-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pv-bv-periodo { grid-column: 1 / -1; grid-row: auto; }
    .pv-bv-rodape { flex-wrap: wrap; }
    .pv-bv-rodape small { flex-basis: 100%; }
}

/* Pós Venda: cards ocupam a largura toda (o "?" fica dentro do 1º card) */
body.painel-posvenda #cards.pv-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); width: 100%; box-sizing: border-box; }
body.painel-posvenda-analise #cards.mrg-cards { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); width: 100%; box-sizing: border-box; }
body.painel-posvenda #cards .card, body.painel-posvenda-analise #cards .card { position: relative; }
#cards .card > .pv-cards-ajuda { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; padding: 0; }
@media (max-width: 1300px) {
    body.painel-posvenda #cards.pv-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    body.painel-posvenda-analise #cards.mrg-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    body.painel-posvenda #cards.pv-cards, body.painel-posvenda-analise #cards.mrg-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.pv-bv-tabela td.pv-bv-nf { color: #255f85; font-weight: 600; }
.pv-bv-periodo { grid-row: auto; }
.pv-bv-periodo-cab { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.pv-bv-periodo-cab > span { font-size: 10.5px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: #6b6a5f; }
.pv-bv-periodo-cab .pv-bv-atalhos { margin: 0; gap: 3px; }
.pv-bv-periodo-cab .pv-bv-atalhos button { padding: 0 7px; font-size: 10.5px; line-height: 16px; }

/* Pós Venda: resultado da busca sem barras de rolagem (colunas fixas, nomes em até 2 linhas, páginas de 10) */
.pv-modal.pv-modal-novo { width: min(1240px, 97vw); }
.pv-bv-rolagem { max-height: none; overflow: visible; border: 1px solid #e3e8e8; border-radius: 8px; background: #fff; }
.pv-bv-tabela { table-layout: fixed; width: 100%; }
.pv-bv-tabela th, .pv-bv-tabela td { white-space: normal; overflow: hidden; vertical-align: middle; padding: 5px 7px; }
.pv-bv-2l { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.25; overflow-wrap: anywhere; }
.pv-bv-tabela thead th { position: static; }
.pv-bv-cont { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pv-bv-paginas { display: flex; gap: 4px; }
.pv-bv-paginas button { min-width: 28px; height: 26px; border: 1px solid #c9d2d4; background: #fff; color: #255f85; border-radius: 6px; font: inherit; font-size: 12px; cursor: pointer; }
.pv-bv-paginas button.ativo { background: #255f85; border-color: #255f85; color: #fff; font-weight: 700; }
.pv-bv-paginas button:hover:not(:disabled):not(.ativo) { background: #eef4f8; }
.pv-bv-paginas button:disabled { opacity: .4; cursor: default; }
.pv-bv-sem { color: #939082; font-style: italic; }

.pv-bv-tabela td.pv-bv-nf b { color: #255f85; }
.pv-bv-tabela td.pv-bv-nf small { color: #6b6a5f; font-size: 11px; font-weight: 600; }
.pv-bv-tabela td.pv-bv-nf .pv-bv-mais { color: #939082; font-size: 11px; }
/* Localizar a venda: 4 colunas (unidade de negócio e botões na grade) */
.pv-bv-grade { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pv-bv-campo select { width: 100%; box-sizing: border-box; padding: 6px 9px; border: 1px solid #c9d2d4; border-radius: 6px; font: inherit; font-size: 13px; background: #fff; color: #1f2430; }
.pv-bv-campo select:focus { outline: none; border-color: #255f85; box-shadow: 0 0 0 3px rgba(37, 95, 133, .15); }
.pv-bv-botoes { display: flex; align-items: flex-end; justify-content: flex-end; gap: 8px; }
.pv-bv-rodape { margin-top: 6px; }
@media (max-width: 760px) { .pv-bv-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pv-bv-botoes { grid-column: 1 / -1; } }
/* Localizar a venda: nº da venda e da NF estreitos (até 12 caracteres); grade de 24 colunas */
.pv-bv-grade { grid-template-columns: repeat(24, minmax(0, 1fr)); }
.pv-bv-grade > :nth-child(1) { grid-column: span 9; }
.pv-bv-grade > .pv-bv-curto { grid-column: span 3; }
.pv-bv-grade > .pv-bv-periodo { grid-column: span 9; }
.pv-bv-grade > :nth-child(5) { grid-column: span 7; }
.pv-bv-grade > :nth-child(6), .pv-bv-grade > :nth-child(7) { grid-column: span 6; }
.pv-bv-grade > .pv-bv-botoes { grid-column: span 5; }
.pv-bv-botoes .botao { white-space: nowrap; }
@media (max-width: 760px) { .pv-bv-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pv-bv-grade > * { grid-column: auto !important; } .pv-bv-grade > .pv-bv-periodo, .pv-bv-grade > .pv-bv-botoes { grid-column: 1 / -1 !important; } }
/* Pós Venda: "+ Novo Chamado" em evidência na barra da lista */
.painel-titulo .botao.pv-novo { background: #e8833a; border: 1px solid #f19a55; color: #fff; font-weight: 700; font-size: calc(13px * var(--esc, 1)); padding: 4px 16px; border-radius: 7px; letter-spacing: .2px;
    box-shadow: 0 0 0 3px rgba(232, 131, 58, .28), 0 2px 6px rgba(0, 0, 0, .25); }
.painel-titulo .botao.pv-novo:hover { background: #d46f25; box-shadow: 0 0 0 4px rgba(232, 131, 58, .38), 0 3px 8px rgba(0, 0, 0, .3); }
.painel-titulo .botao.pv-novo:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
/* "+ Novo Chamado": azul do sistema com contorno azul-claro da marca (no lugar do laranja) */
.painel-titulo .botao.pv-novo { background: #255f85; border: 1px solid #8fb3cc; color: #fff; box-shadow: 0 0 0 3px rgba(143, 179, 204, .30), 0 2px 6px rgba(0, 0, 0, .25); }
.painel-titulo .botao.pv-novo:hover { background: #2f74a1; border-color: #b8d0e0; box-shadow: 0 0 0 4px rgba(143, 179, 204, .42), 0 3px 8px rgba(0, 0, 0, .3); }
/* Localizar a venda: unidade de negócio 30% menor (grade de 48 colunas; a sobra vai para o período) */
.pv-bv-grade { grid-template-columns: repeat(48, minmax(0, 1fr)); }
.pv-bv-grade > :nth-child(1) { grid-column: span 13; }
.pv-bv-grade > .pv-bv-curto { grid-column: span 6; }
.pv-bv-grade > .pv-bv-periodo { grid-column: span 23; }
.pv-bv-grade > :nth-child(5) { grid-column: span 14; }
.pv-bv-grade > :nth-child(6), .pv-bv-grade > :nth-child(7) { grid-column: span 12; }
.pv-bv-grade > .pv-bv-botoes { grid-column: span 10; }
@media (max-width: 760px) { .pv-bv-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pv-bv-grade > * { grid-column: auto !important; } .pv-bv-grade > .pv-bv-periodo, .pv-bv-grade > .pv-bv-botoes { grid-column: 1 / -1 !important; } }

/* Calendário do Argus (campo de data com "Hoje" e "Limpar") */
.cal-campo { position: relative; display: flex; align-items: center; flex: 1; min-width: 0; background: #fff; border: 1px solid #c9d2d4; border-radius: 6px; }
.cal-campo:focus-within { border-color: #255f85; box-shadow: 0 0 0 3px rgba(37, 95, 133, .15); }
.cal-campo.invalida { border-color: #b5473f; box-shadow: 0 0 0 3px rgba(181, 71, 63, .12); }
.pv-bv-campo .cal-campo input { border: 0; box-shadow: none; flex: 1; min-width: 0; padding: 6px 4px 6px 9px; background: transparent; }
.pv-bv-campo .cal-campo input:focus { box-shadow: none; }
.cal-abrir { flex: none; border: 0; background: transparent; color: #255f85; padding: 4px 7px; cursor: pointer; display: inline-flex; align-items: center; border-radius: 5px; }
.cal-abrir:hover { background: #eef4f8; }
.cal-pop { position: fixed; z-index: 3700; width: 250px; background: #fff; border: 1px solid #dde3e4; border-top: 3px solid #255f85;
    border-radius: 10px; box-shadow: 0 10px 28px rgba(28, 37, 65, .25); padding: 10px; font-size: 13px; color: #1f2430; }

.cal-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.cal-topo b { color: #1c2541; font-size: 13.5px; }
.cal-nav { border: 0; background: transparent; color: #255f85; font-size: 18px; width: 28px; height: 28px; border-radius: 6px; cursor: pointer; }
.cal-nav:hover { background: #eef4f8; }
.cal-grade { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.cal-sem { font-size: 10.5px; font-weight: 700; color: #939082; padding: 3px 0; }
.cal-dia { border: 0; background: transparent; height: 29px; border-radius: 6px; font: inherit; font-size: 12.5px; color: #1f2430; cursor: pointer; }
.cal-dia:hover { background: #eef4f8; color: #255f85; }
.cal-dia.hoje { box-shadow: inset 0 0 0 1px #8fb3cc; color: #255f85; font-weight: 700; }
.cal-dia.sel { background: #255f85; color: #fff; font-weight: 700; }
.cal-rodape { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px solid #e3e8e8; }
.cal-rodape button { flex: 1; border-radius: 6px; padding: 5px 0; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.cal-hoje { background: #255f85; border: 1px solid #255f85; color: #fff; }
.cal-hoje:hover { background: #2f74a1; }
.cal-limpar { background: #fff; border: 1px solid #c9d2d4; color: #4a5a7a; }
.cal-limpar:hover { background: #f3f6f7; }
.pv-bv-atalhos button.ativo { background: #255f85; border-color: #255f85; color: #fff; }

/* ================= Celular (app Android): nada passa da largura da tela */
fieldset { min-width: 0; }
.form-vertical select, .form-vertical input:not([type=checkbox]):not([type=radio]) { max-width: 100%; box-sizing: border-box; }
.banco-grade > *, .uso-grade > * { min-width: 0; }
.uso-grade .cartao { overflow-x: auto; }
/* campanha de incentivo: o seletor não cresce com o nome mais longo */
.inc-escolha { min-width: 0; max-width: 100%; }
.inc-escolha select { min-width: 0; max-width: 100%; text-overflow: ellipsis; }
@media (max-width: 760px) {
    .inc-escolha { display: flex; align-items: center; gap: 6px; width: 100%; }
    .inc-escolha select { flex: 1; width: 100%; }
    /* tabelas soltas (fora de uma caixa com rolagem) rolam dentro delas mesmas */
    table.tabela-admin { display: block; overflow-x: auto; max-width: 100%; }
    /* painéis com a mesma margem dos cards */
    body > section.painel, .grade .painel { margin-left: 8px; margin-right: 8px; }
    .grade { padding-left: 0; padding-right: 0; }
    /* Campanhas de Promoção: barra do "Resultado da Campanha" compacta */
    .painel-titulo .painel-acoes { gap: 4px 6px; justify-content: center; }
    .painel-titulo .painel-acoes .separador, .painel-titulo .exportar-grupo > span:not([class]) { display: none; }
    .painel-titulo .painel-acoes > span:not([class]) { font-size: 11.5px; opacity: .85; }
    .painel-titulo .painel-acoes button:not(.botao-ajuda):not(.botao-foco) { padding: 2px 8px; font-size: 12px; }
    .painel-titulo .painel-acoes .so-sem-venda { font-size: 12px; }
    /* Pós Venda: os botões de situação quebram linha em vez de passar da tela */
    #pv-mostrar { flex-wrap: wrap; max-width: 100%; }
    .pv-lista-painel .painel-acoes { flex-wrap: wrap; justify-content: center; }
}
/* "?" com o mesmo visual em todas as barras (não vira um botão branco) */
.painel-titulo .painel-acoes button.botao-ajuda, .painel-titulo .exportar-grupo button.botao-ajuda { background: transparent; border: 0; box-shadow: none; padding: 0; color: inherit; }
/* Modo TV em tela baixa (celular deitado): letras menores para o ranking, a corrida e os prêmios caberem */
@media (max-height: 520px) {
    .inc-tv { font-size: clamp(11px, 3.4vh, 15px); padding: 1.2vh 2vw; }
    .inc-tv-titulo b { font-size: 1.35em; }
    .inc-tv-topo { padding-bottom: .8vh; }
    .inc-tv-rank2 { padding-top: .6vh; }
    .inc-tv-rank2 .inc-tv-tabela td { padding: .18em .4em; }
    .inc-tv-corrida { padding-top: .6vh; }
}
.inc-tv-corrida .inc-tv-grafico { overflow: hidden; }
@media (max-width: 760px) { .mrg-cards .card-valor { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } }

/* Curva ABC e Estoque: "Analisar por" (Venda ou NF Emitida) */
.base-analise { display: flex; flex-direction: column; gap: 6px; }
.base-op { display: flex; align-items: flex-start; gap: 8px; padding: 7px 10px; border: 1px solid #dde3e4; border-radius: 8px; cursor: pointer; background: #fff; }
.base-op:has(input:checked) { border-color: #255f85; background: #eef4f8; }
.base-op input { margin-top: 3px; accent-color: #255f85; }
.base-op b { display: block; color: #1c2541; font-size: 13px; }
.base-op small { display: block; color: #6b6a5f; font-size: 11.5px; line-height: 1.3; }
.aviso-info { margin: 0 20px 10px; padding: 8px 14px; border-radius: 6px; background: #eef4f8; color: #1c2541; border: 1px solid #c8d9e5; font-size: 12.5px; }
.aviso-info[hidden] { display: none; }
body > .aviso-info { flex: none; }
@media (max-width: 760px) { .aviso-info { margin: 0 8px 8px; } }

/* "Ignorar Venda/Faturamento entre Empresas do Grupo" na gaveta de filtros */
.sem-grupo-lista { margin: 6px 2px 0; font-size: 11.5px; line-height: 1.35; }
#g-sem-grupo .base-op { align-items: flex-start; }