/* /Compartilhado/ComponentesCaviuna/CavAcoes.razor.rz.scp.css */
/*
    Três colunas por duas linhas, na mesma ordem do desktop:

        OK       Incluir   Alterar
        Excluir  Cancelar  Sair

    A ordem é copiada de propósito. Quem migrar do desktop não vai reaprender onde
    ficam os botões, e as duas versões vão conviver por um bom tempo.

    Grade, e não flex: com flex os botões teriam larguras diferentes conforme o texto,
    e "OK" ficaria um terço de "Cancelar". Em colunas iguais o conjunto fica alinhado
    e a posição de cada botão é sempre a mesma — que é o ponto de mantê-los visíveis.
*/

.cav-acoes[b-8vtf0e5oqq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-top: 8px;
}

/* Botão desabilitado com o texto legível. O padrão do MudBlazor apaga tanto que o
   rótulo some — e um botão que não dá para ler não ensina nada sobre por que ele
   está bloqueado, que é metade do motivo de ele continuar na tela. */
.cav-acoes[b-8vtf0e5oqq]  .mud-button-root.mud-button-disabled {
    color: var(--mud-palette-text-disabled);
    opacity: 1;
}

/*
    TEXTO MENOR — só aqui, não em todo CavBotao.

    Esta barra é o caso mais apertado do sistema: seis botões em três colunas iguais,
    e a coluna tem a largura do maior rótulo. Com o corpo padrão (13px, o mesmo dos
    campos) e o texto em caixa alta que o MudBlazor aplica, "CANCELAR" e "ALTERAR"
    ocupam quase toda a coluna — sobra pouco para o ícone e o conjunto fica espremido
    contra as bordas.

    12px devolve esse respiro sem prejudicar a leitura: são rótulos de uma palavra, já
    conhecidos de cor por quem opera, e a posição fixa de cada botão identifica mais
    que o texto. Um botão solto numa tela continua com os 13px de sempre — lá ele não
    disputa largura com mais cinco.

    O ícone acompanha para manter a proporção: com o texto em 12px e o ícone nos 1.1rem
    globais, ele passaria a pesar mais que o rótulo ao lado. 1rem mantém a relação que
    já existia entre os dois.
*/
.cav-acoes[b-8vtf0e5oqq]  .mud-button-root {
    font-size: .75rem;
}

.cav-acoes[b-8vtf0e5oqq]  .mud-icon-root {
    font-size: 1rem;
}

/* Numa janela estreita, duas colunas em vez de três — seis botões de 60px lado a lado
   viram texto cortado. */
@media (max-width: 520px) {
    .cav-acoes[b-8vtf0e5oqq] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* /Compartilhado/ComponentesCaviuna/CavBusca.razor.rz.scp.css */
/*
    Estilo do CavBusca.

    Estava numa tag <style> dentro do .razor, e por isso metade das regras não valia
    nada: o ::deep só é traduzido pelo compilador em arquivos .razor.css. Dentro de
    <style> ele ia cru para o navegador, que não conhece esse seletor e descartava a
    regra inteira. Aqui é CSS isolado de verdade — o mesmo caminho que o
    CavCampoTexto.razor.css já usa.
*/

.cav-busca[b-u7mswgfzn4] {
    min-width: 0;
}

/* Centrado, e não pelo topo: é isto que mantém os dois campos na mesma linha
   mesmo quando um deles tem rótulo e o outro não. */
.cav-busca-linha[b-u7mswgfzn4] {
    display: flex;
    align-items: center;
    /* Um vao pequeno, sem separador no meio.

       Existia um traco "–" entre os dois campos, para "0333 – Jose Paulo" se ler como
       uma informacao so. Saiu: com o rotulo agora no campo da descricao, o par ja se le
       junto, e o traco virava mais um elemento no meio de uma linha que precisa de
       largura. O vao de 4px basta para dizer que sao dois campos. */
    gap: 4px;
    min-width: 0;
}

/* O código tem poucos dígitos; o espaço é do nome, que é o que costuma faltar.
   O relative é a âncora da mensagem de erro flutuante. */
.cav-busca-codigo[b-u7mswgfzn4] {
    flex: 0 0 auto;
    position: relative;
}

.cav-busca-descricao[b-u7mswgfzn4] {
    flex: 1;
    min-width: 0;
}

/*
    A altura dos dois campos e a margem que os mantém na mesma linha NÃO estão aqui:
    são as mesmas de todo campo do sistema, e moram em wwwroot/css/campos-caviuna.css.
    Este componente participa delas pela classe "cav-campo-denso" no contêiner.
*/

/*
    A DESCRIÇÃO É INERTE. Só a lupa responde.

    pointer-events:none no NOSSO PRÓPRIO contêiner (.cav-busca-descricao, sem ::deep) —
    e não só num elemento interno do MudTextField — porque o clique tinha três caminhos
    até o foco: o próprio input, a área da borda em volta dele e o <label>, que por ser
    label do campo foca o input mesmo clicado longe dele. Bloquear a partir da NOSSA div
    cobre os três de uma vez, sem depender de acertar o nome exato da classe interna que
    o MudBlazor usa para envolver os três — o que se mostrou frágil: com a regra presa
    a ".mud-input-control", um clique ainda conseguia focar o campo e piscar o cursor,
    sinal de que aquela classe não é o limite real do controle nesta versão do MudBlazor.

    Depois disso a lupa precisa ser reativada explicitamente: ela está DENTRO do
    contêiner e herdaria o bloqueio. É o único ponto vivo aqui.

    Por que inerte, e não Disabled="true": o Disabled do MudBlazor desliga o campo
    inteiro, lupa incluída — e a lupa é o caminho de quem não sabe o código. O parâmetro
    Desabilitado continua existindo e desliga tudo de propósito, quando a tela está fora
    de edição.
*/
.cav-busca-descricao[b-u7mswgfzn4] {
    pointer-events: none;
}

.cav-busca-descricao[b-u7mswgfzn4]  .mud-input-adornment {
    pointer-events: auto;
    cursor: pointer;
}

/*
    O esmaecido é a parte que se comunica ANTES do clique.

    Fica no texto e na borda, nunca na lupa nem no rótulo: apagar a lupa seria mentir
    sobre o que funciona, e rótulo apagado só dificulta ler de qual campo é o nome.

    Não é o cinza de campo desabilitado (que vem com traço pontilhado em alguns
    navegadores e sugere "indisponível"): é o mesmo texto, com menos peso, dizendo
    "isto é resultado, não entrada".

    O text-overflow é o que corta com "…" em vez de sumir com o resto do nome. Funciona
    em <input> só quando ele não está focado — e este nunca está, por causa do
    pointer-events acima e do tabindex="-1". As duas coisas se sustentam juntas.

    caret-color:transparent é a REDE DE SEGURANÇA, não a regra principal: se algum
    caminho de foco que a gente não previu conseguir passar pelo pointer-events (um
    componente pai focando por código, por exemplo), o campo ainda assim não pisca
    cursor nenhum. Não substitui o bloqueio acima — sozinho ele não impediria digitar
    nem selecionar texto, só esconderia o "|".
*/
.cav-busca-descricao[b-u7mswgfzn4]  input {
    cursor: default;
    user-select: none;
    opacity: .62;
    text-overflow: ellipsis;
    caret-color: transparent;
}

.cav-busca-descricao[b-u7mswgfzn4]  .mud-input-outlined-border {
    opacity: .55;
}

/*
    O MudBlazor nao pode reservar espaco para a mensagem DELE.

    Com Error="true", ele monta o contentor da mensagem mesmo sem texto — e esse
    contentor tem margem propria:

        .mud-input-control-helper-container { overflow: hidden; margin-top: 3px }

    Como ele so existe no campo do CODIGO, a caixa desse campo fica 3px mais alta que a
    da descricao. Com align-items:center, o input do codigo sobe ~1,5px em relacao ao da
    descricao — o desnivel que aparece so quando ha erro.

    display:none resolve na raiz: quem mostra a mensagem e a nossa div, abaixo da linha
    inteira, onde o erro pertence — ele e do par, nao de um dos dois campos.
*/
.cav-busca[b-u7mswgfzn4]  .mud-input-control-helper-container {
    display: none;
}

/* A mensagem de erro do código: discreta, na largura toda do componente e no fluxo.
   O padding de 14px alinha o texto com o conteúdo do campo, e não com a borda. */
.cav-busca-erro[b-u7mswgfzn4] {
    padding: 2px 14px 0;
    font-size: .72rem;
    line-height: 1.2;
    color: var(--mud-palette-error);
}
/* /Compartilhado/ComponentesCaviuna/CavBuscaListaConteudo.razor.rz.scp.css */
/*
    Estilo do CavBuscaListaConteudo — o miolo da lupa.

    Isolado (::deep chega até a grade lá dentro), e não numa <style> solta: a mesma razão
    de sempre, ::deep só é traduzido em arquivo .razor.css.
*/

/*
    height:480px — FIXO, e declarado AQUI, não emprestado da casca em volta.

    Este componente entra em dois lugares diferentes: o MudDialog global (CavBuscaDialogo)
    e o diálogo local da JanelaFlutuante, que TAMBÉM hospeda o "tem certeza?" — um
    conteúdo bem menor, que não deve ganhar uma caixa vazia de 560px por baixo. Pedir a
    ambos que cooperem com uma altura combinada seria acoplar dois conteúdos que não têm
    nada a ver um com o outro. Trazendo a própria altura, este componente funciona igual
    nos dois lugares, e a casca em volta só precisa saber crescer até caber o que está
    dentro (display:flex; flex-direction:column basta, sem altura nenhuma declarada).

    480px é campo de procurar (~56px) + vão (10px) + a área da grade, que é o que sobra
    — praticamente os mesmos ~360px de grade que a lupa já tinha antes desta correção,
    só que agora com o rodapé (contagem + Sair) SEMPRE visível dentro desses 480px, em
    vez de disputar espaço com a rolagem.
*/
.busca-conteudo[b-zh7l9q1jom] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 480px;
    min-height: 0;
    min-width: 460px;
}

/*
    O MEIO — onde a grade mora, e a única parte que rola.

    flex:1 com min-height:0 é o que faz esta área ficar SÓ com o espaço que sobra depois
    do campo de procurar (que tem altura de conteúdo, fixa). O CavCampoTexto acima não
    precisa de flex nenhum: sem ele declarado, o flex padrão já é "não crescer, não
    encolher, tamanho do próprio conteúdo" — exatamente o que um campo precisa.
*/
.busca-grade-area[b-zh7l9q1jom] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/*
    Isto é o que faz o CavGrade (Altura="100%") realmente absorver o espaço da área
    acima, em vez de crescer com o número de linhas.

    ::deep > :first-child alcança a raiz do CavGrade — ".cav-grade" — sem precisar saber
    o nome dessa classe aqui (ela pertence ao CSS isolado DELE, não deste arquivo). É a
    MESMA receita de Lancamentos.razor.css (.lanc-lista ::deep > :first-child): o filho
    ganha "flex: 1 1 0" — cresce, encolhe, começa do zero — e não da altura do conteúdo.

    O min-height de 120px é o piso: numa caixa de diálogo pequena de mais, a grade nunca
    fica menor que isso, e quem cede é a rolagem da tela por trás, não a lupa.
*/
.busca-grade-area[b-zh7l9q1jom]  > :first-child {
    flex: 1 1 0;
    min-height: 120px;
}
/* /Compartilhado/ComponentesCaviuna/CavCampoData.razor.rz.scp.css */
/*
    Estilo do CavCampoData.

    Só o que é do PRÓPRIO contêiner. O que mexe no input nativo — a cor do ícone, a fonte,
    o aperto do texto — está em wwwroot/css/campos-caviuna.css, e não aqui: o CSS isolado
    do Blazor não alcança pseudo-elemento do WebKit através do ::deep. As regras
    compilavam e o navegador as ignorava.
*/

/* Referência de posicionamento para o campo dentro da linha do formulário. */
.cav-data[b-b532xbcrwc] {
    position: relative;
}
/* /Compartilhado/ComponentesCaviuna/CavCampoHora.razor.rz.scp.css */
/*
    Estilo do CavCampoHora.

    Existe por um motivo só: a mensagem de erro não cabe no campo.

    O campo tem 94px — a largura de "08:30" com o rótulo em repouso dentro dele. Qualquer
    frase embaixo quebra em três ou quatro linhas, e quatro linhas de texto vermelho sob
    um campo de quatro dígitos empurram o formulário inteiro para baixo a cada digitação.

    A saída é deixar a frase transbordar em UMA linha, para o lado. Precisa das duas
    regras: o nowrap para ela não quebrar, e o overflow no contêiner porque o MudBlazor
    põe overflow:hidden nele (.mud-input-control-helper-container) e a frase seria cortada
    no meio.

    Transbordar é seguro aqui porque os campos de hora andam em fila — início, fim e total
    — e embaixo deles não há mensagem nenhuma concorrendo pelo espaço. Não vale para um
    campo de hora sozinho no meio de um formulário em coluna: ali a frase passa por cima
    do que estiver à direita. Se isso aparecer, o caminho é a mensagem curta pelos
    parâmetros MensagemMaiorQue e MensagemMenorQue, não mexer nestas regras.
*/

.cav-hora[b-t1q65a9cu7]  .mud-input-control-helper-container {
    overflow: visible;
}

.cav-hora[b-t1q65a9cu7]  .mud-input-helper-text {
    white-space: nowrap;
}
/* /Compartilhado/ComponentesCaviuna/CavCampoTexto.razor.rz.scp.css */
/*
    Borda grafite no foco, em vez do azul padrão do MudBlazor.

    Este trecho estava duplicado dentro de uma tag <style> no Login.razor. Aqui ele
    é CSS isolado: só afeta este componente, não vaza para o resto do sistema.

    O ::deep é necessário porque a regra precisa alcançar o elemento que o MudBlazor
    renderiza dentro do nosso <div> — o CSS isolado, sozinho, não atravessa a
    fronteira de outro componente.
*/

.cav-campo[b-a8lktsb5il]  .mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: #3F3F46 !important;
}

.cav-campo[b-a8lktsb5il]  .mud-input-outlined.mud-focused .mud-input-label {
    color: #3F3F46;
}

/* Erro continua vermelho: a cor da marca não pode engolir o aviso de validação. */
.cav-campo[b-a8lktsb5il]  .mud-input-error.mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: var(--mud-palette-error) !important;
}

.cav-campo[b-a8lktsb5il]  .mud-input-error .mud-input-label {
    color: var(--mud-palette-error);
}
/* /Compartilhado/ComponentesCaviuna/CavDialogoConfirmacaoConteudo.razor.rz.scp.css */
/* Estilo do CavDialogoConfirmacaoConteudo — o mesmo desenho de rodapé do
   CavBuscaListaConteudo, para os dois diálogos parecerem parte do mesmo sistema. */
.confirmacao-acoes[b-jh4htra9jv] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 20px;
}
/* /Compartilhado/ComponentesCaviuna/CavGrade.razor.rz.scp.css */
/*
    Estilo do CavGrade.

    Estava numa tag <style> dentro do .razor, e ali DOZE regras não valiam nada: o
    ::deep só é traduzido pelo compilador em arquivos .razor.css. Dentro de <style> ele
    vai cru para o navegador, que não conhece o seletor e descarta a regra inteira.

    Ficavam sem efeito, entre outras: a borda e o arredondamento da tabela, o corpo de
    fonte do cabeçalho e das células, o corte com reticências, o destaque da linha
    selecionada e a altura das linhas.
*/

.cav-grade[b-kkswby959t] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/*
    A tabela absorve a altura que a tela der a grade.

    Sem as tres linhas de flex abaixo, passar Altura="100%" nao adianta: o MudBlazor
    escreve height:100% no contedor de rolagem, mas o pai dele — a raiz do MudDataGrid —
    nao tem altura definida, entao a porcentagem nao resolve e a tabela fica do tamanho
    do conteudo. O resultado e a grade esticada com a tabela pequena dentro e um vao
    embaixo. Com flex, a altura vem do flex e nao da porcentagem.
*/
.cav-grade[b-kkswby959t]  .cav-grade-tabela {
    border: 1px solid var(--mud-palette-lines-default);
    /* 4px, e nao 8: o desktop e quadrado; 4 aproxima sem ficar cru. */
    border-radius: 4px;
    overflow: hidden;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/*
    A TABELA pode ser mais larga que o contedor - e e isso que devolve a rolagem lateral.

    Antes, quem forcava a largura era um "min-width" repetido em cada celula. Isso dava
    rolagem, mas impedia o arrastar da divisoria de ENCOLHER a coluna, que e metade do
    que arrastar serve para fazer.

    Passando a exigencia para a tabela inteira, os dois voltam a conviver:

      width: max-content  - a tabela fica do tamanho que as colunas pedem;
      min-width: 100%     - mas nunca menor que o contedor, senao sobraria faixa vazia
                            a direita quando ha poucas colunas.

    Cada coluna continua livre para crescer e encolher no arrasto.
*/
/* Descendente, e NAO filho direto.
   
   O MudDataGrid insere um <div class="mud-drop-container"> entre o contedor de rolagem
   e a <table>:
   
       .mud-table-container > .mud-drop-container > table
   
   Com o ">" a regra nunca casava, e a tabela ficava no auto do navegador: presa a
   largura do contedor. Era por isso que arrastar uma coluna so espremia as vizinhas em
   vez de alargar a tabela, e por isso o arrasto parecia funcionar apenas com a janela
   larga o bastante para tudo caber. */
.cav-grade[b-kkswby959t]  .mud-table-container table {
    width: max-content;
    min-width: 100%;
}

.cav-grade[b-kkswby959t]  .cav-grade-tabela > .mud-table-container {
    flex: 1;
    min-height: 0;

    /* Declarado aqui, e nao herdado do MudBlazor: o wrapper acima tem overflow:hidden
       (para o arredondamento da borda nao vazar), entao se este nao rolar o conteudo
       simplesmente some cortado. E o "auto" precisa valer nos DOIS eixos - com mais
       colunas do que cabe, a lateral e obrigatoria. */
    overflow: auto;
}

/*
    O cabecalho segue a tela do desktop: caixa normal, nao MAIUSCULAS.

    O versalete do Material fica bonito num painel com poucas colunas e atrapalha aqui:
    "DURACAO" e "CLASSIFICACAO" ocupam bem mais largura que escritos normalmente, e
    largura e o recurso escasso numa grade de seis colunas. O fundo cinza faz o papel
    que as maiusculas faziam — separar cabecalho de dado.
*/
.cav-grade[b-kkswby959t]  thead th {
    font-weight: 600;
    font-size: .8rem;
    text-transform: none;
    letter-spacing: normal;
    white-space: nowrap;
    color: var(--mud-palette-text-primary);
    background-color: var(--mud-palette-background-grey);
}

.cav-grade[b-kkswby959t]  td {
    font-size: .8rem;
}

/*
    LINHAS DE GRADE nas duas direcoes.

    E o que mais aproxima do desktop, e nao e so estetica: com seis colunas de larguras
    diferentes, a linha vertical diz onde um dado termina e o outro comeca. Sem ela, uma
    descricao longa parece invadir a coluna vizinha.

    A ultima coluna nao leva borda a direita — ficaria duplicada com a borda da tabela.
*/
.cav-grade[b-kkswby959t]  th,
.cav-grade[b-kkswby959t]  td {
    border-right: 1px solid var(--mud-palette-lines-default);
}

.cav-grade[b-kkswby959t]  th:last-child,
.cav-grade[b-kkswby959t]  td:last-child {
    border-right: 0;
}

.cav-grade[b-kkswby959t]  tbody td {
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.cav-grade[b-kkswby959t]  thead th {
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

/* Corta com reticências em vez de quebrar a linha. O max-width em zero parece
   estranho, mas é o que faz o text-overflow funcionar dentro de uma célula de
   tabela — sem ele a célula cresce e empurra as vizinhas. */
.cav-grade[b-kkswby959t]  .cav-celula-cortada {
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* A linha selecionada precisa continuar legível: fundo suave e uma barra na
   lateral, em vez de inverter as cores e brigar com as listras. */
/* Cinza claro e mais nada.

   Era o primary-hover com uma barra grafite de 3px na lateral. Chamava atencao demais
   para uma lista em que a pessoa percorre linha a linha com a seta: a cada tecla o olho
   era puxado por um bloco colorido. Cinza diz "e esta" sem competir com o dado.

   Cinza NEUTRO, e nao a variavel background-grey: aquela e praticamente a mesma cor que
   o MudBlazor usa no hover, e as duas juntas deixavam impossivel saber se a linha estava
   selecionada ou so debaixo do mouse. Esta e um pouco mais escura, de proposito.

   Nao e cor de marca - por isso nao vem do TemaCaviuna. E um veu neutro, que funciona
   sobre qualquer fundo.

   O !important e necessario porque o hover do MudBlazor tem seletor mais especifico. */
.cav-grade[b-kkswby959t]  .cav-linha-selecionada > td {
    background-color: rgba(0, 0, 0, .09) !important;
}

.cav-grade[b-kkswby959t]  tbody tr {
    cursor: pointer;
}

/* ── Altura das linhas ─────────────────────────────────────────────────
   Compacta, sempre. Existiu um menu para o usuario escolher entre compacta, normal e
   confortavel; saiu porque ninguem precisa escolher isso: o sistema e de operador que
   passa o dia percorrendo lista, e nesse uso mais linhas a vista sempre ganham.
   Escolha que so tem uma resposta certa nao e escolha, e opcao a mais na tela. */
/*
    O seletor e longo de proposito — precisa GANHAR do MudBlazor.

    O padrao dele para tabela densa e:

        .mud-table-dense * .mud-table-row .mud-table-cell
        { padding: 6px 24px 6px 16px; padding-inline-start: 16px; padding-inline-end: 24px }

    Sao TRES classes. Um seletor curto como ".cav-grade ::deep td" tem duas (a classe
    mais a marca de escopo) e perde — foi o que aconteceu aqui por duas rodadas: a regra
    existia, estava viva, e a grade continuava com os 6px do MudBlazor.

    Espelhando ".mud-table-row .mud-table-cell" e somando o escopo, sao quatro. Ganha.

    O padding_inline vai junto porque o MudBlazor tambem declara a versao logica; deixar
    so a fisica e pedir para uma das duas sobrar por engano.

    Vertical em 2px: quase toda a altura restante da linha e o proprio texto.

    Horizontal em 5px, e nao os 16/24 do MudBlazor. Aqueles sao de tela de leitura, com
    poucas colunas largas; aqui sao nove colunas competindo por largura, e 40px por
    celula so de recheio empurrava cliente e descricao para fora da vista. Com 5px o
    conteudo cabe, e quem separa uma coluna da outra passa a ser a linha de grade.
*/
.cav-grade[b-kkswby959t]  .mud-table-row .mud-table-cell {
    padding: 2px 5px;
    padding-inline-start: 5px;
    padding-inline-end: 5px;
}

.cav-grade-vazia[b-kkswby959t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 36px 16px;
}

.cav-grade-rodape[b-kkswby959t] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 4px 0;
    color: var(--mud-palette-text-secondary);
}

.cav-grade-rodape-extra[b-kkswby959t] {
    margin-left: auto;
}

/*
    O PUXADOR da divisoria.

    Injetado pelo grade.js dentro de cada <th>, e nao montado no markup: por HeaderTemplate
    perderiamos o clique de ordenar que o MudDataGrid ja entrega pronto.

    6px de largura, metade para cada lado da borda: mais estreito que isso e dificil de
    pegar com o mouse, mais largo comeca a roubar o clique do titulo.
*/
.cav-grade[b-kkswby959t]  thead th {
    position: relative;
}

.cav-grade[b-kkswby959t]  .cav-puxador {
    position: absolute;
    top: 0;
    right: -3px;
    width: 6px;
    height: 100%;
    cursor: col-resize;
    z-index: 2;

    /* Invisivel ate o mouse chegar perto: linha de grade ja existe ali, e duas linhas
       coladas so poluiriam o cabecalho. */
    background: transparent;
}

.cav-grade[b-kkswby959t]  .cav-puxador:hover {
    background: var(--mud-palette-primary);
    opacity: .35;
}

/* ────────────────────────────────── O menu do clique direito ──── */

/* O menu é posicionado por coordenada, no ponto do clique — ver AbrirMenuDeExportacao.
   z-index alto porque ele precisa passar por cima da janela flutuante, que já empilha. */
.cav-grade-menu[b-kkswby959t] {
    z-index: 2400;
}

.cav-grade-menu-item[b-kkswby959t] {
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

/* O véu que fecha o menu no próximo clique. Invisível de propósito: ele não deve
   escurecer nada, só capturar o clique — um menu de contexto que escurece a tela
   parece diálogo, e diálogo pede decisão. */
.cav-grade-veu[b-kkswby959t] {
    position: fixed;
    inset: 0;
    z-index: 2399;
}
/* /Compartilhado/ComponentesCaviuna/Exportacao/CavExportarConteudo.razor.rz.scp.css */
/*
    O diálogo de exportação: o resumo, a lista de colunas e a barra de botões.

    O TÍTULO NÃO MORA AQUI — quem o desenha é a moldura (a barra da janela flutuante ou o
    TitleContent do CavExportarDialogo). Ver a nota no topo do .razor.
*/

.cav-exportar[b-evtpk45onh] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    /* LARGURA DECLARADA, e não "o que o conteúdo pedir".

       A caixa da janela flutuante não impõe largura nenhuma (ver .jan-dialogo-caixa, em
       JanelaFlutuante.razor): ela se ajusta ao conteúdo. Sem este mínimo, a grade de
       colunas abaixo colapsava para UMA coluna e a caixa saía alta e estreita — dez
       marcas empilhadas, com o botão Exportar lá embaixo fora da vista.

       Mínimo e máximo em vez de largura fixa: no diálogo global o MudDialog já dá a
       largura (MaxWidth.Small), e uma largura fixa aqui brigaria com ela. */
    min-width: 420px;
    max-width: 100%;
}

/* O resumo: o selo do formato e as duas linhas de texto ao lado. */
.cav-exportar-resumo[b-evtpk45onh] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* O ícone num quadrado de fundo suave, em vez de solto sobre o branco.

   Solto, ele ficava com o mesmo peso visual de um ícone de botão e não parecia parte do
   cabeçalho. O quadrado o transforma no ponto de partida da leitura — é o primeiro
   elemento da caixa, e diz o formato antes de qualquer palavra. */
.cav-exportar-selo[b-evtpk45onh] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 10px;
}

/* As duas cores são as do PRÓPRIO formato — o vermelho do Acrobat e o verde do Excel —,
   e por isso não saem da paleta da marca: aqui elas não representam a Caviúna, e sim o
   arquivo que a pessoa vai receber. É o único lugar do sistema onde isso vale.

   O fundo é a mesma cor a 12%, para o quadrado acompanhar o ícone sem competir com ele. */
.cav-exportar-selo-pdf[b-evtpk45onh] {
    background: rgba(198, 40, 40, .12);
    color: #c62828;
}

.cav-exportar-selo-excel[b-evtpk45onh] {
    background: rgba(29, 111, 66, .12);
    color: #1d6f42;
}

.cav-exportar-resumo-texto[b-evtpk45onh] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* A linha "Colunas · 9 de 9 · Todas Nenhuma".

   O contador fica colado no rótulo, e os atalhos vão para a direita: as duas coisas se
   leem juntas ("Colunas, 9 de 9"), enquanto os botões são ação e pertencem à borda. */
.cav-exportar-titulo-secao[b-evtpk45onh] {
    display: flex;
    align-items: center;
    gap: 8px;
    border-top: 1px solid var(--mud-palette-lines-default);
    padding-top: 12px;
}

.cav-exportar-rotulo[b-evtpk45onh] {
    font-weight: 600;
    font-size: .8125rem;
}

/* O contador em pílula: ele MUDA a cada clique, e um número que muda solto no meio do
   texto passa despercebido. A pílula lhe dá borda própria, então o olho o encontra. */
.cav-exportar-contador[b-evtpk45onh] {
    font-size: .75rem;
    line-height: 1;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-secondary);
}

.cav-exportar-atalhos[b-evtpk45onh] {
    display: flex;
    gap: 2px;
    margin-left: auto;
}

/* Duas colunas de marcas: dez campos empilhados viram uma lista alta demais para caber
   sem rolagem, e a rolagem esconde metade das opções. */
.cav-exportar-lista[b-evtpk45onh] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 2px 12px;
    /* Teto com rolagem: quinze colunas não podem empurrar os botões para fora da tela. */
    max-height: 280px;
    overflow-y: auto;
    /* Respiro à direita para a barra de rolagem não encostar no texto quando ela aparece. */
    padding-right: 4px;
}

/* A LINHA INTEIRA É O ALVO DO CLIQUE.

   É um <label> em volta da marca e do texto: clicar em qualquer ponto da linha alterna a
   coluna. Sem isso o alvo era o quadradinho de 18px, dez vezes seguidas, numa lista que
   se percorre depressa.

   O padding e o cantinho arredondado existem para o realce do hover ter forma; sem eles
   o fundo mudaria numa faixa colada na linha de cima e na de baixo. */
.cav-exportar-item[b-evtpk45onh] {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 1px 8px 1px 2px;
    border-radius: 6px;
    cursor: pointer;
    user-select: none;
    transition: background-color .12s ease;
}

.cav-exportar-item:hover[b-evtpk45onh] {
    background: var(--mud-palette-action-default-hover);
}

.cav-exportar-item-texto[b-evtpk45onh] {
    font-size: .8125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* A coluna DESMARCADA é que muda de cor, não a marcada.

   Parece invertido, mas é o certo: quase sempre tudo está marcado, então destacar o
   marcado pintaria a lista inteira e não diria nada. Apagando o que sai do arquivo, as
   exceções é que saltam — e são elas que a pessoa quer conferir antes de exportar. */
.cav-exportar-item:not(.cav-exportar-item-marcado) .cav-exportar-item-texto[b-evtpk45onh] {
    color: var(--mud-palette-text-disabled);
    text-decoration: line-through;
}

.cav-exportar-rodape[b-evtpk45onh] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid var(--mud-palette-lines-default);
    padding-top: 12px;
}

/* Numa janela flutuante estreita a caixa não pode exigir os 420px: melhor uma coluna só
   de marcas do que um diálogo mais largo que a janela que o contém. */
@media (max-width: 520px) {
    .cav-exportar[b-evtpk45onh] {
        min-width: 0;
    }
}
/* /Modulos/Campo/Telas/Confinamento/Confinamento.razor.rz.scp.css */
.section-load[b-km2ayo29ms] {
    animation: confSlideIn-b-km2ayo29ms 0.42s ease-out both;
}

@keyframes confSlideIn-b-km2ayo29ms {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Modulos/Gerencial/Telas/Interno/CartaoPonto/Pontos.razor.rz.scp.css */
/*
    Estilo da tela Cartão ponto.

    Espelha o Lancamentos.razor.css de propósito: as duas telas têm o mesmo arranjo
    (lista + Consultar de um lado, formulário + ações do outro), e a cadeia de alturas
    que faz isso funcionar dentro de uma janela flutuante é a mesma. Divergir aqui só
    criaria duas soluções para o mesmo problema.

    Em arquivo próprio, e não numa tag <style> dentro do .razor: é a convenção da pasta
    de componentes, e <style> dentro do .razor injeta um elemento no meio do markup
    renderizado — o que já quebrou um seletor de posição na tela de lançamentos — além
    de não traduzir ::deep.
*/

/* A TELA PREENCHE A JANELA, em vez de a janela ser cortada no tamanho da tela: a
   janela dá a altura, o corpo estica, a grade fica com o que sobra depois do
   Consultar. Nenhuma conta para manter. */
.ponto-tela[b-kbv5wf6hoz] {
    display: flex;
    flex-direction: column;
    /* height, e não min-height: é o que torna a altura DEFINIDA para quem está dentro.
       Com min-height a altura fica indefinida, o "100%" da grade vira "auto" (ou seja,
       o tamanho do conteúdo) e ela volta a crescer com o número de linhas. */
    height: 100%;
    min-width: 0;
}

/* 70/30, e não meio a meio: onde tem grade, a grade é o assunto da tela. O formulário
   se preenche de vez em quando; a lista se percorre o tempo todo, e cada coluna a mais
   visível poupa uma rolagem horizontal.

   Piso nas DUAS colunas: 680 é o que a caixa Consultar precisa — as três colunas de
   200 + os dois vãos de 16 + o recheio do CavGrupo. 300 é o piso do formulário: a linha das horas tem três campos de 94px que
   não quebram, e o par código+descrição do CavBusca precisa de largura parecida para
   mostrar um nome inteiro.

   Abaixo desses pisos o conteúdo transborda e a JANELA rola na horizontal — que é o
   comportamento certo: melhor rolar do que ler campo cortado. */
.ponto-corpo[b-kbv5wf6hoz] {
    display: grid;
    grid-template-columns: minmax(680px, 7fr) minmax(300px, 3fr);
    gap: 14px;
    /* stretch, e não start: é o que faz as duas colunas terminarem na mesma linha
       embaixo, em vez de cada uma parar onde o próprio conteúdo acabou. */
    align-items: stretch;
    /* 1 1 auto + min-height 0: a altura vem da JANELA, não do conteúdo. Com shrink 0 a
       altura viria do conteúdo, e altura indefinida faz o "100%" da grade virar "auto"
       — era assim que mil linhas esticavam a tela. Quem garante que o formulário não
       seja espremido é o mínimo da janela, declarado em TelasDePessoal.cs. */
    flex: 1 1 auto;
    min-height: 0;
}

/* Media query mede o viewport do NAVEGADOR, não a largura da janela flutuante — dentro
   de uma janela quem segura o layout é o minmax acima. Esta regra serve ao caso de o
   navegador inteiro ser estreito. */
@media (max-width: 1100px) {
    .ponto-corpo[b-kbv5wf6hoz] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.ponto-lista[b-kbv5wf6hoz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

/* A grade fica com o espaço que sobra na coluna, depois do Consultar.

   ::deep porque o primeiro filho é a raiz do CavGrade, renderizada pelo componente —
   sem ele o seletor procura a marca de escopo desta tela num elemento que nunca vai
   tê-la, e a regra morre.

   O flex-basis ZERO é o detalhe que importa: com "auto" ela pediria a altura do próprio
   conteúdo, e voltaríamos a crescer com o número de linhas. O min-height segura o caso
   extremo — janela muito baixa não pode reduzir a grade a nada. */
.ponto-lista[b-kbv5wf6hoz]  > :first-child {
    flex: 1 1 0;
    min-height: 120px;
}

/* ─────────────────────────────────────────── A caixa Consultar ──── */

/* Três colunas IGUAIS, preenchidas linha a linha. Iguais porque as três linhas se leem
   em vertical: a data De fica sobre o Funcionário, que fica sobre o Serviço. Colunas de
   larguras diferentes desalinhariam essas pilhas.

   O minmax(200px) é o piso: sem ele, o par código+descrição do CavBusca se espreme até
   a descrição não caber num nome de funcionário. */
.ponto-consulta[b-kbv5wf6hoz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(200px, 1fr));
    gap: 6px 16px;
    align-items: start;
}

/* A faixa do período atravessa as três colunas, mas o conteúdo dela NÃO se espalha:
   cada caixa fica com a largura que tem (134px as datas, o texto o botão) e as três
   ficam encostadas à esquerda. É por isso que ela é um flex dentro do grid, e não três
   células. */
.ponto-consulta-periodo[b-kbv5wf6hoz] {
    grid-column: 1 / -1;
    display: flex;
    /* flex-start, e não center: com "Data inválida" numa das caixas, ela fica mais alta
       que a outra — centrados, o vizinho e o botão subiriam junto e a linha dançaria. */
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 2px;
}

/* O Consulta cai na TERCEIRA coluna da linha seguinte — as duas primeiras ficam vazias
   de propósito, e é isso que o deixa embaixo do Função, na mesma vertical do Mês
   anterior. */
.ponto-consulta-acao[b-kbv5wf6hoz] {
    grid-column: 3;
    display: flex;
    justify-content: flex-end;
    margin-top: 2px;
}

/* Numa janela estreita as três colunas viram uma: três colunas de 120px seriam piores
   que os campos empilhados. O Consulta perde a coluna fixa junto, senão ficaria preso
   a uma terceira coluna que não existe mais. */
@media (max-width: 780px) {
    .ponto-consulta[b-kbv5wf6hoz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .ponto-consulta-acao[b-kbv5wf6hoz] {
        grid-column: auto;
    }
}

/* ────────────────────────────────────────── A caixa Relatório ──── */

/* Uma linha só: as duas marcas à esquerda, o botão no canto direito — que é onde a mão
   vai depois de marcá-las. */
.ponto-relatorio[b-kbv5wf6hoz] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 16px;
}

/* O seletor de quebra do resumo: estreito, porque as três opções são curtas e ele
   divide a linha com duas marcas e o botão. */
.ponto-relatorio[b-kbv5wf6hoz]  .ponto-quebra {
    width: 130px;
    flex: 0 0 auto;
}

/* O alvo é "button", e não uma classe cav-*: o CavBotao renderiza o MudButton direto,
   sem raiz própria. */
.ponto-relatorio[b-kbv5wf6hoz]  > button:last-child {
    margin-left: auto;
}

/* ─────────────────────────────────────────────── O formulário ──── */

.ponto-formulario[b-kbv5wf6hoz] {
    display: flex;
    flex-direction: column;
    /* 6px de vão + 2px de margem de cada campo = ~10px reais entre um campo e o
       seguinte, que é o respiro da tela do desktop. */
    gap: 6px;
    min-width: 0;
    min-height: 0;
}

/* Empurra a barra de botões para a base da coluna. É o que alinha OK/Incluir/Alterar
   com o fim do Consultar do outro lado, em vez de deixar os dois lados parando em
   alturas diferentes. */
.ponto-formulario[b-kbv5wf6hoz]  > .cav-acoes {
    margin-top: auto;
}

/* A marca "Limpar campos" não deve ficar colada na barra nem herdar o empurrão: ela
   vem logo acima, e é o margin-top:auto do .cav-acoes que segura o vão. */
.ponto-formulario[b-kbv5wf6hoz]  > .mud-input-control-boolean-input {
    margin: 0;
}

/* Os três campos de hora ficam SEMPRE na mesma linha.

   nowrap, e não wrap: inicial, final e total são um conjunto só — quebrar o total para
   a linha de baixo faria parecer outro assunto. O preço é a coluna precisar de largura
   mínima, declarada no .ponto-corpo, com o mínimo da janela acompanhando em
   TelasDePessoal.cs. */
.ponto-horas[b-kbv5wf6hoz] {
    display: flex;
    flex-wrap: nowrap;
    /* flex-start, e não center: quando UM dos três mostra "Hora inválida", ele fica
       mais alto que os outros. Centrados, os outros dois subiriam para acompanhar e a
       linha inteira dançaria por causa de um erro em um campo só. */
    align-items: flex-start;
    gap: 6px;
}

/* Linha de campos que dividem largura — a data sozinha, e o par Atividade+Safra. */
.ponto-linha[b-kbv5wf6hoz] {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 6px;
}

/* Quem não tem largura própria (a Atividade, ao lado da Safra) fica com o que sobra. */
.ponto-linha[b-kbv5wf6hoz]  > .cav-busca {
    flex: 1;
    min-width: 0;
}

/* A Safra é curta e não cresce junto com a Atividade. */
.ponto-linha[b-kbv5wf6hoz]  > .cav-campo {
    flex: 0 0 92px;
}
/* /Modulos/Gerencial/Telas/Interno/RegistrarHoras/Lancamentos.razor.rz.scp.css */
/*
    Estilo da tela Registrar horas trabalhadas.

    Em arquivo proprio, e nao numa tag <style> dentro do .razor: e a convencao da pasta
    de componentes, e aqui ela vale pelo mesmo motivo pratico — <style> dentro do .razor
    injeta um elemento no meio do markup renderizado, o que ja quebrou um seletor
    :last-child nesta tela, e nao traduz ::deep.

    As duas regras com ::deep alcancam a raiz de um componente filho: a grade e a barra
    de acoes. Sem ele, o CSS isolado nao atravessa a fronteira do componente.
*/
/* A TELA PREENCHE A JANELA, em vez de a janela ser cortada no tamanho da tela.

       Antes a altura da janela era um numero calculado a mao a partir da soma dos
       blocos — e bastava mexer em qualquer um deles para sobrar faixa vazia embaixo ou
       cortar os botoes. Agora a corrente e: a janela da a altura, o .lanc-corpo estica,
       a grade fica com o que sobra. Nenhuma conta para manter. */
    .lanc-tela[b-thyb06olu3] {
        display: flex;
        flex-direction: column;
        /* min-height, e nao height: a tela ocupa a janela inteira quando sobra espaco,
           mas pode passar dela quando falta — e ai quem rola e a janela, nao uma coluna
           sozinha. */
        /* height, e nao min-height: e o que torna a altura DEFINIDA para quem esta
           dentro. Com min-height a altura fica indefinida, e ai o "100%" da grade nao
           resolve - vira "auto", ou seja, o tamanho do conteudo. Era essa a origem de a
           grade crescer com o numero de linhas. */
        height: 100%;
        min-width: 0;
    }

    /* Duas colunas quando cabe, empilhado quando a janela é estreita. É o mínimo para
       a tela servir tanto numa janela de 700px quanto maximizada. */
    /* 70/30, e nao meio a meio: onde tem grade, a grade e o assunto da tela. O
       formulario e o que se preenche de vez em quando; a lista e o que se percorre o
       tempo todo, e cada coluna a mais visivel poupa uma rolagem horizontal.

       O minmax(300px) no formulario e o piso: abaixo disso o par codigo+descricao do
       CavBusca fica com a descricao curta demais para mostrar um nome de cliente. */
    .lanc-corpo[b-thyb06olu3] {
        display: grid;
        /* Piso nas DUAS colunas, nao so na direita.

           Era "minmax(0, 7fr)" na esquerda: o zero diz que ela pode encolher ate sumir.
           Quem pagava era a caixa Consultar, cujos campos iam se espremendo ate se
           sobrepor conforme a janela era estreitada.

           O piso da DIREITA e 300: a linha das horas tem tres campos de 94px que nao
           quebram — 294 com os vaos —, e o par codigo+descricao do CavBusca precisa de
           largura parecida para mostrar um nome de cliente.

           560 e o que a Consultar precisa: as duas datas (274) + o vao (16) + a busca de
           cliente (~242), mais o recheio do CavGrupo. Abaixo disso o conteudo passa a
           transbordar e a JANELA rola na horizontal — que e o comportamento certo:
           melhor rolar do que ler campo cortado. */
        grid-template-columns: minmax(560px, 7fr) minmax(300px, 3fr);
        gap: 14px;
        /* stretch, e nao start: e o que faz as duas colunas terminarem na mesma linha
           embaixo, em vez de cada uma parar onde o proprio conteudo acabou. */
        align-items: stretch;
        /* 1 0 auto: CRESCE quando sobra espaco (a grade fica com a folga), mas NAO
           ENCOLHE abaixo do proprio conteudo.

           Era "flex: 1", que e "1 1 0%" — encolhia. A linha ficava com a altura que a
           janela desse, e a coluna direita, que nao encolhe (oito campos, descricao e a
           barra de botoes), vazava para fora dela. Dai um lado terminar mais embaixo que
           o outro, por mais que as duas colunas tenham a MESMA altura de linha.

           Com shrink 0, a linha nunca fica menor que a coluna mais alta: as duas sempre
           terminam juntas, e o que falta vira rolagem da janela. Nenhum numero para
           acertar. */
        /* 1 1 auto, e nao 1 0 auto.

           O shrink zero mantinha a linha do tamanho do CONTEUDO. Conteudo manda dizer
           que a altura e indefinida - e altura indefinida faz o "100%" da grade virar
           "auto", ou seja, a altura de todas as linhas. Era por isso que mil lancamentos
           esticavam a tela.

           Com shrink 1 a altura vem da JANELA. Quem garante que o formulario nao seja
           espremido e o minimo da janela, declarado em TelasDePessoal.cs. */
        flex: 1 1 auto;
        min-height: 0;
    }

    @media (max-width: 1100px) {
        .lanc-corpo[b-thyb06olu3] {
            grid-template-columns: minmax(0, 1fr);
        }
    }

    .lanc-lista[b-thyb06olu3] {
        display: flex;
        flex-direction: column;
        min-width: 0;
        min-height: 0;
    }

    /* A grade NAO cresce mais.
    
       Ela tinha "flex: 1" para ficar com o espaco que sobrasse. O efeito colateral era
       que o conteudo tambem contava: com mil linhas, a grade pedia a altura das mil e
       esticava a tela inteira.
    
       Agora a altura e fixa (Altura="340px" no markup) e a rolagem acontece dentro dela.
       O flex: 0 0 auto deixa isso explicito - nem cresce nem encolhe. */
    /* A grade fica com o espaco que sobra na coluna, depois do Consultar.

       O flex-basis ZERO e o detalhe que importa: com "auto" ela pediria a altura do
       proprio conteudo, e voltariamos a crescer com o numero de linhas. Em zero, a
       altura vem so do espaco disponivel.

       O min-height segura o caso extremo: janela muito baixa nao pode reduzir a grade a
       nada. */
    .lanc-lista[b-thyb06olu3]  > :first-child {
        flex: 1 1 0;
        min-height: 120px;
    }


    /* A caixa Consultar, no mesmo arranjo do desktop: duas colunas, duas linhas.

       A coluna da esquerda e "auto" porque quem manda na largura dela sao as duas datas,
       que tem tamanho fixo. A direita fica com o resto — e e onde ficam os campos que
       ganham em ser largos: nome de cliente e descricao. */
    .lanc-consulta[b-thyb06olu3] {
        display: grid;
        /* O minmax(240px) e o mesmo cuidado por dentro: sem ele a coluna da direita
           encolhe ate a busca de cliente virar duas caixinhas coladas. */
        /* 274px = as duas datas (134 + 134) mais o vao de 6.
        
           Era "auto", que dimensiona pelo maior conteudo da coluna - e o CavBusca do
           Analista, sem largura propria, puxava a coluna para alem das datas. O
           resultado era o Analista mais largo que o De+Ate logo acima dele, e o Cliente e
           a Descricao da coluna da direita comecando em pontos diferentes.
        
           Travando na largura das datas, as quatro caixas se alinham em duas colunas
           limpas, como na tela do desktop. */
        grid-template-columns: 274px minmax(240px, 1fr);
        gap: 6px 16px;
        align-items: start;
    }

    .lanc-consulta-datas[b-thyb06olu3] {
        display: flex;
        gap: 6px;
    }

    /* Descricao e o botao na mesma linha: a descricao cresce, o botao nao. */
    .lanc-consulta-acao[b-thyb06olu3] {
        display: flex;
        align-items: flex-start;
        gap: 6px;
    }

    /* ::deep tambem aqui: o primeiro filho e a raiz do CavCampoTexto, renderizada pelo
       componente filho — sem ele o seletor procura a marca de escopo desta tela num
       elemento que nunca vai te-la, e a regra morre. */
    .lanc-consulta-acao[b-thyb06olu3]  > :first-child {
        flex: 1;
        min-width: 0;
    }

    /* Numa janela estreita a caixa vira uma coluna so: duas colunas de 150px seriam
       piores que quatro linhas empilhadas. */
    @media (max-width: 620px) {
        .lanc-consulta[b-thyb06olu3] {
            grid-template-columns: minmax(0, 1fr);
        }
    }

    .lanc-formulario[b-thyb06olu3] {
        display: flex;
        /* 6px de vão + 2px de margem de cada campo = ~10px reais entre um campo e
           o seguinte, que é o respiro da tela do desktop. */
        flex-direction: column;
        gap: 6px;
        min-width: 0;
        min-height: 0;
    }

    /* Empurra a barra de botoes para a base da coluna. E o que alinha OK/INCLUIR/ALTERAR
       com o fim do Consultar do outro lado, em vez de deixar os dois lados parando em
       alturas diferentes. */
    .lanc-formulario[b-thyb06olu3]  > .cav-acoes {
        margin-top: auto;
    }

    /* Os tres campos de hora ficam SEMPRE na mesma linha.

       nowrap, e nao wrap: inicio, fim e total sao um conjunto so — quebrar o total para
       a linha de baixo faria parecer outro assunto. O preco e a coluna precisar de
       largura minima, declarada no .lanc-corpo, com o minimo da janela acompanhando em
       TelasDePessoal.cs. */
    .lanc-horas[b-thyb06olu3] {
        display: flex;
        flex-wrap: nowrap;
        /* flex-start, e nao center: quando UM dos tres mostra "Hora invalida", ele fica
           mais alto que os outros. Centrado, os outros dois subiriam para acompanhar e a
           linha inteira dancaria por causa de um erro em um campo so. Pelo topo, os tres
           campos ficam parados e so a mensagem desce. */
        align-items: flex-start;
        gap: 6px;
    }

/* /Modulos/Gerencial/Telas/Interno/UsuariosAWS/UsuariosAws.razor.rz.scp.css */
.aws-tela[b-nlu39opkhd] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-width: 0;
}
.aws-corpo[b-nlu39opkhd] {
    display: grid;
    grid-template-columns: minmax(560px, 7fr) minmax(300px, 3fr);
    gap: 14px;
    align-items: stretch;
    flex: 1 1 auto;
    min-height: 0;
}

@media (max-width: 1100px) {
    .aws-corpo[b-nlu39opkhd] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.aws-lista[b-nlu39opkhd] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.aws-lista[b-nlu39opkhd]  > :first-child {
    flex: 1 1 0;
    min-height: 120px;
}
.aws-consulta[b-nlu39opkhd] {
    display: grid;
    grid-template-columns: 274px minmax(240px, 1fr);
    gap: 6px 16px;
    align-items: start;
}
.aws-consulta-acao[b-nlu39opkhd] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
.aws-consulta-acao[b-nlu39opkhd]  > :first-child {
    flex: 1;
    min-width: 0;
}

@media (max-width: 620px) {
    .aws-consulta[b-nlu39opkhd] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.aws-formulario[b-nlu39opkhd] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    min-height: 0;
}

.aws-formulario[b-nlu39opkhd]  > .cav-acoes {
    margin-top: auto;
}

/* Sequencia e Servidor na largura da caixa de CODIGO do Cliente.

   96px e o LarguraDoCodigo padrao do CavBusca. Repetido aqui como numero porque nao ha
   variavel CSS para ele — o componente o aplica em style inline. Mexendo naquele padrao,
   este numero tem que acompanhar, senao os tres campos deixam de se alinhar.

   A largura vai no DIV que envolve o campo, e nao no campo: o CavCampoTexto e FullWidth,
   entao ele preenche o que o pai der. Sem o div, seria preciso um ::deep so para
   atravessar a fronteira do componente. */
.aws-campo-curto[b-nlu39opkhd] {
    width: 96px;
}
