/* Design Aurora — tokens */
:root {
  --font-family: 'Inter', sans-serif;
  --font-weight-bold: 700; --font-weight-semi: 600; --font-weight-regular: 400;
  --font-size-xxl: 1.5rem; --font-size-xl: 1.25rem; --font-size-lg: 1.125rem; --font-size-md: 1rem;
  --font-size-sm: 0.875rem; --font-size-xs: 0.75rem; --font-size-xxs: 0.625rem;
  --line-height: 150%;

  --color-primary-900: #2B0F5D; --color-primary-800: #3F1B7F; --color-primary-700: #4F2596;
  --color-primary-600: #6034AC; --color-primary-500: #6E3DC3; --color-primary-400: #8954E5;
  --color-primary-300: #B68CFF; --color-primary-200: #CBADFF; --color-primary-100: #E0CEFF; --color-primary-50: #F1ECFF;
  --color-secondary-500: #B12E5D; --color-secondary-50: #FCECF1;
  --color-neutral-900: #101123; --color-neutral-800: #28293A; --color-neutral-700: #404152;
  --color-neutral-600: #5B5D6C; --color-neutral-500: #777986; --color-neutral-400: #9496A1;
  --color-neutral-300: #B3B5BE; --color-neutral-200: #D2D4DB; --color-neutral-100: #E8EBEF; --color-neutral-50: #F3F4F9;
  --color-negative-700: #A71D1E; --color-negative-500: #EB4042; --color-negative-50: #FDEEEE;
  --color-positive-800: #336A48; --color-positive-500: #6DC18E; --color-positive-100: #D3F4E0; --color-positive-50: #ECFBF2;
  --color-warning-800: #6A4F0A; --color-warning-500: #F2C247; --color-warning-100: #FFEEC4; --color-warning-50: #FFFAED;
  --color-info-800: #397C9A; --color-info-50: #F4FCFF;
  --color-support-white: #FFFFFF; --color-support-off-white: #FBFCFF;

  /* Semânticos */
  --background: var(--color-neutral-50);
  --card: var(--color-support-white);
  --border: var(--color-neutral-100);
  --border-strong: var(--color-neutral-200);
  --foreground: var(--color-neutral-900);
  --muted: var(--color-neutral-500);
  --primary: var(--color-primary-500);
  --primary-hover: var(--color-primary-600);
  --primary-soft: var(--color-primary-50);
  --radius: 10px;
  --container: 1360px;
  --lateral: 248px;
  --sombra: 0 1px 2px rgba(16, 17, 35, .04), 0 1px 3px rgba(16, 17, 35, .03);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body {
  margin: 0; background: var(--background); color: var(--foreground);
  font-family: var(--font-family) !important; font-size: var(--font-size-sm);
  font-weight: var(--font-weight-regular); line-height: var(--line-height);
}
a { color: var(--primary); }
button, input, select, textarea { font: inherit; color: inherit; }
.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }

/* Estrutura: menu lateral fixo + conteúdo */
.lateral {
  position: fixed; inset: 0 auto 0 0; width: var(--lateral); background: var(--card); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; z-index: 9;
}
.marca { display: flex; align-items: center; gap: 10px; padding: 18px 16px 16px; border-bottom: 1px solid var(--border); }
.logo-icone {
  width: 36px; height: 36px; border-radius: 10px; background: var(--primary); color: var(--color-support-white);
  display: grid; place-items: center; flex: none; box-shadow: 0 2px 6px rgba(110, 61, 195, .35);
}
.logo-icone svg { width: 20px; height: 20px; }
.titulo-sistema { font-size: var(--font-size-md); font-weight: var(--font-weight-bold); margin: 0; line-height: 1.2; }
.subtitulo-sistema { font-size: var(--font-size-xs); color: var(--muted); margin: 0; }
.lateral nav { flex: 1; overflow-y: auto; padding: 6px 10px 16px; }
.grupo-nav { margin-top: 12px; }
.grupo-nav:not(:has(a:not([hidden]))) { display: none; }
.grupo-titulo {
  margin: 0 10px 4px; font-size: var(--font-size-xxs); text-transform: uppercase; letter-spacing: .08em;
  color: var(--color-neutral-400); font-weight: var(--font-weight-semi);
}
.lateral nav a {
  display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 8px; margin-bottom: 1px;
  color: var(--color-neutral-700); text-decoration: none; font-weight: var(--font-weight-semi); transition: background .12s, color .12s;
}
.lateral nav a:hover { background: var(--color-neutral-50); color: var(--foreground); }
.lateral nav a.ativo { background: var(--primary-soft); color: var(--color-primary-700); }
.ico { width: 18px; height: 18px; flex: none; color: var(--color-neutral-400); }
.lateral nav a:hover .ico { color: var(--color-neutral-600); }
.lateral nav a.ativo .ico { color: var(--primary); }
.perfil { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-top: 1px solid var(--border); }
.avatar {
  width: 32px; height: 32px; border-radius: 50%; background: var(--primary-soft); color: var(--color-primary-700);
  display: grid; place-items: center; font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); flex: none;
}
.perfil-texto { display: block; flex: 1; min-width: 0; line-height: 1.3; }
.perfil-texto strong { display: block; font-size: var(--font-size-sm); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.perfil-texto small { color: var(--muted); font-size: var(--font-size-xs); }
.link-sair {
  border: 1px solid var(--border-strong); background: var(--card); color: var(--color-neutral-700); font-weight: var(--font-weight-semi);
  cursor: pointer; padding: 4px 10px; border-radius: 6px; font-size: var(--font-size-xs);
}
.link-sair:hover { border-color: var(--color-negative-500); color: var(--color-negative-700); }
.principal { margin-left: var(--lateral); min-height: 100vh; }
.topo-movel { display: none; }
.fundo-menu { position: fixed; inset: 0; background: rgba(16, 17, 35, .4); z-index: 24; }
.btn-menu { border: 0; background: none; padding: 6px; border-radius: 8px; cursor: pointer; color: var(--foreground); display: grid; }
.btn-menu svg { width: 22px; height: 22px; }
.lateral nav a:focus-visible, .btn:focus-visible, .link-sair:focus-visible, .btn-menu:focus-visible {
  outline: 2px solid var(--color-primary-300); outline-offset: 2px;
}
@media (max-width: 900px) {
  .lateral { transform: translateX(-105%); transition: transform .2s ease; z-index: 25; width: min(280px, 85vw); }
  body.menu-aberto .lateral { transform: none; box-shadow: 0 10px 40px rgba(16, 17, 35, .25); }
  .principal { margin-left: 0; }
  .topo-movel {
    display: flex; align-items: center; gap: 8px; position: sticky; top: 0; z-index: 8;
    background: var(--card); border-bottom: 1px solid var(--border); padding: 8px 12px;
  }
}
@media (prefers-reduced-motion: reduce) { .lateral { transition: none; } }
body.deslogado .lateral, body.deslogado .topo-movel, body.deslogado .fundo-menu { display: none !important; }
body.deslogado .principal { margin-left: 0; }

/* Entrada (login / 2FA) */
.entrada { min-height: calc(100vh - 64px); display: grid; place-items: center; }
.entrada-card { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 32px; width: min(420px, 100%); }
.entrada-marca { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.entrada h1 { font-size: var(--font-size-xl); }
.entrada .sub { margin-bottom: 20px; }
.btn.largo { width: 100%; justify-content: center; padding: 10px; }
.codigo { font-size: var(--font-size-xl); letter-spacing: 0.3em; text-align: center; font-variant-numeric: tabular-nums; }
.qr { display: flex; justify-content: center; margin: 8px 0; min-height: 180px; }
.chave { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0 0 16px; font-size: var(--font-size-xs); color: var(--muted); }
.chave code { font-size: var(--font-size-sm); letter-spacing: 0.05em; }


main.container { padding: 28px 32px 56px; }
@media (max-width: 900px) { main.container { padding: 20px 16px 40px; } }
h1 { font-size: 1.625rem; font-weight: var(--font-weight-bold); margin: 0 0 4px; line-height: 1.25; letter-spacing: -0.01em; }
h2 { font-size: var(--font-size-md); font-weight: var(--font-weight-semi); margin: 0 0 12px; }
.sub { color: var(--muted); margin: 0 0 24px; }
.vazio { color: var(--muted); }

.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-bottom: 16px; }
.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; }
.card .rotulo { color: var(--muted); font-size: var(--font-size-xs); }
.card .valor { font-size: var(--font-size-xxl); font-weight: var(--font-weight-bold); font-variant-numeric: tabular-nums; }
.grade-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.barras { display: flex; flex-direction: column; gap: 8px; }
.barra { display: grid; grid-template-columns: 160px 1fr 40px; align-items: center; gap: 10px; }
.barra .trilho { background: var(--color-neutral-100); border-radius: 4px; height: 8px; overflow: hidden; }
.barra .preench { background: var(--primary); height: 100%; border-radius: 4px; }
.barra .n { text-align: right; font-variant-numeric: tabular-nums; color: var(--muted); }

.filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; align-items: center; }
.filtros input, .filtros select, .campo input, .campo select, .campo textarea {
  background: var(--card); border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 7px 10px;
}
.filtros input:focus, .filtros select:focus, .campo input:focus, .campo select:focus, .campo textarea:focus {
  outline: 2px solid var(--color-primary-200); border-color: var(--primary);
}
.filtros input[type=search] { min-width: 260px; }
.filtros .total { margin-left: auto; color: var(--muted); font-size: var(--font-size-xs); }

.tabela-wrap { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--border); white-space: nowrap; }
th { font-size: var(--font-size-xs); color: var(--muted); font-weight: var(--font-weight-semi); background: var(--color-support-off-white); }
tbody tr:last-child td { border-bottom: 0; }
tbody tr[data-cnpj] { cursor: pointer; }
tbody tr[data-cnpj]:hover { background: var(--primary-soft); }
td.empresa { white-space: normal; min-width: 220px; font-weight: var(--font-weight-semi); }
td.empresa small { display: block; color: var(--muted); font-weight: var(--font-weight-regular); font-size: var(--font-size-xs); }
.num { text-align: right; font-variant-numeric: tabular-nums; }

.tag { display: inline-block; padding: 1px 8px; border-radius: 99px; font-size: var(--font-size-xs); font-weight: var(--font-weight-semi); background: var(--color-neutral-100); color: var(--color-neutral-700); }
.tag.A { background: var(--color-positive-100); color: var(--color-positive-800); }
.tag.B { background: var(--color-warning-100); color: var(--color-warning-800); }
.tag.C { background: var(--color-negative-50); color: var(--color-negative-700); }
.tag.etapa { background: var(--primary-soft); color: var(--color-primary-700); font-weight: var(--font-weight-regular); }
.tag.alerta { background: var(--color-warning-50); color: var(--color-warning-800); font-weight: var(--font-weight-regular); }

.btn {
  border: 1px solid var(--border-strong); background: var(--card); padding: 7px 14px; border-radius: var(--radius);
  cursor: pointer; text-decoration: none; color: var(--foreground); display: inline-flex; align-items: center; gap: 6px;
  font-weight: var(--font-weight-semi); font-size: var(--font-size-sm);
}
.btn:hover { background: var(--color-neutral-50); }
.btn.primario { background: var(--primary); border-color: var(--primary); color: var(--color-support-white); }
.btn.primario:hover { background: var(--primary-hover); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn.perigo { background: var(--color-negative-500); border-color: var(--color-negative-500); color: var(--color-support-white); }
.btn.perigo:hover { background: var(--color-negative-700); }
.barra-selecao { display: flex; align-items: center; gap: 10px; background: var(--color-negative-50); border: 1px solid var(--color-negative-100, #FFD2D2); border-radius: var(--radius); padding: 8px 12px; margin-bottom: 12px; }
th.sel, td.sel { width: 36px; padding-right: 0; }
th.sel input, td.sel input { width: 16px; height: 16px; cursor: pointer; accent-color: var(--primary); }
.acoes { display: flex; gap: 8px; flex-wrap: wrap; }

.painel-lateral { position: fixed; inset: 0; z-index: 10; }
.painel-fundo { position: absolute; inset: 0; background: rgba(16, 17, 35, .4); }
.painel-corpo {
  position: absolute; right: 0; top: 0; bottom: 0; width: min(640px, 100%); background: var(--background);
  overflow-y: auto; padding: 24px; border-left: 1px solid var(--border);
}
.fechar { position: absolute; right: 16px; top: 14px; border: 0; background: none; font-size: 24px; cursor: pointer; color: var(--muted); }
.secao { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; margin-bottom: 12px; }
dl { display: grid; grid-template-columns: 130px 1fr; gap: 6px 12px; margin: 0; }
dt { color: var(--muted); }
dd { margin: 0; word-break: break-word; }
.msg { white-space: pre-wrap; background: var(--color-support-off-white); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; margin: 8px 0; }
.campo { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.campo label { color: var(--muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-semi); }
.campo textarea { min-height: 80px; resize: vertical; }
.form-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.erro { color: var(--color-negative-700); }

.status-int { display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-xs); font-weight: var(--font-weight-semi); }
.status-int::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.status-int.off { color: var(--color-warning-800); }
.status-int.on { color: var(--color-positive-800); }
.passos { margin: 8px 0 0; padding-left: 20px; }
.passos li { margin-bottom: 4px; }
code { background: var(--color-neutral-50); border: 1px solid var(--border); padding: 1px 6px; border-radius: 4px; font-size: var(--font-size-xs); }

/* Progresso da importação */
.progresso { margin: 4px 0 12px; }
.progresso .trilho { height: 8px; background: var(--color-neutral-100); border-radius: 4px; overflow: hidden; }
.progresso .trilho span { display: block; height: 100%; width: 0; background: var(--primary); border-radius: 4px; transition: width .2s; }
.progresso .trilho span.indeterminado { width: 35%; animation: vaivem 1.2s ease-in-out infinite; }
.progresso small { display: block; margin-top: 4px; color: var(--color-neutral-600); font-size: var(--font-size-xs); }
@keyframes vaivem { 0% { transform: translateX(-100%); } 100% { transform: translateX(290%); } }
@media (prefers-reduced-motion: reduce) { .progresso .trilho span.indeterminado { animation: none; width: 100%; opacity: .5; } }

/* Listas suspensas com pesquisa */
.ss-nativo { display: none !important; }
.ss { position: relative; display: inline-block; min-width: 170px; }
.campo .ss, .grupo .ss, .form-grade .ss { display: block; width: 100%; }
.ss-botao { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--card);
  border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 7px 10px; cursor: pointer; text-align: left; font-size: var(--font-size-sm); }
.ss-botao:hover { border-color: var(--color-neutral-300); }
.ss-botao:focus-visible, .ss-botao[aria-expanded="true"] { outline: 2px solid var(--color-primary-200); border-color: var(--primary); }
.ss-botao:disabled { opacity: .6; cursor: not-allowed; }
.ss-valor { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-seta { color: var(--muted); font-size: var(--font-size-xs); }
.ss-pop { position: absolute; top: calc(100% + 4px); left: 0; z-index: 40; min-width: 100%; width: max-content; max-width: 380px;
  background: var(--card); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(16, 17, 35, .12); padding: 6px; }
.ss-busca { width: 100%; border: 1px solid var(--border-strong); border-radius: 6px; padding: 6px 8px; margin-bottom: 4px; font-size: var(--font-size-sm); }
.ss-busca:focus { outline: 2px solid var(--color-primary-200); border-color: var(--primary); }
.ss-lista { list-style: none; margin: 0; padding: 0; max-height: 280px; overflow-y: auto; }
.ss-lista li { padding: 6px 8px; border-radius: 6px; cursor: pointer; font-size: var(--font-size-sm); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-lista li.ss-destaque { background: var(--primary-soft); color: var(--color-primary-700); }
.ss-lista li[aria-selected="true"] { font-weight: var(--font-weight-semi); }
.ss-lista li[aria-selected="true"]::after { content: " ✓"; color: var(--primary); }
.ss-lista .ss-nada { color: var(--muted); cursor: default; }

/* Tabela de leads */
.cabecalho-tela { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.painel-filtros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; margin-bottom: 12px; }
.painel-filtros[hidden] { display: none; }
.painel-filtros .grupo { display: flex; flex-direction: column; gap: 8px; }
.painel-filtros h3 { margin: 0; font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.painel-filtros select, .painel-filtros input:not([type=checkbox]) { background: var(--card); border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 7px 10px; }
.check { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.check input { accent-color: var(--primary); width: 16px; height: 16px; }
.etiquetas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; }
.etiquetas:empty { display: none; }
.chip { border: 1px solid var(--color-primary-200); background: var(--primary-soft); color: var(--color-primary-700); border-radius: 99px; padding: 2px 10px; font-size: var(--font-size-xs); font-weight: var(--font-weight-semi); cursor: pointer; }
.chip:hover { background: var(--color-primary-100); }
.resumo-filtro { font-size: var(--font-size-sm); color: var(--color-neutral-600); margin-bottom: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.resumo-filtro strong { color: var(--foreground); font-size: var(--font-size-md); }
.tabela-fixa { max-height: calc(100vh - 300px); min-height: 320px; overflow: auto; }
.tabela-fixa thead th { position: sticky; top: 0; z-index: 2; box-shadow: inset 0 -1px 0 var(--border); }
.t-leads td { vertical-align: top; white-space: normal; font-size: var(--font-size-sm); }
.t-leads td small { display: block; color: var(--muted); font-size: var(--font-size-xs); margin-top: 2px; }
.t-leads th[data-ordem] { cursor: pointer; user-select: none; white-space: nowrap; }
.t-leads th[data-ordem]:hover, .t-leads th.ordenada { color: var(--primary); }
.t-leads .seta { font-size: var(--font-size-xxs); }
.t-leads tbody tr.marcada { background: var(--primary-soft); }
.t-leads th, .t-leads td { padding: 10px 10px; }
.c-empresa { min-width: 220px; max-width: 280px; }
.c-empresa strong { display: block; line-height: 1.3; }
.linha-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; align-items: center; }
.linha-tags .tag { font-weight: var(--font-weight-regular); font-size: var(--font-size-xxs); }
.cnpj { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--font-size-xxs); background: var(--color-primary-50); color: var(--color-primary-700); border-radius: 4px; padding: 1px 6px; }
.c-ativ { min-width: 150px; max-width: 200px; }
.clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.c-local { min-width: 110px; }
.c-contato { min-width: 130px; max-width: 180px; }
.ico-link svg { width: 13px; height: 13px; vertical-align: -2px; fill: var(--primary); }
.c-canais { min-width: 210px; max-width: 250px; }
.canal { display: flex; align-items: center; gap: 6px; font-size: var(--font-size-xs); line-height: 1.8; min-width: 0; }
.canal svg { width: 14px; height: 14px; flex-shrink: 0; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.canal a { color: var(--foreground); text-decoration: none; }
.canal a:hover { color: var(--primary); text-decoration: underline; }
.trunc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; max-width: 150px; }
.selo { font-size: var(--font-size-xxs); border-radius: 4px; padding: 0 5px; background: var(--color-neutral-100); color: var(--color-neutral-600); white-space: nowrap; flex-shrink: 0; }
.selo.ok { background: var(--color-positive-100); color: var(--color-positive-800); font-weight: var(--font-weight-semi); }
.c-score { white-space: nowrap; }
.mini-barra { height: 4px; background: var(--color-neutral-100); border-radius: 2px; margin-top: 6px; width: 64px; overflow: hidden; }
.mini-barra span { display: block; height: 100%; }
.mini-barra .f-A { background: var(--color-positive-500); }
.mini-barra .f-B { background: var(--color-warning-500); }
.mini-barra .f-C { background: var(--color-negative-500); }
.paginacao { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 10px; font-size: var(--font-size-xs); color: var(--muted); flex-wrap: wrap; }
.paginacao select { border: 1px solid var(--border-strong); border-radius: 6px; padding: 4px 6px; background: var(--card); }
.paginacao .btn { padding: 4px 10px; font-size: var(--font-size-xs); }
@media (max-width: 800px) { .painel-filtros { grid-template-columns: 1fr; } .tabela-fixa { max-height: 70vh; } }

/* Listas */
.c-lista { min-width: 340px; white-space: normal; }
.c-lista small { display: block; color: var(--muted); font-size: var(--font-size-xs); margin-top: 4px; }
form.renomear { display: flex; gap: 6px; align-items: center; }
form.renomear input { flex: 1; min-width: 180px; border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 6px 8px; font-weight: var(--font-weight-semi); }
form.renomear input:focus { outline: 2px solid var(--color-primary-200); border-color: var(--primary); }
.kcard small.klista { color: var(--color-primary-700); }

/* Kanban */
.kquadro { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 12px; align-items: flex-start; }
.kcoluna { flex: 0 0 260px; background: var(--color-neutral-100); border-radius: var(--radius); display: flex; flex-direction: column; max-height: calc(100vh - 260px); border: 2px solid transparent; }
.kcoluna.alvo { border-color: var(--primary); background: var(--primary-soft); }
.kcoluna header { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; font-weight: var(--font-weight-semi); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: .03em; color: var(--color-neutral-700); }
.kcontador { background: var(--card); border-radius: 99px; padding: 0 8px; font-variant-numeric: tabular-nums; }
.kcartoes { overflow-y: auto; padding: 0 8px 8px; display: flex; flex-direction: column; gap: 8px; min-height: 60px; }
.kcard { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px; cursor: grab; display: flex; flex-direction: column; gap: 4px; }
.kcard:hover { border-color: var(--color-primary-200); }
.kcard:focus-visible { outline: 2px solid var(--primary); }
.kcard.arrastando { opacity: .4; }
.kcard-topo { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.kcard-topo strong { font-size: var(--font-size-sm); line-height: 1.3; }
.kcard small { color: var(--muted); font-size: var(--font-size-xs); }
.kcard-rodape { display: flex; justify-content: space-between; align-items: center; font-size: var(--font-size-xs); color: var(--color-neutral-600); }
.kcard-meta { display: flex; align-items: center; gap: 6px; }
.atrasado { color: var(--color-negative-700); font-weight: var(--font-weight-semi); }
.kvazio { color: var(--muted); font-size: var(--font-size-xs); text-align: center; padding: 12px 0; margin: 0; }
.kmais { justify-content: center; font-size: var(--font-size-xs); }
.avatar { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--primary); color: var(--color-support-white); font-size: var(--font-size-xxs); font-weight: var(--font-weight-bold); }
.avatar.vazio { background: var(--color-neutral-200); color: var(--color-neutral-600); }

.guia { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.guia summary { cursor: pointer; font-weight: var(--font-weight-semi); color: var(--primary); }
.guia form { margin-top: 12px; }
.copiavel { display: flex; align-items: center; gap: 8px; margin: 6px 0; flex-wrap: wrap; }
.copiavel code { word-break: break-all; }

.modal { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; padding: 16px; }
.modal[hidden] { display: none; }
.modal-corpo { position: relative; background: var(--card); border-radius: 12px; padding: 24px; width: min(440px, 100%); border: 1px solid var(--border); }
.modal-corpo h2 { font-size: var(--font-size-lg); }
.modal-corpo p { color: var(--color-neutral-600); margin: 0 0 16px; }
.modal-corpo .acoes { justify-content: flex-end; margin-top: 8px; }

.toast { position: fixed; bottom: 20px; left: calc(50% + var(--lateral) / 2); transform: translateX(-50%); background: var(--color-neutral-900); color: var(--color-support-white); padding: 10px 16px; border-radius: var(--radius); z-index: 20; }

@media (max-width: 800px) {
  .container { padding: 0 16px; }
  .grade-2, .form-grade { grid-template-columns: 1fr; }
  .barra { grid-template-columns: 110px 1fr 32px; }
  .filtros input[type=search] { min-width: 0; flex: 1 1 100%; }
}
.c-modelo { min-width: 280px; max-width: 520px; white-space: normal; }
.t-modelos td small { display: block; color: var(--muted); font-size: var(--font-size-xs); margin-top: 2px; }
.t-modelos .acoes { flex-wrap: nowrap; }

/* Tela Hoje */
.meta-de { font-size: var(--font-size-sm); font-weight: var(--font-weight-regular); color: var(--muted); }
.barra-acoes { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.meta-campo { display: flex; align-items: center; gap: 8px; font-size: var(--font-size-sm); color: var(--muted); }
.meta-campo input { width: 72px; }
.t-hoje tbody tr { cursor: pointer; }
.foco-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.foco { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.foco h1 { margin-bottom: 4px; }
.botoes-resultado { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; margin-bottom: 12px; }
.botoes-resultado .btn { justify-content: flex-start; }
.botoes-resultado kbd { font: inherit; font-size: var(--font-size-xs); min-width: 18px; padding: 0 4px; border-radius: 4px; border: 1px solid currentColor; opacity: .7; text-align: center; }
.notas-foco { white-space: pre-wrap; margin: 0; font-size: var(--font-size-sm); }
@media (max-width: 900px) { .foco { grid-template-columns: 1fr; } }
/* Tela Resultados */
.seg-periodo { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.t-resultados td:first-child { min-width: 220px; white-space: normal; }
/* Histórico do lead */
.historico { list-style: none; margin: 12px 0 0; padding: 0; font-size: var(--font-size-xs); color: var(--muted); }
.historico li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 0; border-bottom: 1px solid var(--border); }
.historico li:last-child { border-bottom: 0; }
.hist-excluir { flex: none; width: 24px; height: 24px; border: 1px solid transparent; border-radius: 6px; background: none; color: var(--muted); cursor: pointer; font-size: 16px; line-height: 1; }
.hist-excluir:hover, .hist-excluir:focus-visible { border-color: var(--color-negative-500); color: var(--color-negative-700); }
/* Prévia do e-mail */
.previa-corpo { width: min(720px, 100%); max-height: calc(100vh - 32px); overflow: auto; }
.previa-assunto { font-weight: var(--font-weight-semi); color: var(--color-neutral-800) !important; }
#previaFrame { width: 100%; min-height: 320px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.assinatura-previa { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 16px; }
/* WhatsApp: conversa em balões */
.conversa { display: flex; flex-direction: column; gap: 6px; max-height: 60vh; overflow-y: auto; padding: 12px; background: #EFEAE2; border-radius: 8px; }
.balao { max-width: 80%; padding: 6px 10px; border-radius: 8px; font-size: var(--font-size-sm); line-height: 1.4; overflow-wrap: anywhere; box-shadow: 0 1px 0 rgba(0,0,0,.08); }
.balao > div { white-space: pre-wrap; }
.balao.do-cliente { align-self: flex-start; background: #fff; }
.balao.do-vendedor { align-self: flex-end; background: #D9FDD3; }
.balao small { display: block; margin-top: 2px; font-size: var(--font-size-xxs); color: var(--color-neutral-500); text-align: right; }
.t-aguardando tbody tr { cursor: pointer; }
.t-aguardando tbody tr.fora-metricas { opacity: .62; }
.fora-metricas-lista { margin-top: 16px; }
.fora-metricas-lista summary { cursor: pointer; font-weight: 600; }
.tipo-conversa { justify-content: flex-start; gap: 8px; flex-wrap: wrap; align-items: center; }
.tipo-conversa label { font-size: 13px; font-weight: 600; }
.tipo-conversa select { width: auto; }
.regra-metricas { display: block; font-size: 13px; margin: 16px 0 4px; }
.sub-titulo { font-size: var(--font-size-sm); margin: 12px 0 4px; }
.qr-evo { display: grid; justify-items: center; gap: 12px; text-align: left; }
.qr-evo img { border: 1px solid var(--border); border-radius: 8px; background: #fff; padding: 8px; }
#aoVivo { font-size: var(--font-size-xs); vertical-align: middle; margin-left: 8px; font-weight: var(--font-weight-semi); }
.btn-mini { padding: 2px 8px; font-size: var(--font-size-xs); margin-top: 4px; }
.dir-msg { color: var(--muted); font-size: var(--font-size-xs); }
.nowrap { white-space: nowrap; }
.linha-cnpj { display: flex; gap: 8px; }
.linha-cnpj input { flex: 1; }
/* Produtividade */
.prod-grade { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 16px; align-items: start; }
.vendedor-prod { margin-bottom: 16px; }
.vendedor-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.vendedor-topo h2 { margin: 0; }
.diagnostico { margin: 0 0 12px; padding: 10px 12px 10px 28px; background: var(--color-warning-50); border-radius: 8px; font-size: var(--font-size-sm); }
.diagnostico li + li { margin-top: 4px; }
.grade-2.sem-margem { margin-bottom: 8px; }
.meta-linha { margin-bottom: 10px; }
.meta-topo { display: flex; justify-content: space-between; font-size: var(--font-size-sm); margin-bottom: 4px; }
.preench.ok { background: var(--color-positive-500, #22a06b); }
.preench.quase { background: var(--color-warning-500, #e0a100); }
.preench.baixo { background: var(--color-negative-500); }
.mini-dl { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; margin: 0; font-size: var(--font-size-sm); }
.mini-dl dt { color: var(--muted); }
.mini-dl dd { margin: 0; text-align: right; font-weight: var(--font-weight-semi); }
.dias-prod { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; height: 110px; margin-bottom: 8px; }
.dia-prod { display: grid; grid-template-rows: 1fr auto auto; text-align: center; font-size: var(--font-size-xs); }
.dia-prod .coluna { display: flex; align-items: flex-end; background: var(--color-neutral-50); border-radius: 6px; overflow: hidden; }
.dia-prod .coluna div { width: 100%; background: var(--primary); border-radius: 6px 6px 0 0; min-height: 2px; }
.funil-prod .etapa-prod { display: grid; grid-template-columns: 1fr 1.2fr; gap: 10px; align-items: center; font-size: var(--font-size-sm); margin-bottom: 6px; }
.ranking ol { margin: 0; padding-left: 22px; }
.ranking li { padding: 3px 0; }
.ranking li.eu { font-weight: var(--font-weight-bold); color: var(--color-primary-700); }
.t-metas input { width: 72px; }
.t-metas th { font-size: var(--font-size-xs); white-space: normal; }
.sua-semana { margin-bottom: 16px; }
.sua-semana-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
@media (max-width: 1200px) { .prod-grade { grid-template-columns: 1fr; } }
.meta-linha .trilho, .funil-prod .trilho { height: 8px; background: var(--color-neutral-100); border-radius: 4px; overflow: hidden; }
.meta-linha .preench, .funil-prod .preench { height: 100%; border-radius: 4px; }
.funil-prod .preench { background: var(--primary); }
/* Playbook */
.lista-pb { margin: 0; padding-left: 20px; }
.lista-pb li { margin-bottom: 4px; }
.cadencia { display: grid; gap: 10px; }
.passo-cad { display: grid; grid-template-columns: 52px 1fr; gap: 12px; align-items: start; }
.dia-cad { background: var(--primary-soft); color: var(--color-primary-700); font-weight: var(--font-weight-bold); border-radius: 8px; text-align: center; padding: 8px 0; }
.t-calor td, .t-calor th { text-align: center; font-size: var(--font-size-xs); padding: 6px; }
.t-calor td { border-radius: 4px; }
.objecoes details { border-bottom: 1px solid var(--border); padding: 8px 0; }
.objecoes summary { cursor: pointer; font-weight: var(--font-weight-semi); }
.objecoes p { margin: 6px 0; }
.linha-obj { display: grid; gap: 6px; padding: 10px 0; border-bottom: 1px solid var(--border); }
.criterios { grid-template-columns: 180px 1fr; }
.criterios dd { text-align: left; font-weight: var(--font-weight-regular); }
.proximo-passo { background: var(--primary-soft); }
.proximo-passo p { margin: 0 0 6px; }
/* IA */
.ia-secao { border: 1px solid var(--color-primary-200, #d9ccf5); }
.ia-resultado { margin-top: 12px; padding: 12px; background: var(--primary-soft); border-radius: 8px; font-size: var(--font-size-sm); }
.ia-resultado p { margin: 0 0 8px; }
.ia-resultado ol { margin: 0 0 8px; padding-left: 20px; }
.ia-resultado textarea { width: 100%; margin-bottom: 8px; }
.ia-conversa { margin-bottom: 8px; }
.prod-grade > div { min-width: 0; }
.t-metas input { width: 64px; }

/* Acabamento geral */
.card, .secao, .tabela-wrap { box-shadow: var(--sombra); }
.card .valor { color: var(--color-neutral-900); line-height: 1.2; margin-top: 2px; }
.btn { transition: background .12s, border-color .12s, box-shadow .12s; }
.btn.primario { box-shadow: 0 1px 2px rgba(110, 61, 195, .3); }
tbody tr[data-conv], tbody tr[data-foco] { cursor: pointer; }
tbody tr[data-conv]:hover, tbody tr[data-foco]:hover { background: var(--primary-soft); }
.filtros input, .filtros select, .campo input, .campo select, .campo textarea { transition: border-color .12s; }
.filtros input:hover, .filtros select:hover, .campo input:hover, .campo select:hover, .campo textarea:hover { border-color: var(--color-neutral-300); }
h2 { color: var(--color-neutral-900); }
.seg-periodo .btn { padding: 5px 12px; }
@media (max-width: 900px) {
  .grade-2 { grid-template-columns: 1fr; }
  .barra { grid-template-columns: 110px 1fr 36px; }
}
@media (max-width: 700px) {
  .form-grade { grid-template-columns: 1fr; }
  h1 { font-size: 1.375rem; }
  .filtros input[type=search] { min-width: 0; width: 100%; }
}
@media (max-width: 900px) { .toast { left: 50%; } }
@media (max-width: 700px) { .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .card .valor { font-size: var(--font-size-xl); } }
.perfil-link { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; text-decoration: none; color: inherit; border-radius: 8px; padding: 4px; margin: -4px; }
.perfil-link:hover, .perfil-link.ativo { background: var(--color-neutral-50); }
.perfil-link:focus-visible { outline: 2px solid var(--color-primary-300); outline-offset: 2px; }
.conta-grade { align-items: start; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); }
.conta-grade > * { min-width: 0; }
.conta-grade .form-grade { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
/* Usuários (equipe) */
.topo-tela { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.t-equipe td { vertical-align: middle; }
.t-equipe tr.inativo td { opacity: .55; }
.t-equipe .acoes-linha { gap: 4px; max-width: 360px; }
.sel-papel { border: 1px solid var(--border-strong); border-radius: 8px; padding: 4px 8px; background: var(--card); }
.sel-papel:disabled { background: var(--color-neutral-50); color: var(--muted); }
.janela-corpo { width: min(640px, 100%); max-height: calc(100vh - 32px); overflow: auto; }
.senha-prov { font-size: var(--font-size-lg); letter-spacing: .08em; padding: 6px 12px; }
.copiavel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.t-equipe .linha-sub, .t-equipe td.empresa small { display: block; color: var(--muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-regular); margin-top: 3px; white-space: normal; }
.t-equipe td.empresa small code { font-size: var(--font-size-xxs); padding: 0 4px; }
.col-acoes { text-align: right; white-space: nowrap; }
.menu-acoes { display: inline-block; position: relative; }
.menu-acoes summary { list-style: none; }
.menu-acoes summary::-webkit-details-marker { display: none; }
.menu-itens {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 5; background: var(--card); border: 1px solid var(--border);
  border-radius: 10px; box-shadow: 0 8px 24px rgba(16, 17, 35, .12); padding: 6px; display: grid; min-width: 180px;
}
.menu-itens .btn { border: 0; justify-content: flex-start; box-shadow: none; padding: 7px 10px; }
.menu-itens:empty { display: none; }
.alternar { display: inline-flex; align-items: center; gap: 8px; font-size: var(--font-size-sm); color: var(--color-neutral-700); background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 6px 12px; cursor: pointer; }
.alternar input { accent-color: var(--primary); }
/* WhatsApp: envio e mídia */
.compositor { display: flex; gap: 8px; align-items: flex-end; margin-top: 10px; }
.compositor textarea { flex: 1; resize: vertical; min-height: 44px; max-height: 200px; border: 1px solid var(--border-strong); border-radius: 10px; padding: 9px 12px; background: var(--card); }
.compositor textarea:focus { outline: 2px solid var(--color-primary-200); border-color: var(--primary); }
.compositor-nota { margin: 4px 0 0; font-size: var(--font-size-xs); }
.balao audio { display: block; width: 260px; max-width: 100%; height: 36px; }
.midia-img { display: block; max-width: 240px; max-height: 240px; border-radius: 6px; margin-bottom: 2px; }
.midia-img.sticker { max-width: 120px; max-height: 120px; }
.compositor-ferramentas { position: relative; display: flex; flex-direction: column; gap: 4px; }
.btn-icone { border: 1px solid var(--border-strong); background: var(--card); border-radius: 8px; width: 36px; height: 36px; cursor: pointer; font-size: 18px; line-height: 1; display: grid; place-items: center; }
.btn-icone:hover { background: var(--color-neutral-50); }
.btn-icone:focus-visible { outline: 2px solid var(--color-primary-300); outline-offset: 2px; }
.painel-emoji {
  position: absolute; bottom: calc(100% + 6px); left: 0; z-index: 6; width: 300px; display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px;
  background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 8px; box-shadow: 0 8px 24px rgba(16, 17, 35, .14);
}
.painel-emoji button { border: 0; background: none; font-size: 20px; padding: 4px; border-radius: 6px; cursor: pointer; }
.painel-emoji button:hover { background: var(--color-neutral-50); }
.anexo-previa { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 8px 10px; border: 1px dashed var(--color-primary-300); border-radius: 10px; background: var(--primary-soft); }
.anexo-previa img { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; }
.anexo-previa span { flex: 1; min-width: 0; }
.anexo-previa strong, .doc-msg strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--font-size-sm); }
.anexo-previa small, .doc-msg small { color: var(--muted); font-size: var(--font-size-xs); }
.doc-ico { font-size: 26px; line-height: 1; }
.doc-msg { display: flex; align-items: center; gap: 8px; padding: 6px 8px; background: rgba(255, 255, 255, .6); border-radius: 6px; text-decoration: none; color: inherit; max-width: 260px; margin-bottom: 2px; }
.doc-msg span { min-width: 0; }
.balao video { display: block; max-width: 260px; border-radius: 6px; }
#conversaCorpo .conversa { max-height: 46vh; }
/* WhatsApp: citação e reações */
.balao { position: relative; }
.citacao { border-left: 3px solid var(--primary); background: rgba(16, 17, 35, .05); border-radius: 4px; padding: 4px 8px; margin-bottom: 4px; font-size: var(--font-size-xs); color: var(--color-neutral-700); white-space: pre-wrap; }
.citacao strong { display: block; color: var(--color-primary-700); }
.reacoes { position: absolute; bottom: -10px; right: 8px; background: var(--card); border: 1px solid var(--border); border-radius: 99px; padding: 0 5px; font-size: 13px; line-height: 18px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.balao:has(.reacoes) { margin-bottom: 10px; }
.balao-acoes { position: absolute; top: 2px; display: none; gap: 2px; }
.balao.do-cliente .balao-acoes { right: -58px; }
.balao.do-vendedor .balao-acoes { left: -58px; }
.balao:hover .balao-acoes, .balao:focus-within .balao-acoes { display: flex; }
.balao-acoes button { border: 1px solid var(--border); background: var(--card); border-radius: 99px; width: 26px; height: 26px; cursor: pointer; font-size: 13px; padding: 0; }
.painel-reacao { position: absolute; z-index: 6; top: -38px; display: flex; gap: 2px; background: var(--card); border: 1px solid var(--border); border-radius: 99px; padding: 3px 6px; box-shadow: 0 6px 18px rgba(16,17,35,.15); }
.balao.do-cliente .painel-reacao { left: 0; }
.balao.do-vendedor .painel-reacao { right: 0; }
.painel-reacao button { border: 0; background: none; font-size: 18px; cursor: pointer; border-radius: 99px; padding: 2px 4px; }
.painel-reacao button:hover, .painel-reacao button.escolhida { background: var(--primary-soft); }
.citando { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 6px 10px; border-left: 3px solid var(--primary); background: var(--primary-soft); border-radius: 6px; font-size: var(--font-size-sm); }
.citando span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.citando strong { margin-right: 6px; color: var(--color-primary-700); }
#conversaCorpo .conversa { padding-left: 64px; padding-right: 64px; }
/* WhatsApp: janela da conversa no estilo WhatsApp Web (conversas · mensagens · dados do contato) */
.modal-corpo.modal-wpp { width: min(1440px, 100%); height: calc(100vh - 32px); max-height: none; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.modal-wpp > h2, .modal-wpp > .acoes { display: none; }
.modal-wpp #conversaCorpo { flex: 1; min-height: 0; }
.wpp-janela { position: relative; display: grid; grid-template-columns: 320px minmax(0, 1fr) 300px; height: 100%; }
.wpp-col-lista { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--border); }
.wpp-lista-topo { display: grid; gap: 8px; padding: 14px 14px 10px; border-bottom: 1px solid var(--border); }
.wpp-lista-topo input { width: 100%; border: 1px solid var(--border); border-radius: 99px; padding: 7px 14px; background: var(--color-neutral-50, #f6f6f8); }
.wpp-lista { flex: 1; overflow-y: auto; }
.wpp-lista .vazio { padding: 16px; }
.wpp-item { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; align-items: center; width: 100%; padding: 10px 14px; border: 0; border-bottom: 1px solid var(--border); background: none; text-align: left; cursor: pointer; font: inherit; color: inherit; }
.wpp-item:hover { background: var(--color-neutral-50, #f6f6f8); }
.wpp-item.ativo { background: var(--primary-soft); }
.wpp-item.fora { opacity: .6; }
.wpp-item-txt { min-width: 0; display: grid; }
.wpp-item-txt strong, .wpp-item-txt small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wpp-item-txt strong { font-size: var(--font-size-sm); }
.wpp-item-txt small, .wpp-item-meta small { color: var(--muted); font-size: var(--font-size-xs); }
.wpp-item-meta { display: grid; justify-items: end; gap: 4px; }
.wpp-pendente { background: #25D366; color: #fff; border-radius: 99px; padding: 0 7px; font-size: 11px; font-weight: 600; line-height: 18px; white-space: nowrap; }
.wpp-pendente.atrasada { background: #D93025; }
.wpp-avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--primary-soft); color: var(--color-primary-700); font-weight: 700; font-size: 14px; flex: none; }
.wpp-avatar.sem-lead { background: var(--color-neutral-100, #ececf0); color: var(--color-neutral-600); }
.wpp-central { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: #EFEAE2; }
.wpp-cab { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--card); border-bottom: 1px solid var(--border); }
.wpp-cab-txt { flex: 1; min-width: 0; display: grid; }
.wpp-cab-txt strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wpp-cab-txt small { color: var(--muted); font-size: var(--font-size-xs); }
.wpp-cab-txt .fora-txt { color: #B06000; }
.wpp-msgs { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wpp-msgs .wpp-aviso { text-align: center; margin: 8px 0 0; }
.modal-wpp #conversaCorpo .wpp-msgs .conversa { flex: 1; max-height: none; border-radius: 0; padding: 16px 72px; }
.wpp-rodape { padding: 8px 16px 10px; background: var(--color-neutral-50, #f6f6f8); border-top: 1px solid var(--border); }
.wpp-rodape .compositor { margin-top: 0; }
.wpp-rodape .compositor textarea { resize: none; }
.wpp-rodape .citando, .wpp-rodape .anexo-previa { margin: 0 0 8px; }
.wpp-sem-envio { margin: 4px 0; }
.sep-dia { align-self: center; margin: 8px 0 4px; }
.sep-dia span { display: inline-block; background: #fff; color: var(--color-neutral-600); font-size: var(--font-size-xs); padding: 3px 10px; border-radius: 8px; box-shadow: 0 1px 1px rgba(0,0,0,.06); }
.wpp-info { overflow-y: auto; border-left: 1px solid var(--border); background: var(--card); }
.wpp-info-topo { display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 4px; }
.wpp-info-bloco { padding: 12px 16px; border-bottom: 1px solid var(--border); display: grid; gap: 8px; justify-items: start; }
.wpp-info-bloco h3 { margin: 0; font-size: var(--font-size-md, 16px); }
.wpp-info-bloco p { margin: 0; }
.wpp-info-bloco select { width: 100%; max-width: 100%; }
.wpp-info-bloco { grid-template-columns: minmax(0, 1fr); }
.wpp-info-rot { font-size: 13px; font-weight: 600; }
.wpp-info .ia-conversa { margin: 0; padding: 0; background: none; border: 0; }
.wpp-info #iaSaidaConv { width: 100%; }
.wpp-dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; margin: 0; font-size: var(--font-size-sm); width: 100%; }
.wpp-dl dt { color: var(--muted); }
.wpp-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.wpp-notas { white-space: pre-wrap; font-size: var(--font-size-xs); color: var(--color-neutral-700); background: var(--color-neutral-50, #f6f6f8); border-radius: 6px; padding: 8px; max-height: 140px; overflow-y: auto; width: 100%; }
.wpp-so-estreito { display: none; }
@media (max-width: 1180px) {
  .wpp-janela { grid-template-columns: 280px minmax(0, 1fr); }
  .wpp-info { display: none; position: absolute; top: 0; right: 0; bottom: 0; width: min(320px, 90%); z-index: 5; box-shadow: -8px 0 24px rgba(16,17,35,.15); }
  .wpp-janela.mostra-info .wpp-info { display: block; }
  .wpp-so-estreito { display: inline-grid; }
  .modal-wpp #conversaCorpo .wpp-msgs .conversa { padding: 16px 64px; }
}
@media (max-width: 760px) {
  .wpp-janela { grid-template-columns: minmax(0, 1fr); }
  .wpp-col-lista { display: none; }
  .modal-corpo.modal-wpp { height: calc(100vh - 16px); }
  .modal-wpp #conversaCorpo .wpp-msgs .conversa { padding: 12px 56px 12px 12px; }
}
.wpp-rodape .compositor { align-items: center; }
.wpp-rodape .compositor-ferramentas { flex-direction: row; }
/* Escala mais compacta: os tamanhos em rem (tokens --font-size-*) diminuem juntos; base 15px no lugar de 16px */
html { font-size: 15px; }
body { line-height: 1.45; }
h1 { font-size: 1.5rem; }
.btn { padding: 6px 12px; }
main.container { padding: 24px 28px 48px; }
.tipo-conversa label, .regra-metricas, .wpp-info-rot { font-size: 12px; }
/* Agenda de reuniões (Minha conta e lead) */
.aviso-agenda { background: var(--color-warning-50); border: 1px solid var(--color-warning-100); border-radius: 8px; padding: 8px 12px; color: var(--color-warning-800); }
.agenda-semana { display: grid; gap: 6px; }
.agenda-dia { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--border); }
.agenda-dia-nome { font-weight: 600; display: flex; gap: 6px; align-items: center; }
.agenda-faixas { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.agenda-faixa { display: inline-flex; gap: 6px; align-items: center; background: var(--color-neutral-50); border-radius: 8px; padding: 4px 6px; }
.agenda-faixa input { border: 1px solid var(--border-strong); border-radius: 6px; padding: 3px 6px; background: var(--card); }
.btn-mini-icone { width: 24px; height: 24px; font-size: 12px; }
.agenda-livres { display: grid; gap: 10px; margin: 12px 0; }
.agenda-horas { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
@media (max-width: 600px) { .agenda-dia { grid-template-columns: 1fr; } }
.agenda-horas .btn.escolhido, .agenda-horas .btn.escolhido:hover { background: var(--primary); border-color: var(--primary); color: var(--color-support-white); }
.wpp-info .acoes { justify-content: flex-start; margin-top: 0; }
.wpp-info { overflow-x: hidden; }
.wpp-info-bloco > div { width: 100%; min-width: 0; }
.wpp-info .form-grade { grid-template-columns: minmax(0, 1fr); }
.wpp-info .agenda-horas .btn-mini { padding: 2px 7px; }
.ag-form .campo label { display: grid; gap: 4px; } .ag-form input { width: 100%; }