:root {
    color-scheme: light;
    --fundo: #f4f6f9;
    --superficie: #ffffff;
    --superficie-secundaria: #eef2f6;
    --texto: #18212f;
    --texto-secundario: #667085;
    --borda: #d9e0e8;
    --destaque: #2563eb;
    --destaque-suave: #eff6ff;
    --texto-destaque: #ffffff;
    --sucesso: #16803c;
    --sucesso-suave: #e8f5ec;
    --alerta: #b54708;
    --sombra: 0 1px 2px rgba(16, 24, 40, .05);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --fundo: #11151b;
    --superficie: #191e26;
    --superficie-secundaria: #222935;
    --texto: #edf2f7;
    --texto-secundario: #a7b0bf;
    --borda: #303846;
    --destaque: #60a5fa;
    --destaque-suave: #172554;
    --texto-destaque: #0b1220;
    --sucesso: #4ade80;
    --sucesso-suave: #173724;
    --alerta: #fdb022;
    --sombra: none;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 14px/1.5 Inter, "Segoe UI", sans-serif; }
a { color: inherit; text-decoration: none; }
.estrutura { min-height: 100vh; display: grid; grid-template-columns: 252px 1fr; }
.menu-lateral { position: sticky; top: 0; height: 100vh; overflow-y: auto; background: var(--superficie); border-right: 1px solid var(--borda); padding: 22px 14px; }
.marca { padding: 0 10px 22px; color: var(--destaque); font-size: 18px; font-weight: 700; }
.menu-lateral nav { display: grid; gap: 6px; }
.menu-item { position: relative; min-height: 38px; display: flex; align-items: center; padding: 0 11px; border-radius: 6px; color: var(--texto-secundario); }
.menu-item:hover { background: var(--superficie-secundaria); color: var(--texto); }
.menu-item.ativo { background: var(--destaque-suave); color: var(--destaque); font-weight: 700; }
.menu-item.ativo::before { content: ""; position: absolute; left: 0; width: 3px; height: 18px; border-radius: 0 3px 3px 0; background: var(--destaque); }
.menu-secao { border-top: 1px solid var(--borda); }
.menu-secao summary { min-height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px; color: var(--texto); font-size: 12px; font-weight: 700; text-transform: uppercase; cursor: pointer; list-style: none; }
.menu-secao summary::-webkit-details-marker { display: none; }
.menu-secao summary::after { content: "+"; color: var(--texto-secundario); font-size: 17px; font-weight: 400; line-height: 1; }
.menu-secao[open] summary::after { content: "-"; }
.menu-secao > div { display: grid; gap: 3px; padding: 0 0 7px 8px; }
.menu-grupo { margin: 18px 10px 6px; color: var(--texto-secundario); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.pagina { min-width: 0; }
.cabecalho { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 28px; background: var(--superficie); border-bottom: 1px solid var(--borda); }
.cabecalho h1 { margin: 0; font-size: 20px; }
.contexto { margin: 0 0 2px; color: var(--texto-secundario); font-size: 12px; }
.controle-tema { display: flex; align-items: center; gap: 9px; color: var(--texto-secundario); cursor: pointer; }
.controle-tema input {
    appearance: none;
    width: 36px;
    height: 20px;
    margin: 0;
    padding: 2px;
    border: 1px solid var(--borda);
    border-radius: 10px;
    background: var(--superficie-secundaria);
    cursor: pointer;
}
.controle-tema input::before {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--texto-secundario);
    transition: transform .15s ease, background .15s ease;
}
.controle-tema input:checked { background: var(--destaque-suave); border-color: var(--destaque); }
.controle-tema input:checked::before { transform: translateX(16px); background: var(--destaque); }
.controle-tema input:focus-visible { outline: 2px solid var(--destaque); outline-offset: 2px; }
.acoes-cabecalho { display: flex; align-items: center; gap: 18px; }
.usuario-atual { max-width: 220px; overflow: hidden; color: var(--texto-secundario); text-overflow: ellipsis; white-space: nowrap; }
.botao-texto { border: 0; padding: 6px; background: transparent; color: var(--destaque); font: inherit; cursor: pointer; }
.botao-texto:hover { text-decoration: underline; }
.pagina-autenticacao { min-height: 100vh; }
.cabecalho-autenticacao { min-height: 68px; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; background: var(--superficie); border-bottom: 1px solid var(--borda); }
.cabecalho-autenticacao .marca { padding: 0; }
.conteudo-autenticacao { min-height: calc(100vh - 68px); display: grid; place-items: center; padding: 28px; }
.painel-login { width: min(100%, 400px); padding: 28px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; box-shadow: var(--sombra); }
[data-portal="gerenciador"] .painel-login { border-top: 4px solid #1d4ed8; }
[data-portal="contador"] .painel-login { border-top: 4px solid #2563eb; }
[data-portal="empresa"] .painel-login { border-top: 4px solid #0284c7; }
.login-cabecalho { margin-bottom: 22px; }
.login-cabecalho h1 { margin: 2px 0 6px; font-size: 24px; }
.login-cabecalho > p:last-child { margin: 0; color: var(--texto-secundario); }
.formulario-login { display: grid; gap: 8px; }
.formulario-login label { margin-top: 6px; font-weight: 600; }
.formulario-login input:not([type="hidden"]) { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.formulario-login input:focus { border-color: var(--destaque); outline: 2px solid var(--destaque-suave); }
.botao-primario { min-height: 42px; margin-top: 14px; border: 1px solid var(--destaque); border-radius: 6px; background: var(--destaque); color: var(--texto-destaque); font: inherit; font-weight: 700; cursor: pointer; }
.botao-primario:hover { filter: brightness(.94); }
.mensagem-erro { margin-bottom: 14px; padding: 10px 12px; border-left: 3px solid #d92d20; background: color-mix(in srgb, #d92d20 9%, var(--superficie)); color: var(--texto); }
.acao-cancelar-renovacao { margin-top: 10px; text-align: center; }
main { padding: 24px 28px; }
.resumo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.resumo-gerenciador { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.indicador { min-height: 130px; padding: 18px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; box-shadow: var(--sombra); }
.indicador span, .indicador small { display: block; color: var(--texto-secundario); }
.indicador strong { display: block; margin: 10px 0 4px; font-size: 28px; }
.indicador.alerta strong { color: var(--alerta); }
.secao-tabela { margin-top: 20px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; box-shadow: var(--sombra); }
.secao-titulo { padding: 18px 20px; border-bottom: 1px solid var(--borda); }
.secao-titulo h2 { margin: 0; font-size: 16px; }
.secao-titulo p, .estado-vazio p { margin: 3px 0 0; color: var(--texto-secundario); }
.estado-vazio { min-height: 220px; display: grid; place-content: center; text-align: center; padding: 30px; }
.lista-modulos { display: grid; gap: 1px; background: var(--borda); }
.modulo-plataforma { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 20px; background: var(--superficie); }
.modulo-plataforma p { margin: 2px 0 0; color: var(--texto-secundario); }
.estado { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 9px; border-radius: 6px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.estado-ativo { background: var(--sucesso-suave); color: var(--sucesso); }
.estado-inativo { background: var(--superficie-secundaria); color: var(--texto-secundario); }
.cabecalho-painel-operacional { align-items: center; }
.atalhos-painel { display: flex; align-items: center; gap: 8px; }
.resumo-operacional { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); box-shadow: var(--sombra); }
.indicador-operacional { min-width: 0; min-height: 92px; padding: 13px 15px; border-right: 1px solid var(--borda); border-bottom: 2px solid var(--destaque); }
.indicador-operacional:nth-child(4n) { border-right: 0; }
.indicador-operacional:nth-child(-n+4) { border-bottom-width: 1px; border-bottom-color: var(--borda); }
.indicador-operacional span, .indicador-operacional small { display: block; overflow: hidden; color: var(--texto-secundario); text-overflow: ellipsis; white-space: nowrap; }
.indicador-operacional span { font-size: 12px; font-weight: 700; }
.indicador-operacional strong { display: block; margin: 5px 0 1px; font-size: 23px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.indicador-operacional small { font-size: 11px; }
.indicador-operacional.atencao { border-bottom-color: var(--alerta); }
.indicador-operacional.atencao strong { color: var(--alerta); }
.indicador-operacional.critico { border-bottom-color: #d92d20; }
.indicador-operacional.critico strong { color: #d92d20; }
.indicador-operacional.contexto-plataforma { border-bottom-color: #7c3aed; }
.grade-alertas-operacionais { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.painel-alertas { min-width: 0; }
.titulo-com-acao { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.titulo-com-acao > div { min-width: 0; }
.titulo-com-acao > a { color: var(--destaque); font-size: 12px; font-weight: 700; white-space: nowrap; }
.titulo-com-acao > a:hover { text-decoration: underline; }
.lista-alertas { display: grid; }
.item-alerta { min-width: 0; min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 16px; border-bottom: 1px solid var(--borda); }
.item-alerta:last-child { border-bottom: 0; }
.item-alerta:hover { background: var(--destaque-suave); }
.item-alerta-principal { min-width: 0; }
.item-alerta-principal strong, .item-alerta-principal small, .item-alerta-estado small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-alerta-principal small, .item-alerta-estado small { margin-top: 3px; color: var(--texto-secundario); font-size: 11px; }
.item-alerta-estado { flex: 0 0 auto; max-width: 150px; text-align: right; }
.lista-alertas-vazia { min-height: 118px; display: grid; place-content: center; padding: 22px; text-align: center; }
.lista-alertas-vazia small { margin-top: 3px; color: var(--texto-secundario); }
.cabecalho-pagina { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.cabecalho-pagina h2, .painel-formulario h3 { margin: 0; font-size: 17px; }
.cabecalho-pagina p { margin: 3px 0 0; color: var(--texto-secundario); }
.contador-registros { color: var(--texto-secundario); white-space: nowrap; }
.resumo-fiscal { display: grid; grid-template-columns: repeat(8, minmax(125px, 1fr)); gap: 0; margin-bottom: 14px; overflow-x: auto; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); box-shadow: var(--sombra); }
.resumo-fiscal-item { min-width: 0; min-height: 64px; padding: 8px 12px; border: 0; border-right: 1px solid var(--borda); border-bottom: 2px solid var(--texto-secundario); border-radius: 0; background: transparent; box-shadow: none; }
.resumo-fiscal-item:last-child { border-right: 0; }
.resumo-fiscal-item span, .resumo-fiscal-item small { display: block; color: var(--texto-secundario); }
.resumo-fiscal-item span { overflow: hidden; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.resumo-fiscal-item strong { display: block; margin: 3px 0 1px; font-size: 16px; font-variant-numeric: tabular-nums; line-height: 1; }
.resumo-fiscal-item small { overflow: hidden; font-size: 11px; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.resumo-fiscal-item.total { border-bottom-color: #475569; }
.resumo-fiscal-item.nfe { border-bottom-color: #2563eb; }
.resumo-fiscal-item.nfce { border-bottom-color: #0891b2; }
.resumo-fiscal-item.entrada { border-bottom-color: #7c3aed; }
.resumo-fiscal-item.saida { border-bottom-color: #0284c7; }
.resumo-fiscal-item.autorizado { border-bottom-color: #16803c; }
.resumo-fiscal-item.cancelado { border-bottom-color: #d92d20; }
.resumo-fiscal-item.denegado { border-bottom-color: #b45309; }
.painel-formulario { padding: 20px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; box-shadow: var(--sombra); }
.painel-formulario h3 { margin-bottom: 14px; }
.formulario-cadastro { display: grid; gap: 8px; max-width: 680px; }
.formulario-cadastro.grade-tres { max-width: none; grid-template-columns: minmax(170px, .7fr) minmax(240px, 1.4fr) minmax(220px, 1fr); gap: 12px; }
.formulario-cadastro.grade-usuarios { max-width: none; grid-template-columns: repeat(5, minmax(140px, 1fr)); gap: 12px; }
.formulario-cadastro.grade-licenciamento { max-width: none; grid-template-columns: 180px minmax(260px, 1.4fr) minmax(220px, 1fr) minmax(220px, 1fr) 160px auto; gap: 12px; align-items: end; }
.formulario-cadastro.grade-plano { max-width: none; grid-template-columns: 150px minmax(200px, 1fr) 140px 140px 130px 150px; gap: 12px; align-items: end; }
.formulario-cadastro.grade-assinatura { max-width: none; grid-template-columns: minmax(260px, 1.5fr) minmax(210px, 1fr) 130px 150px 150px 140px; gap: 12px; align-items: end; }
.formulario-cadastro.grade-recurso { max-width: none; grid-template-columns: minmax(190px, .7fr) minmax(240px, 1fr) minmax(300px, 1.5fr) auto; gap: 12px; align-items: end; }
.formulario-cadastro.grade-instalacao-licenciada { max-width: none; grid-template-columns: minmax(280px, 1.5fr) minmax(220px, 1fr) 130px auto; gap: 12px; align-items: end; }
.grade-assinatura .campo-motivo-assinatura { grid-column: 1 / -2; }
.aviso-formulario { margin: 0; color: var(--texto-secundario); }
.grade-plano .campo-descricao-plano { grid-column: 1 / -2; }
.formulario-cadastro > div { min-width: 0; }
.formulario-cadastro label { display: block; margin-bottom: 5px; font-weight: 600; }
.formulario-cadastro input, .formulario-cadastro select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.formulario-cadastro input:focus, .formulario-cadastro select:focus { border-color: var(--destaque); outline: 2px solid var(--destaque-suave); }
.formulario-dados-cadastrais { max-width: none; gap: 18px; }
.formulario-dados-cadastrais fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.formulario-dados-cadastrais legend { width: 100%; margin-bottom: 12px; padding: 0 0 7px; border-bottom: 1px solid var(--borda); color: var(--texto-secundario); font-size: 12px; font-weight: 700; text-transform: uppercase; }
.grade-campos { display: grid; gap: 12px; }
.grade-campos > div { min-width: 0; }
.grade-identificacao-escritorio { grid-template-columns: minmax(280px, 1.5fr) minmax(200px, .7fr); }
.grade-identificacao-empresa { grid-template-columns: minmax(190px, .7fr) minmax(260px, 1.4fr) minmax(220px, 1fr); }
.grade-contato { grid-template-columns: minmax(260px, 1fr) minmax(190px, .55fr); }
.grade-endereco { grid-template-columns: 140px minmax(280px, 1.4fr) 120px minmax(190px, .8fr); }
.grade-endereco .campo-logradouro { grid-column: span 2; }
.cabecalho-formulario { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.cabecalho-formulario h3 { margin-bottom: 0; }
.acoes-formulario { display: flex; align-items: end; }
.botao-primario.compacto { min-height: 40px; margin: 0; padding: 8px 16px; }
.mensagem { margin-bottom: 14px; padding: 11px 13px; border-left: 3px solid; background: var(--superficie); }
.mensagem.sucesso { border-color: var(--sucesso); }
.mensagem.erro { border-color: #d92d20; }
.tabela-administracao { margin-top: 16px; }
.rolagem-tabela { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px 16px; border-bottom: 1px solid var(--borda); text-align: left; vertical-align: middle; }
th { color: var(--texto-secundario); font-size: 12px; font-weight: 700; }
td strong, td small { display: block; }
td small { margin-top: 2px; color: var(--texto-secundario); }
tbody tr:last-child td { border-bottom: 0; }
.dado-mono { font-family: Consolas, monospace; }
.coluna-acao { width: 100px; }
.tabela-usuarios .coluna-acao { width: 230px; }
.situacao { display: inline-block; padding: 3px 8px; border-radius: 12px; background: var(--superficie-secundaria); color: var(--texto-secundario); font-size: 11px; font-weight: 700; }
.situacao.ativa, .situacao.ativo { background: var(--sucesso-suave); color: var(--sucesso); }
.situacao.teste { background: var(--destaque-suave); color: var(--destaque); }
.situacao.suspensa, .situacao.expirada { background: color-mix(in srgb, var(--alerta) 12%, var(--superficie)); color: var(--alerta); }
.situacao.cancelada { background: color-mix(in srgb, #d92d20 10%, var(--superficie)); color: #d92d20; }
.situacao.bloqueada, .situacao.revogada { background: color-mix(in srgb, #d92d20 10%, var(--superficie)); color: #d92d20; }
.situacao.conectado { background: var(--sucesso-suave); color: var(--sucesso); }
.situacao.atencao { background: color-mix(in srgb, var(--alerta) 12%, var(--superficie)); color: var(--alerta); }
.situacao.sem-contato, .situacao.revogada { background: color-mix(in srgb, #d92d20 10%, var(--superficie)); color: #d92d20; }
.situacao.aguardando { background: var(--superficie-secundaria); color: var(--texto-secundario); }
.botao-secundario { min-height: 32px; padding: 5px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; cursor: pointer; }
.botao-secundario:hover { border-color: var(--destaque); color: var(--destaque); }
.acoes-tabela { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.acoes-tabela form { margin: 0; }
.acoes-tabela .botao-secundario { display: inline-flex; align-items: center; justify-content: center; }
.tabela-vazia { height: 110px; color: var(--texto-secundario); text-align: center; }
.painel-vazio { background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; }
.formulario-cadastro.grade-instalacao { max-width: none; grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) auto; gap: 12px; }
.formulario-selecao-vinculo { display: grid; grid-template-columns: minmax(280px, 520px) auto; gap: 12px; align-items: end; }
.formulario-selecao-vinculo label { display: block; margin-bottom: 5px; font-weight: 600; }
.formulario-selecao-vinculo select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.painel-vinculos { padding: 18px; }
.cabecalho-lista-vinculos { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.cabecalho-lista-vinculos h3, .cabecalho-lista-vinculos p { margin: 0; }
.cabecalho-lista-vinculos p { margin-top: 4px; color: var(--texto-secundario); font-size: 13px; }
.lista-vinculos-empresas { display: grid; grid-template-columns: repeat(2, minmax(240px, 1fr)); gap: 8px; }
.item-vinculo-empresa { display: flex; align-items: center; gap: 11px; min-height: 56px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 6px; cursor: pointer; }
.item-vinculo-empresa:hover { background: var(--superficie-secundaria); }
.item-vinculo-empresa.item-inativo { opacity: .65; cursor: default; }
.composicao-plano { margin-top: 16px; }
.formulario-composicao-plano { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--borda); }
.item-vinculo-empresa input { width: 18px; height: 18px; margin: 0; }
.item-vinculo-empresa span { display: grid; gap: 3px; }
.item-vinculo-empresa small { color: var(--texto-secundario); }
.token-novo { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(320px, 1.2fr); gap: 18px; margin-bottom: 16px; padding: 16px 18px; border: 1px solid var(--destaque); border-radius: 8px; background: var(--destaque-suave); }
.token-novo p { margin: 3px 0 0; color: var(--texto-secundario); }
.token-novo input { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--destaque); border-radius: 6px; background: var(--superficie); color: var(--texto); font: 13px Consolas, monospace; }
.credencial-temporaria { display: grid; grid-template-columns: minmax(240px, .7fr) minmax(420px, 1.3fr); align-items: end; gap: 18px; margin-bottom: 16px; padding: 16px 18px; border: 1px solid var(--destaque); border-radius: 8px; background: var(--destaque-suave); }
.credencial-temporaria p { margin: 4px 0 0; color: var(--texto-secundario); }
.campos-credencial { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(280px, 1.3fr); gap: 10px; }
.campos-credencial label { min-width: 0; color: var(--texto-secundario); font-size: 12px; font-weight: 700; }
.campos-credencial input { width: 100%; min-height: 38px; margin-top: 5px; padding: 7px 9px; border: 1px solid var(--destaque); border-radius: 6px; background: var(--superficie); color: var(--texto); font: 13px Consolas, monospace; }
.acoes-linha { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.botao-secundario.perigo:hover { border-color: #d92d20; color: #d92d20; }
.painel-filtros { padding: 16px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; box-shadow: var(--sombra); }
.formulario-filtros { display: grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); gap: 10px; align-items: end; }
.formulario-filtros > div { min-width: 0; }
.formulario-filtros label { display: block; margin-bottom: 5px; font-size: 12px; font-weight: 600; }
.formulario-filtros input, .formulario-filtros select { width: 100%; min-height: 38px; padding: 7px 9px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.formulario-filtros input:focus, .formulario-filtros select:focus { border-color: var(--destaque); outline: 2px solid var(--destaque-suave); }
.filtros-documentos { grid-template-columns: 140px 140px minmax(180px, 1.2fr) 115px 160px 120px minmax(155px, .8fr) auto; gap: 8px; }
.filtros-documentos .acoes-filtros { flex-wrap: nowrap; white-space: nowrap; }
.filtros-documentos .acoes-filtros > * { min-height: 38px; }
.acoes-filtros, .acoes-detalhe { display: flex; align-items: center; gap: 7px; }
.acao-exportar { display: flex; justify-content: flex-end; align-items: end; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--borda); }
.campo-exportacao label { display: block; margin-bottom: 5px; font-size: 12px; font-weight: 600; }
.campo-exportacao select { min-width: 230px; min-height: 38px; padding: 7px 9px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.link-botao { display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.tabela-documentos { margin-top: 16px; }
.tabela-documentos td:first-child { min-width: 300px; }
.valor-documento { white-space: nowrap; font-variant-numeric: tabular-nums; }
.paginacao { display: grid; grid-template-columns: 100px 1fr 100px; align-items: center; gap: 12px; margin-top: 14px; text-align: center; }
.detalhe-cabecalho { align-items: center; }
.painel-detalhe { padding: 22px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; box-shadow: var(--sombra); }
.grade-detalhes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 28px; margin: 0; }
.grade-detalhes div { min-width: 0; }
.grade-detalhes dt { margin-bottom: 4px; color: var(--texto-secundario); font-size: 12px; font-weight: 600; }
.grade-detalhes dd { margin: 0; font-weight: 600; }
.grade-detalhes .detalhe-largo { grid-column: 1 / -1; }
.quebra-texto { overflow-wrap: anywhere; }
.resumo-panorama { display: grid; grid-template-columns: repeat(7, minmax(108px, 1fr)); margin-bottom: 14px; overflow-x: auto; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); box-shadow: var(--sombra); }
.resumo-panorama-item { min-width: 108px; padding: 9px 12px; border-right: 1px solid var(--borda); border-bottom: 2px solid #64748b; }
.resumo-panorama-item:last-child { border-right: 0; }
.resumo-panorama-item span { display: block; overflow: hidden; color: var(--texto-secundario); font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.resumo-panorama-item strong { display: block; margin-top: 3px; font-size: 18px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.resumo-panorama-item.requer_acao, .resumo-panorama-item.rejeitadas { border-bottom-color: #d92d20; }
.resumo-panorama-item.contingencias { border-bottom-color: #d97706; }
.resumo-panorama-item.inutilizadas { border-bottom-color: #7c3aed; }
.resumo-panorama-item.autorizadas { border-bottom-color: #16803c; }
.resumo-panorama-item.canceladas { border-bottom-color: #475569; }
.filtros-panorama { grid-template-columns: 135px 135px minmax(180px, 1fr) 100px 150px minmax(180px, .8fr); gap: 8px; }
.filtro-marcacao { min-height: 38px; display: flex !important; align-items: center; gap: 7px; margin: 0 !important; padding: 0 8px; border: 1px solid var(--borda); border-radius: 6px; white-space: nowrap; cursor: pointer; }
.filtro-marcacao input { width: 16px !important; min-height: 16px !important; margin: 0; }
.tabela-panorama { margin-top: 16px; }
.tabela-panorama td:first-child { min-width: 230px; }
.tabela-panorama td:nth-child(2) { min-width: 160px; }
.chave-resumida { max-width: 220px; overflow: hidden; font-family: Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.retorno-fiscal { max-width: 360px; }
.retorno-fiscal small { max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.data-curta, .numero-centralizado { white-space: nowrap; font-variant-numeric: tabular-nums; }
.numero-centralizado { text-align: center; }
.situacao.fiscal-autorizada { background: var(--sucesso-suave); color: var(--sucesso); }
.situacao.fiscal-contingencia, .situacao.fiscal-pendente { background: color-mix(in srgb, #d97706 12%, var(--superficie)); color: #b45309; }
.situacao.fiscal-rejeitada, .situacao.fiscal-nao_transmitida { background: color-mix(in srgb, #d92d20 10%, var(--superficie)); color: #d92d20; }
.situacao.fiscal-inutilizada { background: color-mix(in srgb, #7c3aed 11%, var(--superficie)); color: #7c3aed; }
.resumo-auditoria { display: grid; grid-template-columns: repeat(5, minmax(125px, 1fr)); margin-bottom: 14px; overflow-x: auto; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); box-shadow: var(--sombra); }
.resumo-auditoria-item { min-width: 125px; padding: 9px 12px; border-right: 1px solid var(--borda); border-bottom: 2px solid var(--destaque); }
.resumo-auditoria-item:last-child { border-right: 0; }
.resumo-auditoria-item span { display: block; overflow: hidden; color: var(--texto-secundario); font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.resumo-auditoria-item strong { display: block; margin-top: 3px; font-size: 18px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.resumo-auditoria-item.negada { border-bottom-color: #d92d20; }
.resumo-auditoria-item.vigente { border-bottom-color: var(--sucesso); }
.resumo-auditoria-item.vencida { border-bottom-color: var(--alerta); }
.resumo-auditoria-item.revogada { border-bottom-color: #64748b; }
.filtros-auditoria { grid-template-columns: 140px 140px minmax(190px, 1.2fr) 150px 145px minmax(200px, 1fr) auto; gap: 8px; }
.tabela-auditoria { margin-top: 16px; }
.tabela-auditoria td:nth-child(2), .tabela-auditoria td:nth-child(3) { min-width: 190px; }
.motivo-auditoria { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.situacao.auditoria-sucesso, .situacao.auditoria-vigente { background: var(--sucesso-suave); color: var(--sucesso); }
.situacao.auditoria-negada { background: color-mix(in srgb, #d92d20 10%, var(--superficie)); color: #d92d20; }
.situacao.auditoria-vencida { background: color-mix(in srgb, var(--alerta) 12%, var(--superficie)); color: var(--alerta); }
.situacao.auditoria-revogada { background: var(--superficie-secundaria); color: var(--texto-secundario); }
.dados-auditoria { max-height: 360px; margin: 0; overflow: auto; padding: 14px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie-secundaria); color: var(--texto); font: 12px/1.55 Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.faixa-alertas-gerenciador { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 14px; padding: 10px 13px; border: 1px solid color-mix(in srgb, var(--alerta) 45%, var(--borda)); border-radius: 7px; background: color-mix(in srgb, var(--alerta) 7%, var(--superficie)); }
.faixa-alertas-gerenciador > span { min-width: 0; overflow: hidden; color: var(--texto-secundario); text-overflow: ellipsis; white-space: nowrap; }
.faixa-alertas-gerenciador.critica { border-color: color-mix(in srgb, #d92d20 45%, var(--borda)); background: color-mix(in srgb, #d92d20 7%, var(--superficie)); }
.faixa-alertas-acao { color: var(--destaque) !important; font-weight: 700; }
.resumo-alertas { display: grid; grid-template-columns: repeat(2, minmax(130px, 180px)); margin-bottom: 14px; overflow: hidden; border: 1px solid var(--borda); border-radius: 7px; background: var(--superficie); }
.resumo-alertas > div { padding: 9px 12px; border-right: 1px solid var(--borda); border-bottom: 2px solid var(--alerta); }
.resumo-alertas > div:last-child { border-right: 0; }
.resumo-alertas span { display: block; color: var(--texto-secundario); font-size: 11px; font-weight: 700; }
.resumo-alertas strong { display: block; margin-top: 2px; font-size: 18px; line-height: 1.1; }
.resumo-alertas .critico { border-bottom-color: #d92d20; }
.filtros-alertas { grid-template-columns: minmax(180px, 260px) auto; }
.lista-alertas-licenciamento { display: grid; gap: 8px; margin-top: 14px; }
.alerta-licenciamento { min-width: 0; display: grid; grid-template-columns: 4px minmax(0, 1fr) auto; gap: 13px; align-items: center; padding: 11px 13px 11px 0; overflow: hidden; border: 1px solid var(--borda); border-radius: 7px; background: var(--superficie); box-shadow: var(--sombra); }
.alerta-licenciamento.estado-resolvido { opacity: .68; }
.alerta-marcador { align-self: stretch; border-radius: 0 4px 4px 0; background: var(--texto-secundario); }
.severidade-media .alerta-marcador { background: var(--alerta); }
.severidade-alta .alerta-marcador { background: #ea580c; }
.severidade-critica .alerta-marcador { background: #d92d20; }
.alerta-conteudo { min-width: 0; }
.alerta-titulo { display: flex; align-items: center; gap: 9px; }
.alerta-conteudo p { margin: 3px 0; }
.alerta-conteudo small { display: block; overflow: hidden; color: var(--texto-secundario); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.alerta-acoes { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.situacao.alerta-pendente { background: color-mix(in srgb, var(--alerta) 12%, var(--superficie)); color: var(--alerta); }
.situacao.alerta-lido { background: var(--destaque-suave); color: var(--destaque); }
.situacao.alerta-resolvido { background: var(--sucesso-suave); color: var(--sucesso); }
.formulario-grupo-cobranca { max-width: none; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: 12px; }
.formulario-grupo-cobranca .selecao-empresas-grupo, .formulario-grupo-cobranca .acoes-formulario { grid-column: 1 / -1; }
.selecao-empresas-grupo { min-width: 0; margin: 8px 0 0; padding: 0; border: 0; }
.selecao-empresas-grupo legend { width: 100%; margin-bottom: 9px; padding-bottom: 6px; border-bottom: 1px solid var(--borda); font-weight: 700; }
.lista-selecao-empresas { display: grid; grid-template-columns: repeat(2,minmax(240px,1fr)); gap: 7px; }
.lista-selecao-empresas label { min-width: 0; display: flex; align-items: center; gap: 10px; margin: 0; padding: 9px 11px; border: 1px solid var(--borda); border-radius: 6px; cursor: pointer; }
.lista-selecao-empresas label:hover { background: var(--superficie-secundaria); }
.lista-selecao-empresas input { width: 17px; min-height: 17px; flex: 0 0 auto; }
.lista-selecao-empresas span, .lista-selecao-empresas strong, .lista-selecao-empresas small { min-width: 0; display: block; }
.lista-selecao-empresas strong, .lista-selecao-empresas small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lista-selecao-empresas small { color: var(--texto-secundario); font-weight: 400; }
.barra-selecao-empresas { display: grid; grid-template-columns: minmax(260px,1fr) auto auto; align-items: end; gap: 8px; margin-bottom: 9px; }
.barra-selecao-empresas label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.barra-selecao-empresas input { min-height: 38px; margin: 0; }
.barra-selecao-empresas .botao-secundario { min-height: 38px; }
.barra-selecao-empresas > span { align-self: center; min-width: 112px; color: var(--texto-secundario); font-size: 12px; text-align: right; }
.lista-selecao-empresas { max-height: 330px; overflow-y: auto; padding-right: 3px; }
.lista-selecao-empresas label:has(input:checked) { border-color: var(--destaque); background: var(--destaque-suave); }
.situacao-assinatura-grupo { margin-top: 2px; color: var(--destaque) !important; font-size: 10px; font-weight: 700 !important; text-transform: uppercase; }
.estado-vazio-selecao { grid-column: 1 / -1; padding: 20px; border: 1px dashed var(--borda); border-radius: 6px; color: var(--texto-secundario); text-align: center; }
.configuracao-integracao { display: grid; gap: 16px; }
.grade-configuracao { display: grid; grid-template-columns: repeat(3,minmax(180px,1fr)); gap: 12px; }
.grade-configuracao-smtp { grid-template-columns: 130px minmax(220px,1.5fr) 110px 170px minmax(220px,1fr); }
.grade-configuracao-pix { grid-template-columns: 150px 190px repeat(2,minmax(220px,1fr)); }
.grade-configuracao .campo-largo { grid-column: span 2; }
.grade-configuracao .campo-total { grid-column: 1 / -1; }
.grade-configuracao label, .painel-teste-integracao label { display: block; margin-bottom: 5px; font-weight: 600; }
.grade-configuracao input, .grade-configuracao select, .painel-teste-integracao input { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.grade-configuracao input:focus, .grade-configuracao select:focus, .painel-teste-integracao input:focus { border-color: var(--destaque); outline: 2px solid var(--destaque-suave); }
.grade-configuracao small { display: block; margin-top: 4px; color: var(--texto-secundario); }
.segredo-status { color: var(--texto-secundario); font-size: 12px; }
.painel-teste-integracao { display: grid; grid-template-columns: minmax(220px,1fr) minmax(340px,1.2fr); align-items: end; gap: 24px; margin-top: 16px; }
.painel-teste-integracao h3, .painel-teste-integracao p { margin: 0; }
.painel-teste-integracao p { margin-top: 3px; color: var(--texto-secundario); }
.acao-em-linha { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.acao-em-linha .botao-secundario, .painel-teste-integracao form > .botao-secundario { min-height: 40px; }
.resumo-cobrancas { display: grid; grid-template-columns: repeat(4,minmax(145px,1fr)); margin-bottom: 14px; overflow: hidden; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); }
.resumo-cobrancas > div { padding: 9px 12px; border-right: 1px solid var(--borda); border-bottom: 2px solid var(--destaque); }
.resumo-cobrancas > div:last-child { border-right: 0; }
.resumo-cobrancas span { display: block; color: var(--texto-secundario); font-size: 11px; font-weight: 700; }
.resumo-entregas { grid-template-columns: repeat(5,minmax(120px,1fr)); }
.filtros-entregas { grid-template-columns: 135px 135px 150px minmax(180px,1fr) minmax(220px,1.3fr) auto; }
.filtros-financeiros { grid-template-columns: 140px 140px minmax(180px,1fr) minmax(160px,.8fr) 170px 150px auto; }
.erro-entrega { max-width: 270px; overflow: hidden; color: var(--texto-secundario); text-overflow: ellipsis; white-space: nowrap; }
.paginacao { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 14px; color: var(--texto-secundario); }
.paginacao a { color: var(--destaque); font-weight: 700; }
.editor-modelos { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 14px; align-items: start; }
.abas-modelos { grid-row: 1 / span 2; display: grid; gap: 5px; }
.aba-modelo { min-height: 40px; padding: 8px 11px; border: 0; border-left: 3px solid transparent; border-radius: 0 5px 5px 0; background: transparent; color: var(--texto-secundario); font: inherit; text-align: left; cursor: pointer; }
.aba-modelo:hover { background: var(--superficie-secundaria); color: var(--texto); }
.aba-modelo.ativo { border-left-color: var(--destaque); background: var(--destaque-suave); color: var(--destaque); font-weight: 700; }
.variaveis-modelo { grid-column: 2; grid-row: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); }
.variaveis-modelo button { border: 1px solid var(--borda); border-radius: 4px; background: var(--superficie-secundaria); color: var(--texto); font: 12px Consolas,monospace; cursor: pointer; }
.formulario-modelo { grid-column: 2; grid-row: 2; }
.formulario-modelo.oculto { display: none; }
.webhook-efetivo output { display: block; margin-top: 5px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 5px; background: var(--superficie-secundaria); color: var(--texto); }
.aviso-campo { display: block; margin-top: 7px; color: var(--perigo); font-size: 13px; font-weight: 700; }
.aviso-campo.aviso-desenvolvimento { color: var(--alerta); }
.configuracao-avancada { border-top: 1px solid var(--borda); padding-top: 10px; }
.configuracao-avancada summary { color: var(--destaque); font-weight: 700; cursor: pointer; }
.configuracao-avancada > div { margin-top: 12px; }
.grade-modelo { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 12px; }
.grade-modelo .campo-largo { grid-column: 2; }
.grade-modelo .campo-total { grid-column: 1 / -1; }
.grade-modelo label { display: block; margin-bottom: 5px; font-weight: 600; }
.grade-modelo input, .grade-modelo select, .grade-modelo textarea { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.grade-modelo textarea { min-height: 150px; resize: vertical; line-height: 1.5; }
.acoes-modelo { display: flex; align-items: center; gap: 8px; }
.acoes-modelo .botao-secundario { margin-top: 14px; min-height: 42px; }
.previa-email { margin-top: 18px; padding: 22px; border: 1px solid var(--borda); border-left: 4px solid var(--destaque); background: var(--superficie-secundaria); }
.previa-email small, .previa-email span { display: block; color: var(--texto-secundario); }
.previa-email h4 { margin: 12px 0 8px; font-size: 19px; }
.previa-email p { max-width: 720px; white-space: pre-line; }
.painel-pagamento-manual { display: grid; grid-template-columns: minmax(220px,.6fr) minmax(0,1.4fr); gap: 24px; margin-top: 16px; }
.painel-pagamento-manual p { margin: 3px 0 0; color: var(--texto-secundario); }
.grade-pagamento-manual { display: grid; grid-template-columns: 150px 180px minmax(180px,1fr) auto; gap: 10px; align-items: end; }
.grade-pagamento-manual label { display: block; margin-bottom: 5px; font-weight: 600; }
.grade-pagamento-manual input, .grade-pagamento-manual select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); font: inherit; }
.faixa-financeira { display: grid; grid-template-columns: repeat(7,minmax(125px,1fr)); margin: 14px 0; overflow-x: auto; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); }
.faixa-financeira > div { min-width: 125px; padding: 10px 12px; border-right: 1px solid var(--borda); border-bottom: 2px solid var(--destaque); }
.faixa-financeira > div:last-child { border-right: 0; }
.faixa-financeira span { display: block; color: var(--texto-secundario); font-size: 11px; font-weight: 700; }
.faixa-financeira strong { display: block; margin-top: 3px; font-size: 16px; white-space: nowrap; }
.faixa-financeira .sucesso { border-bottom-color: var(--sucesso); }
.faixa-financeira .atencao { border-bottom-color: var(--alerta); }
.faixa-financeira .critico { border-bottom-color: #d92d20; }
.resumo-cobrancas strong { display: block; margin-top: 3px; font-size: 17px; }
.resumo-cobrancas .sucesso { border-bottom-color: var(--sucesso); }
.resumo-cobrancas .atencao { border-bottom-color: var(--alerta); }
.fechamento-cobranca { grid-template-columns: 180px auto; }
.situacao.cobranca-paga { background: var(--sucesso-suave); color: var(--sucesso); }
.situacao.cobranca-aguardando_pagamento { background: color-mix(in srgb,var(--alerta) 12%,var(--superficie)); color: var(--alerta); }
.situacao.cobranca-falha, .situacao.cobranca-expirada, .situacao.cobranca-cancelada { background: color-mix(in srgb,#d92d20 10%,var(--superficie)); color: #d92d20; }
.acao-detalhe-cobranca { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--borda); }
.pagina-pagamento { min-height: 100vh; padding: 28px 16px; background: var(--fundo); }
.conteudo-pagamento { width: min(100%,760px); margin: 0 auto; padding: 0; }
.conteudo-pagamento > header { display: flex; justify-content: space-between; padding: 15px 18px; border: 1px solid var(--borda); border-bottom: 0; border-radius: 8px 8px 0 0; background: var(--superficie); }
.conteudo-pagamento > header strong { color: var(--destaque); }
.conteudo-pagamento > header span { color: var(--texto-secundario); }
.pagamento-resumo { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 18px; border: 1px solid var(--borda); background: var(--superficie); }
.pagamento-resumo h1 { margin: 0; font-size: 20px; }
.pagamento-resumo p { margin: 3px 0 0; color: var(--texto-secundario); }
.pagamento-resumo > strong { color: var(--destaque); font-size: 24px; white-space: nowrap; }
.pagamento-pix { display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 24px; padding: 20px 18px; border: 1px solid var(--borda); border-top: 0; background: var(--superficie); }
.qr-pix { width: 210px; aspect-ratio: 1; display: grid; place-items: center; border: 1px solid var(--borda); }
.qr-pix img { width: 100%; height: 100%; object-fit: contain; }
.pagamento-pix h2 { margin: 0 0 4px; font-size: 17px; }
.pagamento-pix textarea { width: 100%; min-height: 90px; margin: 9px 0; resize: vertical; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie-secundaria); color: var(--texto); }
.itens-pagamento { border: 1px solid var(--borda); border-top: 0; background: var(--superficie); }
.itens-pagamento h2 { margin: 0; padding: 12px 18px; border-bottom: 1px solid var(--borda); font-size: 14px; }
.itens-pagamento > div { display: flex; justify-content: space-between; gap: 18px; padding: 10px 18px; border-bottom: 1px solid var(--borda); }
.itens-pagamento > div:last-child { border-bottom: 0; }
.itens-pagamento span small { display: block; color: var(--texto-secundario); }
.conteudo-pagamento footer { padding: 13px; color: var(--texto-secundario); font-size: 11px; text-align: center; }
.pagamento-confirmado { display: grid; gap: 3px; margin: 0; border: 1px solid var(--borda); border-top: 0; }

@media (max-width: 820px) {
    .estrutura { grid-template-columns: 1fr; }
    .menu-lateral { display: none; }
    .resumo { grid-template-columns: 1fr; }
    .cabecalho, main { padding-left: 18px; padding-right: 18px; }
    .usuario-atual { display: none; }
    .acoes-cabecalho { gap: 10px; }
    .cabecalho-autenticacao { padding: 0 18px; }
    .conteudo-autenticacao { padding: 18px; }
    .formulario-cadastro.grade-tres, .formulario-cadastro.grade-usuarios, .formulario-cadastro.grade-instalacao, .formulario-cadastro.grade-licenciamento, .formulario-cadastro.grade-plano, .formulario-cadastro.grade-assinatura, .formulario-cadastro.grade-recurso, .formulario-cadastro.grade-instalacao-licenciada, .formulario-selecao-vinculo, .lista-vinculos-empresas, .token-novo, .credencial-temporaria, .campos-credencial, .grade-campos { grid-template-columns: 1fr; }
    .grade-plano .campo-descricao-plano { grid-column: auto; }
    .grade-assinatura .campo-motivo-assinatura { grid-column: auto; }
    .grade-endereco .campo-logradouro { grid-column: auto; }
    .cabecalho-formulario { align-items: stretch; flex-direction: column; }
    .cabecalho-pagina { align-items: start; flex-direction: column; gap: 6px; }
    .atalhos-painel { align-items: stretch; flex-direction: column; width: 100%; }
    .resumo-operacional, .grade-alertas-operacionais { grid-template-columns: 1fr; }
    .indicador-operacional, .indicador-operacional:nth-child(4n), .indicador-operacional:nth-child(-n+4) { border-right: 0; border-bottom: 1px solid var(--borda); }
    .indicador-operacional:last-child { border-bottom: 2px solid #7c3aed; }
    .item-alerta { align-items: flex-start; }
    .formulario-filtros, .grade-detalhes { grid-template-columns: 1fr; }
    .filtros-panorama { grid-template-columns: 1fr; }
    .filtros-auditoria { grid-template-columns: 1fr; }
    .faixa-alertas-gerenciador { grid-template-columns: 1fr; gap: 3px; }
    .faixa-alertas-gerenciador > span { white-space: normal; }
    .resumo-alertas, .filtros-alertas { grid-template-columns: 1fr; }
    .resumo-alertas > div { border-right: 0; border-bottom: 1px solid var(--borda); }
    .resumo-alertas > div:last-child { border-bottom: 2px solid #d92d20; }
    .alerta-licenciamento { grid-template-columns: 4px minmax(0, 1fr); align-items: start; }
    .alerta-marcador { grid-row: 1 / 3; }
    .alerta-acoes { flex-wrap: wrap; padding-bottom: 2px; }
    .formulario-grupo-cobranca, .lista-selecao-empresas, .resumo-cobrancas, .fechamento-cobranca, .grade-configuracao, .grade-configuracao-smtp, .grade-configuracao-pix, .painel-teste-integracao, .editor-modelos, .grade-modelo, .painel-pagamento-manual, .grade-pagamento-manual { grid-template-columns: 1fr; }
    .abas-modelos, .variaveis-modelo, .formulario-modelo { grid-row: auto; }
    .variaveis-modelo, .formulario-modelo, .grade-modelo .campo-largo, .grade-modelo .campo-total { grid-column: auto; }
    .grade-configuracao .campo-largo, .grade-configuracao .campo-total { grid-column: auto; }
    .barra-selecao-empresas { grid-template-columns: 1fr; }
    .barra-selecao-empresas > span { text-align: left; }
    .resumo-cobrancas > div { border-right: 0; border-bottom: 1px solid var(--borda); }
    .pagamento-resumo { align-items: flex-start; flex-direction: column; gap: 8px; }
    .pagamento-pix { grid-template-columns: 1fr; }
    .qr-pix { width: min(100%,240px); }
    .acoes-filtros, .acoes-detalhe { align-items: stretch; flex-direction: column; width: 100%; }
    .acao-exportar { align-items: stretch; flex-direction: column; }
    .campo-exportacao select { width: 100%; min-width: 0; }
    .detalhe-cabecalho { align-items: stretch; }
}

@media (min-width: 821px) and (max-width: 1180px) {
    .resumo-operacional { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .indicador-operacional, .indicador-operacional:nth-child(4n), .indicador-operacional:nth-child(-n+4) { border-right: 1px solid var(--borda); border-bottom: 1px solid var(--borda); }
    .indicador-operacional:nth-child(2n) { border-right: 0; }
    .indicador-operacional:nth-last-child(-n+2) { border-bottom: 2px solid var(--destaque); }
    .indicador-operacional.atencao:nth-last-child(-n+2) { border-bottom-color: var(--alerta); }
    .indicador-operacional.critico:nth-last-child(-n+2) { border-bottom-color: #d92d20; }
    .indicador-operacional.contexto-plataforma:nth-last-child(-n+2) { border-bottom-color: #7c3aed; }
    .grade-alertas-operacionais { grid-template-columns: 1fr; }
    .formulario-cadastro.grade-usuarios { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
    .formulario-cadastro.grade-tres { grid-template-columns: repeat(2, minmax(200px, 1fr)); }
    .formulario-cadastro.grade-licenciamento, .formulario-cadastro.grade-plano, .formulario-cadastro.grade-assinatura, .formulario-cadastro.grade-recurso, .formulario-cadastro.grade-instalacao-licenciada { grid-template-columns: repeat(2, minmax(190px, 1fr)); }
    .grade-plano .campo-descricao-plano { grid-column: span 2; }
    .grade-assinatura .campo-motivo-assinatura { grid-column: span 2; }
    .grade-identificacao-empresa, .grade-endereco { grid-template-columns: repeat(2, minmax(190px, 1fr)); }
    .grade-endereco .campo-logradouro { grid-column: span 2; }
    .formulario-filtros { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
}

@media (min-width: 821px) and (max-width: 1350px) {
    .filtros-entregas, .filtros-financeiros { grid-template-columns: repeat(3,minmax(170px,1fr)); }
    .painel-pagamento-manual { grid-template-columns: 1fr; }
}

@media (min-width: 1500px) {
    .formulario-filtros { grid-template-columns: 145px 145px minmax(180px, 1.2fr) 120px 130px minmax(150px, .8fr) auto; }
    .filtros-panorama { grid-template-columns: 135px 135px minmax(180px, 1fr) 100px 150px minmax(180px, .8fr) auto auto; }
}