.coin-icon {
    mask-image: url("../img/coin.svg");
    -webkit-mask-image: url("../img/coin.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}
.cash-icon {
    mask-image: url("../img/cash.svg");
    -webkit-mask-image: url("../img/cash.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.percent-icon {
    mask-image: url("../img/percent.svg");
    -webkit-mask-image: url("../img/percent.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.refresh-icon {
    mask-image: url("../img/refresh.svg");
    -webkit-mask-image: url("../img/refresh.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.wheel-icon {
    mask-image: url("../img/wheel.svg");
    -webkit-mask-image: url("../img/wheel.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.like-icon {
    mask-image: url("../img/like.svg");
    -webkit-mask-image: url("../img/like.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.clock-icon {
    mask-image: url("../img/clock.svg");
    -webkit-mask-image: url("../img/clock.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.doc-icon {
    mask-image: url("../img/doc.svg");
    -webkit-mask-image: url("../img/doc.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}

.calendar-icon {
    mask-image: url("../img/calendar.svg");
    -webkit-mask-image: url("../img/calendar.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}
.crown-icon {
    mask-image: url("../img/crown.svg");
    -webkit-mask-image: url("../img/crown.svg");
    background-color: var(--primary-medium);
    width: 32px;
    height: 32px;
}


.like-icon,
.doc-icon,
.calendar-icon,
.crown-icon,
.wheel-icon,
.refresh-icon,
.percent-icon,
.cash-icon,
.coin-icon,
.clock-icon {
    background-repeat: no-repeat;
    background-position: center;
    mask-repeat: no-repeat;
    -webkit-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center;
    -webkit-position: no-repeat;
    -webkit-mask-position: center;
    transition: all 0.3s ease;
    display: block;
    -webkit-mask-size: 100%;
}