$prefix-anchor: #{$prefix}anchor;
.#{$prefix-anchor} {
    &-wrapper {
        overflow: auto;
        padding-left: 4px;
        margin-left: -4px;
    }

    & {
        position: relative;
        padding-left: $anchor-border-width;

        &-ink {
            position: absolute;
            height: 100%;
            left: 0;
            top: 0;
            &:before {
                content: ' ';
                position: relative;
                width: $anchor-border-width;
                height: 100%;
                display: block;
                @include get-color-divider(background-color);
                margin: 0 auto;
            }
            &-ball {
                display: inline-block;
                position: absolute;
                width: 8px;
                height: 8px;
                border-radius: 50%;
                border: 2px solid $color-primary;
                @include get-color-bg(background-color);
                left: 50%;
                transition: top $transition-time $bezier;
                transform: translate(-50%, 2px);
            }
        }

        &.fixed &-ink &-ink-ball {
            display: none;
        }
    }

    &-link {
        padding: 8px 0 8px 16px;
        line-height: 1;

        &-title {
            display: block;
            position: relative;
            transition: all 0.3s;
            @include get-color-text();
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-bottom: 8px;
            &:only-child {
                margin-bottom: 0;
            }
        }

        &-active > &-title {
            color: $color-primary;
        }
    }

    &-link &-link {
        padding-top: 6px;
        padding-bottom: 6px;
    }
}