// /**
//  * Copyright Â© Magento, Inc. All rights reserved.
//  * See COPYING.txt for license details.
//  */

//
//  Default appearance styles
//  _____________________________________________

.pagebuilder-content-type.children-min-height.pagebuilder-column {
    display: flex;
    margin-right: 1px;

    .pagebuilder-column-inner > .element-children {
        flex: 1;
        max-width: 100%;
        min-height: initial;
        padding: 0;
    }
}

.pagebuilder-column-inner {
    display: flex;
    max-width: 100%;
    min-height: initial;
    width: 100%;
}

.pagebuilder-content-type.pagebuilder-column {
    min-height: 150px;

    &.empty-container {
        min-height: 300px;
    }

    .pagebuilder-column-resize-handle {
        background: @color-pagebuilder-light-blue;
        bottom: 0;
        cursor: col-resize;
        height: calc(~'100% + 30px');
        opacity: 0;
        position: absolute;
        right: -15px;
        top: -15px;
        transition: .5s opacity;
        width: 15px;
        z-index: 28;

        &:hover {
            opacity: .3;
        }
    }

    .pagebuilder-resizing {
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        background: @color-pagebuilder-light-blue;
        height: 100%;
        left: 0;
        opacity: 0;
        position: absolute;
        top: 0;
        transition: .5s opacity;
        user-select: none;
        visibility: hidden;
        width: 100%;
        z-index: 24;

        * {
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            user-select: none;
        }

        &:hover {
            border: 1px solid @text-color;
        }
    }

    &.active {
        opacity: .5;
        transition: .5s opacity;
        visibility: visible;
    }
}

.pagebuilder-content-type-hidden .pagebuilder-column-resize-handle,
.pagebuilder-stage.interacting .pagebuilder-content-type.pagebuilder-column .pagebuilder-column-resize-handle {
    display: none;
}
.pagebuilder-stage .pagebuilder-column-group.resizing .pagebuilder-content-type.pagebuilder-column .pagebuilder-column-resize-handle {
    display: block;
}
