/* chat-kit · roupa WhatsApp das mensagens internas do grupo (01/11/2026, fio chat-kit-whatsapp). FONTE CANÔNICA: plataforma/chat-kit/.
 * CVO 01/11: "se parecer o MÁXIMO possível ao WhatsApp". Paleta e medidas do WhatsApp Web (claro e escuro); tudo em --ck-*, escopo .ck.
 * Escuro: o adaptador liga .ck-escuro (opção escuro()). Nunca editar a cópia num consumidor. */
.ck{--ck-painel:#fff;--ck-cab:#F0F2F5;--ck-fundo:#EFEAE2;--ck-fio:#E9EDEF;--ck-tx:#111B21;--ck-tx2:#667781;--ck-hv:#F5F6F6;--ck-on:#F0F2F5;
  --ck-verde:#00A884;--ck-verde-bolinha:#25D366;--ck-eu:#D9FDD3;--ck-ele:#FFFFFF;--ck-azul:#53BDEB;--ck-dia:#FFFFFF;--ck-dia-tx:#54656F;
  --ck-caixa:#FFFFFF;--ck-sombra:0 1px .5px rgba(11,20,26,.13);--ck-desenho:.045;
  position:relative;display:grid;grid-template-columns:minmax(300px,30%) minmax(0,1fr);height:calc(100dvh - 140px);min-height:260px;
  border-radius:14px;overflow:hidden;background:var(--ck-painel);color:var(--ck-tx);box-shadow:0 1px 3px rgba(11,20,26,.08),0 0 0 1px var(--ck-fio);
  font-family:"Segoe UI","Helvetica Neue",Helvetica,"Lucida Grande",Arial,Ubuntu,Cantarell,"Fira Sans",sans-serif;font-size:15px;line-height:1.35;
  -webkit-font-smoothing:antialiased;text-align:left}
.ck.ck-escuro{--ck-painel:#111B21;--ck-cab:#202C33;--ck-fundo:#0B141A;--ck-fio:#222D34;--ck-tx:#E9EDEF;--ck-tx2:#8696A0;--ck-hv:#202C33;--ck-on:#2A3942;
  --ck-eu:#005C4B;--ck-ele:#202C33;--ck-dia:#182229;--ck-dia-tx:#8696A0;--ck-caixa:#2A3942;--ck-sombra:0 1px .5px rgba(11,20,26,.5);--ck-desenho:.03}
.ck *,.ck *::before,.ck *::after{box-sizing:border-box}
.ck svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ck button{font:inherit;color:inherit}
.ck-sem{display:block;height:auto!important;min-height:0;padding:28px}
.ck-vz{padding:28px 18px;color:var(--ck-tx2);font-size:.92rem;text-align:center;margin:0}
.ck-vz p{margin:0 0 12px}
.ck-err{color:#D9304E}
.ck-lk{border:0;background:none;text-decoration:underline;cursor:pointer;padding:0}

/* lista */
.ck-lista{position:relative;display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--ck-fio);background:var(--ck-painel)}
.ck-cab{display:flex;align-items:center;gap:10px;min-height:60px;padding:10px 12px 10px 16px;background:var(--ck-painel)}
.ck-cab h3{flex:1;margin:0;font-size:1.4rem;font-weight:700;letter-spacing:-.01em;font-family:inherit;color:var(--ck-tx)}
.ck-redondo{width:40px;height:40px;border-radius:50%;border:0;background:none;display:grid;place-items:center;cursor:pointer;color:var(--ck-tx2)}
.ck-redondo:hover{background:var(--ck-hv)}
.ck-aviso{margin:0 16px 6px;font-size:.8rem;color:var(--ck-tx2)}
.ck-busca{display:flex;align-items:center;gap:12px;margin:2px 12px 8px;padding:0 14px;height:38px;border-radius:10px;background:var(--ck-cab);color:var(--ck-tx2);cursor:text}
.ck-busca svg{width:18px;height:18px}
.ck-busca input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--ck-tx);font:inherit;font-size:.92rem;padding:0}
.ck-busca input::placeholder{color:var(--ck-tx2)}
.ck-itens{flex:1;overflow-y:auto;min-height:0;overscroll-behavior:contain}
.ck-it{display:flex;align-items:center;gap:14px;width:100%;padding:0 0 0 14px;border:0;background:none;text-align:left;cursor:pointer;min-height:72px}
.ck-it:hover{background:var(--ck-hv)}
.ck-it.on{background:var(--ck-on)}
.ck-it-tx{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;flex:1;align-self:stretch;padding:10px 14px 10px 0;border-bottom:1px solid var(--ck-fio)}
.ck-l1,.ck-l2{display:flex;align-items:center;gap:8px;min-width:0}
.ck-l1 b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;font-size:1.02rem;color:var(--ck-tx)}
.ck-l1 time{flex:none;font-size:.76rem;color:var(--ck-tx2)}
.ck-l2>span{display:flex;align-items:center;gap:3px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem;color:var(--ck-tx2)}
.ck-l2 em{flex:none;font-style:normal;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--ck-verde-bolinha);color:#fff;font-size:.74rem;font-weight:600;display:grid;place-items:center}
.ck-l3{font-size:.76rem;color:var(--ck-tx2);opacity:.85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-it.nl .ck-l1 time{color:var(--ck-verde-bolinha);font-weight:600}
.ck-it.nl .ck-l2>span{color:var(--ck-tx);font-weight:500}
.ck-it.obs .ck-av{opacity:.7}
.ck-g{display:block;padding:14px 16px 6px;font-size:.78rem;font-weight:500;color:var(--ck-verde);letter-spacing:.02em}

/* avatar: cor fixa por pessoa (como os nomes nos grupos do WhatsApp); não lida = anel verde (o "status" do WhatsApp, o story do Instagram) */
.ck-av{flex:none;width:49px;height:49px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:.95rem;font-weight:600;letter-spacing:.02em;background:#6B7C85}
.ck-c0{background:#25A18E}.ck-c1{background:#E2725B}.ck-c2{background:#5B7BD5}.ck-c3{background:#C9A227}.ck-c4{background:#A65FAE}.ck-c5{background:#2E9CCA}.ck-c6{background:#D2577F}.ck-c7{background:#6F9A3A}
.ck-anel{box-shadow:0 0 0 2px var(--ck-painel),0 0 0 4px var(--ck-verde-bolinha)}
.ck-av-eq{border-radius:14px}
.ck-cv-cab .ck-av{width:40px;height:40px;font-size:.82rem}
.ck-t0{color:#06CF9C}.ck-t1{color:#E26A4F}.ck-t2{color:#5B7BD5}.ck-t3{color:#B38A00}.ck-t4{color:#A65FAE}.ck-t5{color:#1F94C4}.ck-t6{color:#D2577F}.ck-t7{color:#5E8A2B}

/* conversa */
.ck-cv{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--ck-fundo)}
.ck-cv::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:var(--ck-desenho);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 30a10 10 0 1 0-6 9l-5 2 2-5'/%3E%3Cpath d='M70 18l12 6-12 6 2-6z'/%3E%3Ccircle cx='130' cy='28' r='7'/%3E%3Cpath d='M30 92c0-5 7-8 9-2 2-6 9-3 9 2 0 6-9 11-9 11s-9-5-9-11z'/%3E%3Cpath d='M92 82h22v16H92zM92 82l11 9 11-9'/%3E%3Cpath d='M140 96l4 8 9 1-7 6 2 9-8-5-8 5 2-9-7-6 9-1z'/%3E%3Cpath d='M18 140h16M26 132v16'/%3E%3Cpath d='M70 130a8 8 0 0 1 16 0v10H70z'/%3E%3Cpath d='M120 140q10-14 20 0'/%3E%3C/svg%3E");
  background-size:160px 160px}
.ck.ck-escuro .ck-cv::before{filter:invert(1)}
.ck-cv>*{position:relative}
.ck-cv-vz{margin:auto;max-width:420px;padding:24px;text-align:center;color:var(--ck-tx2)}
.ck-cv-vz h4{margin:14px 0 6px;font-size:1.6rem;font-weight:300;color:var(--ck-tx)}
.ck-cv-vz p{margin:0;font-size:.9rem}
.ck-ic-g{width:72px!important;height:72px!important;stroke-width:1.1!important;color:var(--ck-verde)}
.ck-cv-cab{display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 16px;background:var(--ck-cab);border-left:1px solid var(--ck-fio)}
.ck-cv-id{display:flex;flex-direction:column;min-width:0;flex:1}
.ck-cv-id b{font-weight:500;font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-cv-id small{color:var(--ck-tx2);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-voltar{display:none;border:0;background:none;padding:6px;margin-left:-8px;cursor:pointer;color:var(--ck-tx2)}
.ck-voltar.ck-sempre{display:block}
.ck-fluxo{flex:1;overflow-y:auto;min-height:0;overscroll-behavior:contain;padding:14px 7% 10px;display:flex;flex-direction:column;gap:2px}
.ck-dia{text-align:center;margin:10px 0 8px;position:sticky;top:4px;z-index:1}
.ck-dia span{display:inline-block;padding:5px 12px;border-radius:8px;background:var(--ck-dia);color:var(--ck-dia-tx);font-size:.78rem;box-shadow:var(--ck-sombra)}
.ck-dica{margin:auto;padding:10px 14px;border-radius:8px;background:#FFEECD;color:#54656F;font-size:.84rem;text-align:center;max-width:420px;box-shadow:var(--ck-sombra)}
.ck.ck-escuro .ck-dica{background:#182229;color:#FFD279}
.ck-dica p{margin:0}
.ck-b{display:flex;max-width:min(65%,560px);align-self:flex-start;animation:ckEntra .16s ease-out}
.ck-b.eu{align-self:flex-end}
.ck-b.ck-rabo{margin-top:8px}
.ck-b-c{position:relative;padding:6px 8px 8px 9px;border-radius:7.5px;background:var(--ck-ele);color:var(--ck-tx);font-size:.94rem;line-height:1.38;box-shadow:var(--ck-sombra);overflow-wrap:anywhere;min-width:64px}
.ck-b.eu .ck-b-c{background:var(--ck-eu)}
.ck-rabo .ck-b-c{border-top-left-radius:0}
.ck-rabo.eu .ck-b-c{border-top-left-radius:7.5px;border-top-right-radius:0}
.ck-rabo .ck-b-c::before{content:"";position:absolute;top:0;left:-8px;width:8px;height:13px;background:inherit;clip-path:polygon(0 0,100% 0,100% 100%)}
.ck-rabo.eu .ck-b-c::before{left:auto;right:-8px;clip-path:polygon(0 0,100% 0,0 100%)}
.ck-b-a{display:block;font-size:.82rem;font-weight:500;margin-bottom:2px}
.ck-b-a small{font-weight:400;color:var(--ck-tx2);font-size:.76rem}
.ck-b-t a{color:#027EB5}
.ck.ck-escuro .ck-b-t a{color:#53BDEB}
.ck-b-m{float:right;display:inline-flex;align-items:center;gap:3px;position:relative;top:7px;margin:0 0 0 10px;font-size:.7rem;color:var(--ck-tx2);white-space:nowrap;line-height:15px}
.ck.ck-escuro .ck-b.eu .ck-b-m{color:rgba(233,237,239,.6)}
.ck-tq{display:inline-flex;font-style:normal}
.ck-tq svg{width:17px;height:12px;stroke-width:1.5;color:var(--ck-tx2)}
.ck-tq.ck-lida svg{color:var(--ck-azul)}
.ck-l2 .ck-tq svg{width:16px;height:11px}
@keyframes ckEntra{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ck-b{animation:none}}

/* compositor: barra cinza, caixa branca em pílula, botão verde redondo de enviar */
.ck-comp{background:var(--ck-cab);padding:8px 14px 10px}
.ck-comp-l{display:flex;align-items:flex-end;gap:8px}
.ck-caixa{position:relative;flex:1;display:flex;align-items:flex-end;min-height:42px;padding:0 14px;border-radius:21px;background:var(--ck-caixa)}
.ck-caixa textarea{flex:1;border:0;outline:0;resize:none;background:none;color:var(--ck-tx);font:inherit;font-size:.95rem;line-height:1.4;padding:10px 0;max-height:140px}
.ck-caixa textarea::placeholder{color:var(--ck-tx2)}
.ck-cont{flex:none;align-self:center;margin-left:8px;font-size:.72rem;color:var(--ck-tx2)}
.ck-cont.ck-pouco{color:#D9304E;font-weight:600}
.ck-env{flex:none;width:42px;height:42px;border-radius:50%;border:0;background:var(--ck-verde);color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform .12s,filter .12s}
.ck-env:hover{filter:brightness(1.06)}.ck-env:active{transform:scale(.94)}
.ck-env svg{width:22px;height:22px;fill:currentColor;stroke:none;margin-left:2px}
.ck-comp.env .ck-env{opacity:.55;pointer-events:none}
.ck-ops{display:flex;flex-wrap:wrap;gap:14px;padding:0 6px 6px;font-size:.8rem;color:var(--ck-tx2)}
.ck-op{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.ck-op input{accent-color:var(--ck-verde);width:15px;height:15px;margin:0}
.ck-obs{background:var(--ck-cab);padding:14px 16px;color:var(--ck-tx2);font-size:.86rem;text-align:center}

/* botões e painel de nova conversa (desliza sobre a lista) */
.ck-bt{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:999px;border:0;background:var(--ck-verde);color:#fff!important;font-size:.88rem;font-weight:500;cursor:pointer}
.ck-bt svg{width:18px;height:18px}
.ck-bt-s{padding:7px 14px;font-size:.8rem;background:transparent;color:var(--ck-verde)!important;box-shadow:inset 0 0 0 1px var(--ck-verde)}
.ck-nova{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;background:var(--ck-painel);animation:ckDesliza .18s ease-out}
.ck-nova-cab{background:var(--ck-verde);color:#fff;min-height:64px}
.ck-nova-cab h3{color:#fff;font-size:1.1rem;font-weight:500}
.ck-nova-cab .ck-voltar{color:#fff}
.ck-nova .ck-busca{margin-top:10px}
@keyframes ckDesliza{from{transform:translateX(-24px);opacity:0}to{transform:none;opacity:1}}

/* ícone avulso (topo, menu, trilho de cada produto): ChatKit.icone('classe-do-produto') */
.ck-ic{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* celular: uma coluna, como o app do WhatsApp (lista OU conversa; seta para voltar) */
@media (max-width:980px){
  .ck{grid-template-columns:minmax(0,1fr);border-radius:12px}
  .ck.na-conversa .ck-lista{display:none}
  .ck:not(.na-conversa) .ck-cv{display:none}
  .ck-voltar{display:block}
  .ck-cv-cab{border-left:0}
  .ck-b{max-width:85%}
  .ck-fluxo{padding:10px 12px 8px}
  .ck-comp{padding:6px 8px 8px}
}

/* blindagem contra o estilo do hospedeiro (botões e campos globais do produto não vazam para dentro das mensagens) */
.ck .ck-voltar,.ck .ck-redondo,.ck .ck-it,.ck .ck-lk{background:none!important;box-shadow:none!important;border:0!important;min-height:0}
.ck .ck-it{min-height:72px}
.ck .ck-busca input,.ck .ck-caixa textarea{border:0!important;box-shadow:none!important;background:none!important;outline:0!important;height:auto;margin:0;border-radius:0}
.ck .ck-env{border:0!important;box-shadow:none!important}
