/* POWERMAIL */
.powermail_fieldwrap_votingid  { display: none; }
#powermail_field_verein { background: none; border: none; margin-bottom: 50px; font-size: 50px; padding: 0; color: #d78200; }
.card-body { padding-top: 0; }

 /* Container für die Progressbar */
 .progress-container {
    width: 100%;
    max-width: 500px;
    position: relative;
}

/* Die äußere Progressbar */
.progress-bar {
    width: calc(100% + 38px);
    margin-left: -19px;
    height: 20px;
    background-color: #e0e0e0;
    border: 1px solid #ccc;
    position: relative;
    overflow: visible; 
    margin-bottom: 25px
}

/* Der farbige Teil der Progressbar */
.progress-fill {
    height: 100%;
    background-color: #afca05; /* Grün für den Fortschritt */
    position: absolute;
    width: 0; /* Startwert: 0 */
    animation: fillProgress 5s ease-in-out forwards;
}

/* Sprechblase */
.speech-bubble {
    position: absolute;
    top: -40px;
    left: 0;
    padding: 5px 10px;
    background-color: #d78200;
    color: white;
    border-radius: 5px;
    font-size: 14px;
    pointer-events: none;
    white-space: nowrap;
    box-shadow: 4px 4px 4px #383838;
    animation: bubbleMove 5s ease-in-out forwards;
}

/* Standard-Animationen, die durch JavaScript dynamisch überschrieben werden */
@keyframes fillProgress {
0% {
    width: 0;
}
100% {
    width: 0; /* Wird dynamisch durch JavaScript ersetzt */
}
}

@keyframes bubbleMove {
0% {
    left: 0;
}
100% {
    left: 0; /* Wird dynamisch durch JavaScript ersetzt */
}
}
/* POWERMAIL */