/* #### Use a minimum height for region so that they can be hovered over when there are no blocks in them #### */
.cofoundry-sv__region, .cofoundry-sv__block-empty {
    min-height: 30px;
}
/* for Internet Explorer */
/*\*/
* html .cofoundry-sv__region {
    height: 30px;
    opacity: 1;
}

.cofoundry-editmode__custom-entity .cofoundry__sv-region[data-cms-page-region] {
    cursor: not-allowed;
    opacity: .5;
}

.cofoundry-editmode__page .cofoundry__sv-region[data-cms-custom-entity-region] {
    cursor: not-allowed;
    opacity: .5;
}

/* Editable Region/Block Hover */
.cofoundry-sv__hover-block { 
    box-shadow: 0px 0px 2px $color-primary!important;
}
.cofoundry-sv__hover-block.mask { 
    //box-shadow: 0px 0px 1px 1px rgba(0,0,0,.5)!important; 
}

.cofoundry-sv__hover-region {
    //outline: 1px solid $color-primary-dark!important;
    box-shadow: 0px 0px 1px $color-primary-dark !important;
}

/* Used when the html for a region is being replaced */
.cofoundry-sv__region-loading {
    opacity: 0.5;
}

/* #### Hovering #### */
#cofoundry-sv__block-popover-container {
    font-family:$fontstack-default;
    font-size:85%;
    position: absolute;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

/* #### Region hovering #### */
.cofoundry-sv__btn-add-block {
    @include transform(translateY(-50%) translateX(-50%));
    @include border-radius(50%);
    z-index: 999999998;
    border:3px solid $color-primary;
    background-color: $color-primary;
    color: $color-darkgrey;
    overflow: hidden;
    white-space: nowrap;
    position:absolute;
    text-align:center;
    left: 0px;
    height: 20px;
    width: 20px;
    top: 1px;
    cursor: pointer;

    &:after {
        content:'';
        position:absolute;
        height:2px;
        width:8px;
        background:white;
        top: 6px;
        left: 3px;
    }

    &:before {
        content:'';
        position:absolute;
        height:8px;
        width:2px;
        background:white;
        top: 3px;
        left: 6px;
    }

    &:hover {
        &:after, &:before {
            background:$color-secondary;
        }
    }

    &.cofoundry-sv__btn-add-block--empty {

    }
}

.cofoundry-sv__ui-wrap--region {
    display: block !important;
    pointer-events: none;
    position: absolute;
    border: 1px dashed $color-primary;
    min-height: 30px;
    z-index: 999999996;

    .cofoundry-sv__ui-wrap-name {
        z-index: 1;
        transform: translateY(-100%);
        background: $color-primary;
        color: $color-secondary;
        top: 0px;
    }
}

.cofoundry-sv__ui-wrap--block {
    display:block!important;
    pointer-events: none;
    position:absolute;
    border:1px dashed $color-secondary;
    min-height:30px;
    min-width: 100px;
    z-index:999999997;

    .cofoundry-sv__ui-wrap-name {
        z-index: 1;
        font-family:$fontstack-default;
        line-height:12px;
        transform: translateY(-100%);
        background: $color-secondary;
        color: #fff;
        left:-1px;
        top:0px;
        right:auto;
    }
}

.cofoundry-sv__ui-wrap-name {
    font-family:$fontstack-default;
    line-height:12px;
    position: absolute;
    font-size: 8px;
    text-transform: uppercase;
    padding: 2px 4px;
    background: #ccc;
    right: -1px;
    top: -1px;
}


/* #### Block hovering #### */
#cofoundry-sv__block-popover-container {
    z-index:999999998;
    display:none;

    .cofoundry-sv__block-popover--main-actions {
        border: 1px solid $color-secondary;
        background:#fff;
        display: block;
        margin: 0px;
        padding: 0px;
        list-style: none;

        > li {
            display:inline-block;
        }
    }

    li {
        button {
            padding:5px;
            text-transform:uppercase;
            font-size:10px;
            border:none;
            width:100%;
            background-color:transparent;

            &:hover {
                background-color:$color-lightgrey;
            }
        }

        a {
            @include transition(all .3s);
            background-position: center center;
            display: block;
            height: 32px;
            color: $color-darkgrey;
            width: 34px;
            padding-top:7px;
            text-align:center;
            font-size:1.1em;

            &:hover {
                color:$color-primary;
            }
        }

        &.advanced {
            > button {
                display:block;
                width: 30px;
                text-align:center;

                &:hover {
                    //background-color:$color-secondary;
                    //color:#fff;
                }
            }
        }
    }

    .disabled a {
        cursor: default;
        opacity: 0.4;
        -khtml-opacity: 0.4;
        -moz-opacity: 0.4;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
        filter: alpha(opacity=40);
    }

    .cofoundry-sv__block-popover--adv-actions {
        display:none;

        ul {
            background-color:#fff;
            position: absolute;
            border:1px solid $color-secondary;
            list-style:none;
            width:100px;
            padding:0;
            left:0;
        }

        li {
            width:100%;
        }

        button {
            text-align:left;
            text-decoration:none;
            padding: 5px 9px;
        }
    }

    .cofoundry-sv__region-name {
        background-color:$color-secondary;
        color:#fff;
        display:block;
        padding: 5px;
        font-style: italic;
        font-size:11px;
    }

    .advanced:hover {
        //background-color:$color-secondary;

        > button {
            //color:#fff;
        }

        .cofoundry-sv__block-popover--adv-actions {
            display:block;
        }
    }
}