/* Esteira · contato humano no próprio cartão, sem nova camada de navegação. */
.est-client-contact {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  min-width: 0;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  cursor: default;
  text-align: left;
}
.est-client-contact .est-client-info { flex: 1 1 135px; min-width: 0; }
.est-client-contact .est-client-label {
  display: block; margin-bottom: 4px;
  color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.4;
}
.est-client-contact .est-client-name {
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--text); font-size: 12px; font-weight: 600; line-height: 1.6;
}
.est-client-contact .est-client-phone {
  display: block; color: var(--muted); font-size: 12px; font-weight: 400;
  line-height: 1.65; overflow-wrap: anywhere; font-variant-numeric: tabular-nums;
}
.est-client-contact .est-client-select {
  display: block; width: 100%; max-width: 100%; min-width: 0; min-height: 44px;
  margin: 0 0 3px; padding: 7px 24px 7px 8px;
  border: 1px solid var(--border); border-radius: 8px;
  background-color: var(--card); color: var(--text);
  font: inherit; font-size: 12px; font-weight: 500; text-overflow: ellipsis;
  cursor: pointer;
}
.est-client-contact .est-client-whatsapp {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  flex: 0 0 auto; min-width: 44px; min-height: 44px; max-width: 100%;
  padding: 9px 11px; border: 1px solid #a9d5c2; border-radius: 10px;
  background: #eef8f2; color: #146342; text-decoration: none;
  font-size: 12px; font-weight: 600; line-height: 1.3; cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.est-client-contact .est-client-whatsapp .ic { width: 16px; height: 16px; flex-shrink: 0; }
.est-client-contact .est-client-whatsapp .ic:last-child { width: 12px; height: 12px; }
.est-client-contact .est-client-whatsapp:hover { background: #dff2e6; border-color: #558e70; }
/* "o contato esta errado, quero que tenha opcao de mudar" (07/10/2026): a
   correcao fica ao lado do numero errado, nao em outra tela. Discreta de
   proposito -- a acao principal do bloco continua sendo falar com o cliente --
   e com 44px de alvo, como o WhatsApp e o seletor ao lado. */
.est-client-contact .est-client-fix {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  flex: 0 0 auto; min-width: 44px; min-height: 44px;
  padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px;
  background: var(--card); color: var(--muted);
  font: inherit; font-size: 12px; font-weight: 600; line-height: 1.3; cursor: pointer;
  transition: border-color .15s ease, color .15s ease;
}
.est-client-contact .est-client-fix .ic { width: 15px; height: 15px; flex-shrink: 0; }
.est-client-contact .est-client-fix:hover { border-color: var(--primary); color: var(--text-bright); }
@media (prefers-reduced-motion: reduce) { .est-client-contact .est-client-fix { transition: none; } }
.est-client-contact :is(a,button,select):focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.est-client-contact .est-client-empty { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.est-client-contact .est-client-empty .ic { width: 15px; height: 15px; flex-shrink: 0; }
.est-client-contact .est-client-retry { min-height: 44px; padding: 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--card); color: var(--primary); cursor: pointer; }
.est-client-contact.expanded { margin: 0 0 20px; padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--card); }
.est-client-contact.expanded .est-client-info { flex-basis: 220px; }
.est-client-contact.expanded .est-client-name,
.est-client-contact.expanded .est-client-select { font-size: 14px; }
body.dark .est-client-contact .est-client-whatsapp { background: #153a2c; border-color: #386a54; color: #aff0c9; }
body.dark .est-client-contact .est-client-whatsapp:hover { background: #1e4d3b; border-color: #71b78d; }
@media (prefers-reduced-motion: reduce) { .est-client-contact .est-client-whatsapp { transition: none; } }
