/* 4tex Whatsapp Frontend Styles */
.ftw-container {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
}
.ftw-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.18));
}
.ftw-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease;
  box-shadow: 0 12px 24px rgba(37, 211, 102, .35);
}
.ftw-icon img { width: 60%; height: 60%; display:block; }
.ftw-icon svg { width: 60%; height: 60%; display:block; }
.ftw-icon svg path, .ftw-icon svg circle, .ftw-icon svg rect { fill: #fff !important; }
/* Para imagens PNG/JPG customizadas aplicar filtro branco */
.ftw-icon .ftw-white-filter { filter: brightness(0) invert(1); }
.ftw-container.size-small .ftw-icon { width: 52px; height: 52px; }
.ftw-container.size-medium .ftw-icon { width: 68px; height: 68px; }
.ftw-container.size-large .ftw-icon { width: 84px; height: 84px; }
.ftw-icon svg { width: 60%; height: 60%; fill: #fff; }
.ftw-button:hover .ftw-icon { transform: translateY(-2px) scale(1.03); box-shadow: 0 16px 32px rgba(0,0,0,.25); }
/* Closed state: fora do horário */
.ftw-closed .ftw-icon { opacity: .85; filter: grayscale(20%); animation: none !important; box-shadow: 0 8px 16px rgba(0,0,0,.18); }
/* Disabled: sem número configurado */
/* Removido estado desabilitado para garantir clique */

/* Animations */
.ftw-container.animation-pulse .ftw-icon { animation: ftwPulse 1.8s ease-in-out infinite; }
.ftw-container.animation-shake .ftw-icon { animation: ftwShake 2.4s ease-in-out infinite; }

@keyframes ftwPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

@keyframes ftwShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-2px); }
  40% { transform: translateX(2px); }
  60% { transform: translateX(-2px); }
  80% { transform: translateX(2px); }
}

/* Responsive tweaks */
@media (max-width: 480px) {
  .ftw-container { right: 16px; bottom: 16px; }
}