@import 'commons';

$m-button--border-radius: 4px !default;

.m-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    text-align: center;
    vertical-align: middle;
    font-size: inherit;
    border-radius: $m-button--border-radius;
    padding: 10px $m-space;
    font-weight: $m-font-weight-semi-bold;
    min-height: 44px;

    @include m-button();

    @include m-is-ie() {
        display: inline;
    }

    &:not(.m--is-waiting):not(.m--is-disabled) {
        &.m--is-skin-primary {
            @include m-button--primary();
        }

        &.m--is-skin-secondary {
            @include m-button--secondary();
        }

        &.m--is-skin-tertiary {
            @include m-button--tertiary();
        }

        @include m-button--hover();
    }

    &.m--is-waiting {
        @include m-button--waiting();
    }

    &.m--is-disabled {
        @include m-button--disabled();
    }

    &.m--is-full-size {
        width: 100%;
    }

    .m-icon {
        stroke-width: 2px;

        @include m-font-size('xs');
    }

    &__text,
    &__precision {
        position: relative;
    }

    &__precision,
    &__icon {
        &:empty {
            display: none;
        }
    }

    &__text {
        flex: 1;
    }

    &__icon {
        position: relative;
        z-index: 2;
        font-size: inherit;
        height: #{$m-font-size * 1px};

        &.m--is-left {
            margin-right: $m-space-sm
        }

        &.m--is-right {
            margin-left: $m-space-sm;
        }
    }

    &__precision {
        display: block;
        margin-top: 3px;
        font-weight: $m-font-weight-light;

        @include m-font-size('sm');

        &:empty {
            display: none;
        }
    }
}