apply background with same text width

Here

here 2

I want to apply the text background to be fit with the text width

h4{

text-align: center;
color: white !important;
    background: linear-gradient(65deg , transparent 50%,rgb(183, 65, 14) 50%) left no-repeat, linear-gradient(0deg , rgba(136, 3, 3, 0.7),rgb(183, 65, 14)) 30px 0 no-repeat;
    background-size: 50px 100%, 100% 100%;
    width: 210px;  
    padding: 0 20px;
    position: relative;
    font-family: "Open Sans";
    line-height: 24px;
    font-weight: 400;
    font-style: normal;
    color: #ffffff;
    font-size: 18px;
    opacity: 1;
    visibility: visible;
    
    transition: opacity 0.24s ease-in-out;
}