/* Modul `transcription` — schwebender Mikrofon-Button (Tirugo-CI).
 * Default-Position: direkt UEBER der Assistant-Bubble (rechts unten,
 * Bubble ist 56px hoch + 1.25rem Abstand) — gut auffindbar neben den
 * "Sternen" des Assistenten; per Drag frei verschiebbar.
 * z-Hierarchie: Topnav 40 < Assistant 45 < Mic 46 < Modal 50 < Toast 60 */

#tirugo-mic {
  position: fixed;
  right: 1.4rem;
  bottom: 6rem;
  z-index: 46;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #0a0a0a;
  border: 2px solid #c6f135;
  color: #c6f135;
  cursor: grab;
  display: flex;
  align-items: center;
  justify-content: center;
  touch-action: none;          /* Pointer-Drag auch auf iPad/Touch */
  user-select: none;
  -webkit-user-select: none;
  transition: transform .12s ease, box-shadow .12s ease;
}
#tirugo-mic:hover { transform: translateY(-2px); }
#tirugo-mic.mic--dragging { cursor: grabbing; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35); }
#tirugo-mic svg { pointer-events: none; }

/* Laufzeitanzeige mm:ss */
#tirugo-mic .mic__timer {
  position: absolute;
  top: -1.4rem;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 0.7rem;
  color: #c6f135;
  background: rgba(10, 10, 10, 0.85);
  padding: 0 0.35rem;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
}
#tirugo-mic .mic__timer:empty { display: none; }

/* Mobile: Assistant-Panel klebt an den Raendern — Mic etwas hoeher */
@media (max-width: 480px) {
  #tirugo-mic { right: 0.6rem; bottom: 5.25rem; }
}

/* Aufnahme laeuft: pulsierender roter Ring — klar erkennbar, dass
   mitgehoert wird. */
#tirugo-mic.mic--recording {
  border-color: #ff3b30;
  color: #ff3b30;
  animation: tirugo-mic-pulse 1.2s ease-in-out infinite;
}
@keyframes tirugo-mic-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(255, 59, 48, 0.45); }
  70%  { box-shadow: 0 0 0 12px rgba(255, 59, 48, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 59, 48, 0); }
}

/* Verarbeitung: Spinner-Ring, Button gesperrt */
#tirugo-mic.mic--busy {
  pointer-events: none;
  opacity: 0.85;
}
#tirugo-mic.mic--busy::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: #c6f135;
  animation: tirugo-mic-spin 0.9s linear infinite;
}
@keyframes tirugo-mic-spin {
  to { transform: rotate(360deg); }
}