/* ═══════════════════════════════════════════════════════════
   whisper-recorder.css — Styles du composant dictée vocale
   ═══════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════
   whisper-recorder — états visuels appliqués sur la pill
   Les classes wr-* sont ajoutées par whisper-recorder.js
   sur le bouton triggerEl (ici .nr-dictee-pill)
   ═══════════════════════════════════════════════════════════ */

/* Idle — pas de style spécial, la pill parente gère */
.wr-idle { }

/* Recording — bordure rouge, pulse doux */
.wr-recording {
  border-color: var(--red, #E02020) !important;
  background: rgba(224, 32, 32, .04) !important;
  animation: wr-pulse 1.5s ease-in-out infinite;
}
.wr-recording .nr-dictee-ico { color: var(--red, #E02020); }

@keyframes wr-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(224,32,32,.15); }
  50% { box-shadow: 0 0 0 6px rgba(224,32,32,.08); }
}

/* Transcribing — bordure verte, spinner */
.wr-transcribing {
  border-color: var(--green) !important;
  background: rgba(47,191,122,.04) !important;
  cursor: wait;
}

/* Spinner inline */
.wr-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid rgba(47,191,122,.25);
  border-top-color: var(--green);
  border-radius: 50%;
  animation: wr-spin .6s linear infinite;
  vertical-align: middle;
  margin-right: 4px;
}
@keyframes wr-spin { to { transform: rotate(360deg); } }

/* Erreur */
.wr-error {
  border-color: var(--red, #E02020) !important;
  background: rgba(224,32,32,.04) !important;
}