/* Bolhas de chat — componente novo, não existe no design system consolidado.
   Construído com os tokens .ds-* existentes (cor, raio, sombra). */

.ds-chat-shell{display:flex;flex:1;min-height:0;background:var(--ds-white);border-radius:var(--ds-radius-2xl);box-shadow:var(--ds-shadow-md);overflow:hidden;}

.ds-chat-contacts{width:320px;flex-shrink:0;background:var(--ds-offwhite);display:flex;flex-direction:column;overflow-y:auto;}
.ds-chat-tabs{position:sticky;top:0;z-index:5;display:flex;gap:4px;padding:10px 12px;background:var(--ds-offwhite);box-shadow:0 1px 0 var(--ds-border);}
.ds-chat-tab{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font:600 12px var(--ds-font-body);color:var(--ds-slate);text-decoration:none;}
.ds-chat-tab:hover{background:var(--ds-platinum);}
.ds-chat-tab.is-active{background:var(--ds-royal);color:#fff;}
.ds-chat-tab.is-active .ds-chat-unread{background:rgba(255,255,255,.28);}
.ds-chat-contact{display:flex;align-items:center;gap:12px;padding:12px 16px;text-decoration:none;color:inherit;transition:background var(--ds-fast) var(--ds-ease);}
.ds-chat-contact:hover{background:var(--ds-platinum);}
.ds-chat-contact.is-active{background:var(--ds-white);}
.ds-chat-avatar{width:40px;height:40px;border-radius:999px;background:linear-gradient(135deg,var(--ds-royal),var(--ds-navy));color:#fff;display:grid;place-items:center;font:700 15px var(--ds-font-display);flex-shrink:0;}
.ds-chat-contact-body{flex:1;min-width:0;}
.ds-chat-contact-name{font:600 14px var(--ds-font-body);color:var(--ds-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ds-chat-contact-snippet{font:var(--ds-type-body-sm);color:var(--ds-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ds-chat-contact-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0;}
.ds-chat-contact-time{font:var(--ds-type-mono-sm);color:var(--ds-muted);}
.ds-chat-unread{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--ds-royal);color:#fff;font:700 10px var(--ds-font-body);display:grid;place-items:center;}

.ds-chat-thread-pane{flex:1;min-width:0;display:flex;flex-direction:column;}
.ds-chat-thread-head{padding:16px 24px;background:var(--ds-white);}
.ds-chat-thread-head .name{font:var(--ds-type-title);color:var(--ds-navy);}
.ds-chat-thread-head .phone{font:var(--ds-type-mono-sm);color:var(--ds-muted);}
.ds-chat-thread{flex:1;display:flex;flex-direction:column;gap:8px;padding:24px;overflow-y:auto;background:var(--ds-ivory);}
.ds-chat-bubble{max-width:65%;padding:10px 14px;border-radius:var(--ds-radius-lg);font:var(--ds-type-body-sm);}
.ds-chat-bubble--out{align-self:flex-end;background:linear-gradient(135deg,var(--ds-royal),var(--ds-navy));color:#fff;border-bottom-right-radius:4px;}
.ds-chat-bubble--in{align-self:flex-start;background:var(--ds-white);color:var(--ds-ink);box-shadow:var(--ds-shadow-sm);border-bottom-left-radius:4px;}
.ds-chat-bubble-img{display:block;max-width:100%;border-radius:var(--ds-radius-md);margin-bottom:6px;}
.ds-chat-meta{font:var(--ds-type-mono-sm);opacity:.75;margin-top:4px;display:flex;gap:6px;align-items:center;}
.ds-chat-bubble--in .ds-chat-meta{color:var(--ds-muted);opacity:1;}

.ds-chat-composer{display:flex;gap:10px;padding:16px 24px;background:var(--ds-white);align-items:flex-end;}
.ds-chat-composer textarea{resize:none;}

.ds-chat-empty{flex:1;display:grid;place-items:center;color:var(--ds-muted);font:var(--ds-type-body-md);}
