/* Voice search mic, at the end (left in RTL) of a search input */
.voice-search-btn {
  position: absolute;
  top: 50%;
  left: 8px;
  z-index: 2;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: var(--project-white);
  font-size: 18px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.voice-search-btn[hidden] {
  display: none;
}

.voice-search-btn:hover {
  background: rgba(127, 127, 127, 0.18);
}

.voice-search-btn.is-listening {
  color: #fff;
  background: #d93025;
  animation: voice-search-pulse 1.4s ease-out infinite;
}

@keyframes voice-search-pulse {
  from { box-shadow: 0 0 0 0 rgba(217, 48, 37, 0.5); }
  to { box-shadow: 0 0 0 12px rgba(217, 48, 37, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .voice-search-btn.is-listening {
    animation: none;
  }
}

/* Header search popup: white input, submit button on the left */
.search-popup__content .voice-search-btn {
  left: 76px;
  color: var(--project-primary);
}

.search-popup__content form.has-voice input[type="text"] {
  padding-left: 130px;
}

/* News sidebar search: submit button on the left */
.sidebar__search-form .voice-search-btn {
  left: 72px;
}

.sidebar__search-form.has-voice input[type="search"] {
  padding-left: 126px;
}

/* Projects sidebar search: no submit button */
.shop-search form.has-voice input[type="text"] {
  padding-left: 60px;
}
