/**
 * Copyright JS Foundation and other contributors, http://js.foundation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 **/
.red-ui-editableList-border {
    border: 1px solid $form-input-border-color;
    border-radius: 4px;
    .red-ui-editableList-header {
        border-bottom: 1px solid $form-input-border-color;
        padding: 2px 16px 2px 4px;
        font-size: 0.9em;
    }
}
.red-ui-editableList-container {
    padding: 5px;
    margin: 0;
    vertical-align: middle;
    box-sizing: border-box;
    .red-ui-editableList-list {
        list-style-type:none;
        margin: 0;
    }
    .red-ui-editabelList-item-placeholder {
        border: 2px dashed $secondary-border-color !important;
    }
    li {
        box-sizing: border-box;
        position: relative;
        background: #fff;
        margin:0;
        padding:8px 0px;
        border-bottom: 1px solid $secondary-border-color;
        min-height: 20px;
        .red-ui-editableList-item-handle {
            position: absolute;
            top: 50%;
            left: 2px;
            margin-top: -7px;
            color: #eee;
            cursor: move;
        }
        .red-ui-editableList-item-remove {
            position: absolute;
            top: 50%;
            right: 0px;
            margin-top: -9px;
        }
        &.ui-sortable-helper {
            border-top: 1px solid $secondary-border-color;
        }
        //.red-ui-editableList-item-content { outline: 1px solid red}

        &.red-ui-editableList-item-sortable .red-ui-editableList-item-content {
            margin-left: 22px;
        }
        &.red-ui-editableList-item-removable .red-ui-editableList-item-content {
            margin-right: 28px;
        }
        &.red-ui-editableList-item-deleting {
            background: #fee;
        }
    }

}