.ui-tag {
    display: inline-block;
    border-radius: 50px;
    white-space: nowrap;
}

.ui-tag a {
    color: inherit;
}

.ui-tag--md {
    font-size: var( --smallest-font-size);
    line-height: var(--small-line-height);
    font-weight: var(--semibold-font-weight);
    padding: 2px 10px;
}

.ui-tag--sm {
    font-size: var(--tiny-font-size);
    line-height: var(--medium-line-height);
    padding: 2px 12px;
}

.ui-tag--uppercase {
    text-transform: uppercase;
}

.ui-tag--truncate {
    max-width: 200px;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    white-space: nowrap;
}

.ui-tag--cyan {
    background: var(--third-cyan-color);
    color: var(--white-color);
}

.ui-tag--outline-cyan {
    border: 1px solid var(--third-cyan-color);
    color: var(--third-cyan-color);
}

.ui-tag--success-stories {
    background: #C35AF5;
    color: var(--white-color);
}

.ui-tag--news {
    background: var(--secondary-cyan-color);
    color: var(--white-color);
}

.ui-tag--favorite {
    background: var(--primary-cyan-color);
    color: var(--white-color);
}

.ui-tag--press-release {
    background: #1F71DC;
    color: var(--white-color);
}

.ui-tag--update {
    background: #3AA565;
    color: var(--white-color);
}

.ui-tag--reviews,
.ui-tag--reviews-comparisons {
    background: #EB55AF;
    color: var(--white-color);
}

.ui-tag--webinar {
    background: #FF7F00;
    color: var(--white-color);
}

.ui-tag--events {
    background: #10BFFD;
    color: var(--white-color);
}

.ui-tag--baza-znaniy,
.ui-tag--knowledge-base {
    background: #F55A5A;
    color: var(--white-color);
}

.ui-tag--gray {
    background: #5F6263;
    color: var(--white-color);
}

.ui-tag--time {
    height: 21px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 4px;
    font-size: var(--tiny-font-size);
    line-height: var(--medium-line-height);
    border: 1px solid rgba(55, 59, 60, .15);
    color: var(--primary-text-color);
    padding: 2px 8px;
}

.ui-tag--time::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    background-color: var(--secondary-text-color);
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask: url(/blog/wp-content/themes/dragon24/assets/img/icon/t1-time.svg) 50% 50% / cover no-repeat;
    mask: url(/blog/wp-content/themes/dragon24/assets/img/icon/t1-time.svg) 50% 50% / cover no-repeat;
}