/**
 * @file
 * Styling for the audio CAPTCHA speaker button.
 */

.captcha-audio-button {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  margin-top: 0.5rem;
  padding: 0.25rem 0.6rem;
  font-size: 0.875rem;
  line-height: 1.2;
  color: #0a4d8c;
  background: #f1f5fa;
  border: 1px solid #c7d6e6;
  border-radius: 4px;
  cursor: pointer;
}

.captcha-audio-button:hover,
.captcha-audio-button:focus {
  background: #e2ecf6;
  outline: none;
}

.captcha-audio-button:focus-visible {
  outline: 2px solid #0a4d8c;
  outline-offset: 1px;
}

.captcha-audio-button__icon {
  width: 1.25em;
  height: 1.25em;
  flex: none;
}

.captcha-audio-button.is-playing {
  color: #1a7f37;
  background: #e6f4ea;
  border-color: #a6d9b5;
}