// Mobile layouts - device layout dialog
.DeviceProfileLayoutGrid {

     .UniGridGrid tr, .UniGridGrid td {
        border: none;
    }

    .EvenRow {
        background-color: #E2E2E2;
    }

    .OddRow {
        background-color: #FFF;
    }

    .FlatItem .SelectorEnvelope {
        border: none;
        height: auto;
        padding-bottom: 6px;
        padding-top: 6px;
    }

    .SelectorFlatImage {
        padding: 10px;
        min-height: 20px;

        i.empty-device-layout-mapping {
            color: @color-gray-130;
        }
    }
}




.DeviceProfileLayoutMapping {
    .MappingDirection {
        float: left;
        height: 114px;
        background: url(../../CMSPages/GetResource.ashx?image=CMSModules/CMS_DeviceProfile/direction_right.png) no-repeat;
        background-position: center center;
        width: 100px;
    }

    .RTL & .MappingDirection {
        float: right;
        background: url(../../CMSPages/GetResource.ashx?image=CMSModules/CMS_DeviceProfile/direction_left.png) no-repeat;
    }

    .FlatItem {
        .SelectorEnvelope {
            &:hover {
                background: #E2E2E2;
            }

            &.DeviceProfileSourceLayout:hover {
                background: none;
            }

            &.DeviceProfileSourceLayout {
                cursor: default;
            }
        }
    }

    .SelectorEnvelope {
        position: relative;
        height: 130px;

        .RemoveButton {
            position: absolute;
            top: 5px;
            right: 5px;
            display: none;
        }

        &:hover .RemoveButton {
            display: block;
        }
    }

    .EvenRow & .FlatItem .SelectorEnvelope:hover {
        background: #F9F9F9;
    }

    .selector-flat-description {
        height: auto;
        overflow: hidden; 
        position: absolute;
        left: 0; 
        right: 0; 
    }

    .RTL & .SelectorEnvelope .RemoveButton {
        right: auto;
        left: 5px;
    }
}