/* Atendimento da Central 1.168: cartão limpo (nome, contato e origem), efeitos suaves e mensagens enviadas pelo celular (camada final). */
.sales-chat-workspace{--c168-brand:var(--chat-brand,var(--central-accent,#137e5a));--c168-soft:color-mix(in srgb,var(--c168-brand) 10%,var(--panel,#fff));--c168-ring:color-mix(in srgb,var(--c168-brand) 34%,transparent);--c168-card:var(--panel,#fff);--c168-line:color-mix(in srgb,var(--line,#dfe7e3) 85%,transparent);--c168-shadow:0 1px 2px rgba(15,35,28,.05),0 6px 18px -10px rgba(15,35,28,.18);--c168-shadow-hover:0 2px 4px rgba(15,35,28,.06),0 14px 28px -14px rgba(15,35,28,.32)}
html[data-theme=dark] .sales-chat-workspace{--c168-soft:color-mix(in srgb,var(--c168-brand) 20%,var(--panel,#15232c));--c168-card:color-mix(in srgb,var(--panel,#15232c) 92%,#fff);--c168-shadow:0 1px 2px rgba(0,0,0,.3);--c168-shadow-hover:0 10px 24px -12px rgba(0,0,0,.65)}

/* Lista */
.sales-chat-workspace .sales-chat-list{padding:8px 8px 12px;gap:6px}
.sales-chat-workspace .sales-chat-list>button.chat-card{position:relative;display:flex;align-items:center;gap:11px;width:100%;min-width:0;min-height:72px;margin:0;padding:9px 12px 9px 10px;border:1px solid var(--c168-line);border-radius:14px;background:var(--c168-card);box-shadow:var(--c168-shadow);text-align:left;overflow:hidden;isolation:isolate;cursor:pointer;color:var(--ink);transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease,border-color .18s ease,background-color .18s ease}
.sales-chat-workspace .sales-chat-list>button.chat-card::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--c168-brand);transform:scaleY(0);transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.sales-chat-workspace .sales-chat-list>button.chat-card::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 140% at 0% 0%,color-mix(in srgb,var(--c168-brand) 12%,transparent),transparent 60%);opacity:0;transition:opacity .2s ease}
.sales-chat-workspace .sales-chat-list>button.chat-card:hover{transform:translateY(-1px);box-shadow:var(--c168-shadow-hover);border-color:var(--c168-ring);background:var(--c168-card)}
.sales-chat-workspace .sales-chat-list>button.chat-card:hover::after{opacity:1}
.sales-chat-workspace .sales-chat-list>button.chat-card:active{transform:scale(.99)}
.sales-chat-workspace .sales-chat-list>button.chat-card:focus-visible{outline:2px solid var(--c168-brand);outline-offset:2px}
.sales-chat-workspace .sales-chat-list>button.chat-card[aria-current=true]{background:var(--c168-soft)!important;border-color:var(--c168-ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--c168-brand) 12%,transparent),var(--c168-shadow)}
.sales-chat-workspace .sales-chat-list>button.chat-card:is([aria-current=true],.has-unread)::before{transform:scaleY(1)}
.sales-chat-workspace .sales-chat-list>button.chat-card.is-closed{opacity:.7}
.sales-chat-workspace .sales-chat-list>button.chat-card .chat-list-avatar{position:relative;flex:0 0 42px;width:42px;height:42px;border-radius:50%;font-size:13px;font-weight:700;color:var(--c168-brand);background:var(--c168-soft);transition:transform .2s ease}
.sales-chat-workspace .sales-chat-list>button.chat-card[aria-current=true] .chat-list-avatar{background:var(--c168-soft);color:var(--c168-brand)}
.sales-chat-workspace .sales-chat-list>button.chat-card:hover .chat-list-avatar{transform:scale(1.04)}
.sales-chat-workspace .chat-card-dot{position:absolute;right:-2px;bottom:-2px;z-index:2;width:13px;height:13px;border-radius:50%;border:2px solid var(--c168-card);background:var(--o,var(--c168-brand))}
.sales-chat-workspace .chat-card-dot.whatsapp,.sales-chat-workspace .chat-card-origin.whatsapp{--o:#1f9d55}
.sales-chat-workspace .chat-card-dot.telegram,.sales-chat-workspace .chat-card-origin.telegram{--o:#229ed9}
.sales-chat-workspace .chat-card-dot.site,.sales-chat-workspace .chat-card-origin.site{--o:var(--c168-brand)}
.sales-chat-workspace .sales-chat-list>button.chat-card .chat-list-copy{display:grid;gap:3px;min-width:0;flex:1 1 auto;}
.sales-chat-workspace .sales-chat-list>button.chat-card .chat-list-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0}
.sales-chat-workspace .sales-chat-list>button.chat-card .chat-list-top b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:650;line-height:1.25;letter-spacing:-.01em;color:var(--ink)}
.sales-chat-workspace .sales-chat-list>button.chat-card.has-unread .chat-list-top b{font-weight:800}
.sales-chat-workspace .sales-chat-list>button.chat-card time{flex:none;font-size:11px;color:var(--chat-muted,var(--muted));font-variant-numeric:tabular-nums}
.sales-chat-workspace .sales-chat-list>button.chat-card.has-unread time{color:var(--c168-brand);font-weight:700}
.sales-chat-workspace .chat-card-row{display:flex;align-items:center;gap:6px;min-width:0}
.sales-chat-workspace .sales-chat-list small.chat-card-contact{display:block;min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;line-height:1.4;color:var(--chat-muted,var(--muted));font-variant-numeric:tabular-nums}
.sales-chat-workspace .sales-chat-list em.chat-card-origin{flex:none;display:inline-flex;align-items:center;gap:4px;padding:2px 8px 2px 6px;border-radius:999px;font-size:10.5px;font-style:normal;font-weight:700;line-height:1.5;color:color-mix(in srgb,var(--o) 82%,var(--ink,#18372d));background:color-mix(in srgb,var(--o) 12%,transparent);border:1px solid color-mix(in srgb,var(--o) 22%,transparent)}
.sales-chat-workspace .sales-chat-list em.chat-card-origin .dmk-chat-icon{width:12px;height:12px;color:var(--o)}
html[data-theme=dark] .sales-chat-workspace .sales-chat-list em.chat-card-origin{color:color-mix(in srgb,var(--o) 55%,#fff)}
.sales-chat-workspace .sales-chat-list em.chat-card-closed{flex:none;font-size:10.5px;font-style:normal;font-weight:600;color:var(--chat-muted,var(--muted))}
.sales-chat-workspace .sales-chat-list>button.chat-card .chat-unread-count{flex:none;margin-left:auto;display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font-size:11px;font-weight:800;line-height:1;color:#fff;background:linear-gradient(135deg,var(--c168-brand),color-mix(in srgb,var(--c168-brand) 70%,#000));box-shadow:0 4px 10px -4px var(--c168-brand);animation:c168-pop .35s cubic-bezier(.2,1.4,.4,1)}

/* Cabeçalho da lista: botão do celular ao lado de "Nova" */
.sales-chat-workspace .chat-heading-actions{display:flex;align-items:center;gap:6px;flex:none}
.sales-chat-workspace .chat-outside-toggle{position:relative;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--chat-muted,var(--muted));transition:background .18s,border-color .18s,color .18s}
.sales-chat-workspace .chat-outside-toggle .dmk-chat-icon{width:19px;height:19px}
.sales-chat-workspace .chat-outside-toggle>i{position:absolute;right:6px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--c168-brand);opacity:0;transform:scale(.3);transition:opacity .2s,transform .25s cubic-bezier(.2,1.4,.4,1)}
.sales-chat-workspace .chat-outside-toggle[aria-pressed=true]{color:var(--c168-brand);background:var(--c168-soft);border-color:var(--c168-brand)}
.sales-chat-workspace .chat-outside-toggle[aria-pressed=true]>i{opacity:1;transform:scale(1)}

/* Conversa: entrada suave da última mensagem, balões leves e marca do envio pelo celular */
.sales-chat-workspace .sales-chat-log .sales-chat-bubble{border-radius:16px;box-shadow:0 1px 2px rgba(15,35,28,.06),0 8px 20px -16px rgba(15,35,28,.35);transition:box-shadow .18s ease}
.sales-chat-workspace .sales-chat-log .sales-chat-bubble:hover{box-shadow:0 2px 4px rgba(15,35,28,.08),0 12px 26px -16px rgba(15,35,28,.45)}
.sales-chat-workspace .sales-chat-log .sales-chat-bubble.visitor{border-bottom-left-radius:6px}
.sales-chat-workspace .sales-chat-log .sales-chat-bubble.staff{border-bottom-right-radius:6px}
.sales-chat-workspace .sales-chat-log .sales-chat-bubble:last-of-type{animation:c168-in .28s cubic-bezier(.2,.8,.2,1)}
.sales-chat-workspace .sales-chat-bubble.outside{border:1px dashed color-mix(in srgb,var(--c168-brand) 45%,transparent)}
.sales-chat-workspace .sales-chat-bubble.outside>b{display:inline-flex;align-items:center;gap:5px;color:var(--c168-brand)}
.sales-chat-workspace .sales-chat-bubble.outside>b .dmk-chat-icon{width:13px;height:13px}

@keyframes c168-in{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes c168-pop{from{transform:scale(.4)}to{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.sales-chat-workspace :is(.chat-card,.chat-card *,.sales-chat-bubble,.chat-outside-toggle>i){animation:none!important;transition:none!important}}
html[data-theme=dark] .sales-chat-workspace .sales-chat-list>button.chat-card .chat-list-avatar{color:color-mix(in srgb,var(--c168-brand) 40%,#fff)}
html[data-theme=dark] .sales-chat-workspace .sales-chat-bubble.outside{border-color:color-mix(in srgb,var(--c168-brand) 70%,transparent)}
