.gmage-tool-pop {
    &.is-active {
        .btn-tips::before,
        .btn-tips::after {
            display: none;
        }
    }
}
.gmage-tool-pop {
    display: inline-block;
    vertical-align: top;
    position: relative;

    em {
        font-style: normal;
    }

    .gmage-tool-pop-panel {
        // display: none;
        background: #fff;
        border: 1px solid rgb(129, 176, 255);
        box-shadow: 0 9px 9px 0 rgba(0, 92, 249, 0.08);
        margin-top: 5px;
        position: absolute;
        left: -50%;
        top: -20px;
        z-index: 9;

        transform: translate(0, -100%);

    }

    .gmage-tool-pop-panel-inner {
        margin: 8px 5px 8px 0;
        max-height: 320px;
        overflow: auto;
        overflow-x: hidden;

        &::-webkit-scrollbar {
            background: none;
            height: 8px;
            width: 8px;
        }
        &::-webkit-scrollbar-thumb {
            background: transparent;
            border-radius: 2px;

            transition: background 0.2s ease;
        }
        &:hover::-webkit-scrollbar-thumb {
            background-color: #e4eeff;
        }
        &::-webkit-scrollbar-button,
        &::-webkit-resizer {
            display: none;
        }
    }
}

.gmage-tool-pop-picker{
    .gmage-tool-pop-picker-label{
        cursor: pointer;
        line-height: 30px;

        &::after{
            content: '';
            display: inline-block;
            border-color: rgb(76, 78, 79) transparent;
            border-width: 4px 4px 0;
            border-style: solid;
            margin: 13px 0 0 15px;
            vertical-align: top;
        }

        em{
            display: inline-block;
            // max-width: 12em;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            vertical-align: top;
        }
    }
}