.mk-comment-box{
    border-radius: 32px;
    background: #FFF;
    padding: 24px;
}

.mk-comment-box-author-avatar img{
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: 12px;
}
.mk-comment-box-author{
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 8px;
}
.mk-comment-box-author-info{
    display: flex;
    flex-flow: column nowrap;
}
.mk-comment-box-author-info .mk-comment-box-author-name{
    color: #181717;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 200% */
    margin: 0;
}
.mk-comment-box-author-info .mk-comment-box-author-job{
    color: #515151;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; /* 200% */
    margin: -4px 0 0;
}
.mk-comment-box-review{
    margin: 18px 0 0;

    color: #8C8C8C;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px; /* 200% */
}
.mk-comment-box-review *{
    font: inherit;
    color: inherit;
}

.mk-comment-box-footer{
    margin: 24px 0 0;
    border-top: 1px dashed var(--color-primary-5-rgba, rgba(122, 127, 244, 0.13));
    padding-top: 16px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
}
.mk-comment-box-footer .mk-comment-box-rate{
    flex: 1;
    direction: ltr;
    text-align: right;
}
body.rtl .mk-comment-box-footer .mk-comment-box-rate{
    text-align: left;

}
.mk-comment-box-footer .mk-comment-box-rate .mk-comment-box-rate-text{
    color: #C7C7C7;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 28px; /* 200% */
}
.mk-comment-box-footer .mk-comment-box-rate .mk-comment-box-rate-text .mk-comment-box-review-rate-text{
    color: #F1AA10;
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: 28px; /* 200% */
}

@media screen and (min-width:1024px) {
    .swiper.mk-comments-slider-swiper{
        padding: 30px 0 0;
    }
    .swiper.mk-comments-slider-swiper .swiper-slide:hover{
        transform: translateY(-30px);
        transition: transform 0.5s ease-in-out;
    }
    .swiper.mk-comments-slider-swiper .swiper-slide:hover .mk-comment-box{
        border: 1px dashed var(--color-primary-1, #7A7FF4);
    }
}