/**
CSS custom elements
 */

/* ==========================================================================
   NK Marquee
   ========================================================================== */

.nk-marquee {
    --nk-marquee-gap: 30px;
    overflow: hidden;
    width: 100%;
}

.nk-marquee-gap-small { --nk-marquee-gap: 15px; }
.nk-marquee-gap-medium { --nk-marquee-gap: 50px; }
.nk-marquee-gap-large { --nk-marquee-gap: 80px; }
.nk-marquee-gap-collapse { --nk-marquee-gap: 0px; }

.nk-marquee-track {
    display: flex;
    width: max-content;
    column-gap: var(--nk-marquee-gap);
    will-change: transform;
}

.nk-marquee-group {
    display: flex;
    align-items: center;
    column-gap: var(--nk-marquee-gap);
    flex: none;
}

.nk-marquee-item,
.nk-marquee-separator {
    display: flex;
    align-items: center;
    flex: none;
    white-space: nowrap;
}

/* Gap between the image/icon and the text inside an item */
.nk-marquee-item,
.nk-marquee-item .el-link {
    column-gap: var(--nk-marquee-item-gap, 10px);
}

.nk-marquee-item .el-image {
    display: block;
}

.nk-marquee-item .el-link {
    display: flex;
    align-items: center;
}