@mixin btn-flat {
    background: $button-color;
    color: $on-button;

    // @include focus-outline();

    &:hover {
        background: darken($button-color, 5%);
    }

    &:active {
        background: lighten($button-color, 5%);
    }
}

.btn-flat {
    @include btn-flat();
}

.#{$ns}btn {
    @include Elevation(1);
    @include ElevationTransition(0.2s);
    &:focus {
        @include Elevation(6);
    }
    @include btn-flat();
}

.#{$ns}fab {
    @include Elevation(8);
    @include ElevationTransition(0.2s);
    &:focus {
        @include Elevation(16);
    }
    background: $button-color;
}