.--svg__counter--plus {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.5 0H7.5V7.5H0V12.5H7.5V20H12.5V12.5H20V7.5H12.5V0Z' fill='white'/%3E%3C/svg%3E");
}

.--svg__counter--minus {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='18' height='5' viewBox='0 0 18 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='17.5' width='5' height='17.5' transform='rotate(90 17.5 0)' fill='white'/%3E%3C/svg%3E");
}

.counter-calc__btn {
    padding: 0px;
    width: 2.5rem;
    height: 2.5rem;
    border-left: 1px solid var(--color__border);
    border-radius: 0px;
    border-bottom: 1px solid var(--color__border);
    color: var(--color__dark) !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% auto;
}

.counter-calc__btn img {
    width: 1rem;
}

.counter-calc__input {
    outline: none;
    pointer-events: none;
    width: 3rem;
    height: 2.5rem;
    border: 0px;
    padding: 0px;
    text-align: center;
    font-family: "Montserrat", sans-serif;
    font-weight: 800;
    color: var(--colo__text-1);
    background-color: transparent;
    text-align: center;
    color: var(--color__dark);
}

.counter-calc {
    position: relative;
}

.counter-calc__btn:hover {
    color: white !important;
}

.counter-calc__btns {
    position: absolute;
    top: 0px;
    right: 0px;
}



/* media */

@media screen and (max-width: 1680px) {  

}

@media screen and (max-width: 1440px) {  

}

@media screen and (max-width: 1366px) {  

}

@media screen and (max-width: 1359px) {  

}

@media screen and (max-width: 1199px) {  

}

@media screen and (max-width: 1024px) {  


}

@media screen and (max-width: 991px) {  
    
}

@media screen and (max-width: 768px) {  

}

@media screen and (max-width: 640px) {  

}