/* Padronização visual do painel (revisão de 30/09/2026).
   Carregado depois dos demais estilos para unificar tamanhos, botões e campos. */

/* Textos de explicação: mesmo tamanho e cor em todas as telas e diálogos. */
body .texto-ajuda,
#painel .nota-custo-item,
#painel #nfse-foz-status {
  margin: 0;
  color: var(--pal-736c80, #736c80);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
}
#painel .dashboard-list .texto-ajuda { padding: 4px 0; }

/* Campos de busca: sempre dentro de um cartão, com a mesma largura. */
#painel .busca-card { margin: 0 0 18px; padding: 18px 22px; }
#painel .busca-card .busca-painel { display: grid; gap: 7px; max-width: 520px; margin: 0; color: var(--pal-514963, #514963); font-size: 12px; font-weight: 600; }
#painel .busca-card .busca-painel input { box-sizing: border-box; width: 100%; min-height: 46px; margin: 0; padding: 11px 14px; border: 1px solid var(--pal-e4e1ea, #e4e1ea); border-radius: 13px; background: var(--pal-fcfbfd, #fcfbfd); font: inherit; font-size: 13px; font-weight: 400; }
#painel .busca-card .busca-painel input:focus { outline: none; border-color: var(--pal-8460d4, #8460d4); box-shadow: 0 0 0 3px rgba(var(--pal-rgb-8460d4, 132, 96, 212), .14); }
#painel #equipamentos-cadastrados > .secao-cabecalho { margin-bottom: 18px; }

/* Catálogo de itens em formato de tabela. */
#painel .itens-catalogo-contagem { color: var(--pal-81798d, #81798d); font-size: 12px; font-weight: 500; }
#painel #itens-catalogo-lista { display: grid; gap: 8px; }
#painel .itens-catalogo-cabecalho,
#painel #itens-catalogo-lista .item-os-linha:not(:has(input)) {
  grid-template-columns: minmax(200px, 3fr) minmax(76px, .7fr) minmax(96px, .8fr) minmax(110px, 1fr) minmax(110px, 1fr) 92px;
}
#painel .itens-catalogo-cabecalho { display: grid; gap: 10px; margin-top: 4px; padding: 0 15px 6px; color: var(--pal-81798d, #81798d); font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
#painel .itens-catalogo-cabecalho[hidden] { display: none; }
#painel #itens-catalogo-lista .item-os-linha:not(:has(input)) > span { color: var(--pal-554d63, #554d63); font-size: 13px; }
#painel #itens-catalogo-lista .item-os-linha > strong { font-size: 13px; }
#painel .item-mao-de-obra { justify-self: start; padding: 3px 10px; border-radius: 999px; background: var(--pal-f3effa, #f3effa); color: var(--pal-5b3f97, #5b3f97) !important; font-size: 11px !important; font-weight: 600; }

/* Cartões de status: nome e cor lado a lado, botões pequenos e iguais. */
#painel form.chamado-status-card { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 18px; border-radius: 16px; box-shadow: 0 8px 24px #2e1b4b0a; }
#painel .chamado-status-card > strong { color: var(--pal-2b2541, #2b2541); font-size: 15px; line-height: 1.35; }
#painel .status-card-campos { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 12px; }
#painel .status-card-campos input { margin: 0 !important; }
#painel .status-card-campos label { margin: 0; }
#painel .chamado-status-card input[type="text"] { min-height: 40px; border-radius: 10px; }
#painel .chamado-status-card input[type="color"] { width: 56px; height: 40px; border-radius: 10px; }
#painel .status-card-acoes { display: flex; flex-wrap: wrap; gap: 8px; }
#painel .status-card-acoes .botao-padrao { min-height: 38px !important; margin: 0 !important; padding: 8px 14px !important; border-radius: 10px !important; font-size: 12px; }
#painel .chamado-status-card > small { color: var(--pal-81798d, #81798d); font-size: 11px; line-height: 1.5; }
#painel #form-cadastrar-status { align-items: end; }
#painel #form-cadastrar-status input[type="color"] { width: 100%; min-height: 46px; padding: 3px; border-radius: 13px; }
#painel #form-cadastrar-status button { margin: 0; min-height: 46px; }

/* Botões de envio de arquivo no mesmo visual dos demais botões. */
#painel input[type="file"] { box-sizing: border-box; width: 100%; max-width: 520px; padding: 7px; border: 1px dashed var(--pal-d9d0ea, #d9d0ea); border-radius: 13px; background: var(--pal-fbfaff, #fbfaff); color: var(--pal-554d63, #554d63); font: inherit; font-size: 12px; cursor: pointer; }
#painel input[type="file"]::file-selector-button { margin-right: 12px; padding: 8px 14px; border: 1px solid var(--pal-e0d8ef, #e0d8ef); border-radius: 10px; background: #fff; color: var(--pal-6947ae, #6947ae); font: 600 12px Poppins, Arial, sans-serif; cursor: pointer; }
#painel input[type="file"]::file-selector-button:hover { background: var(--pal-f5f0fb, #f5f0fb); }

/* Configurações de impressão: listas longas ocupam a linha inteira. */
#painel .configuracao-impressao-grupo .impressao-campo-largo { grid-column: 1 / -1; }

/* Banco de dados: cartão sem espaço vazio e links com aparência de botão. */
/* Cartão de backup com a mesma altura do "Carregar banco de dados"; o backup completo fica no pé do cartão. */
#painel .banco-dados-cards > #banco-dados-backup-card { height: 100%; align-self: stretch; }
#painel #banco-dados-backup-card .banco-dados-completo { display: grid; gap: 9px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--pal-e8e2f0, #e8e2f0); color: var(--pal-514963, #514963); font-size: 13px; }
#painel #banco-dados-backup-card .banco-dados-completo p { margin: 0; }
#painel .banco-dados-cards > #banco-dados-backup-card .form-acoes { margin: 0; }
#painel a:is(.botao-padrao, .botao-secundario) { text-decoration: none; }
#painel #form-banco-dados-reset label > span { display: block; line-height: 1.6; }

/* Finanças tem uma única opção: o submenu não é necessário. */
#painel #secao-financas > nav.submenu-usuarios { display: none; }

/* Celular: cabeçalho compacto e menus quebrando em linhas, sem cortar texto. */
@media (max-width: 600px) {
  .painel-cabecalho { gap: 12px; padding: 16px 18px; border-radius: 18px; }
  .painel-marca { flex-direction: row !important; align-items: center; gap: 12px; text-align: left; }
  .painel-marca .painel-logo-branca { width: 84px !important; }
  .painel-cabecalho h1 { font-size: 17px; }
  #saudacao-painel { display: none; }
  .painel-marca { flex-wrap: wrap; }
  .painel-marca .logo-nome { overflow-wrap: normal; word-break: normal; font-size: 19px !important; max-width: 100% !important; }
  .painel-cabecalho-acoes { position: static !important; width: 100%; justify-content: flex-start; gap: 8px; }
  .painel-cabecalho-acoes > * { flex: 1 1 auto; min-height: 36px !important; padding: 6px 10px !important; }
  #painel .menu { flex-wrap: wrap; overflow-x: visible; }
  #painel .menu button { flex: 1 1 auto; }
  #painel .submenu-usuarios { flex-wrap: wrap; overflow-x: visible; }
  #painel .itens-catalogo-cabecalho { display: none; }
  #painel #itens-catalogo-lista .item-os-linha:not(:has(input)) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }
  #painel #itens-catalogo-lista .item-os-linha:not(:has(input)) > strong,
  #painel #itens-catalogo-lista .item-os-linha:not(:has(input)) > button { grid-column: 1 / -1; }
  #painel #itens-catalogo-lista .item-os-linha:not(:has(input)) > span::before { content: attr(data-rotulo); display: block; color: var(--pal-8a8295, #8a8295); font-size: 10px; font-weight: 500; }
  #painel .status-card-campos { grid-template-columns: minmax(0, 1fr) auto; }
  #painel .item-mao-de-obra { padding: 0; border-radius: 0; background: none; }
}

/* Categorias de acesso: explicação do que cada permissão já inclui. */
#painel .permissoes-usuario label:has(.permissao-inclui) { flex-wrap: wrap; }
#painel .permissao-inclui { flex-basis: 100%; margin: -2px 0 2px 22px; color: var(--pal-81798d, #81798d); font-size: 10px; line-height: 1.45; }
#painel .permissoes-usuario label .permissao-texto { flex: 1 1 0; min-width: 0; }

/* Endereço público do painel (Informações da empresa). */
#painel .endereco-publico-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px; margin: 12px 0 0; padding: 0; border: 0; box-shadow: none; background: none; }
#painel .endereco-publico-form label { display: grid; gap: 7px; font-size: 12px; font-weight: 600; }
#painel .endereco-publico-form input { box-sizing: border-box; width: 100%; min-height: 46px; padding: 11px 14px; border: 1px solid var(--pal-e4e1ea, #e4e1ea); border-radius: 13px; font: inherit; font-size: 13px; }
#painel .endereco-publico-form button { margin: 0; min-height: 46px; }
#painel .endereco-publico-form p { grid-column: 1 / -1; }
@media (max-width: 600px) { #painel .endereco-publico-form { grid-template-columns: 1fr; } }

/* Configuração de notas fiscais. */
#painel #form-fiscal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
#painel #form-fiscal .largo { grid-column: 1 / -1; }
#painel #form-fiscal article { display: grid; align-content: start; gap: 12px; }
#painel #form-fiscal article h3 { margin: 0; }
#painel #form-fiscal label { display: grid; gap: 6px; margin: 0; color: var(--pal-514963, #514963); font-size: 12px; font-weight: 600; }
#painel #form-fiscal label small { color: var(--pal-81798d, #81798d); font-size: 11px; font-weight: 400; }
#painel #form-fiscal :is(input:not([type="checkbox"]), select) { box-sizing: border-box; width: 100%; min-height: 44px; margin: 0; padding: 10px 12px; border: 1px solid var(--pal-e4e1ea, #e4e1ea); border-radius: 12px; background: var(--pal-fcfbfd, #fcfbfd); font: inherit; font-size: 13px; font-weight: 400; }
#painel .fiscal-opcoes { display: grid; gap: 10px; }
#painel #form-fiscal label.opcao-fiscal { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 500; }
#painel .opcao-fiscal input { width: 17px; height: 17px; margin: 0; accent-color: var(--pal-7954bd, #7954bd); }
#painel .fiscal-cnaes, .notas-fiscais-avisos { margin: 0; padding: 10px 14px 10px 28px; border-radius: 12px; background: var(--pal-fbfaff, #fbfaff); color: var(--pal-554d63, #554d63); font-size: 12px; line-height: 1.6; }
#painel .fiscal-cnaes li.principal { font-weight: 600; }
@media (max-width: 760px) { #painel #form-fiscal { grid-template-columns: 1fr; } }
/* Janela de notas fiscais da OS. */
.notas-fiscais-avisos:empty { display: none; }
.notas-fiscais-lista { display: grid; gap: 10px; margin: 12px 0; }
.nota-fiscal-item { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--pal-e8e2f0, #e8e2f0); border-radius: 12px; font-size: 13px; }
.nota-fiscal-item strong { color: var(--pal-2b2541, #2b2541); }
.nota-fiscal-item small { color: var(--pal-736c80, #736c80); }
.nota-fiscal-item a { margin-right: 12px; color: var(--pal-6947ae, #6947ae); font-weight: 600; }
.nota-fiscal-status { justify-self: start; padding: 2px 9px; border-radius: 999px; background: #f3effa; color: #5b3f97; font-size: 11px; font-weight: 600; }
.nota-fiscal-status.autorizado { background: #e4f6ec; color: #1d6b47; }
.nota-fiscal-status.erro, .nota-fiscal-status.erro_autorizacao { background: #fbe7ee; color: #8e2c4b; }

/* Formato de impressão de cada documento. */
#painel .impressao-formato { display: grid; gap: 6px; margin: 4px 0 6px; }
#painel .impressao-formato label { display: grid; gap: 7px; color: var(--pal-514963, #514963); font-size: 12px; font-weight: 600; }
#painel .impressao-formato select { box-sizing: border-box; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--pal-e4e1ea, #e4e1ea); border-radius: 11px; background: var(--pal-fcfbfd, #fcfbfd); font: inherit; font-size: 13px; font-weight: 400; }
#painel [data-configuracao-impressao] [hidden] { display: none !important; }

/* Mensalidade do painel. */
#painel #form-mensalidade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
#painel #form-mensalidade .largo { grid-column: 1 / -1; }
#painel #form-mensalidade article { display: grid; align-content: start; gap: 12px; }
#painel #form-mensalidade article h3 { margin: 0; }
#painel #form-mensalidade label { display: grid; gap: 6px; margin: 0; color: var(--pal-514963, #514963); font-size: 12px; font-weight: 600; }
#painel #form-mensalidade label.opcao-fiscal { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 500; }
#painel #form-mensalidade label small { color: var(--pal-81798d, #81798d); font-size: 11px; font-weight: 400; }
#painel #form-mensalidade input:not([type="checkbox"]) { box-sizing: border-box; width: 100%; min-height: 44px; margin: 0; padding: 10px 12px; border: 1px solid var(--pal-e4e1ea, #e4e1ea); border-radius: 12px; background: var(--pal-fcfbfd, #fcfbfd); font: inherit; font-size: 13px; font-weight: 400; }
@media (max-width: 760px) { #painel #form-mensalidade { grid-template-columns: 1fr; } }
.mensalidade-atual { display: grid; gap: 12px; justify-items: center; margin: 8px 0; text-align: center; }
.mensalidade-atual .mensalidade-valor { color: var(--pal-2b2541, #2b2541); font-size: 26px; font-weight: 700; }
.mensalidade-atual .mensalidade-status { padding: 3px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.mensalidade-status.aberta { background: #f3effa; color: #5b3f97; } .mensalidade-status.atrasada { background: #fbe7ee; color: #8e2c4b; } .mensalidade-status.paga { background: #e4f6ec; color: #1d6b47; }
.mensalidade-atual img { width: 190px; height: 190px; border: 1px solid #e8e2f0; border-radius: 12px; }
.mensalidade-atual .mensalidade-codigo { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; width: 100%; }
.mensalidade-atual .mensalidade-codigo input { min-width: 0; padding: 9px 10px; border: 1px solid #e4e1ea; border-radius: 10px; font: 11px monospace; }
.mensalidade-atual small { color: #81798d; font-size: 11px; }
.mensalidade-atual a.botao-padrao { text-decoration: none; }
.mensalidade-historico { margin: 6px 0 10px; font-size: 12px; color: #554d63; }
.mensalidade-historico table { width: 100%; border-collapse: collapse; }
.mensalidade-historico td, .mensalidade-historico th { padding: 6px 4px; border-bottom: 1px solid #f0edf4; text-align: left; }

/* Recado do dono da Central na mensalidade */
.mensalidade-recado { justify-self: stretch; margin: 0; padding: 10px 14px; border-left: 4px solid #7054d4; border-radius: 10px; background: #f4f0fc; color: #3d3552; font-size: 13px; line-height: 1.5; white-space: pre-line; text-align: left; }
#abrir-mensalidade.com-recado { position: relative; }
#abrir-mensalidade.com-recado::after { content: ""; position: absolute; top: 4px; right: 4px; width: 8px; height: 8px; border-radius: 50%; background: #f5a623; box-shadow: 0 0 0 2px #fff; }
