/* ===== OO Waveform =====
   Animierte Sprachpegel-Anzeige für die Audioaufnahme.
   Der aktuelle Pegel (0-1) wird per JS als --oo-waveform-level gesetzt.
   In Ruhe sind die Balken fast flach; bei Sprache schlagen sie kräftig aus.
   Eine sehr dezente Idle-Animation zeigt an, dass die Aufnahme läuft.
   ===================== */

.oo-waveform {
    --oo-waveform-level: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.18em;
    height: 1em;
    pointer-events: none;
    /* Die Balken werden per justify-content zentriert und duerfen die
       Container-Breite nicht veraendern – so springt der Button nicht. */
    overflow: hidden;
}

.oo-waveform__balken {
    display: inline-block;
    flex-shrink: 0;
    width: var(--_balken-breite, 0.16em);
    border-radius: calc(var(--_balken-breite, 0.16em) / 2);
    background: currentColor;
    /* Hoehe relativ zur Container-Hoehe: Ruhe 18 % + Pegel (0-82 %) * Faktor */
    height: calc(18% + (var(--oo-waveform-level, 0) * 82% * var(--_faktor, 0.5)));
    transform-origin: center;
    animation: oo-waveform-puls 1.6s ease-in-out infinite;
    transition: height 70ms linear;
}

/* Reduzierte Bewegung: Animation abschwächen, nur Pegel reagieren lassen */
@media (prefers-reduced-motion: reduce) {
    .oo-waveform__balken {
        animation: none;
    }
}

@keyframes oo-waveform-puls {
    0%, 100% {
        transform: scaleY(0.8);
    }
    50% {
        transform: scaleY(1);
    }
}