.capacity-progress {
    padding: 1rem;
    border: 1px solid hsl(0, 0%, 90%);
    border-radius: 0.5rem;
    background: white;
    margin-bottom: 1rem;
    
    h5 {
        margin: 0 0 1rem;
        font-size: 1.25rem;
        font-weight: 600;
        color: var(--gray);
    }
    
    p {
        margin: 0.5rem 0;
        text-align: center;
        
        strong {
            font-size: 1.25rem;
            color: var(--color-1);
        }
        
        small {
            color: var(--gray);
            font-size: 0.75rem;
            margin-left: 0.25rem;
        }
    }
    
    progress {
        width: 100%;
        height: 0.5rem;
        border: none;
        border-radius: 0.25rem;
        background: hsl(0, 0%, 95%);
        margin: 1rem 0;
        
        &::-webkit-progress-bar {
            background: hsl(0, 0%, 95%);
            border-radius: 0.25rem;
        }
    }
    
    &.capacity-progress--success { strong { color: var(--color-flash-success-text); } }
    
    &.capacity-progress--warning { strong { color: var(--color-flash-warning-text); } }
    
    &.capacity-progress--info { strong { color: var(--color-flash-info-text); } }
    
    &.capacity-progress--danger { strong { color: var(--color-flash-error-text); } }
    
    @media (min-width: 50rem) { p strong { font-size: 1.5rem; } }
}