$drag-margin: -8px;

.col {
    overflow: hidden;
}

.btn {
    & {
        width: 2rem;
    }

    &:focus {
        border-color: transparent;
    }
}

.category {
    margin-bottom: 1rem;
}

.droppable {
    & {
        position: relative;
    }

    &.cdk-drop-list-dragging {
        & {
            border: 0;
        }

        .drop-indicator {
            display: block;
        }
    }

    .drop-indicator {
        @include absolute($drag-margin, $drag-margin, $drag-margin, $drag-margin);
        background: none;
        border: 2px dashed $color-dark-black;
        display: none;
        pointer-events: none;
    }
}

.header {
    line-height: 2rem;
    margin-bottom: 0;
    margin-left: -1rem;

    h3 {
        line-height: 2rem;
    }

    .btn-remove {
        margin-right: -1rem;
    }
}

.nav-link {
    border: 0;
    padding-bottom: .75rem;
    padding-top: .75rem;
}

.nav-item {
    & {
        border-bottom: 1px solid $color-dark2-separator;
    }

    &:last-child {
        border: 0;
    }

    &.active {
        background: $color-dark2-active-background;
    }

    &.cdk-drag {
        padding-left: 2rem;
        padding-right: 0;
        position: relative;
    }

    .drag-handle {
        @include absolute(1rem, auto, auto, 1rem);
    }
}

.cdk-drag-preview {
    background: $color-dark2-background !important;

    a {
        color: $color-dark1-foreground !important;
    }
}

.cdk-drag-placeholder {
    display: none;
}

.cdk-drag-animating {
    transition: none;
}

.schema {
    &-name {
        @include truncate;
    }

    &-name-accent {
        color: $color-dark-foreground;
    }

    &-modified {
        padding-left: 0;
        text-align: right;
        white-space: nowrap;
        width: auto;
    }

    &-user {
        @include border-radius(1px);
        @include truncate;
        background: $color-dark2-control;
        display: inline-block;
        font-size: .8rem;
        font-weight: normal;
        margin-bottom: 2px;
        margin-left: 10px;
        max-width: 100%;
        padding: .1rem .25rem;
        vertical-align: middle;
    }
}