//
// Tree List
// --------------------------------------------------

.control-treelist {
    ol {
        padding: 0;
        margin: 0;
        list-style: none;

        ol {
            margin: 0;
            margin-left: 15px;
            padding-left: 15px;
            border-left: 1px solid #dbdee0;
        }
    }

    > ol > li > div.record:before {
        display: none;
    }

    li {
        margin: 0;
        padding: 0;
        > div.record {
            margin: 0;
            font-size: 12px;
            margin-bottom: 5px;
            position: relative;
            display: block;

            &:before {
                color: #bdc3c7;
                .icon(@circle);
                font-size: 6px;
                position: absolute;
                left: -18px; 
                top: 11px;
            }

            > a.move {
                display: inline-block;
                padding: 7px 0 7px 10px;
                text-decoration: none;
                color: #bdc3c7;
                &:hover {
                    color: @color-list-hover-bg;
                }
                &:before { .icon(@bars); }
            }
            > span {
                color: @color-list-text;
                display: inline-block;
                padding: 7px 15px 7px 5px;
            }
        }

        &.dragged {
            position: absolute;
            z-index: 2000;
            width: auto !important; // Prevent browser scrollbars
            height: auto !important;
            > div.record {
                .opacity(.5);
                background: @color-list-hover-bg !important;
                > a.move:before, > span { color: white; }

                &:before {
                    display: none;
                }
            }
        }

        &.placeholder {
            display: inline-block;
            position: relative;
            background: @color-list-hover-bg !important;
            height: 25px;
            margin-bottom: 5px;
            &:before {
                display: block;
                position: absolute;
                .icon(@chevron-left);
                color: #d35714;
                left: -10px;
                top: 8px;
                z-index: 2000;
            }
        }

    }
}