.gmage-editor-tools_type-shape {
    line-height: 13px;
    width: 620px;

    .shapes {
        .icon-block::after{
            content: "";
            display: none;
        }
    }

    .gmage-editor-range-picker {
        display: inline-block;
        width: 63px;
    }

    .gmage-editor-tools__shapes {
        transition: all .5s;
        align-items: baseline;
        overflow: hidden;
        z-index: 1;
        padding: 8px 27px 8px 10px;
        position: relative;
        .icon-arrow-down {
            position: absolute;
            right: 10px;
            bottom: 20px;
        }
    }

    .shapes {
        height: 44px;
        width: 220px;
        display: flex;
        flex-wrap: wrap;
    }

    .icon-block {
        .l-center;

        width: 44px;
        height: 44px;
        flex-shrink: 0;

        &:hover {
            background: #E6EFFF
        };

    }

    .tool-shape(@name, @fill: #9FABBD) {
        .shape-@{name} {
            .shape(@name, @fill);
        }
    }
    .tool-shape-active(@name, @fill: #005CF9) {
        .shape-@{name} {
            &_active {
                .shape(@name, @fill)
            }
        }
    };

    .tool-shape(circle);
    .tool-shape(rect);
    .tool-shape(border-circle-radius);
    .tool-shape(border-radius);
    .tool-shape(border);
    .tool-shape(line);
    .tool-shape(line-with-arrow);
    .tool-shape(line-style-wavy);
    .tool-shape(rect-radius);

    .tool-shape-active(circle);
    .tool-shape-active(rect);
    .tool-shape-active(border-circle-radius);
    .tool-shape-active(border-radius);
    .tool-shape-active(border);
    .tool-shape-active(line);
    .tool-shape-active(line-with-arrow);
    .tool-shape-active(line-style-wavy);
    .tool-shape-active(rect-radius);
}