/* =========================================================================
   FLASH TOAST — para /conversas (não consome espaço vertical do layout)
   Aparece no canto superior direito por 4 segundos, dismissível.
   ========================================================================= */

.flash-toast-container {
  position: fixed;
  top: 70px;        /* abaixo da topbar (56px) */
  right: 18px;
  z-index: 1080;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
  /* não bloqueia cliques na área de baixo */
}

.flash-toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--bg-elev-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  max-width: 360px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .4);
  animation: flash-slide-in .25s cubic-bezier(.16, 1, .3, 1),
             flash-fade-out .3s ease-in 4s forwards;
}

@keyframes flash-slide-in {
  from { transform: translateX(20px); opacity: 0; }
  to   { transform: translateX(0); opacity: 1; }
}
@keyframes flash-fade-out {
  to { opacity: 0; transform: translateX(20px); pointer-events: none; }
}

.flash-toast-warning { border-left: 3px solid var(--warning); }
.flash-toast-danger  { border-left: 3px solid var(--danger); }
.flash-toast-success { border-left: 3px solid var(--success); }
.flash-toast-info    { border-left: 3px solid var(--accent); }

.flash-toast-close {
  background: transparent;
  border: none;
  color: var(--text-mute);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
  padding: 0 2px;
  flex-shrink: 0;
}
.flash-toast-close:hover { color: var(--text); }

/* Mobile: full-width no topo */
@media (max-width: 640px) {
  .flash-toast-container {
    top: 60px;
    left: 12px;
    right: 12px;
  }
  .flash-toast { max-width: none; }
}

/* =========================================================================
   TOAST STACK — usado pelo schedule-task.js (agendar tarefa AJAX)
   ========================================================================= */
.toast-stack {
  position: fixed;
  top: 70px;
  right: 18px;
  z-index: 1085;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}
.toast-msg {
  pointer-events: auto;
  background: var(--bg-elev-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  max-width: 360px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .4);
  opacity: 0;
  transform: translateX(20px);
  transition: opacity .25s ease, transform .25s ease;
}
.toast-msg.show {
  opacity: 1;
  transform: translateX(0);
}
.toast-msg.success { border-left: 3px solid var(--success); }
.toast-msg.danger  { border-left: 3px solid var(--danger); }
.toast-msg.info    { border-left: 3px solid var(--accent); }

/* =========================================================================
   NOTAS NO CONTATO — bloco de texto multilinha no painel lateral.
   As notas internas agora vivem em Lead.notes (não como mensagens), exibidas
   aqui de forma compacta e com quebra de linha preservada.
   ========================================================================= */
.notes-display {
  white-space: pre-wrap;
  word-break: break-word;
  background: rgba(255, 181, 71, .08);
  border-left: 2px solid rgba(255, 181, 71, .45);
  padding: 8px 10px;
  border-radius: 4px;
  color: var(--text-soft);
  max-height: 180px;
  overflow-y: auto;
}