@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");

:root {
  --bg: #ffffff;
  --bg-2: #f4f7fe;
  --card: #ffffff;
  --lado: #fafbff;
  --ink: #2f2c5d;
  --muted: #9ca3af;
  --line: #eaeeff;
  --line-2: #d5dcff;
  --accent: #6c19de;
  --accent-ink: #6c19de;
  --accent-soft: #f4f1ff;
  --ok: #15803d;
  --ok-soft: #dcfce7;
  --lost: #dc2626;
  --lost-soft: #fee2e2;
  --open: #6c19de;
  --wa: #25d366;
  --hover: #f4f7fe;
  --input-bg: rgba(123, 144, 255, 0.05);
  --pill: #eff6ff;
  --sombra: 0 1px 2px rgba(0, 0, 0, 0.03);
  --bubble-in: #f4f7fe;
  --bubble-out: #f4f1ff;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
[hidden] { display: none !important; }
body {
  font-family: Poppins, ui-sans-serif, system-ui, sans-serif;
  background: var(--bg);
  color: var(--ink);
  display: flex;
  min-height: 100vh;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.01em;
}
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--accent); }
button, .botao {
  appearance: none;
  border: 0;
  background: var(--accent);
  color: #fff;
  padding: 0 14px;
  height: 32px;
  border-radius: 6px;
  font: 500 12px Poppins, sans-serif;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
button:hover, .botao:hover { filter: brightness(1.08); }
button.ghost, .botao.ghost {
  background: var(--card);
  color: var(--ink);
  border: 1px solid var(--line);
}
button:disabled { opacity: 0.4; cursor: not-allowed; }
input, select, textarea {
  font: 400 12px Poppins, sans-serif;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--input-bg);
  color: var(--ink);
}
textarea { height: auto; padding: 8px 10px; border-radius: 6px; resize: vertical; width: 100%; }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--line-2);
  background: #fff;
}
select option { background: #fff; color: var(--ink); }
::placeholder { color: var(--muted); }
ol.meta { padding-left: 1.2rem; line-height: 1.55; }

.lado {
  width: 250px;
  background: var(--lado);
  border-right: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  padding: 12px 10px 10px;
  flex-shrink: 0;
}
.marca {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 8px 12px;
  color: var(--ink);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: -0.03em;
}
.marca i {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  display: grid;
  place-items: center;
  font-style: normal;
  font-size: 8px;
  font-weight: 700;
}
.marca b { font-weight: 600; }
.busca-lado {
  width: 100%;
  height: 32px;
  margin-bottom: 10px;
  background: #fff;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 4px;
  justify-content: flex-start;
  font-weight: 400;
  padding: 0 10px;
}
.busca-lado:hover { filter: none; background: var(--hover); color: var(--ink); }
.lado nav { display: grid; gap: 2px; }
.lado a {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 34px;
  padding: 0 12px;
  border-radius: 4px;
  color: var(--ink);
  font-weight: 400;
  font-size: 12px;
}
.lado a .ico { width: 16px; height: 16px; color: var(--ink); flex-shrink: 0; }
.lado a:hover { background: var(--hover); color: var(--ink); text-decoration: none; }
.lado a.agora {
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-weight: 500;
}
.lado a.agora .ico { color: var(--accent-ink); }
.pe-lado {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 8px;
}
.lado .eu {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
  min-width: 0;
  flex: 1;
}
.lado .eu strong { color: var(--ink); display: block; font-size: 12px; font-weight: 500; }
.lado .eu span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lado .eu a.sair { color: var(--muted); padding: 0; height: auto; font-size: 11px; }
.avatar {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 8px;
  font-weight: 600;
  color: #111;
  background: #c4b5fd;
  flex-shrink: 0;
}
.avatar.g { width: 32px; height: 32px; font-size: 11px; }

.app { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--bg); }
.topo {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 48px;
  padding: 0 16px;
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  flex-shrink: 0;
}
.topo h1 { font-size: 14px; margin: 0; font-weight: 500; }
.topo .cresce { flex: 1; }
.topo select, .topo input { max-width: 220px; }
.topo .abas { padding: 0; }
.sino { position: relative; flex-shrink: 0; }
.sino button {
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
}
.sino button .ico { width: 16px; height: 16px; display: block; margin: auto; }
.sino button:hover { background: var(--hover); filter: none; }
.sino .conta {
  position: absolute;
  top: -3px;
  right: -3px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 99px;
  background: var(--accent);
  color: #fff;
  font-size: 9px;
  display: grid;
  place-items: center;
}
.sino .lista {
  display: none;
  position: absolute;
  right: 0;
  bottom: 36px;
  width: min(340px, 80vw);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 8px;
  z-index: 6;
  max-height: 70vh;
  overflow: auto;
  box-shadow: 0 8px 24px rgba(47, 44, 93, 0.12);
}
.sino.abre .lista { display: block; }
.sino .lista a, .sino .lista .vazio {
  display: block;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  color: inherit;
}
.sino .lista a:hover { background: var(--hover); }
.sino .lista a.lida { opacity: 0.5; }
.aviso {
  padding: 8px 16px;
  background: #fffbeb;
  border-bottom: 1px solid #fde68a;
  font-size: 12px;
  color: #92400e;
}
.aviso.ok { background: var(--ok-soft); border-color: #bbf7d0; color: var(--ok); }
.erro { color: var(--lost); }
.conteudo { flex: 1; min-height: 0; overflow: auto; padding: 16px; }
.conteudo.funil-wrap { padding: 12px 16px 24px; display: flex; flex-direction: column; gap: 28px; }
.grade.duas { grid-template-columns: 1fr 1fr; }
.funil-bloco h2 { margin: 0 0 10px; font-size: 13px; font-weight: 500; }
.barra-ind { height: 6px; background: var(--bg-2); border-radius: 99px; overflow: hidden; margin-top: 6px; }
.barra-ind i { display: block; height: 100%; background: var(--accent); }
.grade { display: grid; gap: 8px; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.card, .bloco {
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--sombra);
  border-radius: 8px;
  padding: 12px;
}
.num { font-size: 22px; font-weight: 600; letter-spacing: -0.04em; }
.meta { color: var(--muted); font-size: 11px; }
.badge { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); }
th { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; }
.pagina { display: flex; gap: 8px; margin-top: 12px; }

.atende { display: grid; grid-template-columns: 320px 1fr 360px; flex: 1; min-height: 0; }
.lista, .thread, .ficha { min-height: 0; overflow: auto; background: var(--bg); }
.lista { border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.ficha { border-left: 1px solid var(--line); padding: 16px; }
.ficha-topo { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 4px; }
.ficha-topo strong { font-size: 13px; font-weight: 500; }
.ficha button { width: auto; justify-self: start; }
.abas { display: flex; gap: 4px; padding: 10px 10px 0; }
.abas button {
  flex: 0 0 auto;
  height: 28px;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  border: 1px solid transparent;
}
.abas button.agora { color: var(--accent); background: var(--accent-soft); border-color: transparent; box-shadow: none; }
.busca-lista { padding: 8px 10px 4px; }
.busca-lista input { width: 100%; }
#inbox { flex: 1; overflow: auto; }
.item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  color: inherit;
  border-left: 2px solid transparent;
}
.item:hover { background: var(--hover); }
.item.agora { background: var(--accent-soft); border-left-color: var(--accent); }
.item-corpo { min-width: 0; flex: 1; }
.item-topo {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
}
.item-topo strong { font-weight: 500; font-size: 12px; }
.item-topo time { color: var(--muted); font-size: 11px; flex-shrink: 0; }
.item .preview {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}
.item .preview .wa { color: var(--wa); display: inline-flex; }
.item .preview .wa svg { width: 12px; height: 12px; }
.thread { display: flex; flex-direction: column; background: var(--bg); }
.thread-topo {
  min-height: 48px;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--line);
}
.thread-topo strong { font-size: 13px; font-weight: 500; }
.msgs { flex: 1; overflow: auto; padding: 16px 20px; display: grid; gap: 8px; align-content: start; }
.msg {
  max-width: 68%;
  padding: 10px;
  border-radius: 0 12px 12px 12px;
  background: var(--bubble-in);
  font-size: 12px;
  line-height: 1.45;
}
.msg.USER, .msg.USER_INTERNAL {
  justify-self: end;
  background: var(--bubble-out);
  border-radius: 12px 12px 0 12px;
}
.msg.CUSTOMER { justify-self: start; }
.msg.EVENT { justify-self: center; background: transparent; color: var(--muted); font-size: 11px; padding: 4px; }
.msg .quando { color: var(--muted); font-size: 10px; margin-top: 6px; text-align: right; }
.rodape-thread {
  padding: 10px 16px 14px;
  border-top: 1px solid var(--line);
}
.composer-form { display: flex; gap: 8px; margin-bottom: 6px; }
.composer-form input { flex: 1; height: 40px; border-radius: 8px; }
.composer-form button { height: 40px; padding: 0 16px; }
.ficha .sec { margin-top: 18px; }
.ficha h3 { margin: 0 0 8px; font-size: 11px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.ficha .bloco { margin-bottom: 8px; }
.vazio-thread {
  margin: auto;
  text-align: center;
  color: var(--muted);
  max-width: 28ch;
  line-height: 1.5;
}
.vazio-thread b { display: block; color: var(--ink); font-weight: 500; margin: 10px 0 6px; font-size: 13px; }

.funil {
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-start;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 8px;
}
.coluna {
  display: flex;
  flex-direction: column;
  flex: 0 0 250px;
  width: 250px;
  min-width: 250px;
  max-width: 250px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 8px;
}
.coluna header { padding: 0 2px 10px; }
.coluna h3 {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 6px;
}
.coluna h3 em {
  font-style: normal;
  color: var(--muted);
  font-weight: 400;
}
.coluna .soma { color: var(--muted); font-size: 11px; margin-top: 2px; }
.coluna-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 80px;
}
.kcard {
  display: block;
  width: 100%;
  background: var(--card);
  border-radius: 6px;
  padding: 10px;
  cursor: grab;
  border: 1px solid #e3ebff;
  box-shadow: var(--sombra);
}
.kcard:hover { border-color: var(--line-2); }
.kcard-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kcard-nome { font-weight: 500; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kcard-linha {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
}
.kcard-linha .preview { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kcard-linha .hora { flex-shrink: 0; }
.kcard-linha .wa { color: var(--wa); display: inline-flex; }
.kcard-linha .wa svg, .item .preview .wa svg { width: 12px; height: 12px; display: block; }
.wa-caixa { display: grid; grid-template-columns: 280px 1fr; gap: 12px; margin-top: 16px; align-items: start; }
#wa-qr { width: 220px; height: 220px; background: #fff; border-radius: 8px; padding: 8px; margin-top: 8px; }
#wa-fase { font-size: 16px; }
.kcard-pe {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  color: var(--muted);
  font-size: 11px;
}
.st { font-size: 10px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.st.OPEN { color: var(--open); }
.st.WON { color: var(--ok); }
.st.LOST { color: var(--lost); }

.auth {
  min-height: 100vh;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg);
}
.auth .form {
  max-width: 360px;
  margin: auto;
  padding: 32px 24px;
  display: grid;
  gap: 10px;
}
.auth .form .marca { padding: 0 0 8px; }
.auth h1 { margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.03em; }
.auth .form input { height: 36px; border-radius: 6px; }
.auth .form button { height: 36px; border-radius: 6px; width: 100%; }
.auth .painel {
  background: linear-gradient(135deg, #6c19de 0%, #3b0f8a 100%);
  color: #fff;
  padding: 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px solid var(--line);
}
.auth .painel h2 { font-size: 28px; font-weight: 600; margin: 0 0 12px; letter-spacing: -0.03em; line-height: 1.2; }
.auth .painel p { color: rgba(255, 255, 255, 0.8); line-height: 1.55; max-width: 36ch; }
.cal {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  min-height: 280px;
}
.cal-dia {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 8px;
  min-height: 220px;
  padding: 8px;
}
.cal-dia header {
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
  margin-bottom: 8px;
}
.cal-ev {
  width: 100%;
  height: auto;
  min-height: 28px;
  margin-bottom: 4px;
  background: var(--accent-soft);
  color: var(--accent);
  border: 0;
  border-radius: 4px;
  padding: 6px 8px;
  font: 500 11px Poppins, sans-serif;
  text-align: left;
  justify-content: flex-start;
}
.k { position: fixed; inset: 0; background: rgba(47, 44, 93, 0.35); display: none; z-index: 8; }
.k.abre { display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
.k .caixa { width: min(520px, 92vw); background: var(--card); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.k input { width: 100%; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; height: 44px; padding: 0 14px; background: var(--card); }
.k a, .k .res { display: block; padding: 10px 14px; }
.k a:hover { background: var(--hover); }
@media (max-width: 900px) {
  .lado { display: none; }
  .atende { grid-template-columns: 1fr; }
  .ficha { display: none; }
  .auth { grid-template-columns: 1fr; }
  .auth .painel { display: none; }
  .wa-caixa { grid-template-columns: 1fr; }
  .grade.duas { grid-template-columns: 1fr; }
}

/* Página do negócio */
.neg { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: auto; }
.neg-trilha { display: flex; align-items: center; gap: 8px; padding: 12px 20px; border-bottom: 1px solid var(--line); color: var(--muted); }
.neg-trilha a { color: var(--muted); }
.neg-trilha a:hover { color: var(--ink); }
.neg-trilha strong { color: var(--ink); font-weight: 500; }
.ico-bt { width: 32px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.ico-bt.off, .ico-bt[aria-disabled="true"] { opacity: 0.35; pointer-events: none; }
.neg-topo { display: flex; align-items: center; gap: 10px; padding: 16px 20px 6px; }
.neg-topo h1 { font-size: 18px; font-weight: 600; margin: 0; }
.st-sel.WON { border-color: var(--ok); color: var(--ok); }
.st-sel.LOST { border-color: var(--lost); color: var(--lost); }
.st-sel.OPEN { border-color: var(--open); color: var(--open); }
.neg-acoes { display: flex; align-items: center; gap: 6px; padding: 4px 20px 12px; flex-wrap: wrap; }
.tags-linha { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-left: 8px; }
.tag { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-ink); font-size: 11px; }
.tag .x { background: none; padding: 0; height: auto; color: inherit; font-size: 13px; line-height: 1; }
.neg-abas { display: flex; gap: 2px; padding: 0 20px; border-bottom: 1px solid var(--line); }
.neg-abas .aba { background: none; color: var(--muted); border-radius: 0; border-bottom: 2px solid transparent; height: 38px; }
.neg-abas .aba.agora { color: var(--ink); border-bottom-color: var(--accent); }
.regua { display: flex; list-style: none; margin: 0; padding: 14px 20px; gap: 6px; overflow-x: auto; }
.regua li { flex: 1; min-width: 120px; display: flex; flex-direction: column; gap: 6px; padding: 8px 10px; border-radius: 8px; background: var(--bg-2); border: 1px solid var(--line); position: relative; }
.regua li.feita { border-color: var(--accent-soft); }
.regua li.feita .bolinha { background: var(--accent); color: #fff; }
.regua li.agora { border-color: var(--accent); background: var(--accent-soft); }
.regua li.agora .bolinha { background: var(--accent); color: #fff; }
.regua .bolinha { width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--card); font-size: 10px; }
.regua .nome { font-weight: 500; }
.regua .mover { display: none; height: 24px; font-size: 11px; }
.regua li:hover .mover { display: inline-block; }
.neg-aba { padding: 16px 20px; flex: 1; }
.neg-ativ { display: grid; grid-template-columns: minmax(260px, 380px) 1fr; gap: 16px; }
.ativ-lista h3, .ativ-det h3, .campos-topo h3 { margin: 0 0 10px; font-size: 14px; font-weight: 600; }
.ativ-dia h4 { margin: 12px 0 6px; font-size: 12px; font-weight: 500; }
.ativ-dia h4 em, .ativ-dia h4 { font-style: normal; }
.ativ-dia h4 em { color: var(--muted); font-weight: 400; margin-left: 6px; }
.ativ-item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; height: auto; padding: 8px 10px; margin-bottom: 4px; background: var(--bg-2); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; text-align: left; }
.ativ-item.agora { border-color: var(--accent); }
.ativ-item.feita .ativ-tit { text-decoration: line-through; color: var(--muted); }
.ativ-feitas { margin-top: 12px; }
.ativ-feitas summary { cursor: pointer; color: var(--muted); margin-bottom: 6px; }
.ativ-nova { display: grid; gap: 6px; margin-top: 14px; }
.ativ-det { background: var(--bg-2); border: 1px solid var(--line); border-radius: 10px; padding: 16px; align-self: start; }
.ativ-texto { margin: 12px 0; line-height: 1.6; white-space: normal; }
.ativ-texto a { color: var(--accent-ink); text-decoration: underline; }
.ativ-concluir { display: flex; gap: 8px; align-items: end; flex-wrap: wrap; }
.ativ-concluir label { display: grid; gap: 4px; color: var(--muted); }
.campos { display: grid; gap: 10px; max-width: 620px; }
.campos h4 { margin: 4px 0; color: var(--muted); font-weight: 500; text-transform: uppercase; font-size: 10px; letter-spacing: 0.06em; }
.campos-topo { display: flex; align-items: center; gap: 10px; }
.campo { display: grid; grid-template-columns: 180px 1fr; align-items: center; gap: 10px; }
.campo span { color: var(--muted); }
.campos button[type=submit] { justify-self: start; }
.chk { display: inline-flex; gap: 6px; align-items: center; color: var(--muted); }
.chk input { height: auto; }
.neg-conv { display: grid; grid-template-columns: 320px 1fr; gap: 12px; min-height: 420px; }
.conv-lista { display: grid; gap: 4px; align-content: start; }
.conv-item { display: grid; gap: 2px; height: auto; padding: 10px; text-align: left; background: var(--bg-2); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; }
.conv-item.agora { border-color: var(--accent); }
.conv-item .item-topo { display: flex; justify-content: space-between; }
.conv-item .preview { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conv-msgs { background: var(--bg-2); border: 1px solid var(--line); border-radius: 10px; padding: 14px; overflow: auto; max-height: 70vh; display: grid; gap: 8px; align-content: start; }
.vazio { text-align: center; padding: 40px 10px; }
.neg-arq table { width: 100%; margin-top: 10px; }
.hist h4 { margin: 14px 0 6px; font-size: 12px; font-weight: 500; color: var(--muted); }
.hist-item { border-left: 2px solid var(--line); padding: 6px 12px; margin-bottom: 6px; display: grid; gap: 3px; }
.hist-item.status, .hist-item.criado { border-left-color: var(--accent); }
.hist-item p { margin: 0; color: var(--ink); }
@media (max-width: 900px) { .neg-ativ, .neg-conv { grid-template-columns: 1fr; } .campo { grid-template-columns: 1fr; } }
.ico-ativ { display: inline-flex; width: 16px; justify-content: center; font-size: 11px; }
.ativ-det-topo { display: flex; gap: 8px; align-items: center; }
.ativ-det-topo h3 { margin: 0; }
.ativ-item.atrasada .meta { color: var(--lost); }
.ativ-texto p { margin: 0 0 6px; }
.cadencia { display: grid; gap: 6px; margin: 12px 0; padding: 12px; background: var(--bg-2); border-radius: 8px; }
.cadencia .msg { max-width: 92%; white-space: pre-wrap; }
.cad-espera { justify-self: center; color: var(--muted); font-size: 10px; }

/* ---- Quadro de negócios ---- */
.qd { position: relative; display: flex; flex-direction: column; height: 100vh; min-height: 0; background: var(--bg); }
.qd .cresce, .qd-lote .cresce, .modal .cresce, .chat-flut .cresce { flex: 1; }
.qd-topo { display: flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.qd-origem { background: #fff; color: var(--ink); border: 1px solid var(--line); height: 30px; padding: 0 10px; gap: 8px; font-weight: 500; }
.qd-origem i { width: 16px; height: 16px; border-radius: 4px; display: inline-block; }
.qd-origem .seta { color: var(--muted); margin: 0 2px; }
.qd-origem strong { font-weight: 600; }
.qd-origem b { color: var(--muted); font-weight: 400; }
.qd-novo-wrap { position: relative; }
#qd-novo b { font-size: 15px; font-weight: 400; }
#qd-novo-menu { right: 0; left: auto; top: 38px; width: 200px; }
.qd-barra { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.qd-busca { position: relative; display: inline-flex; }
.qd-busca input { width: 230px; padding-right: 28px; }
.qd-busca span { position: absolute; right: 9px; top: 7px; color: var(--muted); font-size: 14px; }
.qd-barra button.ghost { height: 30px; }
.qd-barra em, .fsec em, .cards-grupo em { font-style: normal; background: var(--accent-soft); color: var(--accent); border-radius: 999px; padding: 0 6px; font-size: 10px; line-height: 16px; }
#qd-ordenar.ativo { border-color: var(--accent); color: var(--accent); }
.qd-total { color: var(--ink); font-size: 12px; }
.qd-total strong { font-weight: 500; }
.qd-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px; }
.qd-chips:not(:empty) { padding: 8px 16px 0; }
.qd-chips .chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 10px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); font-size: 11px; }
.qd-chips .chip button { background: none; color: inherit; height: 18px; padding: 0 4px; font-size: 13px; }
.qd-lote { display: flex; align-items: center; gap: 8px; margin: 8px 16px 0; padding: 6px 10px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--accent-soft); }
.qd-lote select { height: 28px; max-width: 180px; background: #fff; }
.qd-lote button { height: 28px; }
.qd-lote[hidden] { display: none; }
.qd-lote .perigo, .pop .perigo { color: var(--lost); }
.qd-colunas { flex: 1; min-height: 0; display: flex; gap: 12px; padding: 12px 16px 16px; overflow-x: auto; overflow-y: hidden; align-items: stretch; }
.qd-colunas .vazio { margin: 40px auto; }
.qc { width: 272px; flex-shrink: 0; display: flex; flex-direction: column; background: var(--bg-2); border-radius: 8px; min-height: 0; }
.qc-topo { padding: 10px 10px 6px; }
.qc-l1 { display: flex; align-items: center; gap: 6px; }
.qc-l1 h5 { flex: 1; margin: 0; font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qc-n { background: #e9e3ff; color: var(--accent); border-radius: 6px; padding: 0 6px; font-size: 10px; font-weight: 600; line-height: 18px; }
.qc-menu { background: none; color: var(--ink); width: 20px; height: 20px; padding: 0; font-size: 14px; }
.qc-soma { margin: 2px 0 0; font-size: 11px; font-weight: 400; color: var(--muted); }
.qc-cards { flex: 1; min-height: 40px; overflow-y: auto; padding: 4px 6px 8px; display: flex; flex-direction: column; gap: 8px; border-radius: 6px; }
.qc-cards.sobre { background: #ebe5ff; outline: 2px dashed var(--line-2); }
.qc-mais { height: 28px; font-size: 11px; }
.qc-add { margin: 0 6px 8px; height: 28px; background: transparent !important; border: 1px dashed var(--line-2) !important; color: var(--muted) !important; }
.kc { position: relative; background: #fff; border: 1px solid #e3ebff; border-radius: 8px; padding: 10px; display: grid; gap: 8px; cursor: grab; box-shadow: var(--sombra); }
.kc:hover { border-color: var(--line-2); }
.kc.sel { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.kc.parado { border-color: #fca5a5; background: #fffafa; }
.kc.arrastando { opacity: 0.45; }
.kc > * { min-width: 0; }
.kc-topo { display: flex; align-items: center; gap: 6px; min-height: 22px; }
.kc-nome { flex: 1; font-weight: 500; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-check { display: none; }
.kc-check input { height: 14px; width: 14px; margin: 0; accent-color: var(--accent); }
.kc:hover .kc-check, .kc.sel .kc-check { display: inline-flex; }
.kc:hover .kc-av, .kc.sel .kc-av { display: none; }
.kc-av { border-radius: 6px; width: 24px; height: 24px; }
.kc-msg { overflow: hidden; width: 100%; justify-content: flex-start; background: #f8faff; border: 1px solid #eef2ff; color: var(--ink); height: 28px; padding: 0 6px; gap: 6px; font-weight: 400; font-size: 11px; border-radius: 6px; }
.kc-msg:hover { filter: none; border-color: var(--line-2); }
.kc-msg:disabled { opacity: 0.7; cursor: default; }
.kc-canal { color: var(--wa); display: inline-flex; flex-shrink: 0; }
.kc-canal svg { width: 13px; height: 13px; }
.kc-canal.instagram { color: #e1306c; }
.kc-prev { flex: 1; min-width: 0; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #4b5563; }
.kc-prev b { font-weight: 500; }
.kc-nl { background: #4f46e5; color: #fff; border-radius: 4px; padding: 0 5px; font-size: 10px; line-height: 16px; }
.kc-hora { color: var(--muted); font-size: 10px; flex-shrink: 0; }
.kc-extra { display: flex; gap: 6px; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-extra span { color: var(--muted); }
.kc-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.kc-pe { display: flex; align-items: center; gap: 6px; border-top: 1px solid #f1f4ff; padding-top: 8px; }
.kc-pe-esq, .kc-pe-dir { display: flex; align-items: center; gap: 6px; }
.kc-pe-esq { flex: 1; min-width: 0; }
.kc-dono { width: 20px; height: 20px; font-size: 7px; }
.kc-ic svg, .kc-ativ svg, .kc-tempo svg { width: 12px; height: 12px; }
.kc-ic { background: none; color: #9ca3af; padding: 0; width: 16px; height: 16px; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.kc-ic:hover { color: var(--accent); filter: none; }
.kc-ic[aria-disabled="true"], .kc-ic:disabled { opacity: 0.35; pointer-events: none; }
.kc-valor { font-weight: 500; font-size: 11px; white-space: nowrap; }
.kc-ativ, .kc-tempo { color: var(--muted); font-size: 10px; white-space: nowrap; display: inline-flex; align-items: center; gap: 3px; }
.kc-tempo.alerta { color: var(--lost); }

/* popovers */
.pop { box-sizing: border-box; position: absolute; z-index: 40; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 24px rgba(47, 44, 93, 0.12); padding: 6px; max-height: 70vh; overflow-y: auto; display: grid; gap: 1px; align-content: start; }
.pop[hidden] { display: none; }
.pop-item { width: 100%; justify-content: flex-start; background: none; color: var(--ink); font-weight: 400; height: 30px; padding: 0 8px; border-radius: 6px; text-align: left; }
.pop-item:hover { background: var(--hover); filter: none; }
.pop-item.agora { background: var(--accent-soft); color: var(--accent); font-weight: 500; }
.pop-item.link, button.link { color: var(--accent); background: none; height: auto; padding: 4px 8px; font-weight: 500; }
.pop-sec { display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 4px; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: 0.04em; }
.pop-sec .link { padding: 0; font-size: 11px; }
.pop-busca { width: 100%; margin-bottom: 4px; }
.pop-p { padding: 4px 8px 8px; margin: 0; line-height: 1.5; }
.pop-linha { display: flex; align-items: center; gap: 4px; }
.pop-linha .pop-item { flex: 1; }
.pop-acoes { display: flex; justify-content: flex-end; gap: 6px; padding: 8px 4px 2px; border-top: 1px solid var(--line); margin-top: 6px; }
.po-grupo { padding: 2px 0 4px; }
.po-g { display: flex; align-items: center; gap: 6px; padding: 6px 8px 2px; }
.po-g i { width: 12px; height: 12px; border-radius: 3px; }
.po-g span { color: var(--muted); font-size: 10px; margin-left: auto; }
.po-grupo .pop-item { padding-left: 26px; }
.mini { height: 22px !important; min-width: 22px; width: auto !important; padding: 0 6px !important; font-size: 12px; }
.sel-n { padding: 2px 8px; gap: 8px; }
.sel-n span { flex: 1; }
.sel-n input { width: 64px; height: 26px; }
.ord-linha { display: flex; gap: 6px; padding: 4px; }
.ord-linha select { flex: 1; min-width: 0; }

/* filtros */
.filtros { display: grid; gap: 0; }
.fsec { border-bottom: 1px solid var(--line); }
.fsec:last-child { border-bottom: 0; }
.fsec summary { list-style: none; display: flex; align-items: center; gap: 8px; padding: 12px 10px; cursor: pointer; font-weight: 500; }
.fsec summary::-webkit-details-marker { display: none; }
.fsec summary b { margin-left: auto; color: var(--muted); font-weight: 400; transition: transform 0.15s; }
.fsec[open] summary b { transform: rotate(180deg); }
.fsec-ico { width: 14px; color: var(--muted); }
.fsec-corpo { padding: 0 10px 14px; display: grid; gap: 8px; }
.fsec-corpo h4, .modal h4, .cards-previa h4 { margin: 8px 0 0; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: 0.05em; }
.filtros .linha { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.filtros .linha select, .filtros .linha input { flex: 1; min-width: 0; }
.grade-chk { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; max-height: 180px; overflow-y: auto; }
.filtros .campo { grid-template-columns: 130px 1fr; }
.filtros .modal-pe { padding: 10px; border-top: 1px solid var(--line); }
.pop .filtros .modal-pe { position: sticky; bottom: -6px; background: #fff; margin: 0 -6px -6px; }
.pop .filtros .chk, .modal .chk { color: var(--ink); }

/* modais */
.modal { position: fixed; inset: 0; z-index: 60; background: rgba(47, 44, 93, 0.25); display: grid; place-items: center; padding: 20px; }
.modal[hidden] { display: none; }
.modal-caixa { background: #fff; border-radius: 10px; width: min(480px, 100%); max-height: 90vh; overflow-y: auto; box-shadow: 0 20px 48px rgba(47, 44, 93, 0.2); }
.modal-caixa.largo { width: min(860px, 100%); }
.modal-topo { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.modal-topo h3 { margin: 0; font-size: 14px; font-weight: 600; }
.modal-form { display: grid; gap: 10px; padding: 16px 18px; }
.modal-form .campo { grid-template-columns: 1fr; gap: 4px; }
.modal-form .campo span { font-weight: 500; color: var(--ink); }
.modal-form .chk { display: flex; }
.modal-pe { display: flex; align-items: center; gap: 8px; padding: 12px 18px; }
.modal-form .modal-pe { padding: 8px 0 0; }
.novo-res { display: grid; gap: 1px; max-height: 200px; overflow-y: auto; }
.novo-res:empty { display: none; }
.novo-res .meta { margin-left: 6px; }
.novo-contato { display: grid; gap: 10px; padding: 10px; border: 1px dashed var(--line-2); border-radius: 8px; }
.cards-cfg { display: grid; grid-template-columns: 1fr 320px; gap: 18px; padding: 16px 18px; }
.cards-opcoes { display: grid; gap: 10px; align-content: start; }
.cards-grupo { border: 1px solid var(--line); border-radius: 8px; padding: 4px 12px 10px; }
.cards-grupo summary { padding: 8px 0; cursor: pointer; font-size: 10px; font-weight: 600; letter-spacing: 0.05em; color: var(--muted); display: flex; gap: 6px; align-items: center; }
.cards-grupo .chk { display: flex; padding: 4px 0; color: var(--ink); }
.cards-previa { background: var(--bg-2); border-radius: 8px; padding: 12px; display: grid; gap: 10px; align-content: start; }
.cards-previa .kc { cursor: default; }

/* chat flutuante */
.chat-flut { position: fixed; right: 20px; bottom: 20px; z-index: 50; width: 380px; height: min(560px, calc(100vh - 40px)); background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 16px 40px rgba(47, 44, 93, 0.22); display: flex; flex-direction: column; overflow: hidden; }
.chat-flut[hidden] { display: none; }
.cf-topo { display: flex; align-items: center; gap: 4px; padding: 8px 10px; border-bottom: 1px solid var(--line); font-size: 10px; letter-spacing: 0.05em; }
.cf-contato { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.cf-contato .botao { height: 26px; font-size: 11px; white-space: nowrap; padding: 0 8px; }
.cf-contato > div:nth-child(2) { min-width: 0; }
.cf-msgs { flex: 1; overflow-y: auto; padding: 12px; display: grid; gap: 6px; align-content: start; background: #fff; }
.cf-msgs .msg { max-width: 85%; }
.cf-form { display: flex; gap: 6px; padding: 8px; border-top: 1px solid var(--line); }
.cf-form input { flex: 1; }

/* Configuração da origem */
.oc-camada { z-index: 70; }
.oc-camada + .oc-camada { z-index: 80; }
.modal-caixa.oc { width: min(1100px, 100%); height: min(660px, 92vh); display: flex; flex-direction: column; overflow: hidden; }
.modal-caixa.medio { width: min(640px, 100%); }
.oc-abas { display: flex; gap: 4px; padding: 0 18px; border-bottom: 1px solid var(--line); }
.oc-abas button { background: none; color: var(--muted); border-radius: 0; border-bottom: 2px solid transparent; height: 40px; }
.oc-abas button.agora { color: var(--accent); border-bottom-color: var(--accent); }
.oc-corpo { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.oc-geral { flex: 1; min-height: 0; display: grid; grid-template-columns: 220px 1fr; }
.oc-lado { border-right: 1px solid var(--line); padding: 12px 8px; display: flex; flex-direction: column; gap: 2px; overflow-y: auto; }
.oc-lado button { background: none; color: var(--ink); justify-content: flex-start; text-align: left; height: auto; min-height: 34px; padding: 6px 10px; }
.oc-lado button:hover { background: var(--hover); }
.oc-lado button.agora { background: var(--accent-soft); color: var(--accent); box-shadow: inset 2px 0 0 var(--accent); border-radius: 0 6px 6px 0; }
.oc-painel { display: flex; flex-direction: column; min-height: 0; padding: 16px 20px; overflow-y: auto; }
.oc-cab { border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.oc-cab h4 { margin: 0 0 4px; font-size: 14px; font-weight: 600; color: var(--ink); }
.oc-cab p { margin: 0 0 14px; }
.oc-campos { flex: 1; display: flex; flex-direction: column; gap: 12px; }
.oc-campos h5 { margin: 8px 0 0; font-size: 12px; font-weight: 600; }
.oc-campos p { margin: 0; }
.oc-painel .modal-pe { padding: 12px 0 0; border-top: 1px solid var(--line); margin-top: 12px; }
.campo-v { display: flex; flex-direction: column; gap: 4px; }
.campo-v > span { font-weight: 500; }
.req { color: var(--lost); font-weight: 500; }
.oc-campos .linha, .modal-form .linha, .oc-painel .linha { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.oc-painel .cresce, .oc-etapas-topo .cresce, .oc-regra .cresce { flex: 1; }
.linha select, .linha input:not([type=checkbox]):not([type=radio]) { flex: 1; min-width: 0; }
.linha input.curto { flex: 0 0 80px; }
.oc-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.oc-lista { display: flex; flex-direction: column; gap: 6px; max-height: 360px; overflow-y: auto; border: 1px solid var(--line); border-radius: 6px; padding: 10px; }
.oc-lista.curta { max-height: 160px; }
.oc-lista .chk, .oc-campos .chk { color: var(--ink); }
.oc-tab { width: 100%; border-collapse: collapse; }
.oc-tab th { text-align: left; font-size: 11px; color: var(--muted); font-weight: 500; padding: 6px; border-bottom: 1px solid var(--line); }
.oc-tab td { padding: 6px; border-bottom: 1px solid var(--line); }
.oc-tab input, .oc-tab select { width: 100%; }
.erro { color: var(--lost); }
.ok-txt { color: var(--ok); }
.oc-regra { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; }
.oc-regra input[type=number] { width: 70px; }
.oc-regra select { min-width: 140px; }
.oc-aviso { padding: 10px 12px; border-radius: 6px; background: var(--bg-2); color: var(--muted); }
.oc-ok { padding: 10px 12px; border-radius: 6px; background: var(--ok-soft); color: var(--ok); }
.oc-vazio { text-align: center; padding: 28px 10px; border: 1px dashed var(--line-2); border-radius: 8px; }
.oc-vazio-ico { font-size: 28px; }
.oc-grupo-campos { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.oc-toggle { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 2px 0; }
.oc-toggle input { display: none; }
.oc-toggle i { width: 28px; height: 16px; border-radius: 999px; background: var(--line-2); position: relative; flex: none; transition: background .15s; }
.oc-toggle i::after { content: ""; position: absolute; left: 2px; top: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: left .15s; }
.oc-toggle input:checked + i { background: var(--accent); }
.oc-toggle input:checked + i::after { left: 14px; }
.oc-etapas-topo { display: flex; gap: 8px; padding: 10px 18px; }
.oc-cols { flex: 1; min-height: 0; display: flex; gap: 12px; padding: 0 18px 12px; overflow-x: auto; }
.oc-col { flex: 0 0 250px; display: flex; flex-direction: column; gap: 8px; background: var(--bg-2); border-radius: 8px; padding: 10px; overflow-y: auto; }
.oc-col-topo { display: flex; align-items: center; gap: 6px; font-weight: 600; background: #fff; border-radius: 6px; padding: 8px 10px; }
.oc-col-topo .meta { margin-left: auto; font-weight: 400; }
.oc-col-topo .flag.ini { color: var(--accent); }
.oc-col-topo .flag.fim { color: var(--ok); }
.oc-col-n { background: #fff; color: var(--ink); justify-content: flex-start; font-weight: 400; }
.oc-modelos { display: flex; flex-direction: column; gap: 4px; }
.oc-modelo { background: #fff; color: var(--ink); justify-content: flex-start; font-weight: 400; gap: 6px; height: auto; min-height: 32px; padding: 4px 8px; border: 1px solid var(--line); text-align: left; }
.oc-modelo.oculta { opacity: 0.6; border-style: dashed; }
.oc-off { font-weight: 600; min-width: 14px; text-align: right; }
.oc-un { font-size: 10px; border-radius: 4px; padding: 0 4px; background: var(--accent-soft); color: var(--accent); }
.oc-tipo svg { width: 14px; height: 14px; display: block; color: var(--muted); }
.oc-tit { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oc-nova { width: 100%; }
.om-tipos-ativ { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.om-tipos-ativ button { background: #fff; color: var(--ink); border: 1px solid var(--line); height: auto; flex-direction: column; align-items: flex-start; text-align: left; padding: 10px; gap: 4px; font-weight: 400; position: relative; }
.om-tipos-ativ button span { color: var(--muted); font-size: 11px; }
.om-tipos-ativ button.agora { border-color: var(--accent); background: var(--accent-soft); }
.om-tipos-ativ button:disabled { padding-top: 22px; }
.om-tipos-ativ em { position: absolute; top: 6px; right: 6px; font-style: normal; font-size: 9px; background: var(--accent); color: #fff; border-radius: 4px; padding: 0 4px; }
.om-tipos { display: flex; gap: 6px; }
.om-tipos button { width: 40px; height: 40px; padding: 0; background: #fff; color: var(--muted); border: 1px solid var(--line); }
.om-tipos button svg { width: 18px; height: 18px; }
.om-tipos button.agora { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.om-passos { display: flex; flex-direction: column; gap: 6px; }
.om-passo { display: flex; gap: 6px; align-items: flex-start; }
.om-passo textarea { flex: 1; height: auto; padding: 6px 10px; }
.om-passo.delay { align-items: center; color: var(--muted); }
.om-passo.delay input { width: 70px; }
.oc-int-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin-top: 12px; }
.oc-int { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--line); border-radius: 8px; padding: 12px; }
.oc-int.off { opacity: 0.6; }
.oc-int-ico { width: 32px; height: 32px; border-radius: 8px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; flex: none; }
.oc-int-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.oc-int-txt strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oc-int-txt .meta { font-size: 10px; }
.badge-wh { font-size: 10px; background: var(--bg-2); border-radius: 4px; padding: 1px 6px; }
.oc-metodo { display: inline-flex; cursor: pointer; }
.oc-metodo input { display: none; }
.oc-metodo span { padding: 0 12px; height: 32px; display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 4px; }
.oc-metodo input:checked + span { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.oc-campos-wh { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.oc-campos-wh .chk { color: var(--ink); }
.oc-campos-wh code { font-size: 10px; color: var(--muted); }
.oc-json { background: var(--bg-2); border-radius: 6px; padding: 10px; max-height: 320px; overflow: auto; font-size: 11px; white-space: pre-wrap; word-break: break-all; }
.oc-menu { padding: 4px; }

/* Atividades */
.at { position: relative; display: flex; flex-direction: column; height: 100vh; min-height: 0; flex: 1; min-width: 0; background: var(--bg); }
.at-topo { display: flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.at-topo h1 { margin: 0; font-size: 16px; font-weight: 500; }
.at-topo .cresce, .at-barra .cresce, .at-chips .cresce, .at-lote .cresce { flex: 1; }
.at-barra { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.at-barra button.ghost { height: 32px; }
.at-barra button.ativo { border-color: var(--accent); color: var(--accent); }
.at-ico-rel { color: var(--accent); }
.at-total { color: var(--muted); }
.at-total b { color: var(--ink); font-weight: 600; }
.at-chips { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--line); flex-wrap: wrap; flex-shrink: 0; }
.at-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding-left: 12px; border: 1px solid var(--line); border-radius: 6px; }
.at-chip b { font-weight: 600; }
.at-chip button { background: none; color: var(--ink); height: 28px; padding: 0 8px; border-left: 1px solid var(--line); border-radius: 0; }
.at-chip-add { background: none; color: var(--ink); border: 1px dashed var(--line-2); height: 30px; }
.at-lote { display: flex; align-items: center; gap: 6px; padding: 8px 16px; background: var(--accent-soft); border-bottom: 1px solid var(--line); flex-wrap: wrap; flex-shrink: 0; }
.at-lote button.ghost { height: 28px; }
.at-tabela { flex: 1; min-height: 0; overflow: auto; }
.at-tab { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 1350px; }
.at-tab thead th { position: sticky; top: 0; z-index: 2; background: var(--bg-2); color: var(--muted); font-size: 10px; font-weight: 500; letter-spacing: 0.06em; text-align: left; padding: 10px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.at-tab td { padding: 8px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.at-tab th:nth-child(1), .at-tab td.at-c-exp { width: 30px; padding-left: 12px; }
.at-tab th:nth-child(2), .at-tab td.at-c-chk { width: 30px; }
.at-tab th:nth-child(3), .at-tab td.at-c-conc { width: 34px; }
.at-c-ativ { min-width: 280px; }
.at-c-conclusao { width: 210px; }
.at-atraso, .at-noprazo { white-space: nowrap; }
.at-c-contato { width: 190px; }
.at-c-conversas { width: 220px; }
.at-c-origem { width: 170px; }
.at-c-etapa { width: 140px; text-align: center; }
.at-c-dono { width: 80px; text-align: center; }
.at-c-tags { width: 160px; }
.at-c-valor { width: 100px; }
.at-dia td { background: var(--bg); padding: 10px 16px; border-bottom: 1px solid var(--line); }
.at-dia td > * { margin-right: 10px; }
.at-quando { font-size: 10px; letter-spacing: 0.06em; color: var(--muted); background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; padding: 1px 6px; }
.at-quando.hoje { color: var(--accent); background: var(--accent-soft); border-color: transparent; }
.at-atr-n { color: var(--lost); background: var(--lost-soft); border-radius: 4px; padding: 1px 6px; font-size: 11px; }
.at-linha:hover td { background: #fbfcff; }
.at-linha.sel td { background: var(--accent-soft); }
.at-exp { background: none; color: var(--ink); width: 22px; height: 22px; padding: 0; font-size: 16px; transition: transform 0.15s; }
.at-exp.aberto { transform: rotate(90deg); }
.at-radio { width: 18px; height: 18px; padding: 0; border-radius: 50%; background: #fff; border: 1.5px solid #a5b4fc; color: #fff; font-size: 11px; }
.at-radio:hover { border-color: var(--accent); }
.at-radio.ok { background: var(--ok); border-color: var(--ok); }
.at-ativ { display: flex; gap: 10px; align-items: center; }
.at-tipo svg { width: 16px; height: 16px; display: block; color: var(--accent); }
.at-tit { display: flex; gap: 8px; align-items: baseline; }
.at-tit span { font-size: 13px; }
.at-tit em { font-style: normal; font-size: 11px; color: var(--muted); white-space: nowrap; }
.at-tit em.atr { color: var(--lost); }
.at-linha.feita .at-tit span, .at-linha.ignorada .at-tit span { text-decoration: line-through; color: var(--muted); }
.at-linha.feita .at-tipo svg { color: var(--muted); }
.at-conc { display: flex; flex-direction: column; gap: 3px; }
.at-atraso { color: var(--lost); background: var(--lost-soft); border-radius: 4px; padding: 1px 6px; font-size: 11px; align-self: flex-start; }
.at-noprazo { color: var(--ok); background: var(--ok-soft); border-radius: 4px; padding: 1px 6px; font-size: 11px; align-self: flex-start; }
.avatar.mini-av { width: 22px; height: 22px; font-size: 9px; vertical-align: middle; }
.at-contato { display: inline-flex; gap: 8px; align-items: center; font-weight: 600; font-size: 11px; max-width: 180px; }
.at-contato span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.at-conv { display: flex; gap: 6px; align-items: center; background: var(--pill); border: 1px solid var(--line-2); border-radius: 6px; padding: 4px 8px; max-width: 210px; }
.at-conv-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; color: var(--muted); }
.at-origem { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.at-origem i { font-style: normal; background: #ff4062; color: #fff; border-radius: 4px; width: 18px; height: 18px; display: inline-grid; place-items: center; font-size: 10px; }
.at-tags { display: flex; gap: 4px; flex-wrap: wrap; }
.at-valor { font-weight: 500; }
.at-painel td { background: #fff; border-bottom: 2px solid var(--accent); }
.at-painel-in { display: flex; gap: 12px; align-items: center; justify-content: center; padding: 4px 0; }
.at-painel-in select { width: 220px; }
.at-det-linha td { background: var(--bg-2); padding: 12px 16px; }
.at-det { display: grid; grid-template-columns: 1fr 380px; gap: 12px; position: sticky; left: 16px; width: var(--at-w, calc(100vw - 260px)); }
.at-det-esq, .at-det-dir { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.at-det h6 { margin: 6px 0 0; font-size: 10px; color: var(--muted); letter-spacing: 0.06em; font-weight: 500; }
.at-det-tit { display: flex; gap: 8px; align-items: center; }
.at-desc { border: 1px solid var(--line); border-radius: 6px; padding: 10px 12px; line-height: 1.6; }
.at-desc p { margin: 0 0 6px; }
.at-passos { display: flex; flex-direction: column; gap: 6px; }
.at-bolha { background: var(--bubble-out); border-radius: 8px; padding: 8px 10px; white-space: pre-wrap; max-width: 520px; }
.at-delay { color: var(--muted); font-size: 11px; }
.at-det-acoes { display: flex; gap: 12px; align-items: center; margin-top: auto; padding-top: 8px; border-top: 1px solid var(--line); }
.at-det-acoes input { height: 28px; }
.at-det-dir .linha { display: flex; gap: 8px; align-items: center; }
.at-det-dir .linha .cresce { flex: 1; }
.at-det-dir .linha select { flex: 1; }
.at-det-cont { display: flex; gap: 8px; align-items: center; }
.at-vazio { text-align: center; padding: 60px 20px; }
.at-mais { text-align: center; padding: 16px; }
.at-filtros h6 { margin: 10px 0 4px; font-size: 10px; color: var(--muted); letter-spacing: 0.06em; font-weight: 500; }
.at-filtros .fsec > header { display: flex; align-items: center; gap: 8px; padding: 12px 10px; cursor: pointer; font-weight: 500; }
.at-filtros .fsec > header i { margin-left: auto; font-style: normal; color: var(--muted); }
.at-filtros .fsec-corpo { padding: 0 10px 12px; }
.at-chks { display: flex; flex-direction: column; gap: 4px; max-height: 160px; overflow-y: auto; }
.at-chks .chk { color: var(--ink); }
.at-cond { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.at-cond select, .at-cond input { flex: 1; min-width: 0; height: 28px; }
.pop-cab { display: flex; align-items: center; gap: 8px; padding: 6px 8px; }
.pop-cab .cresce { flex: 1; }
.pop-vazio { padding: 4px 8px; margin: 0; }
#at-pop { position: fixed; z-index: 50; }
#at-pop .pop-item { display: flex; align-items: center; gap: 6px; cursor: pointer; }
#at-pop .pop-item span { flex: 1; }
.at-cols { display: flex; flex-direction: column; }
.at-col-item { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 6px; cursor: grab; }
.at-col-item:hover { background: var(--hover); }
.at-col-item .cresce { flex: 1; }
.at-passos-wiz { display: flex; gap: 8px; list-style: none; margin: 0; padding: 12px 18px 0; }
.at-passos-wiz li { flex: 1; display: flex; gap: 6px; align-items: center; color: var(--muted); padding-bottom: 8px; border-bottom: 2px solid var(--line); }
.at-passos-wiz li b { width: 20px; height: 20px; border-radius: 50%; background: var(--line); color: var(--muted); display: inline-grid; place-items: center; font-size: 11px; }
.at-passos-wiz li.agora { color: var(--accent); border-bottom-color: var(--accent); }
.at-passos-wiz li.agora b { background: var(--accent); color: #fff; }
.at-neg-op { display: flex; gap: 8px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.at-neg-op .meta { margin-left: auto; }
.at-tipos-grade { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.at-tipos-grade button { height: 76px; flex-direction: column; background: #fff; color: var(--ink); border: 1px solid var(--line); font-weight: 400; }
.at-tipos-grade button svg { width: 22px; height: 22px; color: var(--accent); }
.at-tipos-grade button.agora { border-color: var(--accent); background: var(--accent-soft); }

/* Contatos */
#ct-pop { position: fixed; z-index: 50; }
#ct-pop .pop-item { display: flex; align-items: center; gap: 6px; cursor: pointer; }
#ct-pop .pop-item span { flex: 1; }
.pop-item.vermelho, .ico-mini.vermelho { color: var(--lost); }
.ct .at-tabela { padding-bottom: 70px; }
.ct-tab { min-width: 900px; }
.ct-tab td { height: 52px; }
.ct-c-chk { width: 44px; padding-left: 16px !important; }
.ct-chk-cab { display: inline-flex; align-items: center; gap: 2px; }
.ct-chk-cab .mini { border: 0; background: none; color: var(--muted); }
.ct-c-nome { cursor: pointer; width: 30%; }
.ct-nome { display: inline-flex; align-items: center; gap: 10px; font-weight: 500; }
.ct-nome .avatar { width: 26px; height: 26px; font-size: 10px; }
.ct-c-nome:hover .ct-nome span { color: var(--accent); }
.ct-ord { cursor: pointer; user-select: none; }
.ct-c-contato { width: 26%; }
.ct-c-negocios, .ct-c-mais { text-align: right; }
.ct-c-mais { width: 44px; }
.ct-c-mais .ico-bt { border: 0; background: none; height: 26px; width: 26px; }
.ct-fone { display: inline-flex; align-items: center; gap: 8px; }
.ct-fone-ico svg, .ico-mini svg { width: 14px; height: 14px; display: block; }
.ct-fone-ico { color: var(--ink); }
.ct-fone-acoes { display: inline-flex; gap: 2px; visibility: hidden; }
.at-linha:hover .ct-fone-acoes { visibility: visible; }
.ico-mini { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; color: var(--accent); background: none; padding: 0; border: 0; }
.ico-mini:hover { background: var(--accent-soft); }
.ico-mini[aria-disabled="true"] { opacity: 0.35; pointer-events: none; }
.ct-ig { color: #c13584; }
.ct-vneg { height: 24px !important; font-size: 11px !important; border-radius: 4px; }
.ct-pe { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-top: 1px solid var(--line); flex-shrink: 0; }
.ct-pe .cresce { flex: 1; }
.ct-pe select { width: 150px; }
.ct-paginas { display: flex; align-items: center; gap: 4px; }
.ct-paginas button { height: 28px; min-width: 28px; padding: 0 8px; }
.ct-lote { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 45; display: flex; align-items: center; gap: 4px; background: var(--accent); color: #fff; border-radius: 8px; padding: 6px 10px; box-shadow: 0 10px 30px rgba(108, 25, 222, 0.35); }
.ct-lote button { background: none; color: #fff; height: 30px; padding: 0 12px; font-weight: 500; }
.ct-lote button:hover { background: rgba(255, 255, 255, 0.14); filter: none; }
.ct-lote button svg { width: 15px; height: 15px; }
.ct-lote b { padding-left: 6px; }
.ct-lote-sel { font-size: 10px; letter-spacing: 0.06em; padding: 0 12px 0 4px; margin-right: 4px; border-right: 1px solid rgba(255, 255, 255, 0.3); }
.ct-lote-x { font-size: 16px; }
.ct-mescla { color: #b45309 !important; border-color: #fcd34d !important; background: #fffbeb !important; }
.ct-novo-grupo button b { font-weight: 400; font-size: 15px; }
.ct-ficha { width: min(1060px, 100%); height: min(720px, 94vh); display: flex; flex-direction: column; overflow: hidden; }
.cf-corpo { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 16px 32px 0; }
.cf-cab { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; }
.cf-cab .avatar.g { width: 40px; height: 40px; font-size: 13px; }
.cf-cab h2 { margin: 0 0 2px; font-size: 15px; font-weight: 500; }
.cf-cab .cresce { flex: 1; }
.cf-icos { display: flex; gap: 2px; }
.cf-abas { padding: 0; }
.cf-aba { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 0 20px; display: flex; flex-direction: column; gap: 10px; }
.cf-barra { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: var(--bg-2); border-radius: 8px; font-weight: 500; }
.cf-barra .cresce { flex: 1; }
.cf-barra button { height: 28px; }
.cf-barra button.ativo { border-color: var(--accent); color: var(--accent); }
.cf-campos { display: grid; grid-template-columns: 200px 1fr; border: 1px solid var(--line); border-radius: 8px; min-height: 0; }
.cf-campos aside { border-right: 1px solid var(--line); padding: 8px; }
.cf-campos aside button { width: 100%; justify-content: flex-start; background: none; color: var(--ink); font-weight: 400; }
.cf-campos aside button.agora { background: var(--accent-soft); box-shadow: inset 2px 0 0 var(--accent); border-radius: 0 6px 6px 0; }
.cf-campos > div { padding: 10px 14px; }
.cf-busca input { width: 220px; }
.cf-lista { margin-top: 10px; }
.cf-linha { display: grid; grid-template-columns: 200px 1fr; align-items: center; gap: 12px; padding: 4px 6px; border-bottom: 1px solid var(--line); min-height: 38px; }
.cf-linha > span { font-weight: 500; }
.cf-linha input, .cf-linha select, .cf-linha textarea { width: 100%; background: var(--input-bg); border-color: transparent; }
.cf-linha input:hover, .cf-linha select:hover, .cf-linha textarea:hover { border-color: var(--line-2); }
.cf-fone { display: flex; align-items: center; gap: 6px; width: 100%; background: var(--input-bg); border-radius: 4px; padding-left: 8px; }
.cf-fone span { font-size: 11px; white-space: nowrap; }
.cf-fone input { flex: 1; background: transparent !important; }
.ct-negs { width: 100%; border-collapse: collapse; border: 1px solid var(--line); border-radius: 8px; }
.ct-negs th { text-align: left; font-size: 10px; letter-spacing: 0.06em; color: var(--muted); font-weight: 500; padding: 10px; border-bottom: 1px solid var(--line); }
.ct-negs td { padding: 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.ct-negs .dir { text-align: right; white-space: nowrap; }
.ct-n { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--bg-2); font-size: 10px; font-weight: 600; }
.ct-grupo { font-size: 9px; letter-spacing: 0.06em; color: var(--muted); font-weight: 500; }
.ct-etapa { background: var(--pill); border: 1px solid var(--line-2); border-radius: 4px; padding: 1px 6px; font-size: 11px; }
.ct-st { border-radius: 4px; padding: 1px 6px; font-size: 11px; background: var(--pill); color: var(--accent); }
.ct-st.WON { background: var(--ok-soft); color: var(--ok); }
.ct-st.LOST { background: var(--lost-soft); color: var(--lost); }
.cf-aviso { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--bg-2); border-radius: 8px; }
.cf-conv { flex: 1; min-height: 360px; display: grid; grid-template-columns: 300px 1fr; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.cf-conv-lista { border-right: 1px solid var(--line); overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
.cf-conv-item { background: none; color: var(--ink); height: auto; padding: 8px; display: flex; gap: 8px; align-items: flex-start; justify-content: flex-start; text-align: left; font-weight: 400; border-radius: 6px; }
.cf-conv-item.agora, .cf-conv-item:hover { background: var(--bg-2); filter: none; }
.cf-conv-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cf-conv-txt .linha-1 { display: flex; gap: 6px; align-items: center; }
.cf-conv-txt time { margin-left: auto; color: var(--muted); font-size: 10px; }
.cf-conv-txt .preview { color: var(--muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-sess { font-style: normal; font-size: 10px; border-radius: 4px; padding: 0 6px; background: var(--ok-soft); color: var(--ok); }
.ct-sess.at { background: var(--pill); color: var(--accent); }
.ct-sess.fi { background: var(--bg-2); color: var(--muted); }
.cf-conv-msgs { overflow-y: auto; display: flex; flex-direction: column; }
.cf-msgs-in { display: grid; gap: 6px; padding: 12px; align-content: start; }
.oc-vazio.sem-borda { border: 0; }
.cf-conv-msgs .oc-vazio { margin: auto; }
.cf-barra-arq { display: flex; align-items: center; gap: 8px; }
.cf-barra-arq .cresce { flex: 1; }
.cf-barra-arq select { width: 180px; }
.cf-hist-barra { display: flex; gap: 8px; }
.cf-hist-barra select { width: 220px; }
.cf-hist { display: flex; flex-direction: column; gap: 8px; }
.cf-hist-dia { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 11px; }
.cf-hist-dia::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.cf-hist-item { display: flex; gap: 10px; padding: 10px 12px; background: var(--bg-2); border-radius: 8px; }
.cf-hist-item p { margin: 2px 0; }
.cf-hist-ico { width: 26px; height: 26px; border-radius: 6px; background: var(--accent); color: #fff; display: grid; place-items: center; flex: none; font-size: 12px; }
.cf-hist-ico.t-criado { background: #6366f1; }
.cf-hist-ico.t-tag { background: #f59e0b; }
.cf-hist-ico.t-arquivo { background: #0ea5e9; }
.cf-hist-ico.t-atividade { background: var(--ok); }
.cf-hist-tit { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ct-grade2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ct-ajuda { display: inline-grid; place-items: center; width: 14px; height: 14px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 9px; cursor: help; }
.ct-tagpop { display: flex; flex-direction: column; gap: 4px; }
.ct-tag-q { width: 100%; }
.ct-tag-res { display: grid; gap: 1px; max-height: 240px; overflow-y: auto; }
.gc-lista { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 8px; max-height: 340px; overflow-y: auto; }
.gc-item { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.gc-item .cresce { flex: 1; }
.ct-campo-op { cursor: pointer; }
.ct-campo-op .meta { margin-left: auto; }
.gc-novo { display: flex; gap: 6px; flex-wrap: wrap; }
.gc-novo input[name=rotulo] { flex: 1; min-width: 160px; }
.ct-toggle { display: inline-flex; background: var(--bg-2); border-radius: 8px; padding: 3px; align-self: flex-start; }
.ct-toggle button { background: none; color: var(--muted); height: 28px; }
.ct-toggle button.agora { background: #fff; color: var(--ink); box-shadow: var(--sombra); }
.ct-imp { width: min(920px, 100%); height: min(640px, 94vh); display: flex; flex-direction: column; overflow: hidden; }
.ct-imp-topo { justify-content: center; }
.ct-passos { display: flex; align-items: center; gap: 10px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.ct-passos li { display: flex; align-items: center; gap: 6px; color: var(--ink); }
.ct-passos li + li::before { content: ""; width: 40px; height: 1px; background: var(--line-2); margin-right: 4px; }
.ct-passos li b { width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--line-2); display: grid; place-items: center; font-size: 10px; font-weight: 500; }
.ct-passos li.agora b { border-color: var(--accent); color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ct-passos li.feito b { background: var(--accent); color: #fff; border-color: var(--accent); }
.ct-imp-corpo { flex: 1; min-height: 0; overflow-y: auto; padding: 16px; }
.ct-imp-in { max-width: 380px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }
.ct-imp-in.largo { max-width: 820px; }
.ct-imp-in h2 { margin: 6px 0 0; font-size: 16px; font-weight: 500; }
.ct-imp-in p { margin: 0; }
.ct-imp-in a { color: var(--accent); }
.ct-imp-pe { border-top: 1px solid var(--line); }
.ct-drop { display: flex; gap: 12px; align-items: center; padding: 14px; border: 1px dashed var(--line-2); border-radius: 8px; background: var(--bg-2); cursor: pointer; }
.ct-drop.sobre { border-color: var(--accent); background: var(--accent-soft); }
.ct-drop-ico { width: 36px; height: 36px; border-radius: 6px; background: var(--accent); color: #fff; display: grid; place-items: center; font-size: 18px; flex: none; }
.ct-decisoes { display: grid; gap: 8px; }
.ct-decisoes > div { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; }
.ct-decisoes b { font-size: 20px; font-weight: 600; min-width: 60px; color: var(--accent); }
.ct-decisoes .ruim b { color: var(--lost); }
.ct-previa { overflow-x: auto; }
.ct-mescla-cx { width: min(1100px, 100%); height: min(620px, 94vh); display: flex; flex-direction: column; overflow: hidden; position: relative; }
.ct-mes-tit { font-size: 16px !important; }
.ct-mes { flex: 1; min-height: 0; display: grid; grid-template-columns: 290px 1fr; }
.ct-mes-lado { border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 8px; padding: 10px; min-height: 0; }
.ct-mes-lado .qd-busca input { width: 100%; }
.ct-mes-lado .qd-busca { display: flex; }
.ct-mes-bts { display: flex; gap: 6px; }
.ct-mes-bts button { height: 28px; }
.ct-mes-todos { padding: 6px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.ct-mes-lista { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.ct-mes-item { display: flex; align-items: center; gap: 8px; padding: 8px 6px; border-radius: 6px; cursor: pointer; }
.ct-mes-item:hover { background: var(--bg-2); }
.ct-mes-item.agora { background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line-2); }
.ct-mes-avs { display: inline-flex; }
.ct-mes-avs .avatar + .avatar { margin-left: -6px; box-shadow: 0 0 0 2px #fff; }
.ct-mes-txt { min-width: 0; display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.ct-mes-txt strong { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 190px; }
.ct-conf { font-size: 10px; border-radius: 4px; padding: 0 6px; background: #ffedd5; color: #c2410c; white-space: nowrap; }
.ct-conf.alta { background: var(--ok-soft); color: var(--ok); }
.ct-conf.baixa { background: var(--lost-soft); color: var(--lost); }
.ct-mes-rod { text-align: right; }
.ct-mes-pop { position: absolute; width: 270px; z-index: 5; }
.ct-mes-dir { min-height: 0; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; background: #fbfcff; }
.ct-mes-vazio { margin: auto; }
.ct-mes-cab { display: flex; align-items: center; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.ct-mes-cab .cresce { flex: 1; }
.ct-mes-bloq { display: flex; gap: 10px; padding: 10px 12px; border: 1px solid #fca5a5; background: var(--lost-soft); border-radius: 8px; color: var(--ink); }
.ct-mes-bloq strong { color: var(--lost); }
.ct-mes-sub { display: flex; align-items: center; gap: 8px; font-size: 10px; letter-spacing: 0.05em; color: var(--muted); }
.ct-mes-sub .cresce { flex: 1; }
.ct-mes-sub a { color: var(--accent); letter-spacing: 0; font-size: 11px; }
.ct-mes-tab { border: 1px solid var(--line); border-radius: 8px; background: #fff; overflow-x: auto; }
.ct-mes-tab table { width: 100%; border-collapse: collapse; }
.ct-mes-tab th { text-align: left; padding: 8px; font-weight: 400; border-bottom: 1px solid var(--line); background: var(--bg-2); white-space: nowrap; }
.ct-mes-tab th:first-child { font-size: 10px; letter-spacing: 0.06em; color: var(--muted); width: 130px; }
.ct-mes-tab td { padding: 6px 8px; vertical-align: top; }
.ct-mes-cel { width: 100%; height: auto; min-height: 30px; justify-content: flex-start; flex-direction: column; align-items: flex-start; gap: 2px; background: none; color: var(--ink); border: 1px solid transparent; font-weight: 400; text-align: left; padding: 6px 8px; }
.ct-mes-cel:not(:disabled):hover { border-color: var(--line-2); filter: none; }
.ct-mes-cel.agora { border-color: var(--accent); background: var(--accent-soft); }
.ct-mes-cel.bloq { border-color: #fca5a5; background: var(--lost-soft); opacity: 1; }
.ct-mes-cel:disabled { opacity: 1; cursor: default; }
.ct-mes-cel em { font-style: normal; font-size: 10px; color: var(--lost); }
.ct-wa { font-size: 10px; background: var(--ok-soft); color: var(--ok); border-radius: 4px; padding: 0 6px; }
.ct-mes-pe { border-top: 1px solid var(--line); }
.ct-mes-aviso { padding: 6px 10px; border-radius: 6px; background: var(--bg-2); color: var(--muted); }
.ct-mes-aviso.ruim { background: var(--lost-soft); color: var(--lost); }

/* Agenda */
input.sw { appearance: none; width: 34px; height: 20px; border-radius: 10px; background: var(--line-2); position: relative; cursor: pointer; flex-shrink: 0; margin: 0; transition: background 0.15s; }
input.sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: left 0.15s; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); }
input.sw:checked { background: var(--accent); }
input.sw:checked::after { left: 17px; }
.ag-barra { display: flex; align-items: center; gap: 6px; height: 48px; padding: 0 12px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.ag-barra h2 { margin: 0 0 0 6px; font-size: 15px; font-weight: 600; }
.ag-barra .ico-bt.agora { color: var(--accent); background: var(--accent-soft); }
.ag-vistas { display: inline-flex; background: var(--bg-2); border-radius: 8px; padding: 3px; }
.ag-vistas button { background: none; color: var(--muted); height: 28px; padding: 0 12px; }
.ag-vistas button.agora { background: #fff; color: var(--ink); box-shadow: var(--sombra); }
.ag-corpo { flex: 1; min-height: 0; display: flex; }
.ag-lado { width: 230px; flex-shrink: 0; border-right: 1px solid var(--line); padding: 12px; overflow: auto; background: var(--lado); }
.ag-lado[hidden], .ag-det[hidden] { display: none; }
.ag-grade { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.ag-det { width: 300px; flex-shrink: 0; border-left: 1px solid var(--line); overflow: auto; background: var(--lado); }
.ag-mini-topo { display: flex; align-items: center; gap: 2px; margin-bottom: 6px; }
.ag-mini-topo strong { font-size: 12px; }
.ag-mini-topo .ico-bt { width: 22px; height: 22px; }
.ag-mini-g { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.ag-mini-g > span { font-size: 9px; color: var(--muted); font-weight: 600; padding: 4px 0; }
.ag-mini-d { background: none; color: var(--ink); height: 26px; padding: 0; font-size: 11px; border-radius: 50%; font-weight: 400; }
.ag-mini-d:hover { background: var(--hover); }
.ag-mini-d.fora { color: var(--muted); }
.ag-mini-d.na-faixa { background: var(--accent-soft); border-radius: 6px; color: var(--accent); }
.ag-mini-d.sel { box-shadow: inset 0 0 0 1px var(--accent); }
.ag-mini-d.hoje { background: var(--accent); color: #fff; border-radius: 50%; font-weight: 600; }
.ag-lado-sec { font-size: 10px; font-weight: 600; letter-spacing: 0.06em; color: var(--muted); margin: 18px 0 6px; }
.ag-lado-p { margin: 4px 0; font-size: 11px; }
.ag-camada { display: flex; align-items: center; gap: 8px; padding: 4px 0; cursor: pointer; font-size: 12px; }
.ag-camada input { appearance: none; width: 15px; height: 15px; border-radius: 4px; border: 2px solid var(--cor); margin: 0; cursor: pointer; display: grid; place-items: center; }
.ag-camada input:checked { background: var(--cor); }
.ag-camada input:checked::after { content: "✓"; color: #fff; font-size: 10px; line-height: 1; }
.ag-eq-busca { position: relative; }
.ag-eq-busca .qd-busca { width: 100%; }
.ag-res { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 4px); background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 24px rgba(30, 27, 75, 0.12); max-height: 260px; overflow: auto; padding: 4px; }
.ag-res .pop-item { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: none; color: var(--ink); padding: 6px; height: auto; font-weight: 400; }
.ag-res .pop-item:hover { background: var(--hover); }
.ag-res .pop-item span:last-child { display: flex; flex-direction: column; min-width: 0; }
.ag-res p { margin: 6px; }
.avatar.mini { width: 22px; height: 22px; min-width: 22px; font-size: 9px; border-radius: 50%; color: #fff; display: inline-grid; place-items: center; font-weight: 600; }
.ag-eq { display: flex; align-items: center; gap: 6px; padding: 5px 0; font-size: 12px; }
.ag-eq-cor { width: 4px; height: 20px; border-radius: 2px; }
.ag-conectar { color: var(--accent); width: 100%; justify-content: flex-start; }
.ag-lado hr { border: 0; border-top: 1px solid var(--line); margin: 14px 0 8px; }
.ag-semana { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.ag-cab { display: grid; grid-template-columns: 56px repeat(var(--n), 1fr); border-bottom: 1px solid var(--line); flex-shrink: 0; }
.ag-cab-d { background: none; color: var(--muted); display: flex; flex-direction: column; align-items: center; gap: 2px; height: auto; padding: 8px 0; border-left: 1px solid var(--line); border-radius: 0; font-weight: 500; }
.ag-cab-d span { font-size: 10px; letter-spacing: 0.05em; }
.ag-cab-d b { font-size: 17px; color: var(--ink); font-weight: 500; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; }
.ag-cab-d.hoje span { color: var(--accent); }
.ag-cab-d.hoje b { background: var(--accent); color: #fff; }
.ag-horas-corpo { flex: 1; overflow: auto; }
.ag-horas { display: grid; grid-template-columns: 56px repeat(var(--n), 1fr); height: calc(24 * 48px); position: relative; }
.ag-gutter { position: relative; }
.ag-horas .ag-gutter span { position: absolute; right: 8px; transform: translateY(-50%); font-size: 10px; color: var(--muted); }
.ag-col { position: relative; border-left: 1px solid var(--line); background-image: repeating-linear-gradient(to bottom, var(--line) 0, var(--line) 1px, transparent 1px, transparent 48px); cursor: cell; }
.ag-col.hoje { background-color: #fcfbff; }
.ag-agora { position: absolute; left: 0; right: 0; height: 2px; background: var(--ink); z-index: 3; pointer-events: none; }
.ag-agora::before { content: ""; position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--ink); }
.ag-ev { position: absolute; z-index: 2; border-radius: 6px; padding: 3px 6px; background: color-mix(in srgb, var(--cor) 14%, #fff); border-left: 3px solid var(--cor); color: var(--ink); font-size: 11px; overflow: hidden; cursor: pointer; display: flex; flex-direction: column; line-height: 1.3; user-select: none; touch-action: none; }
.ag-ev strong { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ag-ev span { color: color-mix(in srgb, var(--cor) 70%, var(--ink)); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ag-ev.curto { flex-direction: row; align-items: center; gap: 4px; }
.ag-ev.equipe { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--cor) 10%, #fff) 0 6px, color-mix(in srgb, var(--cor) 18%, #fff) 6px 12px); }
.ag-ev.feito { opacity: 0.55; }
.ag-ev.feito strong { text-decoration: line-through; }
.ag-ev.erro { border-left-color: var(--lost); }
.ag-ev.sel { box-shadow: 0 0 0 2px var(--cor); z-index: 4; }
.ag-ev.arrastando { opacity: 0.8; z-index: 5; box-shadow: 0 6px 16px rgba(30, 27, 75, 0.2); cursor: grabbing; }
.ag-mes { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.ag-mes-cab { display: grid; grid-template-columns: repeat(7, 1fr); border-bottom: 1px solid var(--line); }
.ag-mes-cab span { text-align: center; font-size: 10px; color: var(--muted); font-weight: 600; letter-spacing: 0.05em; padding: 8px 0; }
.ag-mes-g { flex: 1; display: grid; grid-template-columns: repeat(7, 1fr); grid-template-rows: repeat(6, 1fr); min-height: 0; }
.ag-mes-d { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 4px; display: flex; flex-direction: column; gap: 2px; min-height: 0; overflow: hidden; cursor: cell; }
.ag-mes-d.fora { background: var(--lado); }
.ag-mes-d.fora .ag-mes-n { color: var(--muted); }
.ag-mes-d.hoje { background: var(--accent-soft); }
.ag-mes-n { background: none; color: var(--ink); align-self: flex-end; width: 24px; height: 24px; padding: 0; border-radius: 50%; font-size: 11px; font-weight: 500; }
.ag-mes-d.hoje .ag-mes-n { background: var(--accent); color: #fff; }
.ag-mes-ev { display: flex; align-items: center; gap: 4px; font-size: 10px; padding: 1px 4px; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.ag-mes-ev:hover, .ag-mes-ev.sel { background: color-mix(in srgb, var(--cor) 14%, #fff); }
.ag-mes-ev i, .ag-lista-ev i { width: 7px; height: 7px; border-radius: 50%; background: var(--cor); flex-shrink: 0; }
.ag-mais { background: none; color: var(--muted); font-size: 10px; height: auto; padding: 1px 4px; align-self: flex-start; font-weight: 500; }
.ag-lista { overflow: auto; padding: 12px 20px; }
.ag-lista-dia { display: flex; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.ag-lista-data { width: 70px; flex-shrink: 0; display: flex; flex-direction: column; }
.ag-lista-data b { font-size: 20px; font-weight: 500; }
.ag-lista-data span { font-size: 10px; color: var(--muted); letter-spacing: 0.05em; text-transform: uppercase; }
.ag-lista-dia.hoje .ag-lista-data b { color: var(--accent); }
.ag-lista-evs { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.ag-lista-ev { display: flex; align-items: center; gap: 10px; background: none; color: var(--ink); height: auto; padding: 8px; border-radius: 6px; text-align: left; font-weight: 400; }
.ag-lista-ev:hover, .ag-lista-ev.sel { background: var(--hover); }
.ag-lista-h { width: 96px; flex-shrink: 0; font-size: 11px; color: var(--muted); }
.ag-lista-ev strong { font-weight: 500; }
.ag-vazio { margin: auto; }
.ag-det-vazio { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px; }
.ag-det-ico { width: 44px; height: 44px; border-radius: 10px; background: var(--bg-2); display: grid; place-items: center; font-size: 20px; margin-bottom: 4px; }
.ag-det-in { padding: 16px; position: relative; }
.ag-det-x { position: absolute; right: 8px; top: 8px; }
.ag-det-tipo { display: inline-flex; gap: 4px; align-items: center; font-size: 11px; font-weight: 600; color: var(--cor); background: color-mix(in srgb, var(--cor) 12%, #fff); padding: 2px 8px; border-radius: 10px; }
.ag-det-in h3 { margin: 10px 0 4px; font-size: 16px; padding-right: 20px; }
.ag-det-in h3.riscado { text-decoration: line-through; color: var(--muted); }
.ag-det-quando { margin: 0 0 8px; color: var(--muted); font-size: 12px; }
.ag-det-sec { font-size: 10px; font-weight: 600; letter-spacing: 0.06em; color: var(--muted); margin: 16px 0 6px; }
.ag-det-in p { margin: 2px 0; }
.ag-det-txt, .ag-det-msg { white-space: pre-wrap; }
.ag-det-msg { background: var(--bubble-out); padding: 10px; border-radius: 8px; }
.ag-det-vinc { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); text-decoration: none; }
.ag-det-vinc:hover { border-color: var(--accent); }
.ag-det-vinc span:last-child { display: flex; flex-direction: column; }
.ag-det-acoes { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 20px; }
.ag-det-acoes .vermelho { color: var(--lost); }
.ag-st { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 10px; background: var(--pill); color: var(--accent); }
.ag-st.ok { background: var(--ok-soft); color: var(--ok); }
.ag-st.er { background: var(--lost-soft); color: var(--lost); }
.ag-modal { width: min(480px, 100%); }
.ag-form { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.ag-form hr { border: 0; border-top: 1px solid var(--line); margin: 2px 0; width: 100%; }
.ag-titulo-in { height: 36px; }
.ag-hora { display: flex; align-items: center; gap: 6px; }
.ag-hora input[type=date] { width: 150px; }
.ag-hora input[type=time] { width: 100px; }
.ag-vinc-bt { width: 100%; justify-content: center; border: 1px solid var(--line); height: 36px; }
.ag-linha { display: flex; align-items: center; gap: 6px; position: relative; }
.ag-linha > input, .ag-linha > .qd-busca { flex: 1; }
.ag-busca input { width: 100%; }
.ag-form .ag-res { position: static; box-shadow: none; }
.ag-vinc-sel { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; }
.ag-vinc-ico { font-size: 16px; }
.ag-opcao { justify-content: flex-start; color: var(--ink); font-weight: 400; padding-left: 4px; }
.ag-sec { display: flex; align-items: center; gap: 6px; font-weight: 500; }
.ag-sec-ico { width: 20px; display: inline-grid; place-items: center; color: var(--muted); }
.ag-ocupar { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 4px 0; }
.ag-ocupar > span:nth-child(2) { display: flex; flex-direction: column; }
.ag-ocupar strong { font-weight: 500; }
.ag-ct-toggle.mini button, .ct-toggle.mini button { height: 24px; font-size: 11px; }
.ag-rapidos { display: flex; gap: 6px; flex-wrap: wrap; }
.ag-passos { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.ag-msg-lista { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.ag-msg-lista:empty { display: none; }
.ag-msg { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 8px; background: var(--accent-soft); font-size: 12px; }
.ag-msg.erro { background: var(--lost-soft); }
.ag-msg-ico { font-size: 14px; }
.ag-msg-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 520px; }
.ag-msg .cresce { min-width: 0; }
#envio-agendar { height: 40px; width: 40px; font-size: 18px; }