/* ============================================
   Gestão — peças comuns (Shared/Gestao)
   ============================================
   Portado do gestao.css do marvin_blazor a 2026-10-06. As regras base (página, cartões, filtros,
   KPIs, painel lateral, ges-det-*) estão no listagens.css; aqui só o que a Gestão acrescenta:
   ranking (GesRanking), mini-indicadores e barra do detalhe, grelha do detalhe das vendas.
   Cores só pelas variáveis do MudBlazor, para o tema escuro funcionar sem mais nada. */

/* --- Ranking (Shared/Gestao/GesRanking) --- */
.ges-rk-grelha { display: grid; grid-template-columns: 26px minmax(120px, 1fr) 84px 118px 60px 64px; gap: 0 12px; align-items: center; }
.ges-rk-cab { padding: 8px 18px; border-bottom: 1px solid var(--mud-palette-lines-default); font-size: .68rem; font-weight: 700;
              text-transform: uppercase; letter-spacing: .04em; color: var(--mud-palette-text-secondary); }
.ges-rk-lista { max-height: 620px; overflow-y: auto; padding: 0 18px; }
.ges-rk-linha { row-gap: 4px; padding: 8px 0; border-bottom: 1px solid var(--mud-palette-lines-default); font-size: .85rem; cursor: pointer; }
.ges-rk-linha:hover { background: var(--mud-palette-action-default-hover); }
.ges-rk-linha:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: -2px; }
/* A linha é um <button> (teclado e leitores de ecrã): tirar-lhe o aspeto de botão. */
button.ges-rk-linha { width: 100%; border: 0; border-bottom: 1px solid var(--mud-palette-lines-default); background: transparent;
                      color: var(--mud-palette-text-primary); font: inherit; font-size: .85rem; text-align: left; margin: 0; }
.ges-rk-pos { text-align: right; font-size: .75rem; color: var(--mud-palette-text-disabled); }
.ges-rk-nome { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ges-rk-nome.indefinido { font-weight: 500; font-style: italic; color: var(--mud-palette-text-secondary); }
.ges-rk-cod { font-weight: 500; font-size: .75rem; color: var(--mud-palette-text-secondary); margin-right: 8px; }
.ges-rk-qtd, .ges-rk-pct { color: var(--mud-palette-text-secondary); }
.ges-rk-val { font-weight: 700; }
.ges-rk-barra { grid-column: 2 / 5; height: 6px; border-radius: 3px; background: var(--mud-palette-lines-default); overflow: hidden; }
.ges-rk-barra i { display: block; height: 100%; border-radius: 3px; background: var(--mud-palette-primary); }
.ges-rk-barra i.neg { background: var(--mud-palette-error); }
.ges-rk-meta { display: none; }
.ges-rk-rodape { padding: 12px 18px; border-top: 1px solid var(--mud-palette-lines-default); background: var(--mud-palette-background-gray);
                 border-radius: 0 0 12px 12px; font-size: .85rem; font-weight: 700; }
.ges-procura-rk { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px; border: 1px solid var(--mud-palette-lines-inputs);
                  border-radius: 8px; color: var(--mud-palette-text-secondary); }
.ges-procura-rk input { border: 0; outline: none; background: transparent; font: inherit; font-size: .82rem; width: 150px; color: var(--mud-palette-text-primary); }

/* Ranking sem quantidade e/ou sem variação */
.ges-rk-semqtd .ges-rk-grelha { grid-template-columns: 26px minmax(120px, 1fr) 118px 60px 64px; }
.ges-rk-semqtd .ges-rk-barra { grid-column: 2 / 4; }
.ges-rk-semvar .ges-rk-grelha { grid-template-columns: 26px minmax(120px, 1fr) 84px 118px 60px; }
.ges-rk-semvar.ges-rk-semqtd .ges-rk-grelha { grid-template-columns: 26px minmax(120px, 1fr) 118px 60px; }
.ges-rk-semvar .ges-rk-var { display: none; }

/* --- Detalhe: mini-indicadores, barra e grelha das vendas (data, documento, cliente, qtd, valor) --- */
.ges-mini-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 14px 22px; }
.ges-mini-kpis > div { background: var(--mud-palette-background-gray); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ges-mini-kpis .ges-kpi-valor { font-size: 1.1rem; }
.ges-det-barra { display: flex; align-items: center; gap: 8px; padding: 0 22px 10px; }
.ges-det-vnd { display: grid; grid-template-columns: 62px 120px minmax(0, 1fr) 54px 100px; gap: 2px 10px; align-items: baseline; }

@media (max-width: 700px) {
    .ges-rk-grelha, .ges-rk-semqtd .ges-rk-grelha, .ges-rk-semvar .ges-rk-grelha, .ges-rk-semvar.ges-rk-semqtd .ges-rk-grelha { grid-template-columns: 22px minmax(0, 1fr) auto; }
    .ges-rk-cab { display: none; }
    .ges-rk-qtd, .ges-rk-pct, .ges-rk-var { display: none; }
    .ges-rk-barra, .ges-rk-semqtd .ges-rk-barra { grid-column: 2 / 3; }
    .ges-rk-meta { display: block; text-align: right; font-size: .75rem; white-space: nowrap; }
    .ges-rk-lista { padding: 0 14px; max-height: none; }
    .ges-rk-rodape { padding: 12px 14px; }
    .ges-procura-rk input { width: 110px; }
    .ges-mini-kpis { padding: 12px 14px; gap: 8px; }
    .ges-det-barra { padding-left: 14px; padding-right: 14px; }
    .ges-det-vnd { grid-template-columns: 50px minmax(0, 1fr) 90px; }
    .ges-det-vnd .ges-det-doc, .ges-det-vnd .ges-det-qtd { display: none; }
}

/* Diferença de arredondamento entre os documentos (ao cêntimo) e a linha do ranking */
.ges-det-acerto { display: flex; align-items: baseline; gap: 12px; padding: 8px 22px; border-top: 1px dashed var(--mud-palette-lines-default);
                  font-size: .8rem; color: var(--mud-palette-text-secondary); font-style: italic; }
@media (max-width: 700px) { .ges-det-acerto { padding-left: 14px; padding-right: 14px; } }

/* Painel "Filtros" com campos de largura própria (pesquisa com código + nome): em linha, sem grelha. */
.ges-painel-filtros.ges-painel-linha { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; }