// gmage-editor-num-picker
.gmage-editor-num-picker{
    line-height: 26px;
    text-align: right;

    .picker {
        display: flex;
    }

    label{
        float: left;
    }

    input{
        display: inline-block;
        background: #FFF;
        border: none;
        font-size: inherit;
        padding: 2px 3px;
        height: 26px;
        width: 3em;
        outline: 0;
        vertical-align: top;
        text-align: center;

        -webkit-appearance: textfield;

        &:focus{
            border-color: #AAA;
        }
    }

    .gmage-editor-num-picker__handlers {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        margin-left: 12px;

        .triangle_up::after {
            margin-top: 2px;
        }
        .triangle_down::after {
            margin-bottom: 2px;
        }
    }

    button{
        background: none;
        border: 0;
        outline: 0;
        vertical-align: top;
        height: 13px;
        cursor: pointer;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button{
        -webkit-appearance: none;
        display: none;
    }

    &_disabled {
        input {
            color: #ccc;
        }
        .gmage-editor-num-picker__handlers {
            button {
                cursor: default;
            }
            .triangle {
                &_up::after {
                    border-bottom: 4px solid #ccc;
                }
                &_down::after {
                    border-top: 4px solid #ccc;
                    vertical-align: bottom;
                }
            }
        }
    }

}