/* Flowbie Voice — PTT button and recording states */
.flowbie-voice-ptt {
  position: relative;
  overflow: visible;
}

.flowbie-voice-ptt .flowbie-voice__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  inset: 0;
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.flowbie-voice-ptt .flowbie-voice__icon--mic {
  opacity: 1;
}

.flowbie-voice-ptt .flowbie-voice__icon--send,
.flowbie-voice-ptt .fba-send__icon--send,
.flowbie-voice-ptt .fcwd-send__icon--send,
.flowbie-voice-ptt .fcw-send__icon--send {
  opacity: 0;
  transform: scale(0.85);
}

.flowbie-voice-ptt--has-text .flowbie-voice__icon--mic,
.flowbie-voice-ptt--has-text .fba-send__icon--mic,
.flowbie-voice-ptt--has-text .fcwd-send__icon--mic,
.flowbie-voice-ptt--has-text .fcw-send__icon--mic {
  opacity: 0;
  transform: scale(0.85);
}

.flowbie-voice-ptt--has-text .flowbie-voice__icon--send,
.flowbie-voice-ptt--has-text .fba-send__icon--send,
.flowbie-voice-ptt--has-text .fcwd-send__icon--send,
.flowbie-voice-ptt--has-text .fcw-send__icon--send {
  opacity: 1;
  transform: scale(1);
}

.flowbie-voice-ptt--recording,
.flowbie-voice--recording {
  animation: flowbieVoicePulse 1.2s ease-in-out infinite;
}

.flowbie-voice-ptt--recording {
  box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.35);
}

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

@media (prefers-reduced-motion: reduce) {
  .flowbie-voice-ptt--recording,
  .flowbie-voice--recording {
    animation: none;
  }
}

.flowbie-voice-toast {
  align-self: center;
  max-width: 90%;
  padding: 8px 14px;
  border-radius: 10px;
  background: rgba(248, 113, 113, 0.15);
  border: 1px solid rgba(248, 113, 113, 0.35);
  color: #fca5a5;
  font-size: 0.875rem;
  animation: flowbieVoiceToastIn 0.2s ease;
}

@keyframes flowbieVoiceToastIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fba-mode-toggle {
  display: flex;
  gap: 6px;
  margin-bottom: 10px;
  justify-content: center;
}

.fba-mode-btn {
  padding: 6px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.875rem;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}

.fba-mode-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.fba-mode-btn--active {
  background: rgba(74, 222, 128, 0.12);
  border-color: rgba(74, 222, 128, 0.35);
  color: #86efac;
}

.fba-send,
.fcwd-send,
.fcw-send {
  position: relative;
}

.fba-send .fba-send__icon,
.fcw-send .fcw-send__icon,
.fcwd-send .fcwd-send__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  inset: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
}