#wa-ai-widget {
  font-family: Arial, sans-serif;
  z-index: 9999;
}
#wa-ai-chat {
  position: fixed;
  right: 32px;
  bottom: 110px;
  width: 330px;
  height: 430px;
  background-image: url('../img/background-wa.jpg');
  background-size: cover;
  background-position: center;
  border-radius: 18px;
  box-shadow: 0 6px 32px rgba(0,0,0,0.18);
  display: none;
  flex-direction: column;
  z-index: 10001;
}
#wa-ai-chat.active { display: flex; }
#wa-ai-header {
  background: #075e54; color: #fff;
  padding: 16px; border-radius: 18px 18px 0 0;
  display: flex; align-items: center; gap: 10px;
}
.wa-ai-avatar { width: 38px; height: 38px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.wa-ai-avatar img { width: 110%; }
#wa-ai-header span { font-size: 17px; font-weight: bold; }
#wa-ai-close { margin-left: auto; cursor: pointer; font-size: 22px; opacity: 0.7; }
#wa-ai-messages { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.wa-ai-msg { max-width: 80%; padding: 10px 15px; border-radius: 13px; font-size: 15px; line-height: 1.4; }
.wa-ai-msg.ai { align-self: flex-start; background: #fff; color: #444; border-bottom-left-radius: 2px; }
.wa-ai-msg.user { align-self: flex-end; background: #dcf8c6; color: #222; border-bottom-right-radius: 2px; }
#wa-ai-input-area { display: flex; padding: 10px; border-top: 1px solid #cfd8dc; background: #f7f7f7; }
#wa-ai-input { flex: 1; border: none; border-radius: 8px; padding: 9px 14px; font-size: 15px; outline: none; background: #fff; margin-right: 10px; }
#wa-ai-send {
  background: #25d366; color: #fff; border: none; border-radius: 8px;
  padding: 9px 18px; cursor: pointer; font-size: 18px; position: relative; overflow: hidden; transition: background 0.18s;
  display: flex; align-items: center; justify-content: center;
}
#wa-ai-send span { display: inline-block; font-size: 19px; transition: transform 0.23s cubic-bezier(0.4,1.8,0.5,0.9), font-size 0.23s; }
#wa-ai-send:hover { background: #34e67a; }
#wa-ai-send:hover span { font-size: 25px; transform: translateX(8px) scale(1.24); animation: fly-arrow 0.38s cubic-bezier(0.8,0.3,0.4,1.4);}
@keyframes fly-arrow {
  0% { transform: translateX(0) scale(1.14);}
  60% { transform: translateX(10px) scale(1.24);}
  80% { transform: translateX(3px) scale(1.01);}
  100% { transform: translateX(6px) scale(1.12);}
}
#wa-ai-btn-open {
  position: fixed; right: 32px; bottom: 32px; background: #25d366;
  border-radius: 50%; width: 62px; height: 62px; box-shadow: 0 3px 16px rgba(0,0,0,0.13);
  display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 10002;
  animation: shock-effect 1s infinite alternate;
}
#wa-ai-btn-open img { width: 40px; height: 40px; }
@keyframes shock-effect {
  0% { transform: scale(1) rotate(0deg); box-shadow: 0 3px 16px rgba(0,0,0,0.13);}
  15% { transform: scale(1.1) rotate(-7deg);}
  25% { transform: scale(1.06) rotate(7deg);}
  35% { transform: scale(1.14) rotate(-7deg);}
  45% { transform: scale(1.08) rotate(5deg);}
  60% { transform: scale(1.12) rotate(-5deg);}
  80% { transform: scale(1.02) rotate(4deg);}
  100% { transform: scale(1) rotate(0deg);}
}
