/* Botão flutuante do WhatsApp (BRP_Whats). Cores vêm das variáveis --brpz-botao e --brpz-topo no próprio elemento. */
.brp-zap-caixa { position: fixed; bottom: 16px; z-index: 99980; display: flex; flex-direction: column; gap: 10px; max-width: calc(100vw - 32px); font-family: inherit; line-height: 1.4; }
.brp-zap-caixa *, .brp-zap-caixa *::before, .brp-zap-caixa *::after { box-sizing: border-box; }
.brp-zap-direita { right: 16px; align-items: flex-end; }
.brp-zap-esquerda { left: 16px; align-items: flex-start; }
.brp-zap { position: relative; display: inline-flex; align-items: center; gap: 8px; background: var(--brpz-botao, #25d366); color: #fff; font-weight: 700; text-decoration: none; padding: 12px 18px; border-radius: 999px; box-shadow: 0 4px 14px rgba(0, 0, 0, .25); border: 0; font-family: inherit; font-size: 15px; cursor: pointer; }
.brp-zap:hover { filter: brightness(.95); color: #fff; }
.brp-zap-logo { position: relative; display: inline-flex; }
.brp-zap-logo svg { width: 22px; height: 22px; }
.brp-zap-alerta { position: absolute; top: -9px; right: -11px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px; background: #e53935; color: #fff; font-size: 11px; font-weight: 800; line-height: 14px; text-align: center; border: 2px solid #fff; animation: brp-zap-pulso 1.8s ease-in-out 4; }
.brp-zap-chat { width: 320px; max-width: 100%; border-radius: 16px; overflow: hidden; background: #efeae2; box-shadow: 0 10px 30px rgba(0, 0, 0, .3); animation: brp-zap-entra .25s ease-out; }
.brp-zap-chat[hidden] { display: none; }
.brp-zap-chat-topo { display: flex; align-items: center; gap: 10px; background: var(--brpz-topo, #075e54); color: #fff; padding: 12px 14px; }
.brp-zap-chat-topo img, .brp-zap-chat-icone { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; flex: none; background: var(--brpz-botao, #25d366); display: flex; align-items: center; justify-content: center; }
.brp-zap-chat-icone svg { width: 24px; height: 24px; }
.brp-zap-chat-nome { display: flex; flex-direction: column; line-height: 1.25; flex: 1; min-width: 0; }
.brp-zap-chat-nome small { font-weight: 400; opacity: .85; font-size: 12px; }
/* o × de fechar (branco por padrão) e o botão de enviar (na cor do topo da conversa) resistem aos estilos de botão do tema */
.brp-zap-caixa .brp-zap-chat-fechar { border: 0; background: none; box-shadow: none; color: var(--brpz-fechar, #fff); font-size: 24px; line-height: 1; cursor: pointer; padding: 2px 6px; }
.brp-zap-chat-corpo { padding: 16px 14px; min-height: 70px; }
.brp-zap-chat-msg { margin: 0; display: inline-block; max-width: 90%; background: #fff; color: #1f2a30; padding: 9px 12px; border-radius: 0 12px 12px 12px; font-size: 14px; line-height: 1.4; box-shadow: 0 1px 1px rgba(0, 0, 0, .12); }
.brp-zap-chat-form { display: flex; gap: 8px; align-items: flex-end; padding: 10px 12px; background: #f5f5f5; margin: 0; }
.brp-zap-chat-form textarea { flex: 1; min-width: 0; resize: none; border: 1px solid #d5d9dc; border-radius: 18px; padding: 9px 14px; font: inherit; font-size: 14px; background: #fff; color: #1f2a30; max-height: 110px; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; line-height: 1.35; }
.brp-zap-chat-form textarea::-webkit-scrollbar { display: none; width: 0; height: 0; }
.brp-zap-caixa .brp-zap-chat-enviar { flex: none; width: 42px; height: 42px; border: 0; border-radius: 50%; background: var(--brpz-topo, #075e54); box-shadow: none; color: #fff; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.brp-zap-caixa .brp-zap-chat-enviar:hover { filter: brightness(1.15); background: var(--brpz-topo, #075e54); color: #fff; }
/* efeitos: chamar a atenção (repetem de tempos em tempos e param quando a conversa está aberta ou o mouse está em cima) */
.brp-zap { transition: transform .18s ease, filter .18s ease, box-shadow .18s ease; }
.brp-zap-ch-pulsar:not(.is-aberta) .brp-zap:not(:hover) { animation: brp-zap-pulsar 2.6s ease-in-out infinite; }
.brp-zap-ch-balancar:not(.is-aberta) .brp-zap:not(:hover) { animation: brp-zap-balancar 4.5s ease-in-out infinite; }
.brp-zap-ch-brilho:not(.is-aberta) .brp-zap:not(:hover) { animation: brp-zap-brilho 2.4s ease-out infinite; }
.brp-zap-ch-quicar:not(.is-aberta) .brp-zap:not(:hover) { animation: brp-zap-quicar 3.6s ease-in-out infinite; }
@keyframes brp-zap-pulsar { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.09); } }
@keyframes brp-zap-balancar { 0%, 72%, 100% { transform: rotate(0); } 76% { transform: rotate(-9deg); } 82% { transform: rotate(8deg); } 88% { transform: rotate(-6deg); } 94% { transform: rotate(4deg); } }
@keyframes brp-zap-brilho { 0% { box-shadow: 0 4px 14px rgba(0, 0, 0, .25), 0 0 0 0 var(--brpz-botao, #25d366); } 70%, 100% { box-shadow: 0 4px 14px rgba(0, 0, 0, .25), 0 0 0 16px rgba(37, 211, 102, 0); } }
@keyframes brp-zap-quicar { 0%, 60%, 100% { transform: translateY(0); } 70% { transform: translateY(-12px); } 80% { transform: translateY(0); } 88% { transform: translateY(-5px); } 94% { transform: translateY(0); } }
/* ao passar o mouse */
.brp-zap-hv-crescer .brp-zap:hover { transform: scale(1.08); }
.brp-zap-hv-subir .brp-zap:hover { transform: translateY(-4px); box-shadow: 0 10px 20px rgba(0, 0, 0, .3); }
.brp-zap-hv-brilho .brp-zap:hover { filter: brightness(1.12); box-shadow: 0 0 0 5px rgba(255, 255, 255, .35), 0 6px 18px rgba(0, 0, 0, .3); }
.brp-zap-hv-girar .brp-zap:hover .brp-zap-logo svg { transform: rotate(360deg); }
.brp-zap-logo svg { transition: transform .5s ease; }
/* ao clicar */
.brp-zap-ck-afundar .brp-zap:active { transform: scale(.92); }
.brp-zap-ck-onda .brp-zap::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; }
.brp-zap-ck-onda .brp-zap.brp-zap-onda::after { animation: brp-zap-onda .6s ease-out; }
@keyframes brp-zap-onda { 0% { opacity: .55; box-shadow: 0 0 0 0 #fff; } 100% { opacity: 0; box-shadow: 0 0 0 22px #fff; } }
/* a caixinha de conversa aparecendo */
.brp-zap-chat { transform-origin: bottom right; }
.brp-zap-esquerda .brp-zap-chat { transform-origin: bottom left; }
.brp-zap-cx-nenhum .brp-zap-chat { animation: none; }
.brp-zap-cx-subir .brp-zap-chat { animation: brp-zap-entra .3s ease-out; }
.brp-zap-cx-aparecer .brp-zap-chat { animation: brp-zap-aparece .35s ease-out; }
.brp-zap-cx-crescer .brp-zap-chat { animation: brp-zap-cresce .3s cubic-bezier(.2, .9, .3, 1.2); }
.brp-zap-cx-deslizar .brp-zap-chat { animation: brp-zap-desliza-d .35s ease-out; }
.brp-zap-esquerda.brp-zap-cx-deslizar .brp-zap-chat { animation-name: brp-zap-desliza-e; }
@keyframes brp-zap-aparece { from { opacity: 0; } to { opacity: 1; } }
@keyframes brp-zap-cresce { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
@keyframes brp-zap-desliza-d { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }
@keyframes brp-zap-desliza-e { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: none; } }
/* bolinha com a foto escolhida (e o selo do WhatsApp no cantinho) */
.brp-zap-foto .brp-zap { padding: 0; width: var(--brpz-tam, 60px); height: var(--brpz-tam, 60px); justify-content: center; gap: 0; background: #fff; border: 3px solid var(--brpz-botao, #25d366); }
.brp-zap-bolinha-foto { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.brp-zap-selo { position: absolute; right: -5px; bottom: -5px; width: 26px; height: 26px; border-radius: 50%; background: var(--brpz-botao, #25d366); color: #fff; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; }
.brp-zap-selo svg { width: 14px; height: 14px; }
.brp-zap-foto .brp-zap-alerta { top: -6px; right: -6px; }
/* só o círculo, sem o texto */
.brp-zap-redondo .brp-zap { padding: 0; width: var(--brpz-tam, 52px); height: var(--brpz-tam, 52px); justify-content: center; gap: 0; }
.brp-zap-redondo .brp-zap-texto { display: none; }
.brp-zap-redondo .brp-zap-logo svg { width: 26px; height: 26px; }
@keyframes brp-zap-pulso { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }
@keyframes brp-zap-entra { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .brp-zap-alerta, .brp-zap-chat, .brp-zap, .brp-zap::after { animation: none !important; transition: none; } }
/* mostrar só em um tipo de aparelho */
@media (max-width: 600px) { .brp-zap-so-computador { display: none; } }
@media (min-width: 601px) { .brp-zap-so-celular { display: none; } }
/* celular: o botão vira só o logo (círculo pequeno) e a caixinha ocupa no máximo a largura da tela */
@media (max-width: 600px) {
  .brp-zap { padding: 0; width: 48px; height: 48px; justify-content: center; gap: 0; }
  .brp-zap-texto { display: none; }
  .brp-zap-foto .brp-zap { width: min(var(--brpz-tam, 60px), 56px); height: min(var(--brpz-tam, 60px), 56px); }
  .brp-zap-redondo .brp-zap { width: min(var(--brpz-tam, 52px), 56px); height: min(var(--brpz-tam, 52px), 56px); }
  .brp-zap-logo svg { width: 26px; height: 26px; }
  .brp-zap-alerta { top: -6px; right: -8px; }
  .brp-zap-chat { width: calc(100vw - 32px); max-height: 60vh; display: flex; flex-direction: column; }
  .brp-zap-chat[hidden] { display: none; }
  .brp-zap-chat-corpo { padding: 10px 14px; min-height: 0; overflow: auto; }
}
