.config-meta {
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 700px;
}

.config-meta__topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.config-meta__status {
  display: inline-flex;
  align-items: center;
  font-size: 12.5px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
  white-space: nowrap;
}

.config-meta__status--ok {
  background: rgba(246, 196, 0, 0.14);
  color: var(--accent-strong);
  border: 1px solid rgba(246, 196, 0, 0.30);
}

.config-meta__status--pendente {
  background: rgba(217, 119, 6, 0.14);
  color: var(--aviso);
  border: 1px solid rgba(217, 119, 6, 0.3);
}

.config-meta__guia {
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
  box-shadow: var(--shadow-sm);
}

.config-meta__guia-titulo {
  font-weight: 700;
  font-size: 14px;
  color: var(--text);
  margin-bottom: 12px;
}

.config-meta__guia-passo {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--border);
}

.config-meta__guia-num {
  width: 24px;
  height: 24px;
  min-width: 24px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.config-meta__guia-texto {
  font-size: 13.5px;
  color: var(--text-muted);
  line-height: 1.5;
  padding-top: 2px;
}

.config-meta__webhook-url {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--accent-soft);
  border: 1px solid rgba(246, 196, 0, 0.25);
  border-radius: var(--r-sm);
  padding: 12px 14px;
  flex-wrap: wrap;
}

.config-meta__webhook-label {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--accent);
  white-space: nowrap;
}

.config-meta__webhook-valor {
  flex: 1;
  font-family: ui-monospace, "Cascadia Code", monospace;
  font-size: 13px;
  color: var(--accent-strong);
  word-break: break-all;
  min-width: 0;
}

.config-meta__form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px;
  box-shadow: var(--shadow-sm);
}

.config-meta__field {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.config-meta__resultado {
  font-size: 13.5px;
  padding: 10px 14px;
  border-radius: var(--r-sm);
  border: 1px solid transparent;
}

.config-meta__resultado--ok {
  background: rgba(246, 196, 0, 0.10);
  border-color: rgba(246, 196, 0, 0.25);
  color: var(--accent-strong);
}

.config-meta__resultado--erro {
  background: rgba(220, 38, 38, 0.1);
  border-color: rgba(220, 38, 38, 0.25);
  color: var(--perigo);
}

.config-meta__acoes {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 4px;
}

/* Variante do resultado que suporta múltiplas linhas (para o teste de conexão). */
.config-meta__resultado--detalhe {
  white-space: pre-line;
  line-height: 1.65;
}

/* ── Ver conta conectada — painel de identidade ──────────────────── */
.config-meta__identidade {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.config-meta__id-bloco {
  padding: 14px 16px;
  border-radius: var(--r-sm);
  border: 1px solid transparent;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.config-meta__id-bloco--ok {
  background: rgba(246, 196, 0, 0.07);
  border-color: rgba(246, 196, 0, 0.22);
}

.config-meta__id-bloco--erro {
  background: rgba(220, 38, 38, 0.07);
  border-color: rgba(220, 38, 38, 0.22);
}

.config-meta__id-titulo {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-muted);
  margin-bottom: 2px;
}

.config-meta__id-linha {
  display: flex;
  gap: 8px;
  font-size: 13.5px;
  flex-wrap: wrap;
  align-items: baseline;
}

.config-meta__id-chave {
  color: var(--text-muted);
  min-width: 140px;
  flex-shrink: 0;
  font-size: 13px;
}

.config-meta__id-valor {
  color: var(--text);
  word-break: break-word;
}

.config-meta__id-erro {
  font-size: 13.5px;
  color: var(--perigo);
}

.config-meta__id-aviso {
  font-size: 13px;
  font-weight: 600;
  color: var(--aviso);
  background: rgba(217, 119, 6, 0.1);
  border: 1px solid rgba(217, 119, 6, 0.25);
  border-radius: var(--r-sm);
  padding: 8px 12px;
}

/* ── Configurações v2: oito abas ───────────────────────────────────── */
.cfg { max-width: 1000px; }
.cfg__topo { margin-bottom: 22px; }
.cfg__titulo { font-family: var(--font-display); font-size: 26px; margin-bottom: 2px; }
.cfg__sub { color: var(--text-muted); font-size: 13.5px; }

.cfg__corpo { display: grid; grid-template-columns: 200px 1fr; gap: 26px; align-items: start; }

/* Abas na vertical: oito abas horizontais quebram em tela média. */
.cfg__abas { display: flex; flex-direction: column; gap: 2px; }
.cfg__aba {
  text-align: left; font: inherit; font-size: 13.5px; font-weight: 500;
  padding: 9px 12px; border-radius: 8px;
  background: none; border: none; color: var(--text-muted);
  cursor: pointer; transition: background .15s, color .15s;
}
.cfg__aba:hover { background: var(--panel-bg-hover); color: var(--text); }
.cfg__aba.is-ativa { background: var(--accent-soft); color: var(--accent-texto); font-weight: 600; }
.cfg__aba:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: 1px; }

.cfg__painel { min-width: 0; }
.cfg__carregando, .cfg__vazio { color: var(--text-muted); font-size: 13.5px; }

.cfg__secao {
  padding: 18px 20px; margin-bottom: 16px;
  background: var(--panel-bg);
  border: 1px solid var(--border); border-radius: var(--r-md);
}
.cfg__secao-titulo { font-family: var(--font-display); font-size: 16px; margin-bottom: 3px; }
.cfg__secao-sub { color: var(--text-muted); font-size: 12.5px; line-height: 1.5; margin-bottom: 14px; }

.cfg__linha {
  display: flex; justify-content: space-between; gap: 16px;
  padding: 9px 0; border-top: 1px solid var(--border);
  font-size: 13.5px;
}
.cfg__linha:first-of-type { border-top: none; }
.cfg__linha-rot { color: var(--text-muted); }
.cfg__linha-val { font-weight: 600; text-align: right; word-break: break-all; }

.cfg__form { display: flex; flex-direction: column; gap: 12px; max-width: 380px; }

/* ── Meu perfil ───────────────────────────────────────────────────── */
.cfg-perfil {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.cfg-perfil__foto-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.cfg-perfil__avatar {
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(246, 196, 0, .28);
  border-radius: 32px;
  background:
    radial-gradient(circle at 30% 20%, rgba(246, 196, 0, .13), transparent 58%),
    #0d263b;
  color: var(--accent-texto);
  font-family: var(--font-display);
  font-size: 36px;
  font-weight: 800;
  box-shadow: 0 18px 34px -24px rgba(246, 196, 0, .8);
}
.cfg-perfil__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cfg-perfil__foto-acoes {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
}
.cfg-perfil__escolher { cursor: pointer; text-align: center; }
.cfg-perfil__remover {
  border: 0;
  background: transparent;
  color: var(--text-muted);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.cfg-perfil__remover:hover { color: var(--perigo); }
.cfg-perfil__foto-col small {
  color: var(--text-fraco);
  font-size: 11px;
  line-height: 1.45;
  text-align: center;
}
.cfg-perfil__campos {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 430px;
}
.cfg-perfil__campos .campo__input[readonly] {
  opacity: .72;
  cursor: not-allowed;
}
.cfg-perfil__papel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--text-muted);
  font-size: 12.5px;
}
.cfg-perfil__papel strong {
  color: var(--accent-texto);
  font-size: 12px;
}
.cfg-perfil__salvar { align-self: flex-start; min-width: 150px; }

@media (max-width: 680px) {
  .cfg-perfil { grid-template-columns: 1fr; gap: 20px; }
  .cfg-perfil__foto-col { align-items: flex-start; }
  .cfg-perfil__foto-acoes { align-items: flex-start; }
  .cfg-perfil__salvar { width: 100%; }
}

.cfg__aviso {
  padding: 10px 12px; border-radius: 8px; font-size: 12.5px; line-height: 1.5;
  background: var(--panel-bg-hover); color: var(--text-muted);
  border: 1px solid var(--border);
}
.cfg__aviso--ok { background: var(--sucesso-soft); border-color: var(--sucesso-linha); color: var(--sucesso); }
.cfg__aviso--erro { background: var(--perigo-soft); border-color: var(--perigo-linha); color: var(--perigo); }
.cfg__aviso--pendente { background: var(--aviso-soft); border-color: var(--aviso-linha); color: var(--aviso); }

/* Exclusão do próprio usuário: duas etapas visuais e confirmação no servidor. */
.cfg__secao--perigo {
  border-color: color-mix(in srgb, var(--perigo) 36%, var(--border));
}
.cfg-excluir {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  max-width: 520px;
}
.cfg-excluir__texto,
.cfg-excluir__confirmacao > p {
  margin: 0;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.55;
}
.cfg-excluir__confirmacao {
  display: grid;
  gap: 12px;
  width: min(100%, 420px);
  padding: 16px;
  border: 1px solid var(--perigo-linha);
  border-radius: var(--r-md);
  background: var(--perigo-soft);
}
.cfg-excluir__confirmacao[hidden] { display: none; }
.cfg-excluir__confirmacao > strong { color: var(--perigo); }
.cfg-excluir__acoes {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.btn--perigo {
  border: 1px solid var(--perigo);
  background: var(--perigo);
  color: #fff;
}
.btn--perigo:hover:not(:disabled) { filter: brightness(1.08); }
.btn--perigo:disabled { opacity: .45; cursor: not-allowed; }

.cfg__ws, .cfg__usuario, .cfg__conta, .cfg__log {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 11px 0; border-top: 1px solid var(--border);
}
.cfg__ws { flex-direction: column; align-items: flex-start; gap: 2px; }
.cfg__ws-meta, .cfg__usuario-email, .cfg__conta-num { font-size: 12px; color: var(--text-fraco); }
.cfg__usuario-info, .cfg__conta-info { display: flex; flex-direction: column; gap: 1px; }

.cfg__grupo { margin-bottom: 20px; }
.cfg__grupo-titulo { font-size: 14px; font-weight: 700; margin-bottom: 2px; }
.cfg__grupo-sub { font-size: 12.5px; color: var(--text-muted); line-height: 1.5; margin-bottom: 8px; }

.cfg__selo {
  font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 999px;
  background: var(--panel-bg-hover); color: var(--text-muted); flex: none;
}
.cfg__selo--conectado, .cfg__selo--admin_org { background: var(--sucesso-soft); color: var(--sucesso); }
.cfg__selo--desconectado, .cfg__selo--inativo { background: var(--perigo-soft); color: var(--perigo); }
.cfg__conta-tier { font-size: 11.5px; color: var(--text-fraco); font-variant-numeric: tabular-nums; }

.cfg-canal__lista {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}
.cfg-canal__conta {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--panel-bg-hover);
}
.cfg-canal__topo {
  display: flex;
  align-items: center;
  gap: 11px;
}
.cfg-canal__avatar {
  width: 42px;
  height: 42px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  border: 1px solid rgba(246, 196, 0, .24);
  background: var(--accent-soft);
  color: var(--accent-texto);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}
.cfg-canal__info {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cfg-canal__nome {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cfg-canal__numero { color: var(--text-muted); font-size: 12px; }
.cfg-canal__detalhes {
  margin: 13px 0 0 53px;
  padding-top: 9px;
  border-top: 1px solid var(--border);
}
.cfg-canal__detalhes .cfg__linha { padding: 5px 0; }
.cfg-canal__acoes {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 13px;
}
.cfg-canal__vazio {
  padding: 24px 16px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-md);
  color: var(--text-muted);
  text-align: center;
}
.cfg-canal__conectar { justify-self: start; margin-top: 2px; }
.cfg-canal__manual { justify-self: start; }
.btn--perigo-ghost {
  border: 1px solid color-mix(in srgb, var(--perigo) 55%, transparent);
  background: transparent;
  color: var(--perigo);
}
.btn--perigo-ghost:hover:not(:disabled) { background: var(--perigo-soft); }
.cfg__selo--conectando { background: var(--aviso-soft); color: var(--aviso); }

.cfg__log { flex-direction: column; align-items: flex-start; gap: 2px; }
.cfg__log-quando { font-size: 11.5px; color: var(--text-fraco); font-variant-numeric: tabular-nums; }
.cfg__log-texto { font-size: 12.5px; }
.cfg__log-filtros { display: flex; gap: 8px; margin-bottom: 8px; }
.cfg__log-filtro { width: auto; min-width: 190px; }
.cfg__log-topo {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%;
}
.cfg__log-usuario { font-size: 13px; }
.cfg__log-paginacao {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding-top: 14px;
}
.cfg__log-pagina { color: var(--text-muted); font-size: 12px; text-align: center; }

@media (max-width: 860px) {
  .cfg__corpo { grid-template-columns: 1fr; }
  .cfg__abas { flex-direction: row; overflow-x: auto; padding-bottom: 4px; }
  .cfg__aba { white-space: nowrap; }
  .cfg-canal__detalhes { margin-left: 0; }
  .cfg-canal__acoes { justify-content: stretch; }
  .cfg-canal__acoes .btn { flex: 1; }
}

/* Botão voltar das Configurações.
   Elas saíram do menu lateral na versão 2.0, então nenhum item fica marcado
   enquanto estão abertas — sem este botão, a única saída era adivinhar em que
   tela a pessoa estava antes. */
.cfg__topo {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.cfg__voltar {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: none;
  margin-top: 4px;
  padding: 8px 14px;
  border-radius: var(--r-sm);
  border: 1px solid var(--border);
  background: var(--elevado);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .18s, border-color .18s;
}
.cfg__voltar svg { width: 15px; height: 15px; }
.cfg__voltar:hover { background: var(--panel-bg-hover); border-color: var(--border-strong); }
.cfg__voltar:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Configurações: navegação categorizada, seleção suave e
   conteúdo em um painel amplo, sem alterar os formulários já existentes. */
.cfg {
  width: min(1180px, 100%);
  max-width: none;
  margin: 0 auto;
}

.cfg__topo {
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
}

.cfg__titulo-bloco {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.cfg__titulo-icone {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 12px;
  background: var(--accent-soft);
  color: var(--accent);
  box-shadow: inset 0 0 0 1px rgba(192, 37, 27, .08);
}

.cfg__titulo-icone svg { width: 21px; height: 21px; }
.cfg__titulo { margin: 0; font-size: 25px; line-height: 1.15; }
.cfg__descricao { margin: 3px 0 0; color: var(--text-muted); font-size: 13px; }

.cfg__corpo {
  display: grid;
  grid-template-columns: 286px minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
  min-height: 620px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 12px 32px rgba(20, 24, 40, .07);
}

.cfg__abas {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 16px 12px 20px;
  border-right: 1px solid var(--border);
  background: linear-gradient(180deg, #fff, #fafafa);
  overflow-y: auto;
}

.cfg__grupo-label {
  margin: 12px 12px 4px;
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.cfg__grupo-label:first-child { margin-top: 2px; }

.cfg__aba {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 58px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--text-muted);
  text-align: left;
  white-space: normal;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.cfg__aba:hover {
  border-color: rgba(0, 0, 0, .035);
  background: rgba(0, 0, 0, .025);
  color: var(--text);
}

.cfg__aba:active { transform: scale(.985); }

.cfg__aba-icone {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(0, 0, 0, .035);
  color: var(--text-secondary);
  font-size: 14px;
  font-weight: 700;
  transition: color .15s ease, background .15s ease, box-shadow .15s ease;
}

.cfg__aba-texto {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.cfg__aba-texto strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cfg__aba-texto small {
  overflow: hidden;
  color: var(--text-tertiary);
  font-size: 10.5px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cfg__aba-seta {
  color: var(--text-tertiary);
  font-size: 20px;
  line-height: 1;
}

.cfg__aba.is-ativa {
  border-color: rgba(192, 37, 27, .10);
  background: var(--accent-soft);
  color: var(--accent);
  box-shadow: inset 0 0 0 1px rgba(192, 37, 27, .025);
}

.cfg__aba.is-ativa .cfg__aba-icone {
  background: var(--accent);
  color: #fff;
  box-shadow: 0 4px 12px rgba(192, 37, 27, .22);
}

.cfg__aba.is-ativa .cfg__aba-texto strong,
.cfg__aba.is-ativa .cfg__aba-seta { color: var(--accent); }
.cfg__aba.is-ativa .cfg__aba-texto small { color: rgba(192, 37, 27, .72); }

.cfg__painel {
  min-width: 0;
  padding: 26px 28px 32px;
  background: #fbfbfc;
}

.cfg__secao {
  padding: 20px 22px;
  border-color: var(--border);
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(20, 24, 40, .025);
}

.cfg__secao-titulo { font-size: 16px; }
.cfg__form { max-width: 520px; }

@media (max-width: 900px) {
  .cfg__corpo { grid-template-columns: 230px minmax(0, 1fr); }
  .cfg__aba { grid-template-columns: 32px minmax(0, 1fr); }
  .cfg__aba-icone { width: 32px; height: 32px; }
  .cfg__aba-seta { display: none; }
}

@media (max-width: 700px) {
  .cfg__topo { align-items: flex-start; flex-wrap: wrap; }
  .cfg__corpo { display: block; min-height: 0; overflow: visible; }
  .cfg__abas {
    flex-direction: row;
    gap: 6px;
    overflow-x: auto;
    padding: 10px;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  .cfg__grupo-label { display: none; }
  .cfg__aba {
    display: flex;
    width: auto;
    min-width: max-content;
    min-height: 42px;
    padding: 6px 10px;
  }
  .cfg__aba-icone { width: 28px; height: 28px; }
  .cfg__aba-texto small, .cfg__aba-seta { display: none; }
  .cfg__painel { padding: 18px 14px 24px; }
}

/* ── Central de configurações ─────────────────────────────────────────────── */
body.config-aberta { overflow: hidden; }
body.config-aberta .content {
  display: flex;
  flex-direction: column;
  height: 100vh;
  min-height: 0;
  overflow: hidden;
}
body.config-aberta .topbar { position: static; flex: none; }
body.config-aberta .view[data-view="config"].is-active {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 22px 26px 26px;
}
.cfg { display: flex; flex-direction: column; width: min(1280px, 100%); height: 100%; min-height: 0; }
.cfg__topo { flex: none; justify-content: space-between; margin-bottom: 16px; }
.cfg__titulo-bloco { flex: 1; }
.cfg__titulo { font-size: 23px; }
.cfg__descricao { font-size: 12.5px; }
.cfg__sub { margin-top: 3px; font-size: 11.5px; }
.cfg__voltar { margin: 0; padding: 8px 11px; border-radius: 10px; background: var(--surface); color: var(--text-muted); }
.cfg__voltar:hover { color: var(--text); background: var(--surface-elevated); }
.cfg__voltar svg { width: 17px; height: 17px; }
.cfg__corpo {
  flex: 1;
  grid-template-columns: 300px minmax(0, 1fr);
  min-height: 0;
  border-radius: 15px;
  background: var(--bg-elevated);
  box-shadow: var(--shadow-md);
}
.cfg__abas {
  min-height: 0;
  padding: 14px 11px 18px;
  background: var(--bg-subtle);
  border-color: var(--border);
  scrollbar-gutter: stable;
}
.cfg__nav-intro { display: flex; flex-direction: column; gap: 1px; padding: 4px 9px 10px; }
.cfg__nav-intro strong { color: var(--text); font-size: 13px; }
.cfg__nav-intro small { color: var(--text-muted); font-size: 10.5px; }
.cfg__busca {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 37px;
  margin: 0 5px 9px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-elevated);
  color: var(--text-muted);
}
.cfg__busca:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.cfg__busca input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 12px;
}
.cfg__busca-vazia { margin: 16px 10px; color: var(--text-muted); font-size: 12px; text-align: center; }
.cfg__grupo-label { margin: 11px 10px 4px; }
.cfg__aba { grid-template-columns: 33px minmax(0, 1fr) 12px; min-height: 52px; padding: 7px 9px; }
.cfg__aba-icone {
  width: 33px;
  height: 33px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  color: var(--text-secondary);
}
.cfg__aba:hover { border-color: var(--border); background: var(--surface); }
.cfg__aba.is-ativa { border-color: var(--accent-ring); background: var(--accent-soft); }
.cfg__aba.is-ativa .cfg__aba-icone { background: var(--accent); box-shadow: 0 4px 12px rgba(192, 37, 27, .18); }
.cfg__painel {
  min-height: 0;
  padding: 24px 26px 34px;
  overflow-y: auto;
  background: var(--bg-primary);
  scrollbar-gutter: stable;
  outline: 0;
}
.cfg__painel:focus-visible { box-shadow: inset 0 0 0 2px var(--accent-ring); }
.cfg__secao { margin: 0 0 14px; padding: 20px 22px; background: var(--bg-elevated); box-shadow: var(--shadow-sm); }
.cfg__secao:last-child { margin-bottom: 0; }
.cfg__secao-titulo { font-size: 15px; }
.cfg__secao-sub { max-width: 680px; }
.cfg-editor {
  display: grid;
  gap: 10px;
  margin: 4px 0 18px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--bg-subtle);
}
.cfg-editor--setor { grid-template-columns: minmax(180px, 1fr) 42px auto; align-items: center; }
.cfg-editor__cor {
  width: 42px;
  height: 40px;
  padding: 3px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-elevated);
  cursor: pointer;
}
.cfg-editor__mensagem { min-height: 100px; resize: vertical; }
.cfg-editor__acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.cfg-operacao__lista { display: grid; gap: 8px; margin-top: 12px; }
.cfg-operacao__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  padding: 12px 13px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elevated);
}
.cfg-operacao__identidade { display: flex; align-items: center; gap: 11px; min-width: 0; }
.cfg-operacao__cor {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  border: 2px solid var(--bg-elevated);
  border-radius: 50%;
  box-shadow: 0 0 0 1px var(--border);
}
.cfg-operacao__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cfg-operacao__info strong { color: var(--text); font-size: 13px; }
.cfg-operacao__info small { color: var(--text-muted); font-size: 10.5px; }
.cfg-operacao__mensagem {
  display: -webkit-box;
  overflow: hidden;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.cfg-operacao__atalho { color: var(--accent) !important; font-family: var(--font-mono); }
.cfg-operacao__acoes { display: flex; gap: 7px; flex: none; }
.cfg-operacao__vazio {
  padding: 22px;
  border: 1px dashed var(--border-strong);
  border-radius: 10px;
  color: var(--text-muted);
  font-size: 12px;
  text-align: center;
}
.cfg-tags__busca { max-width: 360px; margin: 4px 0 14px; }
.cfg-tags__lista { display: flex; flex-wrap: wrap; gap: 7px; }
.cfg-tags__item {
  display: inline-flex;
  padding: 5px 10px;
  border: 1px solid var(--accent-ring);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11.5px;
  font-weight: 600;
}
@media (max-width: 900px) {
  .cfg__corpo { grid-template-columns: 240px minmax(0, 1fr); }
  .cfg__painel { padding: 20px; }
}
@media (max-width: 700px) {
  body.config-aberta { overflow: auto; }
  body.config-aberta .content { height: auto; min-height: 100vh; overflow: visible; }
  body.config-aberta .view[data-view="config"].is-active { overflow: visible; padding: 16px; }
  .cfg { height: auto; }
  .cfg__topo { align-items: center; flex-wrap: nowrap; }
  .cfg__titulo-icone { display: none; }
  .cfg__descricao, .cfg__sub { display: none; }
  .cfg__voltar span { display: none; }
  .cfg__voltar { width: 38px; height: 38px; justify-content: center; padding: 0; }
  .cfg__corpo { display: block; overflow: hidden; }
  .cfg__abas { display: flex; position: sticky; top: 0; z-index: 4; padding: 10px; background: var(--bg-subtle); }
  .cfg__nav-intro, .cfg__busca, .cfg__grupo-label, .cfg__busca-vazia { display: none; }
  .cfg__aba { min-height: 40px; }
  .cfg__painel { overflow: visible; padding: 14px; }
  .cfg-editor--setor { grid-template-columns: minmax(0, 1fr) 42px; }
  .cfg-editor--setor .btn { grid-column: 1 / -1; }
  .cfg-operacao__item { align-items: flex-start; flex-direction: column; }
  .cfg-operacao__acoes { width: 100%; }
  .cfg-operacao__acoes .btn { flex: 1; }
}

/* ── Central de contas WhatsApp ─────────────────────────────────────────── */
.cfg-whatsapp { padding: 0; overflow: hidden; }
.cfg-whatsapp__cabecalho {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 26px 20px;
  border-bottom: 1px solid var(--border);
}
.cfg-whatsapp__titulo { min-width: 0; }
.cfg-whatsapp__kicker {
  display: block;
  margin-bottom: 6px;
  color: var(--accent);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .11em;
}
.cfg-whatsapp__titulo .cfg__secao-titulo { margin: 0 0 5px; font-size: 18px; }
.cfg-whatsapp__titulo .cfg__secao-sub { margin: 0; }
.cfg-whatsapp__adicionar { flex: none; min-height: 40px; padding-inline: 15px; }
.cfg-whatsapp > .cfg__aviso { margin: 16px 26px 0; }
.cfg-whatsapp__resumo {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0 26px;
  border-bottom: 1px solid var(--border);
  background: var(--border);
}
.cfg-whatsapp__resumo-item {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 17px 16px;
  background: var(--bg-elevated);
}
.cfg-whatsapp__resumo-item:first-child { padding-left: 0; }
.cfg-whatsapp__resumo-item:last-child { padding-right: 0; }
.cfg-whatsapp__resumo-item strong {
  color: var(--text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}
.cfg-whatsapp__resumo-item.is-ok strong { color: var(--sucesso); }
.cfg-whatsapp__resumo-item span { color: var(--text-muted); font-size: 10.5px; }
.cfg-whatsapp__barra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 26px;
}
.cfg-whatsapp__filtros {
  display: inline-flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-subtle);
}
.cfg-whatsapp__filtro {
  min-height: 30px;
  padding: 0 11px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text-muted);
  font: inherit;
  font-size: 10.5px;
  font-weight: 600;
  cursor: pointer;
}
.cfg-whatsapp__filtro:hover { color: var(--text); }
.cfg-whatsapp__filtro.is-ativo {
  background: var(--bg-elevated);
  color: var(--text);
  box-shadow: var(--shadow-sm);
}
.cfg-whatsapp__atualizar { min-height: 34px; padding: 0 10px; font-size: 10.5px; }
.cfg-whatsapp__lista {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
  padding: 0 26px 26px;
}
.cfg-whatsapp-conta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elevated);
  box-shadow: 0 1px 2px rgba(20, 24, 40, .025);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.cfg-whatsapp-conta:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
.cfg-whatsapp-conta__topo {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
.cfg-whatsapp-conta__avatar {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: #e9f8ef;
  color: #168447;
  font-size: 15px;
  font-weight: 800;
}
.cfg-whatsapp-conta__avatar img { width: 100%; height: 100%; object-fit: cover; }
.cfg-whatsapp-conta__identidade {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.cfg-whatsapp-conta__identidade strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cfg-whatsapp-conta__identidade span { color: var(--text-muted); font-size: 10.5px; }
.cfg-whatsapp-conta__status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--surface);
  color: var(--text-muted);
  font-size: 9.5px;
  font-weight: 700;
  white-space: nowrap;
}
.cfg-whatsapp-conta__status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.cfg-whatsapp-conta__status.is-conectado { background: var(--sucesso-soft); color: var(--sucesso); }
.cfg-whatsapp-conta__status.is-conectando { background: var(--aviso-soft); color: var(--aviso); }
.cfg-whatsapp-conta__status.is-desconectado { background: var(--perigo-soft); color: var(--perigo); }
.cfg-whatsapp-conta__tipo {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 15px 0 10px;
  padding: 10px;
  border-radius: 9px;
  background: var(--bg-subtle);
}
.cfg-whatsapp-conta__tipo-icone {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border-radius: 8px;
  background: var(--sucesso-soft);
  color: var(--sucesso);
  font-size: 12px;
  font-weight: 800;
}
.cfg-whatsapp-conta__tipo > span:not(.cfg-whatsapp-conta__tipo-icone) {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.cfg-whatsapp-conta__tipo strong { color: var(--text); font-size: 10.5px; }
.cfg-whatsapp-conta__tipo small { color: var(--text-muted); font-size: 9.5px; }
.cfg-whatsapp-conta__dados { flex: 1; }
.cfg-whatsapp-conta__dados .cfg__linha { min-height: 29px; padding: 5px 0; }
.cfg-whatsapp-conta__dados .cfg__linha-rot,
.cfg-whatsapp-conta__dados .cfg__linha-val { font-size: 10.5px; }
.cfg-whatsapp-conta > .cfg__aviso { margin: 8px 0 0; font-size: 10px; }
.cfg-whatsapp-conta__acoes {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 14px -17px -17px;
  padding: 12px 17px;
  border-top: 1px solid var(--border);
}
.cfg-whatsapp-conta__acoes .btn { min-height: 32px; padding: 0 10px; font-size: 10.5px; }
.cfg-whatsapp-conta__remover {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  font: inherit;
  font-size: 10px;
  cursor: pointer;
}
.cfg-whatsapp-conta__remover:hover { color: var(--perigo); }
.cfg-whatsapp__vazio {
  display: flex;
  grid-column: 1 / -1;
  min-height: 260px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 32px;
  border: 1px dashed var(--border-strong);
  border-radius: 12px;
  text-align: center;
}
.cfg-whatsapp__vazio-icone {
  display: grid;
  width: 52px;
  height: 52px;
  margin-bottom: 13px;
  place-items: center;
  border-radius: 15px;
  background: var(--sucesso-soft);
  color: var(--sucesso);
  font-size: 21px;
}
.cfg-whatsapp__vazio h3 { margin: 0 0 5px; color: var(--text); font-size: 14px; }
.cfg-whatsapp__vazio p { max-width: 360px; margin: 0 0 16px; color: var(--text-muted); font-size: 11px; }

.cfg-whatsapp-modal {
  width: min(690px, calc(100vw - 32px));
  max-width: none;
  padding: 0;
  border: 0;
  border-radius: 16px;
  background: var(--bg-elevated);
  color: var(--text);
  box-shadow: 0 24px 80px rgba(16, 24, 40, .26);
}
.cfg-whatsapp-modal::backdrop {
  background: rgba(15, 23, 42, .48);
  backdrop-filter: blur(3px);
}
.cfg-whatsapp-modal__conteudo { padding: 24px; }
.cfg-whatsapp-modal__topo {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 32px;
  align-items: start;
  gap: 12px;
}
.cfg-whatsapp-modal__marca {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 12px;
  background: var(--sucesso-soft);
  color: var(--sucesso);
  font-size: 18px;
  font-weight: 800;
}
.cfg-whatsapp-modal__etapa {
  display: block;
  margin-bottom: 3px;
  color: var(--accent);
  font-size: 8.5px;
  font-weight: 800;
  letter-spacing: .1em;
}
.cfg-whatsapp-modal__topo h2 { margin: 0; font-size: 18px; }
.cfg-whatsapp-modal__topo p { margin: 4px 0 0; color: var(--text-muted); font-size: 11px; }
.cfg-whatsapp-modal__fechar {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: var(--surface);
  color: var(--text-muted);
  font-size: 20px;
  cursor: pointer;
}
.cfg-whatsapp-modal__fechar:hover { background: var(--surface-elevated); color: var(--text); }
.cfg-whatsapp-modal__opcoes { display: grid; gap: 10px; margin: 22px 0 14px; }
.cfg-whatsapp-opcao {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elevated);
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.cfg-whatsapp-opcao:hover {
  border-color: var(--sucesso);
  background: color-mix(in srgb, var(--sucesso-soft) 55%, var(--bg-elevated));
  transform: translateY(-1px);
}
.cfg-whatsapp-opcao.is-recomendada { border-color: color-mix(in srgb, var(--sucesso) 38%, var(--border)); }
.cfg-whatsapp-opcao__icone {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 11px;
  font-size: 15px;
  font-weight: 800;
}
.cfg-whatsapp-opcao__icone--api { background: var(--sucesso-soft); color: var(--sucesso); }
.cfg-whatsapp-opcao__icone--qr { background: var(--surface); color: var(--text-secondary); }
.cfg-whatsapp-opcao__texto { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.cfg-whatsapp-opcao__linha { display: flex; align-items: center; gap: 8px; }
.cfg-whatsapp-opcao__linha strong { font-size: 12.5px; }
.cfg-whatsapp-opcao__linha em {
  padding: 3px 6px;
  border-radius: 999px;
  background: var(--sucesso-soft);
  color: var(--sucesso);
  font-size: 8.5px;
  font-style: normal;
  font-weight: 700;
}
.cfg-whatsapp-opcao__linha em.is-neutro { background: var(--surface); color: var(--text-muted); }
.cfg-whatsapp-opcao__texto > small { color: var(--text-muted); font-size: 10.5px; line-height: 1.45; }
.cfg-whatsapp-opcao__vantagens { display: flex; flex-wrap: wrap; gap: 5px; }
.cfg-whatsapp-opcao__vantagens i {
  color: var(--text-secondary);
  font-size: 8.5px;
  font-style: normal;
  font-weight: 600;
}
.cfg-whatsapp-opcao__vantagens i::before { content: "·"; margin-right: 4px; color: var(--sucesso); }
.cfg-whatsapp-opcao__seta { color: var(--text-muted); font-size: 22px; }
.cfg-whatsapp-modal__nota {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 11px 13px;
  border-radius: 9px;
  background: var(--bg-subtle);
}
.cfg-whatsapp-modal__nota strong { color: var(--text-secondary); font-size: 9.5px; }
.cfg-whatsapp-modal__nota span { color: var(--text-muted); font-size: 9.5px; line-height: 1.45; }
.cfg-whatsapp-modal__rodape {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 18px -24px -24px;
  padding: 13px 24px;
  border-top: 1px solid var(--border);
}
.cfg-whatsapp-modal__rodape > span { color: var(--text-muted); font-size: 9.5px; }

@media (max-width: 980px) {
  .cfg-whatsapp__lista { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .cfg-whatsapp__cabecalho { align-items: stretch; flex-direction: column; padding: 18px; }
  .cfg-whatsapp__adicionar { width: 100%; }
  .cfg-whatsapp__resumo { grid-template-columns: repeat(2, 1fr); padding: 0 18px; }
  .cfg-whatsapp__resumo-item,
  .cfg-whatsapp__resumo-item:first-child,
  .cfg-whatsapp__resumo-item:last-child { padding: 13px 8px; }
  .cfg-whatsapp__barra { padding: 13px 18px; }
  .cfg-whatsapp__lista { padding: 0 18px 18px; }
  .cfg-whatsapp-conta__topo { grid-template-columns: 38px minmax(0, 1fr); }
  .cfg-whatsapp-conta__avatar { width: 38px; height: 38px; }
  .cfg-whatsapp-conta__status { grid-column: 2; justify-self: start; }
  .cfg-whatsapp-modal__conteudo { padding: 18px; }
  .cfg-whatsapp-modal__topo { grid-template-columns: 38px minmax(0, 1fr) 32px; }
  .cfg-whatsapp-modal__marca { width: 38px; height: 38px; }
  .cfg-whatsapp-opcao { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; }
  .cfg-whatsapp-opcao__icone { width: 38px; height: 38px; }
  .cfg-whatsapp-opcao__seta { display: none; }
  .cfg-whatsapp-modal__rodape { margin: 16px -18px -18px; padding: 12px 18px; }
  .cfg-whatsapp-modal__rodape > span { display: none; }
  .cfg-whatsapp-modal__rodape .btn { margin-left: auto; }
}

/* ── Configurações como página integral ────────────────────────────────────
   Configuração como área de trabalho funcional, não como
   um cartão flutuante. Estas regras fazem a rota preencher toda a região útil
    abaixo da barra superior, preservando a navegação principal do MIND UP. */
body.config-aberta .view[data-view="config"].is-active {
  width: 100%;
  padding: 0;
  background: var(--bg-primary);
}

body.config-aberta .cfg {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  background: var(--bg-primary);
}

body.config-aberta .cfg__topo {
  min-height: 78px;
  margin: 0;
  padding: 15px 24px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-elevated);
}

body.config-aberta .cfg__titulo-icone {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
  border-radius: 10px;
}

body.config-aberta .cfg__titulo {
  font-size: 20px;
}

body.config-aberta .cfg__descricao {
  font-size: 11.5px;
}

body.config-aberta .cfg__corpo {
  flex: 1;
  grid-template-columns: 292px minmax(0, 1fr);
  width: 100%;
  min-height: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: var(--bg-primary);
  box-shadow: none;
}

body.config-aberta .cfg__abas {
  padding: 16px 12px 24px;
  border-right: 1px solid var(--border);
  border-radius: 0;
  background: var(--bg-elevated);
}

body.config-aberta .cfg__painel {
  width: 100%;
  min-height: 0;
  padding: 26px 30px 42px;
  background: var(--bg-primary);
}

body.config-aberta .cfg__painel > .cfg__secao {
  width: 100%;
  max-width: none;
}

body.config-aberta .cfg__voltar {
  min-height: 38px;
  border-color: var(--border);
  background: var(--bg-subtle);
}

@media (min-width: 1500px) {
  body.config-aberta .cfg__corpo {
    grid-template-columns: 310px minmax(0, 1fr);
  }
  body.config-aberta .cfg__painel {
    padding: 30px 38px 48px;
  }
}

@media (max-width: 900px) {
  body.config-aberta .cfg__corpo {
    grid-template-columns: 238px minmax(0, 1fr);
  }
  body.config-aberta .cfg__painel {
    padding: 22px;
  }
}

@media (max-width: 700px) {
  body.config-aberta .view[data-view="config"].is-active {
    padding: 0;
  }
  body.config-aberta .cfg__topo {
    min-height: 64px;
    padding: 12px 14px;
  }
  body.config-aberta .cfg__corpo {
    display: block;
    min-height: calc(100vh - 64px);
    border-radius: 0;
  }
  body.config-aberta .cfg__abas {
    border-radius: 0;
  }
  body.config-aberta .cfg__painel {
    padding: 16px 14px 28px;
  }
}

/* ── Navegação vertical conectada ao cabeçalho ─────────────────────────── */
body.config-aberta .cfg {
  gap: 0;
}

body.config-aberta .cfg__corpo {
  display: grid;
  grid-template-columns: 292px minmax(0, 1fr);
  flex: 1;
  min-height: 0;
  margin: 0;
}

body.config-aberta .cfg__abas {
  display: flex;
  position: static;
  flex-direction: column;
  align-items: stretch;
  gap: 3px;
  width: auto;
  min-height: 0;
  padding: 14px 11px 22px;
  overflow-x: hidden;
  overflow-y: auto;
  border-right: 1px solid var(--border);
  border-bottom: 0;
  background: var(--bg-elevated);
}

body.config-aberta .cfg__nav-intro {
  display: flex;
}

body.config-aberta .cfg__busca {
  display: flex;
}

body.config-aberta .cfg__grupo-label {
  display: block;
}

body.config-aberta .cfg__aba {
  display: grid;
  position: relative;
  grid-template-columns: 33px minmax(0, 1fr) 12px;
  width: 100%;
  min-width: 0;
  min-height: 52px;
  align-items: center;
  gap: 10px;
  padding: 7px 9px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--text-muted);
  box-shadow: none;
}

body.config-aberta .cfg__aba::after {
  display: none;
}

body.config-aberta .cfg__aba:hover {
  border-color: var(--border);
  background: var(--surface);
  color: var(--text);
}

body.config-aberta .cfg__aba.is-ativa {
  border-color: var(--accent-ring);
  background: var(--accent-soft);
  color: var(--accent);
  box-shadow: inset 0 0 0 1px rgba(192, 37, 27, .025);
}

body.config-aberta .cfg__aba-icone {
  display: grid;
  width: 33px;
  height: 33px;
}

body.config-aberta .cfg__aba-seta {
  display: block;
}

body.config-aberta .cfg__aba-texto {
  display: flex;
}

body.config-aberta .cfg__aba-texto small {
  display: block;
}

body.config-aberta .cfg__aba-texto strong,
body.config-aberta .cfg__aba.is-ativa .cfg__aba-texto strong {
  color: inherit;
  font-size: 12px;
  white-space: normal;
}

body.config-aberta .cfg__painel {
  min-width: 0;
  padding: 24px 26px 38px;
  overflow-y: auto;
  background: var(--bg-primary);
}

body.config-aberta .cfg__painel > .cfg__secao {
  margin: 0 0 14px;
  padding: 20px 22px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--bg-elevated);
  box-shadow: var(--shadow-sm);
}

body.config-aberta .cfg__painel > .cfg-whatsapp {
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

body.config-aberta .cfg-whatsapp__cabecalho {
  padding: 24px 26px 20px;
}

body.config-aberta .cfg-whatsapp__resumo {
  padding: 0 26px;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
}

body.config-aberta .cfg-whatsapp__resumo-item:first-child {
  padding-left: 0;
}

body.config-aberta .cfg-whatsapp__resumo-item:last-child {
  padding-right: 0;
}

body.config-aberta .cfg-whatsapp__barra {
  padding: 15px 26px;
}

body.config-aberta .cfg-whatsapp__lista {
  padding: 0 26px 26px;
}

@media (min-width: 1500px) {
  body.config-aberta .cfg__corpo {
    grid-template-columns: 310px minmax(0, 1fr);
  }
}

/* Regra visual final das abas: precisa vir depois dos layouts responsivos. */
body.config-aberta .cfg__busca:focus-within { border-color:var(--border-strong); box-shadow:0 0 0 3px rgba(100,116,139,.09); }
body.config-aberta .cfg__aba[data-aba="geral"] { --cfg-tab-cor:#2563eb; --cfg-tab-suave:rgba(37,99,235,.1); }
body.config-aberta .cfg__aba[data-aba="perfil"] { --cfg-tab-cor:#0891b2; --cfg-tab-suave:rgba(8,145,178,.1); }
body.config-aberta .cfg__aba[data-aba="usuarios"] { --cfg-tab-cor:#7c3aed; --cfg-tab-suave:rgba(124,58,237,.1); }
body.config-aberta .cfg__aba[data-aba="setores"] { --cfg-tab-cor:#4f46e5; --cfg-tab-suave:rgba(79,70,229,.1); }
body.config-aberta .cfg__aba[data-aba="respostas_rapidas"] { --cfg-tab-cor:#d97706; --cfg-tab-suave:rgba(217,119,6,.1); }
body.config-aberta .cfg__aba[data-aba="tags"] { --cfg-tab-cor:#db2777; --cfg-tab-suave:rgba(219,39,119,.1); }
body.config-aberta .cfg__aba[data-aba="whatsapp"] { --cfg-tab-cor:#16a34a; --cfg-tab-suave:rgba(22,163,74,.1); }
body.config-aberta .cfg__aba[data-aba="whatsapp_api"] { --cfg-tab-cor:#059669; --cfg-tab-suave:rgba(5,150,105,.1); }
body.config-aberta .cfg__aba[data-aba="instagram"] { --cfg-tab-cor:#c026d3; --cfg-tab-suave:rgba(192,38,211,.1); }
body.config-aberta .cfg__aba[data-aba="sms"] { --cfg-tab-cor:#0284c7; --cfg-tab-suave:rgba(2,132,199,.1); }
body.config-aberta .cfg__aba[data-aba="api"] { --cfg-tab-cor:#ea580c; --cfg-tab-suave:rgba(234,88,12,.1); }
body.config-aberta .cfg__aba[data-aba="seguranca"] { --cfg-tab-cor:#0f766e; --cfg-tab-suave:rgba(15,118,110,.1); }
body.config-aberta .cfg__aba[data-aba="logs"] { --cfg-tab-cor:#475569; --cfg-tab-suave:rgba(71,85,105,.1); }
body.config-aberta .cfg__aba-icone { border-color:color-mix(in srgb,var(--cfg-tab-cor) 24%,transparent); background:var(--cfg-tab-suave); color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba-icone svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
body.config-aberta .cfg__aba:hover { color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba.is-ativa { border-color:color-mix(in srgb,var(--cfg-tab-cor) 30%,transparent); background:var(--cfg-tab-suave); color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba.is-ativa .cfg__aba-icone { border-color:var(--cfg-tab-cor); background:var(--cfg-tab-cor); color:#fff; box-shadow:0 4px 12px color-mix(in srgb,var(--cfg-tab-cor) 24%,transparent); }

/* Acabamento das configurações pessoais. A especificidade com
   body.config-aberta prevalece sobre os estilos legados compartilhados. */
body.config-aberta .cfg__painel > .cfg__secao {
  width:min(100%, 1180px);
  margin-inline:auto;
}

body.config-aberta .cfg__secao--mensagens .cfg-editor--resposta {
  display:grid;
  grid-template-columns:minmax(190px,.42fr) minmax(320px,1fr);
  gap:14px;
  margin:18px 0 22px;
  padding:18px;
  border:1px solid #f0d7b5;
  border-radius:14px;
  background:linear-gradient(145deg,#fffaf3,#fff);
  box-shadow:0 8px 24px rgba(180,83,9,.055);
}

body.config-aberta .cfg-respostas__campo {
  display:flex;
  flex-direction:column;
  gap:7px;
  min-width:0;
}

body.config-aberta .cfg-respostas__campo > span {
  color:var(--text-secondary);
  font-size:10px;
  font-weight:750;
  letter-spacing:.05em;
  text-transform:uppercase;
}

body.config-aberta .cfg-respostas__campo--mensagem {
  grid-column:2;
  grid-row:1 / span 2;
}

body.config-aberta .cfg-respostas__campo--mensagem textarea {
  height:100%;
  min-height:112px;
}

body.config-aberta .cfg__secao--mensagens .cfg-editor__acoes { align-self:end; }
body.config-aberta .cfg-respostas__lista .cfg-operacao__item {
  border-left:3px solid #d97706;
  background:var(--bg-elevated);
}

body.config-aberta .cfg-tags__resumo {
  margin-top:16px;
  border:1px solid rgba(219,39,119,.16);
  background:linear-gradient(135deg,rgba(219,39,119,.08),rgba(124,58,237,.05));
}

body.config-aberta .cfg-tags__criador {
  display:grid;
  grid-template-columns:minmax(180px,1fr) auto;
  gap:10px;
  width:min(100%, 600px);
  margin:16px 0 10px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--bg-subtle);
}

body.config-aberta .cfg-tags__lista {
  gap:9px;
  padding:14px;
  border:1px dashed var(--border-strong);
  border-radius:12px;
  background:var(--bg-subtle);
}

body.config-aberta .cfg-tags__item {
  padding:6px 11px;
  border-color:color-mix(in srgb,var(--tag-cor) 38%,transparent);
  background:color-mix(in srgb,var(--tag-cor) 11%,white);
  color:var(--tag-cor);
  box-shadow:0 2px 5px color-mix(in srgb,var(--tag-cor) 10%,transparent);
}

body.config-aberta .cfg__painel[data-aba="sms"] > .cfg__secao {
  padding:0;
  overflow:hidden;
  border-top:3px solid #0284c7;
}

body.config-aberta .cfg__painel[data-aba="sms"] .cfg__secao-cabecalho {
  margin:0;
  padding:22px 24px;
  background:linear-gradient(135deg,rgba(2,132,199,.09),transparent 72%);
}

body.config-aberta .cfg__painel[data-aba="sms"] .cfg-canal__lista {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  padding:20px 24px 26px;
}

body.config-aberta .cfg__painel[data-aba="sms"] .cfg-canal__conta {
  padding:18px;
  border:1px solid #cde8f6;
  border-radius:14px;
  background:linear-gradient(145deg,#f5fbff,#fff);
  box-shadow:0 5px 16px rgba(2,132,199,.07);
}

body.config-aberta .cfg__painel[data-aba="whatsapp"] {
  background:linear-gradient(180deg,rgba(22,163,74,.035),var(--bg-primary) 240px);
}

body.config-aberta .cfg-whatsapp-conta {
  border-radius:15px;
  box-shadow:0 5px 18px rgba(15,23,42,.055);
}

body.config-aberta .cfg__secao--auditoria .cfg__logs {
  display:grid;
  gap:10px;
  padding-left:0;
}

body.config-aberta .cfg__secao--auditoria .cfg__logs::before { display:none; }
body.config-aberta .cfg__secao--auditoria .cfg__log {
  padding:14px 16px 14px 20px;
  border:1px solid var(--border);
  border-radius:11px;
  background:var(--bg-elevated);
  box-shadow:0 3px 10px rgba(15,23,42,.045);
}

body.config-aberta .cfg__secao--auditoria .cfg__log::before {
  top:14px;
  bottom:14px;
  left:0;
  width:3px;
  height:auto;
  border:0;
  border-radius:0 4px 4px 0;
  background:#64748b;
  box-shadow:none;
}

@media (max-width:760px) {
  body.config-aberta .cfg__secao--mensagens .cfg-editor--resposta { grid-template-columns:1fr; }
  body.config-aberta .cfg-respostas__campo--mensagem { grid-column:auto; grid-row:auto; }
  body.config-aberta .cfg-tags__criador { grid-template-columns:1fr; }
  body.config-aberta .cfg__painel[data-aba="sms"] .cfg-canal__lista { grid-template-columns:1fr; }
}

/* ── Configurações pessoais: acabamento das seis áreas disponíveis ─────── */
body.config-aberta .cfg__painel > .cfg__secao {
  max-width:1180px;
  margin-inline:auto;
}

.cfg__secao--perfil { border-top:3px solid #0891b2 !important; }
.cfg__secao--mensagens { border-top:3px solid #d97706 !important; }
.cfg__secao--tags { border-top:3px solid #db2777 !important; }
.cfg__secao--sms { border-top:3px solid #0284c7 !important; }
.cfg__secao--auditoria { border-top:3px solid #475569 !important; }

.cfg__secao--mensagens .cfg-editor--resposta {
  display:grid;
  grid-template-columns:minmax(190px,.42fr) minmax(320px,1fr);
  gap:14px;
  margin:18px 0 22px;
  padding:18px;
  border:1px solid #f0d7b5;
  border-radius:14px;
  background:linear-gradient(145deg,#fffaf3,#fff);
}
.cfg-respostas__campo { display:flex; flex-direction:column; gap:7px; min-width:0; }
.cfg-respostas__campo > span { color:var(--text-secondary); font-size:10px; font-weight:750; letter-spacing:.05em; text-transform:uppercase; }
.cfg-respostas__campo--mensagem { grid-column:2; grid-row:1 / span 2; }
.cfg-respostas__campo--mensagem textarea { height:100%; min-height:112px; }
.cfg__secao--mensagens .cfg-editor__acoes { align-self:end; }
.cfg-respostas__lista-titulo { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:8px 0 10px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.cfg-respostas__lista-titulo strong { color:var(--text); font-size:13px; }
.cfg-respostas__lista-titulo span { color:var(--text-muted); font-size:10.5px; }
.cfg-respostas__lista .cfg-operacao__item { border-left:3px solid #d97706; background:var(--bg-elevated); }
.cfg-respostas__lista .cfg-operacao__atalho { display:inline-flex; width:max-content; padding:4px 8px; border-radius:7px; background:rgba(217,119,6,.1); color:#b45309 !important; }

.cfg-tags__resumo { margin-top:16px; border:1px solid rgba(219,39,119,.16); background:linear-gradient(135deg,rgba(219,39,119,.08),rgba(124,58,237,.05)); }
.cfg-tags__criador { display:grid; grid-template-columns:minmax(180px,1fr) auto; gap:10px; max-width:600px; margin:16px 0 10px; padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--bg-subtle); }
.cfg-tags__criador .btn { min-width:120px; }
.cfg-tags__busca { width:100%; max-width:600px; margin:8px 0 16px; }
.cfg-tags__lista { gap:9px; padding:14px; border:1px dashed var(--border-strong); border-radius:12px; background:var(--bg-subtle); }
.cfg-tags__item { padding:6px 11px; border-color:color-mix(in srgb,var(--tag-cor) 38%,transparent); background:color-mix(in srgb,var(--tag-cor) 11%,white); color:var(--tag-cor); box-shadow:0 2px 5px color-mix(in srgb,var(--tag-cor) 10%,transparent); }
.cfg-tags__item::before { content:""; width:6px; height:6px; margin-right:6px; border-radius:50%; background:currentColor; }

.cfg__painel[data-aba="sms"] > .cfg__secao { padding:0; overflow:hidden; }
.cfg__painel[data-aba="sms"] .cfg__secao-cabecalho { margin:0; padding:22px 24px; background:linear-gradient(135deg,rgba(2,132,199,.09),transparent 72%); }
.cfg__painel[data-aba="sms"] .cfg__secao > .cfg__aviso { margin:16px 24px 0; }
.cfg__painel[data-aba="sms"] .cfg-canal__lista { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:20px 24px 26px; }
.cfg__painel[data-aba="sms"] .cfg-canal__conta { position:relative; padding:18px; border:1px solid #cde8f6; border-radius:14px; background:linear-gradient(145deg,#f5fbff,#fff); box-shadow:0 5px 16px rgba(2,132,199,.07); }
.cfg__painel[data-aba="sms"] .cfg-canal__avatar { background:#0284c7; color:#fff; box-shadow:0 5px 14px rgba(2,132,199,.22); }
.cfg__painel[data-aba="sms"] .cfg-canal__conectar { min-height:42px; align-self:start; }

.cfg__painel[data-aba="whatsapp"] { background:linear-gradient(180deg,rgba(22,163,74,.035),var(--bg-primary) 240px); }
.cfg-whatsapp-conta { border-radius:15px; box-shadow:0 5px 18px rgba(15,23,42,.055); }
.cfg-whatsapp-conta--api { border-top:3px solid #16a34a; }
.cfg-whatsapp-conta--web { border-top:3px solid #64748b; }

.cfg__secao--auditoria > .cfg__aviso { margin:14px 0 18px; }
.cfg__logs { position:relative; display:grid; gap:10px; }
.cfg__log { position:relative; padding:14px 16px 14px 20px; border:1px solid var(--border); border-radius:11px; background:var(--bg-elevated); box-shadow:0 3px 10px rgba(15,23,42,.045); }
.cfg__log::before { content:""; position:absolute; top:14px; bottom:14px; left:0; width:3px; border-radius:0 4px 4px 0; background:#64748b; }
.cfg__log-topo { margin-bottom:6px; }
.cfg__log-usuario { color:#334155; }
.cfg__log-texto { color:var(--text); font-weight:600; }
.cfg__log-quando { margin-top:5px; color:var(--text-muted); }

@media (max-width:760px) {
  .cfg__secao--mensagens .cfg-editor--resposta { grid-template-columns:1fr; }
  .cfg-respostas__campo--mensagem { grid-column:auto; grid-row:auto; }
  .cfg-respostas__lista-titulo { align-items:flex-start; flex-direction:column; }
  .cfg-tags__criador { grid-template-columns:1fr; }
  .cfg__painel[data-aba="sms"] .cfg-canal__lista { grid-template-columns:1fr; }
}

/* Ícones semânticos e coloridos das abas. */
body.config-aberta .cfg__busca:focus-within {
  border-color: var(--border-strong);
  box-shadow: 0 0 0 3px rgba(100,116,139,.09);
}

body.config-aberta .cfg__aba[data-aba="geral"] { --cfg-tab-cor:#2563eb; --cfg-tab-suave:rgba(37,99,235,.1); }
body.config-aberta .cfg__aba[data-aba="perfil"] { --cfg-tab-cor:#0891b2; --cfg-tab-suave:rgba(8,145,178,.1); }
body.config-aberta .cfg__aba[data-aba="usuarios"] { --cfg-tab-cor:#7c3aed; --cfg-tab-suave:rgba(124,58,237,.1); }
body.config-aberta .cfg__aba[data-aba="setores"] { --cfg-tab-cor:#4f46e5; --cfg-tab-suave:rgba(79,70,229,.1); }
body.config-aberta .cfg__aba[data-aba="respostas_rapidas"] { --cfg-tab-cor:#d97706; --cfg-tab-suave:rgba(217,119,6,.1); }
body.config-aberta .cfg__aba[data-aba="tags"] { --cfg-tab-cor:#db2777; --cfg-tab-suave:rgba(219,39,119,.1); }
body.config-aberta .cfg__aba[data-aba="whatsapp"] { --cfg-tab-cor:#16a34a; --cfg-tab-suave:rgba(22,163,74,.1); }
body.config-aberta .cfg__aba[data-aba="sms"] { --cfg-tab-cor:#0284c7; --cfg-tab-suave:rgba(2,132,199,.1); }
body.config-aberta .cfg__aba[data-aba="api"] { --cfg-tab-cor:#ea580c; --cfg-tab-suave:rgba(234,88,12,.1); }
body.config-aberta .cfg__aba[data-aba="seguranca"] { --cfg-tab-cor:#0f766e; --cfg-tab-suave:rgba(15,118,110,.1); }
body.config-aberta .cfg__aba[data-aba="logs"] { --cfg-tab-cor:#475569; --cfg-tab-suave:rgba(71,85,105,.1); }

body.config-aberta .cfg__aba-icone {
  border-color:color-mix(in srgb,var(--cfg-tab-cor) 24%,transparent);
  background:var(--cfg-tab-suave);
  color:var(--cfg-tab-cor);
}

body.config-aberta .cfg__aba-icone svg {
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.config-aberta .cfg__aba:hover { color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba.is-ativa {
  border-color:color-mix(in srgb,var(--cfg-tab-cor) 30%,transparent);
  background:var(--cfg-tab-suave);
  color:var(--cfg-tab-cor);
}
body.config-aberta .cfg__aba.is-ativa .cfg__aba-icone {
  border-color:var(--cfg-tab-cor);
  background:var(--cfg-tab-cor);
  color:#fff;
  box-shadow:0 4px 12px color-mix(in srgb,var(--cfg-tab-cor) 24%,transparent);
}
body.config-aberta .cfg__aba[data-aba="instagram"] .cfg__aba-icone svg {
  display:block;
  opacity:1;
  visibility:visible;
  stroke:currentColor;
}

/* ── Acabamento empresarial compartilhado por todas as abas ───────────── */
.cfg__painel--entrada > * {
  animation: cfgConteudoEntrada .28s cubic-bezier(.2, .75, .25, 1) both;
}

.cfg__painel--entrada > *:nth-child(2) { animation-delay: 35ms; }
.cfg__painel--entrada > *:nth-child(3) { animation-delay: 70ms; }

@keyframes cfgConteudoEntrada {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}

.cfg__secao {
  transition: border-color .18s ease, box-shadow .18s ease;
}

.cfg__secao:hover {
  border-color: var(--border-strong);
  box-shadow: 0 8px 24px rgba(15, 23, 42, .055);
}

.cfg__secao-cabecalho {
  display: grid;
  grid-template-columns: 4px minmax(0, 1fr);
  align-items: stretch;
  gap: 12px;
  margin-bottom: 18px;
}

.cfg__secao-indicador {
  width: 4px;
  min-height: 36px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 55%, transparent));
}

.cfg__secao-textos {
  display: flex;
  min-width: 0;
  justify-content: center;
  flex-direction: column;
}

.cfg__secao-titulo {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.01em;
}

.cfg__secao-sub {
  max-width: 760px;
  margin: 3px 0 0;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.5;
}

.cfg__linha {
  min-height: 42px;
  align-items: center;
  padding: 10px 4px;
  transition: background .15s ease;
}

.cfg__linha:hover {
  background: var(--bg-subtle);
}

.cfg__linha-rot {
  color: var(--text-secondary);
  font-size: 11.5px;
}

.cfg__linha-val {
  color: var(--text);
  font-size: 11.5px;
  font-weight: 650;
}

.cfg .campo__input,
.cfg select,
.cfg textarea {
  border-radius: 10px;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.cfg .campo__input:hover,
.cfg select:hover,
.cfg textarea:hover {
  border-color: var(--border-strong);
}

.cfg .campo__input:focus,
.cfg select:focus,
.cfg textarea:focus {
  border-color: var(--accent);
  outline: 0;
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.cfg .btn {
  border-radius: 9px;
  font-weight: 650;
  transition: background .16s ease, border-color .16s ease, color .16s ease,
    box-shadow .16s ease, transform .16s ease;
}

.cfg .btn:hover:not(:disabled) {
  transform: translateY(-1px);
}

.cfg .btn:active:not(:disabled) {
  transform: translateY(0) scale(.985);
}

.cfg .btn--primario {
  box-shadow: 0 7px 18px rgba(192, 37, 27, .16);
}

.cfg .btn--primario:hover:not(:disabled) {
  box-shadow: 0 9px 22px rgba(192, 37, 27, .22);
}

.cfg__aviso {
  position: relative;
  padding: 11px 13px 11px 36px;
  border-radius: 10px;
}

.cfg__aviso::before {
  content: "i";
  position: absolute;
  top: 11px;
  left: 13px;
  display: grid;
  width: 15px;
  height: 15px;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 9px;
  font-weight: 800;
}

.cfg__aviso--ok::before { content: "✓"; }
.cfg__aviso--erro::before { content: "!"; }
.cfg__aviso[hidden] { display: none; }

.cfg__carregando {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 28px;
}

.cfg__carregando::before {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: cfgCarregando .7s linear infinite;
}

@keyframes cfgCarregando {
  to { transform: rotate(360deg); }
}

.cfg__ws {
  margin-top: 1px;
  padding: 13px 12px;
  border: 1px solid transparent;
  border-top-color: var(--border);
  border-radius: 9px;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}

.cfg__ws:hover {
  border-color: var(--border);
  background: var(--bg-subtle);
  transform: translateX(2px);
}

.cfg__ws-nome { color: var(--text); font-size: 12.5px; }
.cfg__ws-meta { line-height: 1.5; }

.cfg-editor {
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-subtle) 78%, var(--bg-elevated));
}

.cfg-operacao__item {
  min-height: 58px;
  border-radius: 11px;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease,
    transform .16s ease;
}

.cfg-operacao__item:hover {
  border-color: var(--border-strong);
  background: var(--bg-subtle);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.cfg-operacao__vazio,
.cfg-canal__vazio {
  display: grid;
  min-height: 108px;
  place-items: center;
  padding: 22px;
  border-radius: 12px;
  background: var(--bg-subtle);
  line-height: 1.55;
}

.cfg-tags__lista { min-height: 44px; }

.cfg-tags__item {
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.cfg-tags__item:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent-soft) 72%, var(--bg-elevated));
  transform: translateY(-1px);
}

.cfg__secao--perigo {
  background: color-mix(in srgb, var(--perigo-soft) 22%, var(--bg-elevated)) !important;
}

.cfg__log {
  margin-top: 8px;
  padding: 12px 13px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elevated);
  transition: border-color .16s ease, background .16s ease;
}

.cfg__log:hover {
  border-color: var(--border-strong);
  background: var(--bg-subtle);
}

.cfg__log-paginacao {
  position: sticky;
  bottom: -1px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg-elevated) 94%, transparent);
  backdrop-filter: blur(8px);
}

.cfg-perfil__avatar {
  border-color: var(--accent-ring);
  background:
    radial-gradient(circle at 28% 20%, rgba(192, 37, 27, .18), transparent 55%),
    var(--bg-subtle);
  color: var(--accent);
  box-shadow: 0 16px 32px -24px rgba(192, 37, 27, .55);
  transition: box-shadow .18s ease, transform .18s ease;
}

.cfg-perfil__avatar:hover {
  box-shadow: 0 20px 36px -22px rgba(192, 37, 27, .62);
  transform: translateY(-2px);
}

.cfg-canal__conta {
  border-radius: 12px;
  background: var(--bg-elevated);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.cfg-canal__conta:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce) {
  .cfg__painel--entrada > *,
  .cfg__carregando::before {
    animation: none;
  }
  .cfg__secao,
  .cfg__ws,
  .cfg-operacao__item,
  .cfg-tags__item,
  .cfg-perfil__avatar,
  .cfg-canal__conta,
  .cfg .btn {
    transition: none;
  }
}

/* ── Identidade visual específica de cada aba ──────────────────────────── */
.cfg__painel[data-aba="geral"] {
  display: grid;
  grid-template-columns: minmax(300px, .85fr) minmax(420px, 1.15fr);
  align-content: start;
  gap: 16px;
}

.cfg__painel[data-aba="geral"] > .cfg__secao {
  margin: 0;
}

.cfg__secao--identidade {
  background:
    radial-gradient(circle at 96% 0, rgba(192, 37, 27, .08), transparent 36%),
    var(--bg-elevated) !important;
}

.cfg-org-identidade {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-subtle) 72%, var(--bg-elevated));
}

.cfg-org-identidade__marca {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 13px;
  background: var(--accent);
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  box-shadow: 0 9px 20px rgba(192, 37, 27, .2);
}

.cfg-org-identidade__texto {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

.cfg-org-identidade__texto strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cfg-org-identidade__texto span { color: var(--text-muted); font-size: 10.5px; }

.cfg-org-identidade__status {
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--sucesso-soft);
  color: var(--sucesso);
  font-size: 9.5px;
  font-weight: 750;
}

.cfg__secao--workspaces {
  background: var(--bg-subtle) !important;
}

.cfg__secao--workspaces .cfg__ws {
  margin: 8px 0 0;
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--bg-elevated);
}

.cfg__painel[data-aba="perfil"] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 16px;
}

.cfg__painel[data-aba="perfil"] > .cfg__secao { margin: 0; }
.cfg__painel[data-aba="perfil"] > .cfg__secao--perfil { grid-column: 1 / -1; }

.cfg__secao--perfil {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent-soft) 45%, var(--bg-elevated)), var(--bg-elevated) 38%)
    !important;
}

.cfg__secao--senha {
  border-top: 3px solid var(--info) !important;
}

.cfg__secao--equipe {
  border-top: 3px solid var(--accent) !important;
}

.cfg__secao--equipe .usr {
  margin-top: 3px;
}

.cfg__secao--setores {
  border-top: 3px solid var(--aviso) !important;
}

.cfg__secao--setores .cfg-editor--setor {
  padding: 16px;
  border-color: color-mix(in srgb, var(--aviso) 24%, var(--border));
  background: color-mix(in srgb, var(--aviso-soft) 35%, var(--bg-subtle));
}

.cfg__secao--setores .cfg-operacao__cor {
  width: 14px;
  height: 14px;
  box-shadow: 0 0 0 4px var(--bg-subtle);
}

.cfg__secao--mensagens {
  border-top: 3px solid var(--info) !important;
}

.cfg__secao--mensagens .cfg-editor--resposta {
  grid-template-columns: minmax(180px, .42fr) minmax(320px, 1fr);
  align-items: start;
  padding: 16px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--info) 6%, var(--bg-subtle)), var(--bg-subtle));
}

.cfg__secao--mensagens .cfg-editor__mensagem {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-height: 118px;
}

.cfg__secao--mensagens .cfg-editor__acoes {
  grid-column: 1;
}

.cfg__secao--mensagens .cfg-operacao__item--resposta {
  border-left: 3px solid var(--info);
}

.cfg__secao--tags {
  min-height: 360px;
  border-top: 3px solid #8b5cf6 !important;
  background:
    radial-gradient(circle at 100% 0, rgba(139, 92, 246, .075), transparent 34%),
    var(--bg-elevated) !important;
}

.cfg-tags__resumo {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  margin: 14px 0;
  padding: 10px 13px;
  border: 1px solid rgba(139, 92, 246, .18);
  border-radius: 10px;
  background: rgba(139, 92, 246, .07);
}

.cfg-tags__resumo strong { color: #7c3aed; font-size: 20px; }
.cfg-tags__resumo span { color: var(--text-muted); font-size: 10.5px; }

.cfg__secao--canal {
  border-top: 3px solid var(--info) !important;
}

.cfg__secao--sms {
  background:
    radial-gradient(circle at 100% 0, color-mix(in srgb, var(--info) 8%, transparent), transparent 34%),
    var(--bg-elevated) !important;
}

.cfg__secao--api {
  border-top: 3px solid #6366f1 !important;
  background:
    linear-gradient(135deg, rgba(99, 102, 241, .045), transparent 42%),
    var(--bg-elevated) !important;
}

.cfg__secao--api .cfg__linha-val {
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--bg-subtle);
  font-family: var(--font-mono);
  font-size: 10.5px;
}

.cfg__secao--seguranca {
  border-top: 3px solid var(--sucesso) !important;
}

.cfg__secao--seguranca .cfg__linha-val::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 7px;
  border-radius: 50%;
  background: var(--sucesso);
  box-shadow: 0 0 0 3px var(--sucesso-soft);
  vertical-align: middle;
}

.cfg__secao--auditoria {
  border-top: 3px solid var(--text-secondary) !important;
}

.cfg__secao--auditoria .cfg__logs {
  position: relative;
  padding-left: 17px;
}

.cfg__secao--auditoria .cfg__logs::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 4px;
  width: 2px;
  border-radius: 999px;
  background: var(--border);
}

.cfg__secao--auditoria .cfg__log {
  position: relative;
}

.cfg__secao--auditoria .cfg__log::before {
  content: "";
  position: absolute;
  top: 17px;
  left: -18px;
  width: 8px;
  height: 8px;
  border: 2px solid var(--bg-elevated);
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 1px var(--border);
}

.cfg__secao--erros {
  border-top: 3px solid var(--perigo) !important;
}

@media (max-width: 1180px) {
  .cfg__painel[data-aba="geral"],
  .cfg__painel[data-aba="perfil"] {
    grid-template-columns: 1fr;
  }
  .cfg__painel[data-aba="perfil"] > .cfg__secao--perfil {
    grid-column: auto;
  }
}

@media (max-width: 800px) {
  .cfg__secao--mensagens .cfg-editor--resposta {
    grid-template-columns: 1fr;
  }
  .cfg__secao--mensagens .cfg-editor__mensagem,
  .cfg__secao--mensagens .cfg-editor__acoes {
    grid-column: 1;
    grid-row: auto;
  }
  .cfg-org-identidade {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  .cfg-org-identidade__marca { width: 42px; height: 42px; }
  .cfg-org-identidade__status { grid-column: 2; justify-self: start; }
}

/* ── Central operacional do WhatsApp ───────────────────────────────────── */
.cfg__painel[data-aba="whatsapp"] {
  padding-bottom: 42px;
}

.cfg__painel[data-aba="whatsapp"] > .cfg-whatsapp {
  border-top: 3px solid #19a463;
  background:
    radial-gradient(circle at 100% 0, rgba(25, 164, 99, .075), transparent 26%),
    var(--bg-elevated);
}

.cfg-whatsapp__diagnostico {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 16px 26px 0;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--bg-subtle);
}

.cfg-whatsapp__diagnostico[hidden] { display: none; }

.cfg-whatsapp__diagnostico.is-ok {
  border-color: var(--sucesso-linha);
  background: var(--sucesso-soft);
}

.cfg-whatsapp__diagnostico.is-alerta {
  border-color: var(--aviso-linha);
  background: var(--aviso-soft);
}

.cfg-whatsapp__diagnostico-icone {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border-radius: 9px;
  background: var(--bg-elevated);
  color: var(--sucesso);
  font-size: 12px;
  font-weight: 850;
  box-shadow: var(--shadow-sm);
}

.cfg-whatsapp__diagnostico.is-alerta .cfg-whatsapp__diagnostico-icone {
  color: var(--aviso);
}

.cfg-whatsapp__diagnostico-texto {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.cfg-whatsapp__diagnostico-texto strong { color: var(--text); font-size: 11.5px; }
.cfg-whatsapp__diagnostico-texto span { color: var(--text-muted); font-size: 10px; line-height: 1.45; }

.cfg-whatsapp__resumo {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 16px;
}

.cfg-whatsapp__resumo-item.is-alerta strong { color: var(--aviso); }

.cfg-whatsapp__ferramentas {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.cfg-whatsapp__busca {
  display: flex;
  width: min(250px, 28vw);
  min-height: 36px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-elevated);
  color: var(--text-muted);
  transition: border-color .16s ease, box-shadow .16s ease;
}

.cfg-whatsapp__busca:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.cfg-whatsapp__busca input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 10.5px;
}

.cfg-whatsapp__comandos {
  display: flex;
  flex: none;
  align-items: center;
  gap: 10px;
}

.cfg-whatsapp__atualizado {
  color: var(--text-muted);
  font-size: 9.5px;
  white-space: nowrap;
}

.cfg-whatsapp-conta {
  position: relative;
  border-top: 3px solid var(--sucesso);
  overflow: hidden;
}

.cfg-whatsapp-conta--web {
  border-top-color: var(--info);
}

.cfg-whatsapp-conta.is-atencao {
  border-top-color: var(--aviso);
}

.cfg-whatsapp-conta.is-pausada {
  border-top-color: var(--text-muted);
}

.cfg-whatsapp-conta.is-pausada::after {
  content: "PAUSADA";
  position: absolute;
  top: 0;
  right: 16px;
  padding: 3px 7px;
  border-radius: 0 0 7px 7px;
  background: var(--text-muted);
  color: var(--bg-elevated);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .08em;
}

.cfg-whatsapp-conta__selo-tipo {
  margin-left: auto;
  padding: 3px 6px;
  border-radius: 999px;
  background: var(--sucesso-soft);
  color: var(--sucesso);
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .05em;
}

.cfg-whatsapp-conta--web .cfg-whatsapp-conta__selo-tipo {
  background: color-mix(in srgb, var(--info) 12%, transparent);
  color: var(--info);
}

.cfg-whatsapp-conta__saude {
  margin: 2px 0 10px;
}

.cfg-whatsapp-conta__saude-titulo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
  color: var(--text-muted);
  font-size: 9.5px;
}

.cfg-whatsapp-conta__saude-titulo strong {
  color: var(--sucesso);
  font-size: 9.5px;
}

.cfg-whatsapp-conta.is-atencao .cfg-whatsapp-conta__saude-titulo strong {
  color: var(--aviso);
}

.cfg-whatsapp-conta__saude-trilho {
  display: block;
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--bg-subtle);
}

.cfg-whatsapp-conta__saude-trilho i {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: var(--sucesso);
  transform-origin: left;
  animation: cfgWhatsappSaude .45s ease both;
}

.cfg-whatsapp-conta__saude-trilho i.is-alerta {
  width: 58%;
  background: var(--aviso);
}

@keyframes cfgWhatsappSaude {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

.cfg-whatsapp-conta__detalhes {
  margin: 11px 0 0;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-subtle);
  animation: cfgWhatsappDetalhes .18s ease both;
}

.cfg-whatsapp-conta__detalhes[hidden] { display: none; }
.cfg-whatsapp-conta__detalhes .cfg__linha { min-height: 30px; padding: 4px 0; }

@keyframes cfgWhatsappDetalhes {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.cfg-whatsapp-conta__acoes {
  flex-wrap: wrap;
}

.cfg-whatsapp-conta__detalhes-btn {
  color: var(--text-secondary);
}

.cfg-whatsapp-conta > .cfg__aviso {
  margin-top: 10px;
}

@media (max-width: 1250px) {
  .cfg-whatsapp__barra {
    align-items: stretch;
    flex-direction: column;
  }
  .cfg-whatsapp__comandos {
    justify-content: space-between;
  }
}

@media (max-width: 1050px) {
  .cfg-whatsapp__ferramentas {
    align-items: stretch;
    flex-direction: column;
  }
  .cfg-whatsapp__busca { width: 100%; }
  .cfg-whatsapp__resumo { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .cfg-whatsapp__diagnostico { margin: 14px 18px 0; }
  .cfg-whatsapp__resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cfg-whatsapp__filtros { overflow-x: auto; }
  .cfg-whatsapp__atualizado { display: none; }
  .cfg-whatsapp-conta__acoes .btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .cfg-whatsapp-conta__saude-trilho i,
  .cfg-whatsapp-conta__detalhes {
    animation: none;
  }
}

@media (max-width: 900px) {
  body.config-aberta .cfg__corpo {
    display: grid;
    grid-template-columns: 238px minmax(0, 1fr);
  }
  body.config-aberta .cfg__painel {
    padding: 20px;
  }
}

@media (max-width: 700px) {
  body.config-aberta .cfg__corpo {
    display: block;
  }
  body.config-aberta .cfg__abas {
    display: flex;
    position: sticky;
    top: 0;
    flex-direction: row;
    min-height: 48px;
    padding: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  body.config-aberta .cfg__nav-intro,
  body.config-aberta .cfg__busca,
  body.config-aberta .cfg__grupo-label,
  body.config-aberta .cfg__busca-vazia {
    display: none;
  }
  body.config-aberta .cfg__aba {
    display: flex;
    width: auto;
    min-width: max-content;
    min-height: 40px;
    padding: 6px 10px;
  }
  body.config-aberta .cfg__aba-icone {
    width: 28px;
    height: 28px;
  }
  body.config-aberta .cfg__aba-texto small,
  body.config-aberta .cfg__aba-seta {
    display: none;
  }
  body.config-aberta .cfg__painel {
    padding: 14px;
  }
}

/* ── Configurações em viewport integral ───────────────────────────────────
   Ao abrir esta rota, a própria central substitui temporariamente toda a
   interface. O botão Fechar no cabeçalho devolve o usuário à tela anterior. */
body.config-aberta .app {
  display: block;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}

body.config-aberta .sidebar,
body.config-aberta .topbar,
body.config-aberta .subnav,
body.config-aberta .gd-paineis {
  display: none !important;
}

body.config-aberta .content {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: block;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  padding: 0 !important;
  overflow: hidden;
  background: var(--bg-primary);
}

body.config-aberta .content::before { display: none; }

body.config-aberta .view[data-view="config"].is-active {
  position: absolute;
  inset: 0;
  display: flex;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

body.config-aberta .cfg {
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
}

body.config-aberta .cfg__corpo { min-height: 0; }

@media (max-width: 700px) {
  body.config-aberta { overflow: hidden; }
  body.config-aberta .content { min-height: 0; overflow: hidden; }
  body.config-aberta .cfg { height: 100%; }
  body.config-aberta .cfg__corpo {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
  }
  body.config-aberta .cfg__abas { position: static; flex: none; }
  body.config-aberta .cfg__painel { flex: 1; min-height: 0; overflow-y: auto; }
}

/* ── Abas superiores no padrão da Configuração da Empresa ──────────────── */
body.config-aberta .cfg__corpo {
  display: flex;
  flex-direction: column;
}

body.config-aberta .cfg__abas {
  display: flex;
  position: static;
  z-index: 3;
  flex: none;
  flex-direction: row;
  align-items: stretch;
  gap: 0;
  width: 100%;
  min-height: 55px;
  padding: 0 24px;
  overflow-x: auto;
  overflow-y: hidden;
  border-right: 0;
  border-bottom: 1px solid var(--border);
  background: var(--bg-elevated);
  scrollbar-width: thin;
}

body.config-aberta .cfg__aba {
  display: flex;
  position: relative;
  grid-template-columns: none;
  width: auto;
  min-width: max-content;
  min-height: 55px;
  align-items: center;
  gap: 0;
  padding: 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text-muted);
}

body.config-aberta .cfg__aba:hover {
  border-color: transparent;
  background: transparent;
  color: var(--text);
  transform: none;
}

body.config-aberta .cfg__aba::after {
  content: "";
  position: absolute;
  right: 14px;
  bottom: 0;
  left: 14px;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: transparent;
}

body.config-aberta .cfg__aba.is-ativa {
  border-color: transparent;
  background: transparent;
  color: var(--accent);
  box-shadow: none;
}

body.config-aberta .cfg__aba.is-ativa::after {
  background: var(--accent);
}

body.config-aberta .cfg__aba-icone,
body.config-aberta .cfg__aba-seta,
body.config-aberta .cfg__aba-texto small {
  display: none;
}

body.config-aberta .cfg__aba-texto {
  display: block;
}

body.config-aberta .cfg__aba-texto strong,
body.config-aberta .cfg__aba.is-ativa .cfg__aba-texto strong {
  color: inherit;
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}

body.config-aberta .cfg__painel {
  flex: 1;
  padding: 24px 28px 40px;
  background: var(--bg-elevated);
}

body.config-aberta .cfg__painel > .cfg__secao {
  margin: 0 0 22px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.config-aberta .cfg__painel > .cfg-whatsapp {
  min-height: 100%;
  padding: 0;
}

body.config-aberta .cfg-whatsapp__cabecalho {
  padding: 5px 0 22px;
}

body.config-aberta .cfg-whatsapp__resumo {
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

body.config-aberta .cfg-whatsapp__resumo-item:first-child {
  padding-left: 16px;
}

body.config-aberta .cfg-whatsapp__resumo-item:last-child {
  padding-right: 16px;
}

body.config-aberta .cfg-whatsapp__barra {
  padding: 16px 0;
}

body.config-aberta .cfg-whatsapp__lista {
  padding: 0 0 24px;
}

@media (max-width: 900px) {
  body.config-aberta .cfg__corpo {
    display: flex;
  }
  body.config-aberta .cfg__abas {
    padding-inline: 12px;
  }
  body.config-aberta .cfg__painel {
    padding: 20px;
  }
}

@media (max-width: 700px) {
  body.config-aberta .cfg__corpo {
    display: flex;
    min-height: 0;
  }
  body.config-aberta .cfg__abas {
    min-height: 48px;
    padding: 0 8px;
  }
  body.config-aberta .cfg__aba {
    min-height: 48px;
    padding-inline: 11px;
  }
  body.config-aberta .cfg__painel {
    padding: 16px 14px 28px;
  }
}

/* Regra final: a navegação de Configurações é vertical no desktop. */
@media (min-width: 701px) {
  body.config-aberta .cfg {
    gap: 0;
  }

  body.config-aberta .cfg__corpo {
    display: grid;
    grid-template-columns: 292px minmax(0, 1fr);
    flex: 1;
    flex-direction: initial;
    min-height: 0;
    margin: 0;
  }

  body.config-aberta .cfg__abas {
    display: flex;
    position: static;
    flex: initial;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    width: auto;
    min-height: 0;
    padding: 14px 11px 22px;
    overflow-x: hidden;
    overflow-y: auto;
    border-right: 1px solid var(--border);
    border-bottom: 0;
    background: var(--bg-elevated);
  }

  body.config-aberta .cfg__nav-intro,
  body.config-aberta .cfg__busca {
    display: flex;
  }

  body.config-aberta .cfg__grupo-label {
    display: block;
  }

  body.config-aberta .cfg__aba {
    display: grid;
    position: relative;
    grid-template-columns: 33px minmax(0, 1fr) 12px;
    width: 100%;
    min-width: 0;
    min-height: 52px;
    align-items: center;
    gap: 10px;
    padding: 7px 9px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--text-muted);
    box-shadow: none;
  }

  body.config-aberta .cfg__aba::after {
    display: none;
  }

  body.config-aberta .cfg__aba:hover {
    border-color: var(--border);
    background: var(--surface);
    color: var(--text);
  }

  body.config-aberta .cfg__aba.is-ativa {
    border-color: var(--accent-ring);
    background: var(--accent-soft);
    color: var(--accent);
    box-shadow: inset 0 0 0 1px rgba(192, 37, 27, .025);
  }

  body.config-aberta .cfg__aba-icone {
    display: grid;
    width: 33px;
    height: 33px;
  }

  body.config-aberta .cfg__aba-seta {
    display: block;
  }

  body.config-aberta .cfg__aba-texto {
    display: flex;
  }

  body.config-aberta .cfg__aba-texto small {
    display: block;
  }

  body.config-aberta .cfg__aba-texto strong,
  body.config-aberta .cfg__aba.is-ativa .cfg__aba-texto strong {
    color: inherit;
    font-size: 12px;
    white-space: normal;
  }

  body.config-aberta .cfg__painel {
    min-width: 0;
    padding: 24px 26px 38px;
    overflow-y: auto;
    background: var(--bg-primary);
  }
}

@media (min-width: 1500px) {
  body.config-aberta .cfg__corpo {
    grid-template-columns: 310px minmax(0, 1fr);
  }
}

/* Prioridade final sobre as regras antigas de navegação. */
body.config-aberta .cfg__aba[data-aba="whatsapp_api"] { --cfg-tab-cor:#16a34a; --cfg-tab-suave:rgba(22,163,74,.1); }
body.config-aberta .cfg__aba[data-aba="whatsapp"] { --cfg-tab-cor:#0f766e; --cfg-tab-suave:rgba(15,118,110,.1); }
body.config-aberta .cfg__busca:focus-within { border-color:var(--border-strong); box-shadow:0 0 0 3px rgba(100,116,139,.09); }
body.config-aberta .cfg__aba-icone { border-color:color-mix(in srgb,var(--cfg-tab-cor) 24%,transparent); background:var(--cfg-tab-suave); color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba-icone svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
body.config-aberta .cfg__aba:hover { color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba.is-ativa { border-color:color-mix(in srgb,var(--cfg-tab-cor) 30%,transparent); background:var(--cfg-tab-suave); color:var(--cfg-tab-cor); }
body.config-aberta .cfg__aba.is-ativa .cfg__aba-icone { border-color:var(--cfg-tab-cor); background:var(--cfg-tab-cor); color:#fff; box-shadow:0 4px 12px color-mix(in srgb,var(--cfg-tab-cor) 24%,transparent); }
body.config-aberta .cfg__painel[data-aba="whatsapp_api"],
body.config-aberta .cfg__painel[data-aba="whatsapp"] { background:linear-gradient(180deg,rgba(22,163,74,.035),var(--bg-primary) 240px); }
body.config-aberta .cfg-whatsapp__resumo { grid-template-columns:repeat(3,minmax(0,1fr)); }
body.config-aberta .cfg-whatsapp--api { border-top:3px solid #16a34a; }
body.config-aberta .cfg-whatsapp--qr { border-top:3px solid #0f766e; }

/* WhatsApp: acabamento visual das centrais separadas. */
body.config-aberta .cfg__painel[data-aba="whatsapp_api"],
body.config-aberta .cfg__painel[data-aba="whatsapp"] {
  padding:26px 30px 46px;
  background:
    radial-gradient(circle at 86% 4%,rgba(34,197,94,.08),transparent 25%),
    linear-gradient(180deg,#f5faf7 0,#f8faf9 280px,var(--bg-primary) 620px);
}

body.config-aberta .cfg__painel > .cfg-whatsapp {
  overflow:visible;
  border:0;
  border-radius:20px;
  background:transparent;
  box-shadow:none;
}

body.config-aberta .cfg-whatsapp__cabecalho {
  align-items:center;
  padding:24px 26px;
  border:1px solid rgba(15,118,110,.14);
  border-radius:18px;
  background:rgba(255,255,255,.9);
  box-shadow:0 12px 32px rgba(15,23,42,.055);
  backdrop-filter:blur(10px);
}

body.config-aberta .cfg-whatsapp__titulo {
  position:relative;
  padding-left:58px;
}

body.config-aberta .cfg-whatsapp__titulo::before {
  content:"QR";
  position:absolute;
  top:50%;
  left:0;
  display:grid;
  width:44px;
  height:44px;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(145deg,#0f766e,#14b8a6);
  color:#fff;
  box-shadow:0 8px 18px rgba(15,118,110,.22);
  font-size:11px;
  font-weight:850;
  letter-spacing:.04em;
  transform:translateY(-50%);
}

body.config-aberta .cfg-whatsapp--api .cfg-whatsapp__titulo::before {
  content:"API";
  background:linear-gradient(145deg,#15803d,#22c55e);
  box-shadow:0 8px 18px rgba(21,128,61,.22);
}

body.config-aberta .cfg-whatsapp__kicker {
  margin-bottom:5px;
  color:#0f766e;
  font-size:9px;
  letter-spacing:.15em;
}

body.config-aberta .cfg-whatsapp--api .cfg-whatsapp__kicker { color:#15803d; }
body.config-aberta .cfg-whatsapp__titulo .cfg__secao-titulo {
  margin-bottom:5px;
  color:#0f172a;
  font-size:20px;
  letter-spacing:-.025em;
}

body.config-aberta .cfg-whatsapp__titulo .cfg__secao-sub {
  color:#64748b;
  font-size:11.5px;
}

body.config-aberta .cfg-whatsapp__adicionar {
  min-height:43px;
  padding:0 17px;
  border:0;
  border-radius:12px;
  background:linear-gradient(135deg,#0f766e,#0d9488);
  color:#fff;
  box-shadow:0 9px 20px rgba(15,118,110,.2);
  font-size:11.5px;
  font-weight:750;
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}

body.config-aberta .cfg-whatsapp--api .cfg-whatsapp__adicionar {
  background:linear-gradient(135deg,#15803d,#16a34a);
  box-shadow:0 9px 20px rgba(21,128,61,.2);
}

body.config-aberta .cfg-whatsapp__adicionar:hover {
  filter:brightness(1.04);
  box-shadow:0 12px 25px rgba(15,118,110,.25);
  transform:translateY(-1px);
}

body.config-aberta .cfg-whatsapp__diagnostico {
  min-height:58px;
  margin:16px 0 0;
  padding:13px 15px;
  border-radius:15px;
  box-shadow:0 5px 18px rgba(15,23,42,.035);
}

body.config-aberta .cfg-whatsapp__diagnostico-icone {
  width:34px;
  height:34px;
  flex-basis:34px;
  border-radius:11px;
  box-shadow:0 4px 12px rgba(15,23,42,.06);
}

body.config-aberta .cfg-whatsapp__diagnostico-texto strong { font-size:11.5px; }
body.config-aberta .cfg-whatsapp__diagnostico-texto span { margin-top:2px; font-size:10.5px; }

body.config-aberta .cfg-whatsapp__resumo {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:14px 0 0;
  padding:0;
  border:0;
  background:transparent;
}

body.config-aberta .cfg-whatsapp__resumo-item,
body.config-aberta .cfg-whatsapp__resumo-item:first-child,
body.config-aberta .cfg-whatsapp__resumo-item:last-child {
  position:relative;
  gap:7px;
  min-height:86px;
  justify-content:center;
  padding:16px 18px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.24);
  border-radius:15px;
  background:rgba(255,255,255,.92);
  box-shadow:0 7px 22px rgba(15,23,42,.04);
}

body.config-aberta .cfg-whatsapp__resumo-item::after {
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:68px;
  height:68px;
  border-radius:0 0 0 68px;
  background:rgba(15,118,110,.045);
}

body.config-aberta .cfg-whatsapp__resumo-item strong {
  color:#0f172a;
  font-size:24px;
  font-weight:780;
  letter-spacing:-.04em;
}

body.config-aberta .cfg-whatsapp__resumo-item span { color:#64748b; font-size:10.5px; }

body.config-aberta .cfg-whatsapp__barra {
  margin:14px 0 16px;
  padding:10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:14px;
  background:rgba(255,255,255,.9);
  box-shadow:0 6px 20px rgba(15,23,42,.035);
}

body.config-aberta .cfg-whatsapp__busca {
  width:min(320px,32vw);
  min-height:40px;
  padding:0 12px;
  border-color:#dbe4ea;
  border-radius:10px;
  background:#f8fafc;
}

body.config-aberta .cfg-whatsapp__busca:focus-within {
  border-color:#5eead4;
  box-shadow:0 0 0 3px rgba(20,184,166,.1);
}

body.config-aberta .cfg-whatsapp__busca input,
body.config-aberta .cfg-whatsapp__busca input:focus {
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}

body.config-aberta .cfg-whatsapp__filtros {
  min-height:40px;
  align-items:center;
  border-color:#dbe4ea;
  border-radius:10px;
  background:#f1f5f9;
}

body.config-aberta .cfg-whatsapp__filtro {
  min-height:32px;
  border-radius:8px;
  font-size:10.5px;
}

body.config-aberta .cfg-whatsapp__filtro.is-ativo {
  color:#0f766e;
  box-shadow:0 2px 8px rgba(15,23,42,.07);
}

body.config-aberta .cfg-whatsapp__atualizar {
  min-height:36px;
  border-radius:9px;
  background:#fff;
}

body.config-aberta .cfg-whatsapp__lista {
  gap:16px;
  padding:0 0 28px;
}

body.config-aberta .cfg-whatsapp-conta {
  padding:20px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.25);
  border-radius:18px;
  background:rgba(255,255,255,.96);
  box-shadow:0 10px 28px rgba(15,23,42,.055);
  transition:border-color .24s ease,box-shadow .24s ease,transform .24s ease;
}

body.config-aberta .cfg-whatsapp-conta::before {
  content:"";
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:4px;
  background:linear-gradient(90deg,#0f766e,#2dd4bf);
}

body.config-aberta .cfg-whatsapp-conta.is-atencao::before {
  background:linear-gradient(90deg,#d97706,#fbbf24);
}

body.config-aberta .cfg-whatsapp-conta:hover {
  border-color:rgba(15,118,110,.3);
  box-shadow:0 16px 34px rgba(15,23,42,.085);
  transform:translateY(-3px);
}

body.config-aberta .cfg-whatsapp-conta__topo {
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:12px;
}

body.config-aberta .cfg-whatsapp-conta__avatar {
  width:48px;
  height:48px;
  border:3px solid #fff;
  background:linear-gradient(145deg,#dcfce7,#ccfbf1);
  color:#0f766e;
  box-shadow:0 5px 14px rgba(15,118,110,.13);
}

body.config-aberta .cfg-whatsapp-conta__identidade strong { font-size:13.5px; }
body.config-aberta .cfg-whatsapp-conta__identidade span { font-size:11px; }
body.config-aberta .cfg-whatsapp-conta__status { padding:5px 9px; font-size:9.5px; }

body.config-aberta .cfg-whatsapp-conta__tipo {
  margin:17px 0 13px;
  padding:11px 12px;
  border:1px solid rgba(15,118,110,.08);
  border-radius:12px;
  background:linear-gradient(135deg,#f3faf7,#f8fafc);
}

body.config-aberta .cfg-whatsapp-conta__tipo-icone {
  width:32px;
  height:32px;
  flex-basis:32px;
  border-radius:10px;
}

body.config-aberta .cfg-whatsapp-conta__tipo strong { font-size:11px; }
body.config-aberta .cfg-whatsapp-conta__tipo small { margin-top:2px; font-size:9.5px; }
body.config-aberta .cfg-whatsapp-conta__saude { margin:5px 0 12px; }
body.config-aberta .cfg-whatsapp-conta__saude-trilho { height:6px; }

body.config-aberta .cfg-whatsapp-conta__dados .cfg__linha {
  min-height:34px;
  padding:7px 1px;
  border-color:#e9eef2;
}

body.config-aberta .cfg-whatsapp-conta__dados .cfg__linha-rot,
body.config-aberta .cfg-whatsapp-conta__dados .cfg__linha-val { font-size:10.5px; }

body.config-aberta .cfg-whatsapp-conta__acoes {
  gap:8px;
  margin:16px -20px -20px;
  padding:13px 20px;
  background:#fbfcfd;
}

body.config-aberta .cfg-whatsapp-conta__acoes .btn {
  min-height:34px;
  border-radius:9px;
}

body.config-aberta .cfg-whatsapp-conta__remover {
  padding:7px 4px;
  font-weight:600;
}

@media (max-width:900px) {
  body.config-aberta .cfg__painel[data-aba="whatsapp_api"],
  body.config-aberta .cfg__painel[data-aba="whatsapp"] { padding:20px; }
  body.config-aberta .cfg-whatsapp__cabecalho { align-items:stretch; flex-direction:column; }
  body.config-aberta .cfg-whatsapp__adicionar { width:100%; }
  body.config-aberta .cfg-whatsapp__lista { grid-template-columns:1fr; }
}

@media (max-width:620px) {
  body.config-aberta .cfg__painel[data-aba="whatsapp_api"],
  body.config-aberta .cfg__painel[data-aba="whatsapp"] { padding:14px; }
  body.config-aberta .cfg-whatsapp__cabecalho { padding:19px; }
  body.config-aberta .cfg-whatsapp__titulo { padding-left:0; padding-top:54px; }
  body.config-aberta .cfg-whatsapp__titulo::before { top:0; transform:none; }
  body.config-aberta .cfg-whatsapp__resumo { grid-template-columns:1fr; }
  body.config-aberta .cfg-whatsapp__barra { align-items:stretch; flex-direction:column; }
  body.config-aberta .cfg-whatsapp__ferramentas { align-items:stretch; flex-direction:column; }
  body.config-aberta .cfg-whatsapp__busca { width:100%; }
  body.config-aberta .cfg-whatsapp__comandos { justify-content:space-between; }
}
.cfg-ig__summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:18px 0; }
.cfg-ig__metric { padding:16px; border:1px solid var(--border); border-radius:14px; background:var(--panel-bg); display:grid; gap:7px; }
.cfg-ig__metric span { color:var(--text-muted); font-size:12px; }
.cfg-ig__metric strong { font-size:22px; }
.cfg-ig__accounts { display:grid; gap:10px; margin-bottom:16px; }
.cfg-ig__account { display:flex; align-items:center; gap:14px; padding:14px; border:1px solid var(--border); border-radius:14px; }
.cfg-ig__identity { display:grid; gap:3px; flex:1; min-width:0; }
.cfg-ig__identity span,.cfg-ig__identity small { color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; }
.cfg-ig__form { display:grid; grid-template-columns:1fr 1.4fr auto; align-items:end; gap:10px; padding-top:16px; border-top:1px solid var(--border); }
.cfg-ig__steps { display:grid; gap:10px; list-style:none; padding:0; margin:18px 0; }
.cfg-ig__steps li { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid var(--border); border-radius:12px; }
.cfg-ig__steps b { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; }
.cfg-ig__steps span { display:grid; gap:2px; }.cfg-ig__steps small { color:var(--text-muted); }
.cfg-ig__help-actions { display:flex; gap:10px; flex-wrap:wrap; }
@media(max-width:800px){.cfg-ig__summary{grid-template-columns:repeat(2,1fr)}.cfg-ig__form{grid-template-columns:1fr}.cfg-ig__account{align-items:flex-start;flex-wrap:wrap}}