@mixin normal_buttons($bg, $fg, $br) {
  padding: 5px 9px;
  min-height: 24px;
  min-width: 16px;
  border-style: solid;
  border-width: 1px;
  border-radius: $button_radius;
  color: $fg;
  border-color: $br;
  border-bottom-color: gtkshade($br, 0.75);
  background-color: $bg;
  background-image: linear-gradient(to bottom, gtkshade($bg, 1.01), gtkshade($bg, 0.92));
  
  @if $variant != 'dark' {
    box-shadow: inset 0 1px gtkalpha($light_shadow, 0.5), inset 0 -1px gtkalpha($dark_shadow, 0.025);
  }
  @else {
    box-shadow: inset 0 1px gtkalpha($light_shadow, 0.15), inset 0 -1px gtkalpha($dark_shadow, 0.5);
  }
  
  @if $variant != 'dark' {
    text-shadow: 0 1px $light_shadow;
    -gtk-icon-shadow: 0 1px $light_shadow;
  }
  @else {
    text-shadow: 0 1px $dark_shadow;
    -gtk-icon-shadow: 0 1px $dark_shadow;
  }

  -gtk-outline-radius: $button_radius;

  &:hover {
    background-image: linear-gradient(to bottom, gtkshade($bg, 1.075), gtkshade($bg, 0.945));

    @if $variant != 'dark' {
      box-shadow: inset 0 1px gtkalpha($light_shadow, 0.5), inset 0 -1px gtkalpha($dark_shadow, 0.025);
    }
    @else {
      box-shadow: inset 0 1px gtkalpha($light_shadow, 0.15), inset 0 -1px gtkalpha($dark_shadow, 0.5);
    }
  }

  &:active, &:checked {
    border-color: $br;
    background-color: gtkshade($bg, 0.9);
    background-image: none;
    box-shadow: none;
    text-shadow: none;
    -gtk-icon-shadow: none;

    &:backdrop {
      border-color: gtkshade($unfocused_bg_color, 0.85);
      background-color: gtkshade($unfocused_bg_color, 0.9);
      box-shadow: none;
      text-shadow: none;
      -gtk-icon-shadow: none;
    }

    &:disabled {
      color: $disabled_fg_color;
      background-color: gtkshade($disabled_bg_color, 0.9);
      box-shadow: none;
      text-shadow: none;
      -gtk-icon-shadow: none;

      &:backdrop {
        color: $unfocused_disabled_fg_color;
        background-color: gtkshade($unfocused_disabled_bg_color, 0.9);
        box-shadow: none;
        text-shadow: none;
        -gtk-icon-shadow: none;
      }
    }
  }

  &:disabled {
    color: $disabled_fg_color;
    border-color: $borders;
    background-color: $disabled_bg_color;
    background-image: none;
    text-shadow: none;
    -gtk-icon-shadow: none;

    &:backdrop {
      color: $unfocused_disabled_fg_color;
      border-color: $unfocused_borders;
      background-color: $unfocused_disabled_bg_color;
      box-shadow: none;
      text-shadow: none;
      -gtk-icon-shadow: none;
    }
  }

  &:backdrop {
    border-color: $unfocused_borders;
    color: $unfocused_fg_color;
    background-color: $unfocused_bg_color;
    background-image: none;
    box-shadow: none;
    text-shadow: none;
    -gtk-icon-shadow: none;
  }
}

@mixin flat_buttons($bg, $fg, $br)
{
  border-color: transparent;
  border-radius: $button_radius;
  color: $fg;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
  text-shadow: none;
  -gtk-icon-shadow: none;

  &:hover {
    color: $fg;
    border-color: $br;
    border-bottom-color: gtkshade($br, 0.75);
    background-color: $bg;
    background-image: linear-gradient(to bottom, gtkshade($bg, 1.075), gtkshade($bg, 0.945));
    
    @if $variant != 'dark' {
      box-shadow: inset 0 1px gtkalpha($light_shadow, 0.5), inset 0 -1px gtkalpha($dark_shadow, 0.025);
    }
    @else {
      box-shadow: inset 0 1px gtkalpha($light_shadow, 0.15), inset 0 -1px gtkalpha($dark_shadow, 0.5);
    }
    
    @if $variant != 'dark' {
      text-shadow: 0 1px $light_shadow;
      -gtk-icon-shadow: 0 1px $light_shadow;
    }
    @else {
      text-shadow: 0 1px $dark_shadow;
      -gtk-icon-shadow: 0 1px $dark_shadow;
    }
  }

  &:active, &:checked {
    border-color: $br;
    background-color: gtkshade($bg, 0.9);
    background-image: none;
    box-shadow: none;
    text-shadow: none;
    -gtk-icon-shadow: none;

    &:backdrop {
      border-color: gtkshade($unfocused_bg_color, 0.85);
      background-color: gtkshade($unfocused_bg_color, 0.95);
      background-image: none;
      box-shadow: none;
      text-shadow: none;
      -gtk-icon-shadow: none;
    }
  }

  &:disabled {
    border-color: transparent;
    color: $disabled_fg_color;
    background-color: transparent;
    background-image: none;
    box-shadow: none;
    text-shadow: none;
    -gtk-icon-shadow: none;

    &:backdrop {
      border-color: transparent;
      color: $unfocused_disabled_fg_color;
      background-color: transparent;
      background-image: none;
      box-shadow: none;
      text-shadow: none;
      -gtk-icon-shadow: none;
    }
  }

  &:backdrop {
    border-color: transparent;
    color: $unfocused_fg_color;
    background-color: transparent;
    background-image: none;
    box-shadow: none;
    text-shadow: none;
    -gtk-icon-shadow: none;
  }
}

@mixin button() {
  button {
    @include normal_buttons($bg_color, $fg_color, $borders);

    &.flat { @include flat_buttons($bg_color, $fg_color, $borders); }

    &:drop(active) {
      color: gtkshade($success_color, 0.8);
      border-color: gtkshade($success_color, 0.8);
      box-shadow: inset 0 0 0 1px gtkshade($success_color, 0.8);
    }
  }
}
