Faced a problem that I can not solve in any way. I have an elite with a gradient fill and a wavy border. How can I implement it on the CSS? The wavy border is at the top and bottom of the element. I highlighted this place in red, and also increased a piece of wavy border for clarity (left). Watch here
How do I make a gradient fill of an element on CSS so that this fill affects the wavy border? Thank you in advance for your cooperation!
For now, I'm just using background-image.
background-image: url($host + 'app/img/main/bonus-wave.png');
background-repeat: no-repeat;
background-position: center;
background-size: cover;