/* ==============================================
   ABACUS STATS - ANIMATED PROGRESS BARS
   ============================================== */

/* Progress Bar Container */
.stat-progress-bar {
    width: 100%;
    height: 3px;
    background: #EAE6E1;
    border-radius: 2px;
    margin-top: 10px;
    overflow: hidden;
    position: relative;
}

/* Progress Bar Fill */
.stat-progress-fill {
    height: 100%;
    background: var(--color-terracotta);
    border-radius: 2px;
    width: 0%;
    transition: width 800ms ease-out 200ms;
    transform-origin: left;
}

/* Active State - Animated When Visible */
.stat-progress-fill.animate {
    /* Width set dynamically via JavaScript based on data-progress attribute */
}

/* Ensure smooth animation */
.stat-progress-fill {
    will-change: width;
}

.stat-progress-fill.animate {
    will-change: auto;
}