/* Componentes comuns — sem dependências externas ou estilos inline. */
.icone {
  display: inline-block;
  flex: 0 0 auto;
  width: 1.375rem;
  height: 1.375rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
}
.botao, .acesso__botao, .admin-topo__botao-sair {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--esp-1);
  min-height: var(--alvo-controle);
  max-width: 100%;
  padding: .875rem 1.75rem;
  border: 1px solid transparent;
  border-radius: var(--raio-1);
  background: transparent;
  font-family: var(--fonte-texto);
  font-size: var(--fs-small);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .14em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  transition: background-color var(--duracao) var(--movimento), color var(--duracao) var(--movimento), border-color var(--duracao) var(--movimento);
}
.botao--primario, .acesso__botao {
  /* Ouro escuro no preenchimento para contraste AA do texto branco pequeno. */
  background: var(--cor-ouro-escuro);
  border-color: var(--cor-ouro);
  color: var(--cor-superficie);
}
.botao--primario:hover, .acesso__botao:hover { background: var(--cor-texto); border-color: var(--cor-texto); }
.botao--secundario, .admin-topo__botao-sair { border-color: var(--cor-texto); color: var(--cor-texto); }
.botao--secundario:hover, .admin-topo__botao-sair:hover { background: var(--cor-texto); color: var(--cor-fundo); }
.botao--perigo { border-color: var(--cor-erro); color: var(--cor-erro); }
.botao--perigo:hover { background: var(--cor-erro); color: var(--cor-superficie); }
.botao--link, .acesso__link { color: var(--cor-ouro-escuro); }
.botao--link { padding-inline: .75rem; }
.botao--link:hover { background: var(--cor-ouro-veu); text-decoration: underline; }
.acesso__link {
  display: inline-flex;
  align-items: center;
  min-height: var(--alvo-toque);
  padding: .5rem 0;
  border: 0;
  background: transparent;
  font-size: .875rem;
  text-decoration: underline;
  text-underline-offset: .3em;
}
:is(.botao, .acesso__botao).is-disabled,
:is(.botao, .acesso__botao):disabled,
:is(.botao, .acesso__botao)[aria-disabled="true"],
fieldset:disabled .botao {
  border-color: var(--cor-linha-forte);
  background: var(--cor-fundo-alt);
  color: var(--cor-texto-2);
  cursor: not-allowed;
  text-decoration: none;
}
.is-loading { cursor: progress; }
.botao.is-loading::after {
  content: "";
  width: 1em;
  height: 1em;
  border: 1px solid currentColor;
  border-inline-end-color: transparent;
  border-radius: 50%;
  animation: girar 900ms linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }

/* Formulários */
.formulario { min-width: 0; }
.formulario__grupo {
  margin-bottom: var(--esp-3);
  padding: var(--esp-3);
  border: 1px solid var(--cor-linha);
  border-radius: var(--raio-2);
  background: var(--cor-superficie);
}
.formulario__legenda {
  padding-inline: .5rem;
  font-family: var(--fonte-titulo);
  font-size: 1.625rem;
  line-height: 1.3;
}
.formulario__campo, .acesso__campo { min-width: 0; margin-bottom: var(--esp-3); }
.formulario__rotulo, .filtros__rotulo, .acesso__rotulo {
  display: block;
  margin-bottom: .5rem;
  color: var(--cor-texto-2);
  font-size: .75rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.formulario__opcional { font-weight: 400; letter-spacing: normal; text-transform: none; }
.formulario__entrada, .formulario__selecao, .filtros__entrada, .filtros__selecao, .acesso__entrada {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: var(--alvo-controle);
  padding: .75rem .875rem;
  border: 1px solid var(--cor-linha-forte);
  border-radius: var(--raio-1);
  background: var(--cor-superficie-2);
  color: var(--cor-texto);
  font-size: 1rem;
  line-height: 1.5;
  transition: border-color var(--duracao) var(--movimento), box-shadow var(--duracao) var(--movimento);
}
select.formulario__selecao, select.filtros__selecao { padding-inline-end: 2rem; }
:is(.formulario__entrada, .formulario__selecao, .filtros__entrada, .filtros__selecao, .acesso__entrada):focus {
  border-color: var(--cor-ouro-claro);
  outline: 2px solid var(--cor-ouro-escuro);
  outline-offset: 2px;
  box-shadow: var(--foco-halo);
}
input::placeholder, textarea::placeholder { color: var(--cor-texto-2); opacity: 1; }
:is(input, select, textarea):disabled, :is(input, textarea)[readonly] {
  border-color: var(--cor-linha);
  background: var(--cor-fundo-alt);
  color: var(--cor-texto-2);
}
:is(input, select, textarea):disabled { cursor: not-allowed; }
:is(input, select, textarea)[aria-invalid="true"],
:is(input, select, textarea).is-erro,
.formulario__campo.is-erro :is(input, select, textarea) { border-color: var(--cor-erro); }
.formulario__erro, .formulario__campo.is-erro .formulario__ajuda { color: var(--cor-erro); font-size: var(--fs-small); }
.formulario__entrada--codigo, .acesso__entrada--codigo { font-family: var(--fonte-mono); letter-spacing: .08em; }
/* O texto de ajuda dentro do campo não é código: volta à fonte de interface. */
:is(.formulario__entrada--codigo, .acesso__entrada--codigo)::placeholder { font-family: var(--fonte-texto); letter-spacing: normal; }
.formulario__entrada--numero, .formulario__entrada--dinheiro { font-variant-numeric: tabular-nums; }
.formulario__entrada--dinheiro { text-align: end; }
.formulario__entrada--texto { min-height: 144px; }
.formulario__selecao--multipla { min-height: 12rem; padding: .5rem; }
.formulario__selecao--multipla option { padding: .375rem .5rem; }
.formulario__rotulo--secundario { margin-top: var(--esp-2); }
.formulario__opcao, .permissoes__opcao {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-height: var(--alvo-toque);
  cursor: pointer;
  line-height: 1.5;
}
.formulario__caixa, .formulario__radio, .permissoes__radio, .filtros__caixa {
  flex: 0 0 auto;
  width: 1.125rem;
  height: 1.125rem;
  accent-color: var(--cor-ouro-escuro);
}
.formulario__campo--opcoes { padding: var(--esp-2); border: 1px solid var(--cor-linha); border-radius: var(--raio-1); }
.formulario__campo--opcoes > .formulario__rotulo { padding-inline: .5rem; }
.formulario__ajuda, .acesso__ajuda {
  margin-top: .5rem;
  color: var(--cor-texto-2);
  font-size: var(--fs-small);
  line-height: 1.6;
}
.formulario__acoes, .painel__acoes, .segredo__acoes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-top: var(--esp-3);
}
.formulario__link, .painel__link, .dados__link, .inicio__link { color: var(--cor-ouro-escuro); }
.formulario--reautenticar { max-width: var(--largura-texto); margin-top: var(--esp-2); }

/* Mensagens, selos e painéis */
.mensagem, .acesso__mensagem, .inicio__aviso {
  margin-bottom: var(--esp-3);
  padding: 1rem 1.25rem;
  border: 1px solid var(--cor-linha);
  border-inline-start: 3px solid var(--cor-info);
  border-radius: var(--raio-1);
  background: var(--cor-info-fundo);
  color: var(--cor-info-texto);
  overflow-wrap: anywhere;
}
.mensagem.is-erro, .acesso__mensagem.is-erro {
  border-color: var(--cor-erro);
  background: var(--cor-erro-fundo);
  color: var(--cor-erro);
}
.mensagem--sucesso, .acesso__mensagem--sucesso {
  border-color: var(--cor-sucesso);
  background: var(--cor-sucesso-fundo);
  color: var(--cor-sucesso-texto);
}
.mensagem__lista, ul.acesso__mensagem { padding-inline-start: 2.5rem; }
.selo {
  display: inline-block;
  margin-block: .125rem;
  padding: .25rem .5rem;
  border-radius: var(--raio-1);
  background: var(--cor-ouro-veu);
  color: var(--cor-ouro-escuro);
  /* Explícita: selos dentro de títulos (Cormorant) não herdam a serifa. */
  font-family: var(--fonte-texto);
  font-size: .6875rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .1em;
  text-transform: uppercase;
  vertical-align: middle;
}
.selo--sucesso { background: var(--cor-sucesso-fundo); color: var(--cor-sucesso-texto); }
.selo--alerta { background: var(--cor-alerta-fundo); color: var(--cor-alerta-texto); }
.selo--perigo { background: var(--cor-erro-fundo); color: var(--cor-erro); }
.selo--neutro { background: var(--cor-fundo-alt); color: var(--cor-texto-2); }
.selo--campanha { background: var(--cor-ouro-veu); color: var(--cor-ouro-escuro); overflow-wrap: anywhere; }
.selo--info { background: var(--cor-info-fundo); color: var(--cor-info-texto); }
.painel, .segredo {
  min-width: 0;
  margin-block: var(--esp-3);
  padding: var(--esp-3);
  border: 1px solid var(--cor-linha);
  border-radius: var(--raio-2);
  background: var(--cor-superficie);
}
.painel__titulo, .segredo__titulo { margin-bottom: var(--esp-2); font-size: var(--fs-h2); }
.painel__subtitulo { margin-bottom: .75rem; font-size: 1.5rem; }
.painel__texto, .segredo__texto { max-width: var(--largura-texto); color: var(--cor-texto-2); }
.painel__texto + .painel__texto { margin-top: .75rem; }
.painel__aviso { margin-block: var(--esp-2); color: var(--cor-texto-2); font-size: .875rem; }
.painel__secao { margin-top: var(--esp-3); padding-top: var(--esp-3); border-top: 1px solid var(--cor-linha); }
.painel--perigo, .painel__secao--perigo { border-inline-start: 3px solid var(--cor-erro); }
.painel__secao--perigo { padding-inline-start: var(--esp-3); }
.painel--perigo .painel__titulo { font-size: 1.75rem; }
.dados, .segredo__dados { display: grid; gap: .25rem var(--esp-3); margin-block: var(--esp-2); }
.dados__rotulo, .segredo__rotulo { color: var(--cor-texto-2); font-size: var(--fs-small); }
.dados__valor, .segredo__valor { margin-bottom: .75rem; overflow-wrap: anywhere; }
.segredo { border-top: 2px solid var(--cor-ouro-claro); max-width: 52rem; }
.segredo__codigo {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-block: var(--esp-2);
  padding: var(--esp-2);
  background: var(--cor-ouro-veu);
  color: var(--cor-texto);
  font-family: var(--fonte-mono);
  font-size: clamp(1.125rem, 3vw, 1.5rem);
  letter-spacing: .06em;
  overflow-wrap: anywhere;
  user-select: all;
}

/* Listas e tabelas */
.filtros {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--esp-2);
  padding: var(--esp-3);
  border: 1px solid var(--cor-linha);
  border-radius: var(--raio-2);
  background: var(--cor-superficie);
}
.filtros__campo { flex: 1 1 11rem; min-width: 0; }
.filtros__campo:first-of-type { flex-grow: 2; }
.filtros__campo--opcao { display: flex; align-items: center; min-height: var(--alvo-controle); }
.filtros__campo--opcao .filtros__rotulo { display: flex; align-items: center; gap: .5rem; min-height: var(--alvo-toque); margin: 0; }
.filtros__acoes { display: flex; flex-wrap: wrap; gap: .5rem; }
.barra-lista { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-2); margin-block: var(--esp-3) var(--esp-2); }
.barra-lista__total { color: var(--cor-texto-2); font-size: .875rem; }
.link-lixeira { display: inline-flex; align-items: center; gap: .5rem; min-height: var(--alvo-toque); color: var(--cor-texto-2); font-size: .875rem; text-decoration: none; }
.link-lixeira:hover { color: var(--cor-ouro-escuro); text-decoration: underline; }
.link-lixeira__icone { width: 1rem; height: 1rem; }
.link-lixeira__total { font-variant-numeric: tabular-nums; }
.tabela-rolagem {
  /* position: bloco de contenção dos rótulos `oculto-acessivel` (absolutos) das células — sem ele eles escapam
     da rolagem e criam rolagem horizontal na página inteira. */
  position: relative;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  border: 1px solid var(--cor-linha);
  border-radius: var(--raio-2);
  /* Sombras de rolagem: aparecem só no lado em que ainda há colunas escondidas (as cobertas "local" acompanham
     o conteúdo; as sombras "scroll" ficam presas às bordas). */
  background-color: var(--cor-superficie);
  background-image:
    linear-gradient(to right, var(--cor-superficie) 35%, rgba(255,255,255,0)),
    linear-gradient(to left, var(--cor-superficie) 35%, rgba(255,255,255,0)),
    radial-gradient(farthest-side at 0 50%, rgba(43,38,32,.14), rgba(43,38,32,0)),
    radial-gradient(farthest-side at 100% 50%, rgba(43,38,32,.14), rgba(43,38,32,0));
  background-position: left center, right center, left center, right center;
  background-size: 2.5rem 100%, 2.5rem 100%, .875rem 100%, .875rem 100%;
  background-repeat: no-repeat;
  background-attachment: local, local, scroll, scroll;
  scrollbar-color: var(--cor-linha-forte) var(--cor-superficie-2);
}
.tabela { width: 100%; font-size: .9375rem; line-height: 1.5; }
.tabela__cabecalho { background: var(--cor-superficie-2); }
.tabela__coluna {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--cor-linha);
  color: var(--cor-texto-2);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.tabela__celula { height: var(--altura-linha); padding: .875rem 1.25rem; border-bottom: 1px solid var(--cor-linha); vertical-align: middle; }
.tabela__corpo > tr:last-child > :is(td, th) { border-bottom: 0; }
.tabela .selo:not(.selo--campanha, .pdv-item__selo) { white-space: nowrap; }
.tabela__corpo > tr:hover { background: var(--cor-superficie-2); }
.tabela__corpo > tr.is-active { background: var(--cor-superficie-2); }
.tabela__corpo > tr.is-active > td:first-child { box-shadow: inset 2px 0 var(--cor-ouro-claro); }
.tabela__linha.is-disabled { color: var(--cor-texto-2); }
.tabela__coluna--numero, .tabela__celula--numero { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabela__coluna--acoes, .tabela__celula--acoes { text-align: end; white-space: nowrap; }
.tabela__celula--data { font-size: var(--fs-small); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabela__celula--codigo { font-family: var(--fonte-mono); font-size: var(--fs-small); }
.tabela__link { color: var(--cor-texto); font-weight: 500; text-decoration: none; }
.tabela__link:hover { color: var(--cor-ouro-escuro); text-decoration: underline; }
.tabela__nota { display: block; margin-top: .375rem; color: var(--cor-texto-2); font-size: var(--fs-small); }
.tabela__vazio, .sessoes__vazio {
  padding: var(--esp-6) var(--esp-3);
  border: 1px solid var(--cor-linha);
  background: var(--cor-superficie);
  color: var(--cor-texto-2);
  text-align: center;
}
.tabela__vazio::before, .sessoes__vazio::before {
  content: "";
  display: block;
  width: 2rem;
  height: 2.5rem;
  margin: 0 auto var(--esp-3);
  border: 1px solid var(--cor-ouro-claro);
  border-block-end-width: 3px;
  border-radius: var(--raio-1);
}
.tabela td.tabela__vazio { border: 0; }
.tabela__celula--acoes .botao { min-height: var(--alvo-toque); padding: .5rem .625rem; font-size: .6875rem; letter-spacing: .1em; }
.form-excluir, .form-restaurar { display: inline-block; }
.abas { margin-bottom: var(--esp-3); border-bottom: 1px solid var(--cor-linha-forte); }
.abas__lista { display: flex; gap: var(--esp-2); overflow-x: auto; padding: 0; list-style: none; }
.abas__item { flex-shrink: 0; }
.abas__link { display: flex; align-items: center; gap: .5rem; min-height: var(--alvo-controle); padding: .75rem .5rem; border-bottom: 2px solid transparent; color: var(--cor-texto-2); font-size: .875rem; text-decoration: none; }
.abas__link:hover { color: var(--cor-ouro-escuro); }
.abas__link.is-active { border-bottom-color: var(--cor-ouro); color: var(--cor-ouro-escuro); }
.abas__total { font-size: .75rem; font-variant-numeric: tabular-nums; }
.preco { font-variant-numeric: tabular-nums; white-space: nowrap; }
.preco__normal { display: block; color: var(--cor-texto-2); font-size: var(--fs-small); }
.preco__vigente { font-weight: 400; }
.preco.is-promo .preco__vigente { color: var(--cor-ouro-escuro); }
.preco--destaque .preco__vigente { font-size: var(--fs-preco); }
.paginacao { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; margin-top: var(--esp-3); }
.paginacao__link, .paginacao__atual { display: inline-flex; align-items: center; justify-content: center; min-width: var(--alvo-toque); min-height: var(--alvo-toque); padding: .5rem .75rem; border: 1px solid var(--cor-linha); border-radius: var(--raio-1); background: var(--cor-superficie); font-size: .875rem; text-decoration: none; }
.paginacao__link:hover { border-color: var(--cor-ouro-claro); color: var(--cor-ouro-escuro); }
.paginacao__atual { border-color: var(--cor-texto); background: var(--cor-texto); color: var(--cor-fundo); }
@media (min-width: 768px) {
  .formulario__grupo, .painel, .segredo { padding: var(--esp-4); }
  .dados, .segredo__dados { grid-template-columns: minmax(9rem, 14rem) minmax(0, 1fr); row-gap: .75rem; }
  .dados__valor, .segredo__valor { margin: 0; }
}
/* Página de erro isolada (403/404/500 do admin, 403/500 do site — includes/erro.cfm). Só depende de arquivos
   estáticos; a 404 pública usa o layout do site (`.pagina-erro--site`, em site.css). */
body.pagina-erro { display: grid; min-height: 100vh; min-height: 100svh; place-items: center; padding: var(--esp-4) var(--esp-2); }
.pagina-erro__conteudo { width: 100%; max-width: 34rem; padding: var(--esp-5) var(--esp-4); border: 1px solid var(--cor-linha); border-top: 2px solid var(--cor-ouro-claro); border-radius: var(--raio-2); background: var(--cor-superficie); text-align: center; box-shadow: var(--sombra-1); }
.pagina-erro__marca { display: inline-block; margin-bottom: var(--esp-4); }
.pagina-erro__logo { width: 160px; height: auto; }
body.pagina-erro .pagina-erro__codigo { color: var(--cor-ouro-escuro); font-family: var(--fonte-titulo); font-size: clamp(4rem, 12vw, 6rem); font-weight: 300; line-height: 1; font-variant-numeric: lining-nums; }
body.pagina-erro .pagina-erro__titulo { margin-top: var(--esp-2); font-size: clamp(1.75rem, 4vw, 2.25rem); }
body.pagina-erro .pagina-erro__texto { max-width: 42ch; margin: var(--esp-2) auto 0; color: var(--cor-texto-2); }
.pagina-erro__ocorrencia { margin-top: var(--esp-3); padding: .75rem 1rem; background: var(--cor-superficie-2); color: var(--cor-texto-2); font-size: var(--fs-small); }
.pagina-erro__ocorrencia-id { color: var(--cor-texto); font-family: var(--fonte-mono); letter-spacing: .06em; user-select: all; }
body.pagina-erro .pagina-erro__acoes { margin-top: var(--esp-4); }
.pagina-erro__detalhe { max-height: 20rem; margin-top: var(--esp-3); padding: var(--esp-2); overflow: auto; background: var(--cor-fundo-alt); font-size: .75rem; text-align: start; white-space: pre-wrap; }

@media (max-width: 479px) {
  .pagina-erro__conteudo { padding: var(--esp-4) var(--esp-3); }
  .formulario__acoes > .botao, .filtros__acoes > .botao { flex: 1 1 auto; }
  .filtros__acoes { width: 100%; }
  .botao { padding-inline: 1rem; }
}