@import 'variables';

.editor-view {

    .paste-zone {
        background-color:@warning-color;
        border:1px solid darken(@warning-color, 10%);
        border:1px solid darken(@warning-color, 10%);
    }
}


.editing-overlay-component-option {
    background-color:#e8e8e8;
    transition:background-color 0.2s;
    &:hover {
        background-color:darken(#e8e8e8, 10%);
    }
    &.selected {
        background-color:darken(#e8e8e8, 20%);
    }
}

.editing-overlay-component-layout-option {
    border:none;
    border-right:1px solid #b7caed;
    padding:0px 10px;
    float:left;
    background-color:#fff;
    color:#3e4960;
    transition:all 0.2s;
    &:hover {
        color:#fff;
        background-color:lighten(@primary-color, 20%);
    }
    &.selected {
        color:#fff;
        background-color:@primary-color;
    }
}

.article, 
.block, 
.component {
    box-shadow: 0px 0px 3pt 2pt transparent;
    &.hovering {
        box-shadow: 0px 0px 3px 3px #e0e0e0;
        position:relative;
    }
}

.block {
    border-left:1px solid transparent;
    border-right:1px solid transparent;
    &.hovering {
        border-left:1px solid darken(#e0e8f7, 10%);
        border-right:1px solid darken(#e0e8f7, 10%);
    }
}