/* Componentes comuns (biblioteca Projurid.Componentes): estrutura (cabeçalho e menu), barra de ações, área de filtros
   e telas de entrada.
   As cores vêm do tema do Radzen; o fundo do painel da marca no login muda com a variável --login-fundo. */

/* Estrutura (LayoutProjurid): cabeçalho e menu lateral na cor da marca */
.cabecalho {
    background: var(--marca-cabecalho, #1F3A5F);
    color: var(--marca-on-cabecalho, #fff);
    /* O botão do menu (☰) usa a cor do cabeçalho, não o fundo do tema */
    --rz-sidebar-toggle-background-color: transparent;
    --rz-sidebar-toggle-hover-background-color: rgba(127, 127, 127, .18);
    --rz-sidebar-toggle-color: currentColor;
    --rz-sidebar-toggle-hover-color: currentColor;
    --rz-sidebar-toggle-border: none;
}
/* Centro do cabeçalho (escritório · usuário): no meio da tela, por cima da linha do cabeçalho */
.cabecalho { position: relative; }
.cabecalho-centro { position: absolute; left: 50%; top: 0; height: 48px; transform: translateX(-50%); display: flex;
    align-items: center; gap: .5rem; white-space: nowrap; pointer-events: none; }
@media (max-width: 1100px) { .cabecalho-centro { display: none; } }
.menu-lateral { width: 250px; --rz-panel-menu-item-2nd-level-offset: 3.4rem; } /* segundo nível recuado, sem linha-guia */
.menu-lateral .rz-navigation-item-text { white-space: nowrap; }
.menu-lateral .rz-navigation-menu .rz-navigation-item-link { font-size: .82rem; }
.menu-lateral .rz-navigation-menu .rz-navigation-item-icon { font-size: 1.05rem; opacity: .85; }

/* Barra de ações das telas e área de filtros */
.barra-acoes { border: 1px solid var(--rz-base-300); }
.barra-acoes .separador { width: 1px; align-self: stretch; background: var(--rz-base-300); margin: 0 0.25rem; }
.area-filtros { padding: .5rem .75rem !important; border: 1px solid var(--rz-base-300); }
.texto-ajuda { margin: 0 0 .25rem; font-size: .85rem; color: var(--rz-text-secondary-color); }

/* Rodapé de auditoria dos formulários (RodapeAuditoria) */
.info-auditoria { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 16px; padding-top: 10px;
    border-top: 1px solid var(--rz-base-300); font-size: .78rem; color: var(--rz-text-secondary-color); }
.info-auditoria .rzi { font-size: 1rem; }

/* Tela de login: painel da marca à esquerda, formulário à direita.
   As cores do formulário vêm do tema (funciona também nos temas escuros). */
.login-pagina { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 4fr); font-family: var(--rz-text-font-family); }

.login-apresentacao {
    display: flex; flex-direction: column; justify-content: space-between; gap: 32px;
    padding: 48px 56px; color: #fff;
    background:
        radial-gradient(circle at 85% 15%, rgba(255,255,255,.10) 0, transparent 45%),
        var(--login-fundo, linear-gradient(150deg, #16304f 0%, #1F3A5F 45%, #2b5384 100%));
}
.login-marca { display: flex; align-items: center; gap: 10px; font-size: 1.5rem; font-weight: 700; letter-spacing: .01em; }
.login-marca .rzi { font-size: 2rem; }
.login-chamada h2 { font-size: clamp(1.6rem, 2.6vw, 2.4rem); line-height: 1.2; font-weight: 600; margin: 0 0 28px; max-width: 18ch; color: #fff; }
.login-chamada ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.login-chamada li { display: flex; align-items: center; gap: 12px; font-size: 1rem; opacity: .92; }
.login-chamada li .rzi { font-size: 1.4rem; background: rgba(255,255,255,.12); border-radius: 10px; padding: 8px; }
.login-rodape { font-size: .8rem; opacity: .6; }

.login-formulario { display: flex; align-items: center; justify-content: center; padding: 32px 24px; background: var(--rz-base-background-color); }
.login-cartao { width: 100%; max-width: 380px; color: var(--rz-text-color); }
.login-cartao h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 6px; color: var(--rz-text-title-color); }
.login-subtitulo { margin: 0 0 28px; color: var(--rz-text-secondary-color); }
.login-marca-compacta { display: none; color: var(--rz-primary); margin-bottom: 24px; }

.login-rotulo { display: block; font-size: .85rem; font-weight: 600; color: var(--rz-text-secondary-color); margin: 16px 0 6px; }
.login-campo-icone { position: relative; }
.login-campo-icone > .rzi { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--rz-text-disabled-color); pointer-events: none; }
.login-campo-icone .rz-textbox { width: 100%; box-sizing: border-box; height: 44px; padding-left: 42px; padding-right: 42px; font-size: 1rem; }
.login-ver-senha { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; cursor: pointer; padding: 6px; border-radius: 6px; color: var(--rz-text-secondary-color); display: flex; }
.login-sufixo { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 1rem; font-weight: 600; color: var(--rz-text-secondary-color); pointer-events: none; }
.login-campo-icone .rz-textbox.com-sufixo { padding-right: 64px; }
/* Fundo e borda tirados da cor do texto: funcionam nos temas claros e escuros (nos escuros, --rz-base-100 é claro). */
.login-valor-fixo { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 12px; box-sizing: border-box; border-radius: 6px;
    background: color-mix(in srgb, var(--rz-text-color) 6%, transparent); border: 1px solid color-mix(in srgb, var(--rz-text-color) 22%, transparent);
    color: var(--rz-text-color); font-size: .95rem; }
.login-valor-fixo .rzi { font-size: 1.25rem; color: var(--rz-text-disabled-color); }
.login-valor-fixo strong { font-weight: 700; }
.login-ver-senha:hover { background: var(--rz-base-200); }
.login-ver-senha .rzi { font-size: 1.25rem; }

.login-link { display: inline-block; margin-top: 14px; font-size: .9rem; color: var(--rz-primary); }
.login-aviso { display: flex; gap: 8px; margin-top: 16px; padding: 10px 12px; border-radius: 6px; font-size: .9rem;
    background: var(--rz-success-lighter); color: var(--rz-success-darker); }
.login-aviso .rzi { font-size: 1.2rem; }

.login-botao { width: 100%; height: 46px; margin-top: 24px; justify-content: center; font-size: 1rem; }

.login-dica { display: flex; gap: 10px; margin-top: 28px; font-size: .82rem; line-height: 1.5; color: var(--rz-text-secondary-color); background: color-mix(in srgb, var(--rz-text-color) 6%, transparent); border: 1px solid color-mix(in srgb, var(--rz-text-color) 22%, transparent); border-radius: 8px; padding: 12px 14px; }
.login-dica > .rzi { font-size: 1.2rem; color: var(--rz-info); }
.login-dica code { background: var(--rz-base-200); padding: 1px 5px; border-radius: 4px; }

/* Telas estreitas (celular): some o painel da marca e ela vai para cima do formulário. */
@media (max-width: 860px) {
    .login-pagina { grid-template-columns: 1fr; }
    .login-apresentacao { display: none; }
    .login-marca-compacta { display: flex; }
    .login-formulario { align-items: flex-start; padding-top: 56px; }
}
/* Login: mensagem de erro */
.login-erro {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: .25rem 0 .75rem;
    padding: .55rem .75rem;
    border-radius: var(--rz-border-radius);
    background: var(--rz-danger-lighter);
    color: var(--rz-danger-darker);
    font-size: .875rem;
}

/* Aceite de termos e links abaixo do formulário de entrada */
.login-aceite { display: flex; gap: 8px; align-items: flex-start; margin-top: 18px; font-size: .88rem; line-height: 1.4; color: var(--rz-text-secondary-color); cursor: pointer; }
.login-aceite input { margin-top: 3px; width: 16px; height: 16px; flex: none; }
.login-aceite a, .login-link-inline { color: var(--rz-primary); }
.login-links { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* Relatórios em tabela (colunas que mudam, como meses): rola na horizontal com a primeira coluna e o cabeçalho
   fixos; números à direita; seções, totais e resultado em destaque. */
.relatorio-rolagem { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--rz-base-300); border-radius: 4px; }
.relatorio-tabela { border-collapse: separate; border-spacing: 0; font-size: .85rem; min-width: 100%; }
.relatorio-tabela th, .relatorio-tabela td { padding: .35rem .6rem; white-space: nowrap; text-align: right; border-bottom: 1px solid var(--rz-base-200); }
.relatorio-tabela th { position: sticky; top: 0; z-index: 2; background: var(--rz-base-100); font-weight: 600; }
/* Valor estimado (ex.: juros projetados nos Parcelamentos). */
.relatorio-tabela td.estimado { font-style: italic; color: var(--rz-text-secondary-color, #5a6472); }
.relatorio-tabela th:first-child, .relatorio-tabela td:first-child { position: sticky; left: 0; z-index: 1; text-align: left; background: var(--rz-base-background-color, var(--rz-body-background-color)); }
.relatorio-tabela th:first-child { z-index: 3; background: var(--rz-base-100); }
.relatorio-tabela td.negativo { color: var(--rz-danger); }
.relatorio-tabela tr.secao td { font-weight: 700; padding-top: .9rem; border-bottom-color: var(--rz-base-300); }
.relatorio-tabela tr.total td { font-weight: 700; background: var(--rz-base-100); }
.relatorio-tabela tr.resultado td { font-weight: 700; background: var(--rz-base-200); border-top: 2px solid var(--rz-base-400); }
.relatorio-tabela tbody tr:not(.secao):not(.total):not(.resultado):hover td { background: var(--rz-base-100); }
/* Selo de banco (ou de qualquer instituição): sigla curta em negrito nas cores dela, com o nome ao lado. */
.selo-banco-linha { display: inline-flex; align-items: center; gap: .45rem; max-width: 100%; vertical-align: middle; }
.selo-banco { display: inline-flex; align-items: center; justify-content: center; min-width: 2.6rem; height: 1.35rem; padding: 0 .3rem;
    border-radius: 4px; font-size: .68rem; font-weight: 800; letter-spacing: .02em; line-height: 1; flex: none;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.selo-banco-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Extrato de conta (como o do banco): créditos em azul, débitos em vermelho, o saldo no fim de cada dia. */
.extrato { display: flex; flex-direction: column; gap: .75rem; height: 100%; min-height: 0; padding: .5rem 0; }
.extrato-credito { color: var(--rz-info-darker, #1f5fa8); }
.extrato-debito { color: var(--rz-danger); }
.extrato-aviso { color: var(--rz-text-secondary-color); font-size: .85rem; }
.extrato-tabela td:nth-child(2), .extrato-tabela th:nth-child(2) { text-align: left; }
.extrato-tabela td:nth-child(3), .extrato-tabela th:nth-child(3) { text-align: left; }
.extrato-tabela td.extrato-historico { white-space: normal; min-width: 260px; max-width: 520px; }
.extrato-tabela tr.extrato-fim-dia td { border-bottom-color: var(--rz-base-400); }
.extrato-tabela tr.extrato-fim-dia td:last-child { font-weight: 600; }
/* Drill-down: a setinha do grupo abre as linhas de detalhe, recuadas e mais discretas. */
.relatorio-abrir { border: none; background: none; padding: 0; margin: 0 .15rem 0 -.2rem; cursor: pointer; color: inherit; vertical-align: middle; line-height: 1; }
.relatorio-abrir .rzi { font-size: 1.1rem; }
.relatorio-tabela tr.conta td { color: var(--rz-text-secondary-color); font-size: .8rem; }
.relatorio-tabela tr.conta td:first-child { padding-left: 2.2rem; }
/* Terceiro nível (ex.: salários por pessoa, abaixo da conta). */
.relatorio-tabela tr.pessoa td:first-child { padding-left: 4rem; }
.relatorio-tabela tr.pessoa td { font-size: .78rem; }
/* Linha com nome e uma segunda linha de detalhe (ex.: o parcelamento e "HENG · S-748 · parcelas 12 a 23 de 60"). */
.relatorio-tabela td.relatorio-nome { white-space: normal; min-width: 280px; max-width: 420px; }
.relatorio-tabela td.relatorio-nome a { color: inherit; text-decoration: none; }
.relatorio-tabela td.relatorio-nome a:hover { text-decoration: underline; color: var(--rz-primary); }
.relatorio-detalhe { display: block; font-size: .75rem; color: var(--rz-text-secondary-color); }
/* Coluna logo depois de um valor, com quem compõe a maior parte dele: "(Funcef 18K, Solucionare 18K)". À esquerda e em
   letra menor, para os números da coluna do valor continuarem alinhados. */
.relatorio-tabela .relatorio-destaques { text-align: left; font-size: .75rem; color: var(--rz-text-secondary-color); font-weight: normal;
    white-space: nowrap; padding-left: .5rem; }

/* Orçamento: as médias (fixas) num fundo discreto; nos cenários, a caixa de digitação ocupa a célula, alinhada à direita. */
.relatorio-tabela .orcamento-media { color: var(--rz-text-secondary-color); background: color-mix(in srgb, var(--rz-base-100) 55%, transparent); }
.relatorio-tabela th.orcamento-cenario { min-width: 150px; }
.orcamento-cenario-titulo { display: inline-flex; align-items: center; gap: .3rem; }
.orcamento-cenario-titulo .relatorio-abrir { margin: 0; opacity: .7; }
.orcamento-cenario-titulo .relatorio-abrir:hover:not(:disabled) { opacity: 1; color: var(--rz-primary); }
.orcamento-cenario-titulo .relatorio-abrir:disabled { opacity: .25; cursor: default; }
.relatorio-tabela td:has(> .orcamento-entrada) { padding: .1rem .3rem; }
.orcamento-entrada { width: 100%; min-width: 110px; box-sizing: border-box; text-align: right; font: inherit; color: var(--rz-text-color);
    padding: .2rem .35rem; border: 1px solid var(--rz-base-300); border-radius: 4px; background: var(--rz-base-background-color, #fff); }
.orcamento-entrada:focus { outline: none; border-color: var(--rz-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--rz-primary) 20%, transparent); }
.relatorio-tabela tr.orcamento-imposto td { font-style: italic; }
@media print { .orcamento-entrada { border: none; background: none; padding: 0; } .orcamento-cenario-titulo .relatorio-abrir { display: none; } }

/* Lista de itens clicáveis num cartão (ex.: as importações pela OAB): título, detalhe e data, o escolhido destacado. */
.importacao-lista { display: flex; flex-direction: column; gap: .35rem; max-height: 420px; overflow: auto; }
.importacao-item { display: flex; flex-direction: column; align-items: flex-start; gap: .1rem; text-align: left; padding: .5rem .65rem; cursor: pointer;
    border: 1px solid var(--rz-base-300); border-radius: 6px; background: var(--rz-base-background-color, #fff); color: var(--rz-text-color); font: inherit; }
.importacao-item:hover { border-color: var(--rz-primary); }
.importacao-item.selecionada { border-color: var(--rz-primary); box-shadow: inset 3px 0 0 var(--rz-primary); }
.importacao-item span { font-size: .85rem; }
.importacao-item small { font-size: .75rem; color: var(--rz-text-secondary-color); }
.importacao-total { font-size: 1.1rem; }
.importacao-total strong { font-size: 2rem; margin-right: .3rem; }

/* Anexos dos tickets de suporte: os enviados (links) e os escolhidos para enviar (com o "x" para tirar). */
.ticket-anexos { display: flex; flex-wrap: wrap; gap: .4rem; }
.ticket-anexos a { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .55rem; border: 1px solid var(--rz-base-300); border-radius: 6px;
    text-decoration: none; color: var(--rz-text-color); font-size: .85rem; }
.ticket-anexos a:hover { border-color: var(--rz-primary); color: var(--rz-primary); }
.ticket-anexos small { color: var(--rz-text-secondary-color); }
.ticket-anexar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.ticket-anexo-novo { display: inline-flex; align-items: center; gap: .25rem; padding: .15rem .2rem .15rem .5rem; border-radius: 6px; background: var(--rz-base-100);
    font-size: .85rem; }
.ticket-anexo-novo button { border: none; background: none; cursor: pointer; color: var(--rz-text-secondary-color); padding: 0; line-height: 1; }
.ticket-anexo-novo .rzi { font-size: 1rem; }

/* Texto de uma comunicação (intimação do DJEN): parágrafos preservados, rolagem própria. */
.intimacao-texto { white-space: pre-wrap; font-size: .9rem; line-height: 1.5; max-height: 30vh; overflow: auto; margin-top: .6rem; padding: .6rem .75rem;
    background: var(--rz-base-50, var(--rz-base-100)); border-radius: 6px; }

/* Escolha da empresa (usuário de mais de uma): um botão por empresa, um embaixo do outro. */
.login-empresas { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.login-empresas .login-botao { margin-top: 0; justify-content: flex-start; }

/* Marcas (badges) claras na linha selecionada do grid: o fundo delas é translúcido e some sobre o destaque da linha;
   fundo branco para continuarem legíveis. */
.rz-data-grid .rz-state-highlight .rz-badge.rz-shade-lighter {
    background-color: #fff;
}

/* Visualizador de Word (VisualizadorWord.razor): as páginas do docx-preview sobre fundo cinza, como no visualizador de PDF. */
.visualizador-word {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: #e8eaed;
}

    .visualizador-word .docx-wrapper {
        background: transparent;
        padding: 16px;
        align-items: center;
    }

        .visualizador-word .docx-wrapper > section.docx {
            box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
            margin-bottom: 16px;
        }

.word-carregando {
    padding: 2rem;
    text-align: center;
    color: #555;
    font-size: .9rem;
}

/* Menu do usuário no cabeçalho (MenuUsuario): o nome com a seta, na cor do cabeçalho. */
.menu-usuario.rz-profile-menu, .menu-usuario .rz-navigation-item-wrapper, .menu-usuario .rz-navigation-item-link { background: transparent; color: inherit; }
.menu-usuario .rz-navigation-menu .rz-navigation-item-link { color: var(--rz-text-color); }
.menu-usuario-separador { margin: .25rem 0; border: none; border-top: 1px solid var(--rz-base-300); }
/* Janela Aparência: as paletas de cor em quadradinhos. */
.paletas { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: .5rem; }
.paleta { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: .4rem; cursor: pointer; border-radius: 8px;
    border: 2px solid transparent; background: transparent; color: var(--rz-text-color); font-size: .8rem; }
.paleta:hover { background: color-mix(in srgb, var(--rz-text-color) 8%, transparent); }
.paleta.escolhida { border-color: var(--rz-primary); font-weight: 600; }
.paleta-amostra { width: 56px; height: 32px; border-radius: 6px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .12); }
/* ---------- Abas do registro (AbasRegistro): Grid | detalhes, como no Windows; "Dividir" põe o grid em cima ---------- */
.abas-registro { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: .35rem; }
.abas-registro-barra { display: flex; align-items: flex-end; gap: .25rem; border-bottom: 1px solid var(--rz-base-300); flex-wrap: wrap; }
.abas-registro-aba { display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .75rem; font-size: .85rem; cursor: pointer;
    border: 1px solid transparent; border-bottom: none; border-radius: 6px 6px 0 0; background: transparent; color: var(--rz-text-color); }
.abas-registro-aba .rzi { font-size: 1rem; }
.abas-registro-aba:hover { background: color-mix(in srgb, var(--rz-text-color) 8%, transparent); }
.abas-registro-aba.ativa { border-color: var(--rz-base-300); background: var(--rz-base-background-color); font-weight: 600;
    color: var(--rz-primary); margin-bottom: -1px; }
.abas-registro-barra .rz-button { margin-bottom: .25rem; }
.abas-registro-grid { flex: 1; min-height: 0; height: 100%; display: flex; flex-direction: column; }
.abas-registro-grid > .rz-data-grid { flex: 1; min-height: 0; }
.abas-registro-conteudo { flex: 1; min-height: 0; height: 100%; display: flex; flex-direction: column; gap: .4rem; overflow: auto; }
.abas-registro-navegacao { display: flex; align-items: center; gap: .15rem; padding: .15rem .25rem; border-radius: 6px;
    background: color-mix(in srgb, var(--rz-text-color) 8%, transparent); font-size: .85rem; }
.abas-registro-posicao { font-weight: 600; padding: 0 .4rem; }
.abas-registro-identificacao { margin-left: .75rem; color: var(--rz-text-secondary-color); }
.abas-registro-vazio { padding: 2rem; text-align: center; opacity: .6; }
/* Conteúdo da aba: ocupa o que sobra; um grid dentro dela estica até o fim. */
.abas-registro-aba-conteudo { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: auto; }
.abas-registro-aba-conteudo > .rz-data-grid { flex: 1; min-height: 0; }
/* Dividido: o detalhe (barra das abas, barra do registro e conteúdo) embaixo do grid. */
.abas-registro-detalhe { height: 100%; display: flex; flex-direction: column; gap: .35rem; padding: .25rem .4rem 0; }

/* Ajuda das telas (BotaoAjuda): elementos com ajuda marcados e o balão */
body.modo-ajuda .com-ajuda { outline: 2px dashed #f59e0b !important; outline-offset: 2px; cursor: help !important; }
.ajuda-balao {
    position: fixed; z-index: 3000; display: none; max-width: 340px; padding: .6rem .8rem; border-radius: 6px;
    background: #1f2937; color: #f9fafb; font-size: .85rem; line-height: 1.45; box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
}
.ajuda-balao a { display: inline-block; margin-top: .35rem; color: #93c5fd; }
.botao-ajuda-ligado { background: #f59e0b !important; color: #1f2937 !important; border-color: #f59e0b !important; }

/* Impressão (botão Imprimir dos relatórios e do extrato, projurid.imprimir): sem o menu, o cabeçalho e os botões; o
   relatório ocupa a folha e as tabelas que rolam na tela saem inteiras. O título fica (o da barra ou .impressao-titulo). */
.impressao-titulo { display: none; }
@media print {
    @page { size: A4 landscape; margin: 10mm; }
    html, body { height: auto !important; overflow: visible !important; background: #fff !important; }
    .cabecalho, .menu-lateral, .rz-sidebar, .nao-imprimir, .rz-dialog-wrapper, .rz-notification,
    .barra-acoes .rz-button, .barra-acoes .rz-selectbar, .barra-acoes .rz-textbox, .barra-acoes .separador,
    .area-filtros .rz-button, .rz-paginator { display: none !important; }
    .rz-layout, .rz-body, .tela-com-hrg, .tela-conteudo { display: block !important; height: auto !important; overflow: visible !important;
        margin: 0 !important; padding: 0 !important; position: static !important; inset: auto !important; }
    .barra-acoes, .area-filtros { border: none !important; box-shadow: none !important; padding: 0 0 .25rem !important; }
    .relatorio-rolagem { overflow: visible !important; border: none !important; flex: none !important; }
    .relatorio-tabela th, .relatorio-tabela td { position: static !important; }
    .relatorio-tabela { font-size: 9pt; }
    .relatorio-tabela tr { break-inside: avoid; }
    .relatorio-tabela thead { display: table-header-group; }
    * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    /* Só uma área (projurid.imprimir com seletor): o resto da tela some. */
    body.imprimindo-area * { visibility: hidden; }
    body.imprimindo-area .imprimindo, body.imprimindo-area .imprimindo * { visibility: visible; }
    body.imprimindo-area .imprimindo { position: absolute; left: 0; top: 0; width: 100%; }
    body.imprimindo-area .imprimindo .nao-imprimir { display: none !important; }
    .impressao-titulo { display: block; font-weight: 700; font-size: 12pt; margin-bottom: .4rem; }
}

/* ---------- Conexão perdida com o servidor (ReconexaoServidor.razor): faixa no topo, a tela continua visível ---------- */
#components-reconnect-modal { display: none; }
#components-reconnect-modal.components-reconnect-show,
#components-reconnect-modal.components-reconnect-failed,
#components-reconnect-modal.components-reconnect-retrying,
#components-reconnect-modal.components-reconnect-rejected {
    display: flex; position: fixed; inset: 0; z-index: 3000; justify-content: center; align-items: flex-start; padding-top: 72px;
    background: rgba(15, 23, 42, .25);
}
.reconexao-caixa {
    display: flex; gap: .9rem; align-items: center; max-width: min(520px, 92vw); padding: .9rem 1.2rem; border-radius: 10px;
    background: var(--rz-base-background-color, #fff); color: var(--rz-text-color, #1f2937); box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
    border-left: 5px solid var(--marca-cabecalho, #1F3A5F);
}
.reconexao-titulo { font-weight: 600; }
.reconexao-texto { font-size: .85rem; opacity: .75; margin-top: .15rem; }
.reconexao-giro {
    flex: none; width: 22px; height: 22px; border-radius: 50%; border: 3px solid rgba(31, 58, 95, .2);
    border-top-color: var(--marca-cabecalho, #1F3A5F); animation: reconexao-giro .9s linear infinite;
}
@keyframes reconexao-giro { to { transform: rotate(360deg); } }
