.ticket-assigned-to {
    align-items: center;
    display: flex;
    margin-bottom: 1rem;
    position: relative;
    &:hover {
        .assigned-to {
            .icon-delete {
                opacity: 1;
                transition: opacity .3s linear;
            }
        }
    }
    .loading-spinner {
        @extend %loading-spinner;
        margin: 1rem auto;
        max-height: 2rem;
        max-width: 2rem;
    }
    .user-avatar {
        flex-basis: 4rem;
        flex-shrink: 0;
        img {
            width: 100%;
        }
    }
    .assigned-to {
        flex-grow: 1;
        margin-left: .5rem;
        .assigned-title {
            @extend %small;
            @extend %light;
            color: $gray;
            display: block;
        }
        .user-assigned {
            @extend %large;
            color: $primary;
            cursor: default;
            line-height: 1.5rem;
            &.editable {
                cursor: pointer;
            }
            .icon {
                vertical-align: middle;
            }
        }
        .assigned-name {
            @include ellipsis(80%);
            display: inline-block;
        }
        .icon-delete {
            color: $gray-light;
            opacity: 0;
            position: absolute;
            right: 0;
            top: 0;
            &:hover {
                color: $red;
            }
        }
    }
}