:root{--painel: #ffffff;--header: #f0f2f5;--borda: #e9edef;--texto: #111b21;--texto-suave: #667781;--verde: #00a884;--verde-claro: #25d366;--bolha-in: #ffffff;--bolha-out: #d9fdd3;--fundo-chat: #efeae2;--fundo-pagina: #d9dbd5;--sombra: 0 1px .5px rgba(11, 20, 26, .13)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Segoe UI,Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--texto);background:var(--fundo-pagina);font-size:15px}.app{display:flex;height:100%;max-width:1600px;margin:0 auto;background:var(--painel);box-shadow:0 6px 24px #0b141a2e}.sidebar{width:32%;min-width:340px;max-width:430px;display:flex;flex-direction:column;background:var(--painel);border-right:1px solid var(--borda)}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--header);min-height:60px;border-bottom:1px solid var(--borda)}.marca{display:flex;flex-direction:column;gap:2px}.marca-nome{font-weight:600;font-size:17px;letter-spacing:.2px}.status-conectado{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--texto-suave)}.ponto{width:8px;height:8px;border-radius:50%;background:var(--verde-claro)}.ponto.off{background:#e53935}.contador{min-width:30px;height:30px;padding:0 9px;border-radius:15px;background:var(--verde);color:#fff;font-size:14px;font-weight:600;display:grid;place-items:center}.busca{padding:8px 12px;background:var(--painel);border-bottom:1px solid var(--borda)}.busca input{width:100%;padding:9px 14px;border:none;border-radius:8px;background:var(--header);font-size:14px;outline:none}.busca input:focus{box-shadow:inset 0 0 0 1px #00a88466}.lista{flex:1;overflow-y:auto}.lista-vazia{padding:24px 16px;color:var(--texto-suave);font-size:14px;text-align:center}.item{width:100%;display:flex;align-items:center;gap:12px;padding:10px 14px;border:none;border-bottom:1px solid var(--borda);background:transparent;cursor:pointer;text-align:left;font:inherit;color:inherit}.item:hover{background:#f5f6f6}.item.ativo{background:var(--header)}.avatar{width:49px;height:49px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:600;font-size:19px;background:var(--verde)}.avatar.pequeno{width:40px;height:40px;font-size:16px}.item-conteudo{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.item-topo{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.nome{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hora{flex:0 0 auto;font-size:12px;color:var(--texto-suave)}.previa{display:flex;align-items:center;gap:4px;font-size:13.5px;color:var(--texto-suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.etiqueta{flex:0 0 auto;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;color:#fff;background:var(--verde-claro);border-radius:10px;padding:2px 7px}.check{color:#53bdeb;font-size:13px}.chat{flex:1;display:flex;flex-direction:column;min-width:0;position:relative;background-color:var(--fundo-chat);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='%23d3cbc2' fill-opacity='0.45'%3E%3Ccircle cx='12' cy='12' r='1.4'/%3E%3Ccircle cx='44' cy='28' r='1.4'/%3E%3Ccircle cx='24' cy='52' r='1.4'/%3E%3Ccircle cx='56' cy='58' r='1.4'/%3E%3C/g%3E%3C/svg%3E")}.chat-header{min-height:60px;display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--header);border-bottom:1px solid var(--borda);z-index:2}.chat-titulo{display:flex;flex-direction:column;gap:2px;min-width:0}.chat-titulo strong{font-size:16px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-sub{font-size:12.5px;color:var(--texto-suave)}.mensagens{flex:1;overflow-y:auto;padding:18px 7% 12px;display:flex;flex-direction:column;gap:4px}.linha{display:flex;justify-content:flex-start}.linha.out{justify-content:flex-end}.bolha{max-width:min(68%,640px);padding:6px 9px 7px;border-radius:8px;box-shadow:var(--sombra);font-size:14.2px;line-height:19.5px;display:flex;flex-direction:column;gap:3px;position:relative;word-wrap:break-word}.bolha.in{background:var(--bolha-in);border-top-left-radius:0}.bolha.out{background:var(--bolha-out);border-top-right-radius:0}.corpo{white-space:pre-wrap}.meta{align-self:flex-end;display:flex;align-items:center;gap:5px;font-size:11px;color:var(--texto-suave)}.falhou{color:#e53935;font-weight:600}.pendente{color:#f59e0b}.aviso{background:#fff4e5;border-top:1px solid #f5d7a8;color:#8a5a00;font-size:13px;padding:8px 16px}.composer{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--header);border-top:1px solid var(--borda)}.composer input{flex:1;border:none;border-radius:8px;padding:12px 16px;font-size:14.5px;outline:none;background:#fff}.botao{width:44px;height:44px;flex:0 0 auto;border:none;border-radius:50%;background:var(--verde);color:#fff;font-size:17px;cursor:pointer;display:grid;place-items:center}.botao:disabled{background:#b8c2c6;cursor:default}.vazio-painel{background:var(--header)}.vazio{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;color:var(--texto-suave);padding:40px}.vazio h2{margin:0;font-size:30px;font-weight:300;color:#41525d}.vazio p{margin:0;font-size:14px}.vazio .dica{margin-top:10px;font-size:13px;color:#8696a0}.login-tela{min-height:100%;display:grid;place-items:center;padding:24px;background:linear-gradient(140deg,#075e54,#128c7e 55%,#25d366)}.login-caixa{width:100%;max-width:380px;background:#fff;border-radius:14px;padding:30px 28px;box-shadow:0 18px 50px #00000047;display:flex;flex-direction:column;gap:15px}.login-marca{display:flex;align-items:center;gap:12px;margin-bottom:4px}.login-logo{width:48px;height:48px;border-radius:12px;background:var(--verde);color:#fff;display:grid;place-items:center;font-size:24px;font-weight:700}.login-marca h1{margin:0;font-size:22px}.login-marca p{margin:2px 0 0;font-size:12.5px;color:var(--texto-suave)}.campo{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--texto-suave)}.campo input{padding:12px 14px;border:1px solid var(--borda);border-radius:8px;font-size:14.5px;color:var(--texto);outline:none}.campo input:focus{border-color:var(--verde);box-shadow:0 0 0 3px #00a88426}.login-erro{background:#fdecea;color:#b3261e;font-size:13px;padding:10px 12px;border-radius:8px}.login-botao{padding:13px;border:none;border-radius:8px;background:var(--verde);color:#fff;font-size:15px;font-weight:600;cursor:pointer}.login-botao:disabled{background:#b8c2c6;cursor:default}.login-dica{margin:0;font-size:12px;color:#8696a0;text-align:center}.carregando{height:100%;display:grid;place-items:center;color:var(--texto-suave)}.usuario-barra{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#fff;border-bottom:1px solid var(--borda)}.usuario-info{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}.usuario-info strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.usuario-info small{font-size:11.5px;color:var(--texto-suave)}.presenca{border:1px solid var(--borda);border-radius:6px;padding:4px 6px;font-size:12px;background:#f7f8f8;color:var(--texto)}.sair{border:none;background:transparent;font-size:18px;cursor:pointer;color:var(--texto-suave);padding:2px 4px}.sair:hover{color:#e53935}.dono{width:20px;height:20px;flex:0 0 auto;border-radius:50%;background:#e9edef;color:#54656f;font-size:11px;display:grid;place-items:center;font-weight:600}.acoes{margin-left:auto;display:flex;align-items:center;gap:8px}.acao{border:1px solid var(--borda);background:#fff;color:#54656f;border-radius:8px;padding:7px 12px;font-size:13px;font-weight:500;cursor:pointer}.acao:hover{background:#f5f6f6}.acao:disabled{opacity:.55;cursor:default}.acao.principal{background:var(--verde);border-color:var(--verde);color:#fff}.acao.perigo{color:#b3261e;border-color:#f3c7c3}.acao.perigo:hover{background:#fdecea}.acao.largo{width:100%;margin-top:6px}.painel-acao{position:absolute;top:62px;right:16px;width:300px;max-height:70%;overflow-y:auto;background:#fff;border:1px solid var(--borda);border-radius:10px;box-shadow:0 12px 30px #0b141a2e;padding:10px;z-index:5;display:flex;flex-direction:column;gap:3px}.painel-acao.curto{width:280px}.painel-titulo{font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--texto-suave);padding:6px 6px 3px}.painel-titulo.segundo{margin-top:8px;border-top:1px solid var(--borda);padding-top:10px}.painel-item{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;border:none;background:transparent;padding:9px 8px;border-radius:8px;cursor:pointer;font:inherit;color:var(--texto);text-align:left}.painel-item:hover{background:#f5f6f6}.painel-item small{color:var(--texto-suave);font-size:12px}.painel-vazio{margin:0;padding:4px 8px;font-size:12.5px;color:var(--texto-suave)}.painel-motivo{margin-top:6px;padding:9px 10px;border:1px solid var(--borda);border-radius:8px;font-size:13px;outline:none}@media(max-width:760px){.app{flex-direction:column}.sidebar{width:100%;max-width:none;min-width:0;height:45%;border-right:none;border-bottom:1px solid var(--borda)}.mensagens{padding:12px}.bolha{max-width:85%}}