// @import "../../../node_modules/bootstrap/scss/functions";
// @import "../../../node_modules/bootstrap/scss/variables";
// @import "../../../node_modules/bootstrap/scss/variables-dark";
// @import "../../../node_modules/bootstrap/scss/maps";
// @import "../../../node_modules/bootstrap/scss/mixins";
// @import "../../../node_modules/bootstrap/scss/buttons";

.emk-button-wrapper{
    .emk-button {
        display: inline-block;
        line-height: 1;
        font-size: 15px;
        padding: 12px 24px;
        border-radius: 3px;
        color: #fff;
        fill: #fff;
        text-align: center;
        transition: all .3s;
        &.emk-size-xs{
            font-size: 13px;
            padding: 10px 20px;
            border-radius: 2px
        }
        &.emk-size-md {
            font-size: 16px;
            padding: 15px 30px;
            border-radius: 4px
        }
        &.emk-size-lg{
            font-size: 18px;
            padding: 20px 40px;
            border-radius: 5px
        }
        &.emk-size-xl{
            font-size: 20px;
            padding: 25px 50px;
            border-radius: 6px;
        }
        &.emk-color-default{
            background-color: #0D6EFD;
        }
        &.emk-color-info{
            background-color: #0DCAF0;
        }
        &.emk-color-success{
            background-color: #198754;
        }
        &.emk-color-warning{
            background-color: #FFC107;
        }
        &.emk-color-danger{
            background-color: #DC3545;
        }
        &.emk-color-light {
            background-color: #F8F9FA;
        }
        &.emk-color-dark  {
            background-color: #212529;
        }
        .emk-button-content-wrapper {
            display: flex;
            justify-content: center;
            .emk-button-icon {
                flex-grow: 0;
                order: 5;
                &.emk-align-icon-right{
                    margin-left: 5px;
                    order: 15;
                }
                &.emk-align-icon-left{
                    margin-right: 5px;
                    order: 5;
                }
                svg{
                    width: 1em;
                    height: auto
                }
                .e-font-icon-svg{
                    height: 1em
                }
            }
            .emk-button-text {
                flex-grow: 1;
                order: 10;
                display: inline-block
            }
        }
    }
}