/* ============================================================
   chat-v2.css — Chat WhatsApp 3 colunas (Onda 5)
   Namespace .cf-chat-*
   ============================================================ */

.cf-chat-shell {
  display: grid;
  grid-template-columns: 320px 1fr 320px;
  height: calc(100vh - 56px);
  background: #f6f9fc;
}
.cf-chat-shell .cf-chat-info-pane.hidden { display: none; }
.cf-chat-shell:has(.cf-chat-info-pane.hidden) { grid-template-columns: 320px 1fr; }
@media (max-width: 1100px) {
  .cf-chat-shell { grid-template-columns: 280px 1fr; }
  .cf-chat-info-pane { display: none; }
}

/* COLUNA 1 — lista de conversas */
.cf-chat-conv-pane {
  background: #fff; border-right: 1px solid #ecf0f4;
  display: flex; flex-direction: column; min-height: 0; overflow: hidden;
}
.cf-chat-conv-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 16px; border-bottom: 1px solid #ecf0f4;
}
.cf-chat-conv-head h3 { font-size: 14px; font-weight: 600; margin: 0; color: #0f172a; }

.cf-chat-status-tabs {
  display: flex; gap: 0; padding: 0 8px; border-bottom: 1px solid #ecf0f4;
  overflow-x: auto;
}
.cf-chat-status-tab {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 9px 8px; border: none; background: transparent;
  cursor: pointer; font-size: 11px; font-weight: 500; color: #94a3b8;
  border-bottom: 2px solid transparent; font-family: inherit;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.cf-chat-status-tab:hover { color: #475569; }
.cf-chat-status-tab.on { color: #1e5baa; border-bottom-color: #1e5baa; }

.cf-chat-filter-bar {
  padding: 10px 12px 0; border-bottom: 1px solid #ecf0f4;
}
.cf-chat-search {
  position: relative;
  padding: 10px 12px; border-bottom: 1px solid #ecf0f4;
}
.cf-chat-search > i { position: absolute; left: 22px; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; }
.cf-chat-search input {
  width: 100%; padding: 7px 10px 7px 32px;
  border: 1px solid #e2e8f0; border-radius: 6px;
  font-size: 12.5px; background: #fafbfc; font-family: inherit;
}
.cf-chat-search input:focus { outline: none; border-color: #1e5baa; background: #fff; }

.cf-chat-conv-list {
  flex: 1; overflow-y: auto; padding: 4px 6px;
}
.cf-chat-empty-list {
  padding: 32px 16px; text-align: center; color: #94a3b8;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
}

.cf-chat-conv-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px; border: none; border-radius: 7px;
  background: transparent; cursor: pointer; width: 100%;
  text-align: left; font-family: inherit;
  transition: background .15s;
}
.cf-chat-conv-row:hover { background: #f8fafc; }
.cf-chat-conv-row.on { background: #f0f6ff; }
.cf-chat-conv-row.unread { background: #fefce8; }
.cf-chat-conv-row.unread.on { background: #fef9c3; }
.cf-chat-conv-row + .cf-chat-conv-row { margin-top: 2px; }

.cf-chat-conv-avatar {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 12px; font-weight: 600;
}
.cf-chat-conv-text { flex: 1; min-width: 0; }
.cf-chat-conv-row-top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.cf-chat-conv-row-top strong {
  font-size: 13px; font-weight: 600; color: #0f172a;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cf-chat-conv-row-top small { font-size: 10.5px; color: #94a3b8; flex-shrink: 0; }
.cf-chat-conv-row-bottom { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-top: 2px; }
.cf-chat-conv-preview {
  font-size: 11.5px; color: #64748b;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cf-chat-conv-row.unread .cf-chat-conv-preview { color: #0f172a; font-weight: 500; }
.cf-chat-unread-badge {
  background: #25d366; color: #fff;
  font-size: 9.5px; font-weight: 600;
  min-width: 16px; height: 16px; padding: 0 5px;
  border-radius: 8px; display: inline-flex; align-items: center; justify-content: center;
}

/* COLUNA 2 — thread + composer */
.cf-chat-thread-pane {
  display: flex; flex-direction: column;
  background:
    linear-gradient(180deg, #f0f4f8 0%, #ebf0f5 100%);
  min-height: 0; overflow: hidden;
}
.cf-chat-empty-state {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; color: #64748b; padding: 24px;
}
.cf-chat-empty-state h3 { margin: 0; font-size: 17px; font-weight: 600; color: #475569; }
.cf-chat-empty-state p { margin: 0; font-size: 12.5px; color: #94a3b8; }

.cf-chat-thread-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 11px 16px; background: #fff;
  border-bottom: 1px solid #ecf0f4; flex-shrink: 0;
}
.cf-chat-thread-head-left { display: flex; align-items: center; gap: 10px; }
.cf-chat-thread-head-left strong { display: block; font-size: 14px; color: #0f172a; }
.cf-chat-thread-head-left small { display: block; font-size: 11px; color: #94a3b8; margin-top: 1px; }
.cf-chat-thread-head-actions { display: flex; gap: 4px; }

.cf-chat-icon-btn {
  width: 30px; height: 30px; border: none; background: transparent;
  border-radius: 6px; cursor: pointer; color: #64748b;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
}
.cf-chat-icon-btn:hover { background: #f1f5f9; color: #0f172a; }

/* M11.1: barra fina de automação ativa entre header e mensagens */
.cf-chat-automation-bar {
  background: #fffbeb; border-bottom: 1px solid #fde68a;
  padding: 6px 16px; display: flex; align-items: center;
}
.cf-chat-automation-bar[hidden] { display: none; }
.cf-chat-automation-bar.is-paused { background: #f8fafc; border-bottom-color: #e2e8f0; }
.cf-chat-automation-pill {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: none; padding: 0; cursor: pointer;
  font: inherit; font-size: 11.5px; color: #92400e; font-weight: 500;
}
.cf-chat-automation-pill:hover { text-decoration: underline; }
.cf-chat-automation-bar.is-paused .cf-chat-automation-pill { color: #64748b; }

.cf-chat-msgs {
  flex: 1; overflow-y: auto; padding: 18px 22px;
  display: flex; flex-direction: column; gap: 6px;
  /* Sessão 134: tema verde WA real (cor #efeae2 + pattern sutil) */
  background-color: #efeae2;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><g fill='%23000' fill-opacity='0.025'><circle cx='15' cy='15' r='1.5'/><circle cx='50' cy='40' r='1'/><circle cx='80' cy='25' r='1.2'/><circle cx='30' cy='70' r='1'/><circle cx='70' cy='85' r='1.5'/><circle cx='90' cy='60' r='1'/></g></svg>");
}
.cf-chat-msg { display: flex; }
.cf-chat-msg-out { justify-content: flex-end; }
.cf-chat-msg-in { justify-content: flex-start; }
.cf-chat-msg-bubble {
  max-width: 70%;
  padding: 8px 12px 18px 12px;
  border-radius: 10px;
  font-size: 13px; line-height: 1.45; color: #0f172a;
  position: relative;
  word-wrap: break-word;
}
.cf-chat-msg-out .cf-chat-msg-bubble {
  background: #d9fdd3; border-bottom-right-radius: 4px;
}
.cf-chat-msg-in .cf-chat-msg-bubble {
  background: #fff; border-bottom-left-radius: 4px;
  box-shadow: 0 1px 1px rgba(0,0,0,0.06);
}
.cf-chat-msg-time {
  position: absolute; bottom: 4px; right: 8px;
  font-size: 10px; color: #6b7484;
  display: inline-flex; align-items: center; gap: 3px;
}
.cf-chat-msg-edited {
  font-style: italic; opacity: 0.85;
}

/* Botão de editar mensagem (Sessão 134, Bloco C) */
.cf-chat-msg-edit-btn {
  position: absolute;
  top: -8px; right: -8px;
  width: 22px; height: 22px;
  background: #fff; border: 1px solid #e2e8f0;
  border-radius: 50%;
  display: none;
  align-items: center; justify-content: center;
  color: #475569;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.1);
  transition: background 0.15s, color 0.15s;
}
.cf-chat-msg-edit-btn:hover { background: #1E5BAA; color: #fff; border-color: #1E5BAA; }
.cf-chat-msg:hover .cf-chat-msg-edit-btn { display: inline-flex; }

.cf-chat-note {
  align-self: center; max-width: 80%;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; background: #fef9e6; border: 1px solid #fde68a; border-radius: 7px;
  font-size: 12px; color: #92400e;
}
.cf-chat-note small { color: #b45309; opacity: 0.8; margin-left: auto; }

/* Composer */
.cf-chat-composer {
  background: #fff; border-top: 1px solid #ecf0f4;
  flex-shrink: 0;
}
.cf-chat-composer-tabs {
  display: flex; gap: 0; padding: 4px 8px 0 8px;
  border-bottom: 1px solid #f1f5f9;
}
.cf-chat-tab {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 10px; border: none; background: transparent;
  border-bottom: 2px solid transparent; cursor: pointer;
  font-size: 11.5px; font-weight: 500; color: #94a3b8;
  font-family: inherit;
}
.cf-chat-tab.on { color: #1e5baa; border-bottom-color: #1e5baa; }

.cf-chat-composer-input {
  display: flex; align-items: flex-end; gap: 4px;
  padding: 8px 10px;
}
.cf-chat-textarea {
  flex: 1; padding: 8px 10px; border: 1px solid #e2e8f0; border-radius: 7px;
  font-size: 13px; resize: none; min-height: 36px; max-height: 120px;
  font-family: inherit; line-height: 1.4;
}
.cf-chat-textarea:focus { outline: none; border-color: #1e5baa; }
.cf-chat-send-btn {
  width: 36px; height: 36px; border: none; border-radius: 50%;
  background: #1e5baa; color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s;
  flex-shrink: 0;
}
.cf-chat-send-btn:hover { background: #16498f; }

/* COLUNA 3 — info pane */
.cf-chat-info-pane {
  background: #fff; border-left: 1px solid #ecf0f4;
  display: flex; flex-direction: column; min-height: 0; overflow: hidden;
}
.cf-chat-info-head {
  padding: 14px 16px; border-bottom: 1px solid #ecf0f4;
}
.cf-chat-info-head h3 { font-size: 14px; font-weight: 600; margin: 0; color: #0f172a; }
.cf-chat-info-body {
  flex: 1; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 16px;
}
.cf-chat-info-section { display: flex; flex-direction: column; gap: 6px; }
.cf-chat-info-eyebrow {
  font-size: 10.5px; color: #94a3b8;
  text-transform: uppercase; letter-spacing: 0.4px; font-weight: 600;
}
.cf-chat-info-card {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; background: #f8fafc; border-radius: 7px;
}
.cf-chat-info-card strong { display: block; font-size: 13px; color: #0f172a; }
.cf-chat-info-card small { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #64748b; margin-top: 2px; }
.cf-chat-info-link {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; background: #f8fafc; border: 1px solid transparent; border-radius: 7px;
  cursor: pointer; text-align: left; width: 100%;
  font-family: inherit; transition: background .15s, border-color .15s;
}
.cf-chat-info-link:hover { background: #f0f6ff; border-color: #bfdbfe; }
.cf-chat-info-link strong { display: block; font-size: 12.5px; color: #0f172a; }
.cf-chat-info-link small { display: block; font-size: 11px; color: #64748b; margin-top: 1px; }
.cf-chat-info-empty { font-size: 11.5px; color: #94a3b8; font-style: italic; }
.cf-chat-info-warn {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 10px 12px; background: #fef3c7; border: 1px solid #fde68a; border-radius: 7px;
  color: #92400e;
}
.cf-chat-info-warn small { line-height: 1.5; }

/* ────────────────────────────────────────
   ALUNOS v2 (extras)
   ──────────────────────────────────────── */
.cf-alunos {
  /* Sessão 134: full-width sem max-width */
  padding: 22px 28px;
  display: flex; flex-direction: column; gap: 18px;
}
.cf-alunos-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap;
}
.cf-alunos-title { font-size: 22px; font-weight: 600; margin: 0; font-family: 'IBM Plex Sans', sans-serif; color: #0f172a; }
.cf-alunos-sub { font-size: 12.5px; color: #64748b; margin: 4px 0 0 0; }
.cf-alunos-filters {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  padding: 12px 14px; background: #fff; border: 1px solid #ecf0f4; border-radius: 9px;
}
.cf-alunos-list {
  background: #fff; border: 1px solid #ecf0f4; border-radius: 9px; overflow: hidden;
}
.cf-alunos-mat-badge {
  display: inline-block; padding: 2px 9px; border-radius: 9px;
  background: #dbeafe; color: #1e40af; font-size: 10.5px; font-weight: 600;
}

/* Sessão 134: Vendas Hotmart no painel info */
.cf-chat-info-eyebrow {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
}
.cf-chat-info-add {
  display: inline-flex; align-items: center; gap: 3px;
  background: transparent; border: 1px solid #e2e8f0;
  padding: 3px 8px; border-radius: 4px;
  font-size: 10.5px; font-weight: 500;
  color: #1E5BAA; cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.cf-chat-info-add:hover { background: #1E5BAA; color: #fff; border-color: #1E5BAA; }

.cf-chat-venda-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px;
  background: #f8fafc;
  border-radius: 7px;
  margin-bottom: 6px;
  position: relative;
}
.cf-chat-venda-card:last-child { margin-bottom: 0; }
.cf-chat-venda-top {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
}
.cf-chat-venda-top strong {
  font-size: 14px; font-weight: 600;
  color: #0f172a;
  font-family: 'IBM Plex Sans', sans-serif;
}
.cf-chat-venda-pill {
  font-size: 10px; font-weight: 600;
  padding: 2px 7px; border-radius: 9px;
}
.cf-chat-venda-card small {
  font-size: 11.5px; color: #475569;
  line-height: 1.4;
}
.cf-chat-venda-unlink {
  position: absolute; top: 8px; right: 8px;
  display: none;
  align-items: center; gap: 3px;
  background: #fff; border: 1px solid #fee2e2;
  padding: 3px 7px; border-radius: 4px;
  font-size: 10px; color: #dc2626; cursor: pointer;
}
.cf-chat-venda-card:hover .cf-chat-venda-unlink { display: inline-flex; }
.cf-chat-venda-unlink:hover { background: #fee2e2; }

/* Sessão 134 / Bloco C / Onda 3: Mensagens agendadas */
.cf-chat-sched-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px;
  background: #f0f9ff; /* azul claro */
  border-radius: 7px;
  margin-bottom: 6px;
  position: relative;
}
.cf-chat-sched-card.failed { background: #fef2f2; }
.cf-chat-sched-card:last-child { margin-bottom: 0; }
.cf-chat-sched-top {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
}
.cf-chat-sched-time {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11.5px; font-weight: 600;
  color: #1E5BAA;
}
.cf-chat-sched-card.failed .cf-chat-sched-time { color: #dc2626; }
.cf-chat-sched-card small {
  font-size: 11.5px; color: #475569;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cf-chat-sched-err { color: #991b1b !important; font-style: italic; }
.cf-chat-sched-cancel {
  background: transparent; border: 1px solid #e2e8f0;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 5px;
  color: #64748b; cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.cf-chat-sched-cancel:hover { background: #fee2e2; border-color: #fee2e2; color: #dc2626; }


/* ============================================================================
   Lote D 50-etapas: notas internas + etiquetas
   ============================================================================ */
.cf-chat-notas-list { display: flex; flex-direction: column; gap: 8px; }
.cf-chat-nota {
  background: #fef3c7;
  border-left: 3px solid #f59e0b;
  padding: 8px 10px;
  border-radius: 6px;
}
.cf-chat-nota-text { font-size: 12.5px; color: #422006; line-height: 1.4; white-space: pre-wrap; }
.cf-chat-nota-meta {
  display: flex; gap: 8px;
  font-size: 10px;
  color: #92400e;
  margin-top: 6px;
  align-items: center;
  font-family: 'IBM Plex Mono', monospace;
}
.cf-chat-nota-del {
  background: transparent; border: 0; padding: 2px;
  cursor: pointer;
  color: #92400e;
  margin-left: auto;
  display: flex;
}
.cf-chat-nota-del:hover { color: #dc2626; }

.cf-chat-tags-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.cf-chat-tag-chip {
  --c: #1E5BAA;
  background: transparent;
  border: 1px solid var(--c);
  color: var(--c);
  padding: 4px 10px;
  border-radius: 14px;
  font-size: 11.5px;
  cursor: pointer;
  font-family: inherit;
  transition: all 120ms;
}
.cf-chat-tag-chip:hover { background: color-mix(in srgb, var(--c) 8%, transparent); }
.cf-chat-tag-chip.is-on {
  background: var(--c);
  color: #fff;
  font-weight: 500;
}

/* ============================================================================
   B1 audit: Botao audio + state de gravacao
   ============================================================================ */
.cf-chat-audio-btn {
  color: #DC2626 !important;
}
.cf-chat-audio-btn:hover {
  background: rgba(220, 38, 38, .1);
  color: #991B1B !important;
}
.cf-chat-audio-state {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px;
  background: #FEF2F2;
  border-top: 1px solid #FCA5A5;
  font-size: 12.5px;
  color: #991B1B;
}
.cf-chat-audio-state[hidden] { display: none; }
.cf-chat-audio-state span { font-family: 'IBM Plex Mono', monospace; font-weight: 600; flex: 1; }
.cf-chat-audio-cancel, .cf-chat-audio-stop {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 12px; border-radius: 6px;
  font-size: 12px; font-family: inherit;
  border: 0; cursor: pointer;
}
.cf-chat-audio-cancel {
  background: transparent; color: #991B1B; border: 1px solid #FCA5A5;
}
.cf-chat-audio-cancel:hover { background: rgba(220,38,38,.08); }
.cf-chat-audio-stop {
  background: #1E5BAA; color: #fff;
}
.cf-chat-audio-stop:hover { background: #143C7E; }
@keyframes cf-chat-rec-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .3; }
}

/* B1 audit U8: tipografia ajustada (letras grandes pra espacos pequenos) */
.cf-chat-info-eyebrow {
  font-size: 10.5px !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #64748B;
  margin-bottom: 6px;
}
.cf-chat-info-card strong {
  font-size: 13px !important;
}
.cf-chat-info-card small {
  font-size: 11px !important;
}

/* ============================================================================
   F2: Botão IA + modal sugestões (público psicólogos)
   ============================================================================ */
.cf-chat-ai-btn {
  background: linear-gradient(135deg, #A855F7, #7C3AED) !important;
  color: #fff !important;
}
.cf-chat-ai-btn:hover {
  background: linear-gradient(135deg, #9333EA, #6D28D9) !important;
}

.cf-aisug-overlay {
  position: fixed; inset: 0;
  background: rgba(15,23,42,.55);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  z-index: 10001;
  animation: cf-aisug-fade 150ms;
}
@keyframes cf-aisug-fade { from { opacity: 0; } to { opacity: 1; } }

.cf-aisug-modal {
  background: #fff;
  border-radius: 14px;
  width: 95%; max-width: 640px;
  max-height: 90vh;
  display: flex; flex-direction: column;
  box-shadow: 0 24px 60px rgba(0,0,0,.25);
  font-family: 'Inter', sans-serif;
  animation: cf-aisug-pop 180ms cubic-bezier(.2,.9,.3,1.2);
}
@keyframes cf-aisug-pop {
  from { transform: scale(.96) translateY(10px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}

.cf-aisug-modal header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid #E2E8F0;
}
.cf-aisug-modal h3 {
  display: flex; align-items: center; gap: 8px;
  font-family: 'IBM Plex Serif', serif;
  font-weight: 400; font-size: 17px;
  margin: 0; color: #0F172A;
}
.cf-aisug-modal h3 i { color: #A855F7; width: 17px; height: 17px; }
.cf-aisug-x {
  background: transparent; border: 0; cursor: pointer;
  padding: 4px; color: #64748B;
  display: flex; align-items: center; justify-content: center;
}
.cf-aisug-x:hover { color: #DC2626; }
.cf-aisug-x i { width: 16px; height: 16px; }

.cf-aisug-sub {
  padding: 12px 18px;
  background: linear-gradient(135deg, #F3E8FF, #FAF5FF);
  border-bottom: 1px solid #E9D5FF;
  font-size: 12.5px;
  color: #475569;
  margin: 0;
  line-height: 1.5;
}

.cf-aisug-list {
  padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
  overflow-y: auto;
  flex: 1;
}

.cf-aisug-item {
  background: #fff;
  border: 1.5px solid #E2E8F0;
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  display: flex; flex-direction: column; gap: 4px;
  transition: all 120ms;
}
.cf-aisug-item:hover {
  border-color: #A855F7;
  background: #FAF5FF;
  transform: translateY(-1px);
}

.cf-aisug-tom {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: #A855F7;
}
.cf-aisug-text {
  font-size: 13.5px;
  line-height: 1.5;
  color: #0F172A;
  white-space: pre-wrap;
}
.cf-aisug-just {
  font-size: 11px;
  color: #94A3B8;
  font-style: italic;
  margin-top: 2px;
}

.cf-aisug-modal footer {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 18px;
  border-top: 1px solid #E2E8F0;
}
.cf-aisug-btn-ghost {
  background: transparent;
  border: 1px solid #E2E8F0;
  padding: 7px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  color: #64748B;
}
.cf-aisug-btn-ghost:hover { background: #F1F5F9; color: #0F172A; }

/* 2º fluxo IA: prioridade na lista de conversas + card de triagem */
.cf-chat-conv-row {
  position: relative;
}
.cf-chat-conv-prio {
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 3px;
  background: var(--prio, #3B82F6);
  border-radius: 0 3px 3px 0;
}

.cf-chat-triagem-card {
  background: linear-gradient(135deg, #F3E8FF, #FAF5FF);
  border-left: 3px solid #A855F7;
  border-radius: 8px;
  padding: 10px 12px !important;
}

/* Sessao 135: anexos via cfMediaPicker (imagens, audio, video, documentos) */
.cf-chat-msg-img-link { display: inline-block; max-width: 100%; }
.cf-chat-msg-img {
  max-width: 280px;
  max-height: 280px;
  border-radius: 8px;
  display: block;
  cursor: zoom-in;
}
.cf-chat-msg-audio,
.cf-chat-msg-video {
  max-width: 280px;
  border-radius: 8px;
  display: block;
}
.cf-chat-msg-doc {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  background: rgba(0,0,0,0.05);
  border-radius: 6px;
  text-decoration: none;
  color: inherit;
  font-size: 12.5px;
}
.cf-chat-msg-doc:hover { background: rgba(0,0,0,0.08); }
.cf-chat-msg-link {
  color: #1E5BAA;
  text-decoration: underline;
  word-break: break-all;
}
.cf-chat-msg-out .cf-chat-msg-link { color: #dbeafe; }
.cf-chat-msg-out .cf-chat-msg-doc { background: rgba(255,255,255,0.15); color: #fff; }
.cf-chat-msg-out .cf-chat-msg-doc:hover { background: rgba(255,255,255,0.25); }

/* M9.2: ações rápidas no painel info */
.cf-chat-quick-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.cf-chat-qa-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 5px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 500;
  color: #4a5670;
  cursor: pointer;
  transition: background .12s, color .12s, border-color .12s;
  font-family: inherit;
  line-height: 1;
}
.cf-chat-qa-btn:hover:not(:disabled) {
  background: #f1f5f9;
  color: #0f172a;
  border-color: #cbd5e1;
}
.cf-chat-qa-btn:disabled {
  opacity: .55; cursor: not-allowed;
  background: #f8fafc;
}
.cf-chat-qa-btn.cf-chat-qa-primary {
  background: #1E5BAA;
  color: #fff;
  border-color: #1E5BAA;
}
.cf-chat-qa-btn.cf-chat-qa-primary:hover:not(:disabled) {
  background: #154A8E;
  border-color: #154A8E;
  color: #fff;
}
.cf-chat-qa-btn i { flex-shrink: 0; }
.cf-chat-qa-btn.is-soft { color: #94a3b8; }

/* ============================================================================
   M12 — REFINAMENTO PROFUNDO
   Filtros popover + chips + hero contato + ficha aluno + ações por intenção +
   cards mini do CRM 360 + empty states orientativos.
   Estilo: Linear/Notion/Intercom — leve, sentence case, espaço respirável.
   ============================================================================ */

/* Toolbar (botão Filtrar + chips horizontais) */
.cf-chat-toolbar {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding: 8px 12px; border-bottom: 1px solid #ecf0f4;
  position: relative;
}
.cf-chat-filter-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 10px; background: #f1f5f9; border: 1px solid #e2e8f0;
  border-radius: 6px; cursor: pointer; font-family: inherit;
  font-size: 11.5px; font-weight: 500; color: #475569;
  transition: background .12s, border-color .12s, color .12s;
}
.cf-chat-filter-btn:hover { background: #e2e8f0; color: #0f172a; }
.cf-chat-filter-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; padding: 0 4px;
  background: #1E5BAA; color: #fff; border-radius: 8px;
  font-size: 10px; font-weight: 700;
}

.cf-chat-active-filters {
  display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
}
.cf-chat-chip {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 3px 4px 3px 8px; background: #eff6ff; color: #1e40af;
  border: 1px solid #bfdbfe; border-radius: 12px;
  font-size: 10.5px; font-weight: 500; line-height: 1;
}
.cf-chat-chip-x {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; border: none; background: transparent;
  color: #1e40af; cursor: pointer; border-radius: 50%;
  transition: background .12s;
}
.cf-chat-chip-x:hover { background: #bfdbfe; }
.cf-chat-chip-clear {
  background: transparent; border: none; color: #64748b;
  font-size: 10.5px; cursor: pointer; padding: 3px 6px; font-family: inherit;
  text-decoration: underline; text-decoration-color: #cbd5e1;
}
.cf-chat-chip-clear:hover { color: #0f172a; text-decoration-color: #94a3b8; }

/* Popover de filtros */
.cf-chat-filter-popover {
  position: absolute; top: 100%; left: 8px; right: 8px;
  z-index: 50; margin-top: 4px;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 10px;
  box-shadow: 0 10px 32px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .06);
  padding: 14px 16px;
  max-height: calc(100vh - 200px); overflow-y: auto;
}
.cf-chat-filter-popover[hidden] { display: none; }
.cf-chat-fp-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 12px;
}
.cf-chat-fp-head strong { font-size: 12.5px; color: #0f172a; font-weight: 600; }
.cf-chat-fp-clear {
  background: transparent; border: none; color: #1E5BAA;
  font-size: 11px; cursor: pointer; font-family: inherit; padding: 2px 4px;
}
.cf-chat-fp-clear:hover { text-decoration: underline; }
.cf-chat-fp-grid {
  display: flex; flex-direction: column; gap: 10px;
}
.cf-chat-fp-row {
  display: flex; flex-direction: column; gap: 4px;
}
.cf-chat-fp-row > span {
  font-size: 10.5px; color: #64748b; font-weight: 500;
}
.cf-chat-fp-row > select {
  padding: 7px 9px; border: 1px solid #e2e8f0; border-radius: 6px;
  font-size: 12px; color: #0f172a; background: #fff;
  font-family: inherit; cursor: pointer;
}
.cf-chat-fp-row > select:focus { outline: none; border-color: #1E5BAA; }
.cf-chat-fp-check {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #0f172a; cursor: pointer;
  padding: 4px 0;
}
.cf-chat-fp-check input { cursor: pointer; }

/* Empty list — orientativo (M12) */
.cf-chat-empty-list { gap: 6px; }
.cf-chat-empty-list strong { font-size: 13px; color: #475569; font-weight: 600; }
.cf-chat-empty-list small { font-size: 11.5px; color: #94a3b8; line-height: 1.5; max-width: 220px; }
.cf-chat-empty-action {
  margin-top: 6px; padding: 5px 12px; background: #1E5BAA; color: #fff;
  border: none; border-radius: 6px; font-family: inherit;
  font-size: 11.5px; font-weight: 500; cursor: pointer;
}
.cf-chat-empty-action:hover { background: #154A8E; }

/* Empty state da coluna 2 (welcome) */
.cf-chat-empty-state-welcome p { max-width: 320px; line-height: 1.55; text-align: center; }
.cf-chat-welcome-tips {
  list-style: none; margin: 12px 0 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
  font-size: 11.5px; color: #64748b;
}
.cf-chat-welcome-tips li {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; background: #fff; border: 1px solid #ecf0f4; border-radius: 6px;
}

/* Painel direito — visual mais leve */
.cf-chat-info-head h3 { font-size: 13px; font-weight: 600; }
.cf-chat-info-body { gap: 14px; padding: 14px; }

/* Hero da pessoa (avatar grande + nome + telefone clicável) */
.cf-chat-hero {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; gap: 6px; padding: 14px 12px;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
  border: 1px solid #ecf0f4; border-radius: 10px;
}
.cf-chat-hero-avatar {
  width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 18px; font-weight: 600;
  font-family: 'IBM Plex Sans', sans-serif;
}
.cf-chat-hero-name {
  font-size: 14px; color: #0f172a; font-weight: 600;
  margin-top: 4px; word-break: break-word;
}
.cf-chat-hero-phone {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11.5px; color: #1E5BAA; text-decoration: none;
  padding: 3px 8px; border-radius: 12px; background: #eff6ff;
  font-family: 'IBM Plex Mono', monospace;
}
.cf-chat-hero-phone:hover { background: #dbeafe; }
.cf-chat-hero-phone-empty {
  font-size: 11px; color: #94a3b8; font-style: italic;
}

/* Ficha do aluno (botão grande, claro) */
.cf-chat-aluno-card {
  display: flex; align-items: center; gap: 12px;
  padding: 12px; background: #f0f6ff; border: 1px solid #bfdbfe;
  border-radius: 10px; cursor: pointer; width: 100%;
  font-family: inherit; text-align: left;
  transition: background .15s, border-color .15s;
}
.cf-chat-aluno-card:hover { background: #dbeafe; border-color: #93c5fd; }
.cf-chat-aluno-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: 11px; font-weight: 600; flex-shrink: 0;
}
.cf-chat-aluno-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.cf-chat-aluno-info > small:first-child {
  font-size: 9.5px; color: #1e40af; text-transform: uppercase;
  letter-spacing: .04em; font-weight: 600;
}
.cf-chat-aluno-info strong {
  font-size: 13px; color: #0f172a; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cf-chat-aluno-email {
  font-size: 11px; color: #64748b;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cf-chat-aluno-cta {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; font-weight: 600; color: #1E5BAA;
  flex-shrink: 0;
}
.cf-chat-aluno-empty {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px; background: #f8fafc; border: 1px dashed #cbd5e1;
  border-radius: 8px; color: #64748b;
}
.cf-chat-aluno-empty > i { color: #94a3b8; margin-top: 2px; flex-shrink: 0; }
.cf-chat-aluno-empty strong { display: block; font-size: 12px; color: #475569; }
.cf-chat-aluno-empty small { display: block; font-size: 11px; color: #94a3b8; margin-top: 2px; line-height: 1.45; }

/* Card matrícula em potencial */
.cf-chat-deal-card {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; background: #fff; border: 1px solid #e2e8f0;
  border-radius: 8px; cursor: pointer; width: 100%;
  font-family: inherit; text-align: left;
  transition: background .15s, border-color .15s;
}
.cf-chat-deal-card:hover { background: #f8fafc; border-color: #cbd5e1; }
.cf-chat-deal-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.cf-chat-deal-info > small:first-child {
  font-size: 9.5px; color: #64748b; text-transform: uppercase;
  letter-spacing: .04em; font-weight: 600;
}
.cf-chat-deal-info strong {
  font-size: 12.5px; color: #0f172a; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cf-chat-deal-meta { font-size: 11px; color: #64748b; }
.cf-chat-deal-empty {
  padding: 10px 12px; background: #f8fafc; border: 1px dashed #e2e8f0;
  border-radius: 8px;
}
.cf-chat-deal-empty small { font-size: 11.5px; color: #94a3b8; line-height: 1.5; }

/* Grupos do painel info — eyebrow leve, espaço entre cards */
.cf-chat-info-group { display: flex; flex-direction: column; gap: 8px; }
.cf-chat-info-eyebrow {
  display: flex; align-items: center; gap: 5px;
  font-size: 10px; color: #94a3b8;
  text-transform: uppercase; letter-spacing: .04em; font-weight: 600;
}

/* Ações principais (full-width) e secundárias (grid 2 colunas) */
.cf-chat-actions-primary {
  display: flex; flex-direction: column; gap: 6px;
}
.cf-chat-actions-primary .cf-chat-qa-btn { width: 100%; padding: 10px 12px; font-size: 12px; }
.cf-chat-actions-secondary {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
}

/* Cards mini do CRM 360 / Histórico */
.cf-chat-mini-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; background: #fff;
  border: 1px solid #ecf0f4; border-radius: 8px;
}
.cf-chat-mini-card + .cf-chat-mini-card { margin-top: 6px; }
.cf-chat-mini-eye {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10px; color: #64748b;
  text-transform: uppercase; letter-spacing: .04em; font-weight: 600;
}
.cf-chat-mini-row { display: flex; align-items: baseline; gap: 8px; margin-top: 2px; }
.cf-chat-mini-big {
  font-size: 18px; font-weight: 700; font-family: 'IBM Plex Sans', sans-serif;
  color: #0f172a; line-height: 1;
}
.cf-chat-mini-sub { font-size: 11.5px; color: #64748b; }
.cf-chat-mini-foot { font-size: 10.5px; color: #94a3b8; margin-top: 4px; }
.cf-chat-mini-good { background: #f0fdf4; border-color: #bbf7d0; }
.cf-chat-mini-good .cf-chat-mini-eye { color: #15803d; }
.cf-chat-mini-good .cf-chat-mini-big { color: #065f46; }
.cf-chat-mini-warn { background: #fff7ed; border-color: #fed7aa; }
.cf-chat-mini-warn .cf-chat-mini-eye { color: #9a3412; }

.cf-chat-mini-tk {
  display: flex; align-items: flex-start; gap: 6px;
  padding: 6px 0;
}
.cf-chat-mini-tk + .cf-chat-mini-tk { border-top: 1px dashed #fed7aa; }
.cf-chat-mini-tk-dot {
  width: 6px; height: 6px; border-radius: 50%; margin-top: 5px; flex-shrink: 0;
  background: #94a3b8;
}
.cf-chat-mini-tk-aberto { background: #dc2626; }
.cf-chat-mini-tk-em_atendimento { background: #f59e0b; }
.cf-chat-mini-tk-aguardando_aluno { background: #3b82f6; }
.cf-chat-mini-tk-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.cf-chat-mini-tk-text strong {
  font-size: 11.5px; color: #0f172a; font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cf-chat-mini-tk-text small { font-size: 10.5px; color: #94a3b8; }

/* Linha de "Atendimento" (status + responsável) */
.cf-chat-atend-row {
  display: flex; flex-direction: column; gap: 3px;
}
.cf-chat-atend-row label {
  font-size: 10.5px; color: #94a3b8; font-weight: 500;
}

/* Triagem IA — pílula e textos limpos */
.cf-chat-prio-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 9px; border-radius: 12px;
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; align-self: flex-start;
}
.cf-chat-prio-urgente { background: #fee2e2; color: #991b1b; }
.cf-chat-prio-alta    { background: #fef3c7; color: #92400e; }
.cf-chat-prio-normal  { background: #dbeafe; color: #1e40af; }
.cf-chat-prio-baixa   { background: #f1f5f9; color: #475569; }
.cf-chat-triagem-text { font-size: 12px; color: #0f172a; line-height: 1.5; }
.cf-chat-triagem-setor { font-size: 11px; color: #1E5BAA; }

/* Pill automação — texto refinado (M12.F) */
.cf-chat-automation-pill {
  display: inline-flex; align-items: center; gap: 6px; width: 100%;
}
.cf-chat-automation-pill > span:first-of-type { flex: 1; text-align: left; }
.cf-chat-automation-go {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10.5px; font-weight: 600; color: #b45309;
  opacity: 0; transition: opacity .15s;
}
.cf-chat-automation-bar:hover .cf-chat-automation-go { opacity: 1; }
.cf-chat-automation-bar.is-paused .cf-chat-automation-go { color: #94a3b8; }

/* ============================================================================
   M13 — REFINAMENTO ESTRUTURAL (estilo Clint adaptado)
   Header coluna esquerda + painel filtros sanfonado + thread sub-info +
   painel direito em sanfonas + conversas relacionadas + nova conversa.
   ============================================================================ */

/* Header coluna esquerda — Nova conversa em destaque */
.cf-chat-conv-head-actions { display: flex; align-items: center; gap: 6px; }
.cf-chat-new-conv-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 10px; background: #1E5BAA; color: #fff;
  border: none; border-radius: 6px; cursor: pointer;
  font-family: inherit; font-size: 11.5px; font-weight: 500;
  transition: background .12s;
}
.cf-chat-new-conv-btn:hover { background: #154A8E; }

/* Painel de filtros sanfonado (slide-in da esquerda) */
.cf-chat-filter-overlay {
  position: fixed; inset: 0; background: rgba(15, 23, 42, 0.32);
  z-index: 80; backdrop-filter: blur(2px);
}
.cf-chat-filter-overlay[hidden] { display: none; }
.cf-chat-filter-panel {
  position: fixed; top: 56px; bottom: 0; left: 0; width: 320px;
  background: #fff; border-right: 1px solid #ecf0f4;
  box-shadow: 4px 0 20px rgba(15, 23, 42, .08);
  z-index: 81; display: flex; flex-direction: column;
  transform: translateX(-100%); transition: transform .18s ease-out;
  overflow: hidden;
}
.cf-chat-filter-panel[hidden] { display: none; }
.cf-chat-filter-panel.is-open { transform: translateX(0); }
.cf-chat-fpnl-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 12px; padding: 16px 16px 14px;
  border-bottom: 1px solid #ecf0f4;
}
.cf-chat-fpnl-head strong { display: block; font-size: 14px; color: #0f172a; font-weight: 600; }
.cf-chat-fpnl-head small { display: block; font-size: 11px; color: #94a3b8; margin-top: 2px; line-height: 1.4; }
.cf-chat-fpnl-x {
  width: 28px; height: 28px; border: none; background: transparent;
  border-radius: 6px; cursor: pointer; color: #64748b;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: background .12s;
}
.cf-chat-fpnl-x:hover { background: #f1f5f9; color: #0f172a; }

.cf-chat-fpnl-acc {
  border-bottom: 1px solid #f1f5f9;
}
.cf-chat-fpnl-acc > summary {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 16px; cursor: pointer;
  font-size: 12px; font-weight: 600; color: #0f172a;
  list-style: none; user-select: none;
  transition: background .12s;
}
.cf-chat-fpnl-acc > summary::-webkit-details-marker { display: none; }
.cf-chat-fpnl-acc > summary::after {
  content: ''; margin-left: auto;
  width: 8px; height: 8px;
  border-right: 1.5px solid #94a3b8;
  border-bottom: 1.5px solid #94a3b8;
  transform: rotate(-45deg); transition: transform .15s;
}
.cf-chat-fpnl-acc[open] > summary::after { transform: rotate(45deg); }
.cf-chat-fpnl-acc > summary:hover { background: #f8fafc; }
.cf-chat-fpnl-body {
  display: flex; flex-direction: column; gap: 10px;
  padding: 0 16px 14px;
}
.cf-chat-fpnl-hint {
  display: block; font-size: 10.5px; color: #94a3b8;
  line-height: 1.45; margin-top: 2px;
}
.cf-chat-fpnl-foot {
  display: flex; justify-content: space-between; gap: 8px;
  padding: 12px 16px; margin-top: auto;
  border-top: 1px solid #ecf0f4;
}
.cf-chat-fpnl-clear {
  background: transparent; border: none; color: #64748b;
  font-size: 11.5px; cursor: pointer; font-family: inherit;
  text-decoration: underline; text-decoration-color: #cbd5e1;
}
.cf-chat-fpnl-clear:hover { color: #0f172a; }
.cf-chat-fpnl-apply {
  padding: 7px 14px; background: #1E5BAA; color: #fff;
  border: none; border-radius: 6px; cursor: pointer;
  font-family: inherit; font-size: 11.5px; font-weight: 500;
}
.cf-chat-fpnl-apply:hover { background: #154A8E; }

/* Subtítulo informativo do header da thread */
.cf-chat-th-sub {
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
  font-size: 11px; color: #64748b; margin-top: 2px;
}
.cf-chat-th-sub strong { color: #0f172a; font-weight: 500; }
.cf-chat-th-status {
  display: inline-flex; align-items: center;
  padding: 1px 7px; border-radius: 8px; font-size: 10.5px; font-weight: 500;
}
.cf-chat-th-status-open { background: #dcfce7; color: #166534; }
.cf-chat-th-status-pending { background: #fef3c7; color: #92400e; }
.cf-chat-th-status-closed { background: #f1f5f9; color: #64748b; }

/* M18: subtítulo do header com canal/origem */
.cf-chat-th-canal {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 10.5px; color: #64748b; margin-top: 2px;
}
.cf-chat-th-canal[hidden] { display: none; }
.cf-chat-th-canal-pill {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 1px 8px; border-radius: 10px; font-weight: 600;
}
.cf-chat-th-canal-origem {
  font-size: 10.5px; color: #94a3b8;
}

/* M22.2: faixa de atalhos de pendência */
.cf-chat-pendencias {
  padding: 8px 12px;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
  border-bottom: 1px solid #fde68a;
}
.cf-chat-pendencias[hidden] { display: none; }
.cf-chat-pendencias-label {
  font-size: 10px; color: #92400e; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em;
  display: block; margin-bottom: 6px;
}
.cf-chat-pendencias-row {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.cf-chat-pendencia {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 8px; background: #fff;
  border: 1px solid var(--c, #fde68a); border-radius: 12px;
  font-family: inherit; font-size: 10.5px; font-weight: 500;
  color: var(--c, #92400e); cursor: pointer;
  transition: background .12s;
}
.cf-chat-pendencia:hover { background: #fffbeb; }
.cf-chat-pendencia.on {
  background: var(--c, #92400e); color: #fff;
}
.cf-chat-pendencia-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; padding: 0 5px;
  background: var(--c, #92400e); color: #fff; border-radius: 9px;
  font-size: 10px; font-weight: 700;
}
.cf-chat-pendencia.on .cf-chat-pendencia-count {
  background: #fff; color: var(--c, #92400e);
}

/* M23.2: barra de ações em massa pra sugestões pendentes */
.cf-chat-bulk-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px;
  background: #eff6ff; border-bottom: 1px solid #bfdbfe;
}
.cf-chat-bulk-all {
  display: flex; align-items: center; gap: 6px;
  flex: 1; cursor: pointer; font-size: 11.5px; color: #1e40af; font-weight: 600;
}
.cf-chat-bulk-actions {
  display: flex; gap: 4px;
}
.cf-chat-bulk-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 10px; background: #fff; border: 1px solid #bfdbfe;
  border-radius: 6px; cursor: pointer; font-family: inherit;
  font-size: 11px; font-weight: 500; color: #1e40af;
  transition: background .12s;
}
.cf-chat-bulk-btn:hover { background: #dbeafe; }
.cf-chat-bulk-btn-confirm {
  background: #1E5BAA; color: #fff; border-color: #1E5BAA;
}
.cf-chat-bulk-btn-confirm:hover { background: #154A8E; border-color: #154A8E; }
.cf-chat-bulk-btn-clear {
  padding: 5px 7px; color: #64748b; border-color: #cbd5e1;
}

.cf-chat-conv-check {
  margin-right: 2px; cursor: pointer; flex-shrink: 0;
}
.cf-chat-conv-row.is-selected {
  background: #dbeafe;
}
.cf-chat-conv-row.is-selected:hover {
  background: #bfdbfe;
}

/* Painel direito sanfonado — <details> */
.cf-chat-acc {
  border: 1px solid #ecf0f4; border-radius: 8px;
  background: #fff; overflow: hidden;
}
.cf-chat-acc[hidden] { display: none; }
.cf-chat-acc > summary {
  display: flex; align-items: center; gap: 7px;
  padding: 10px 12px; cursor: pointer;
  font-size: 11px; color: #475569; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em;
  list-style: none; user-select: none;
  transition: background .12s;
}
.cf-chat-acc > summary::-webkit-details-marker { display: none; }
.cf-chat-acc > summary::after {
  content: ''; margin-left: auto;
  width: 6px; height: 6px;
  border-right: 1.5px solid #cbd5e1;
  border-bottom: 1.5px solid #cbd5e1;
  transform: rotate(-45deg); transition: transform .15s;
}
.cf-chat-acc[open] > summary::after { transform: rotate(45deg); }
.cf-chat-acc > summary:hover { background: #f8fafc; }
.cf-chat-acc > summary > i { color: #64748b; }
.cf-chat-acc-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px;
  background: #f1f5f9; color: #475569; border-radius: 9px;
  font-size: 10px; font-weight: 700;
  margin-left: 4px;
}
.cf-chat-acc-body {
  padding: 10px 12px 12px; border-top: 1px solid #f1f5f9;
  display: flex; flex-direction: column; gap: 8px;
}

/* Conversas relacionadas */
.cf-chat-related-row {
  display: flex; flex-direction: column; gap: 2px;
  padding: 8px 10px; background: #f8fafc; border: 1px solid transparent;
  border-radius: 7px; cursor: pointer; width: 100%;
  font-family: inherit; text-align: left;
  transition: background .12s, border-color .12s;
}
.cf-chat-related-row:hover { background: #f0f6ff; border-color: #bfdbfe; }
.cf-chat-related-row + .cf-chat-related-row { margin-top: 4px; }
.cf-chat-related-top {
  display: flex; justify-content: space-between; align-items: center; gap: 6px;
}
.cf-chat-related-top strong {
  font-size: 12px; color: #0f172a; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cf-chat-related-top small { font-size: 10.5px; color: #94a3b8; flex-shrink: 0; }
.cf-chat-related-bottom {
  display: flex; justify-content: space-between; align-items: center; gap: 6px;
}
.cf-chat-related-bottom small {
  font-size: 10.5px; color: #64748b;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cf-chat-related-status {
  flex-shrink: 0; padding: 1px 7px; border-radius: 8px;
  font-size: 9.5px; font-weight: 500;
}
.cf-chat-related-status-open { background: #dcfce7; color: #166534; }
.cf-chat-related-status-pending { background: #fef3c7; color: #92400e; }
.cf-chat-related-status-closed { background: #f1f5f9; color: #64748b; }

/* Modal Nova conversa — hint sutil */
.cf-chat-newconv-hint {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 10px 12px; background: #f0f6ff; border: 1px solid #bfdbfe;
  border-radius: 7px; margin-top: 8px; color: #1e40af;
}
.cf-chat-newconv-hint small { font-size: 11.5px; line-height: 1.5; }
.cf-chat-newconv-hint strong { font-weight: 600; }

/* M13: cfChatExtras renderiza eyebrow duplicado. Dentro da sanfona, esconde
   o TEXTO (font-size: 0) mas preserva o botão "Nova" que fica no canto. */
.cf-chat-acc-body .cf-chat-info-section { gap: 6px; }
.cf-chat-acc-body .cf-chat-info-section > .cf-chat-info-eyebrow {
  font-size: 0; padding: 0; margin-top: -4px; min-height: 0;
}
.cf-chat-acc-body .cf-chat-info-section > .cf-chat-info-eyebrow > .cf-chat-info-add {
  font-size: 10.5px;
}
.cf-chat-acc-body .cf-chat-notas-list,
.cf-chat-acc-body .cf-chat-tags-list { margin-top: 0; }