$button-border-radius: 3px !default;
$button-fab-border-radius: 50% !default;
$button-icon-border-radius: $button-fab-border-radius;

a.md-button.md-THEME_NAME-theme,
.md-button.md-THEME_NAME-theme {
  border-radius: $button-border-radius;

  &:not([disabled]) {
    &:hover {
      background-color: '{{background-500-0.2}}';
    }
    &.md-focused {
      background-color: '{{background-500-0.2}}';
    }
    &.md-icon-button:hover {
      background-color: transparent;
    }
  }

  &.md-fab {
    border-radius: $button-fab-border-radius;
    background-color: '{{accent-color}}';
    color: '{{accent-contrast}}';
    md-icon {
      color: '{{accent-contrast}}';
    }
    &:not([disabled]) {
      &:hover {
        background-color: '{{accent-color}}';
      }
      &.md-focused {
        background-color: '{{accent-A700}}';
      }
    }
  }

  &.md-icon-button {
    border-radius: $button-icon-border-radius;
  }

  &.md-primary {
    color: '{{primary-color}}';
    &.md-raised,
    &.md-fab {
      color: '{{primary-contrast}}';
      background-color: '{{primary-color}}';
      &:not([disabled]) {
        md-icon {
          color: '{{primary-contrast}}';
        }
        &:hover {
          background-color: '{{primary-color}}';
        }
        &.md-focused {
          background-color: '{{primary-600}}';
        }
      }
    }
    &:not([disabled]) {
      md-icon {
        color: '{{primary-color}}';
      }
    }
  }
  &.md-fab {
    border-radius: $button-fab-border-radius;
    background-color: '{{accent-color}}';
    color: '{{accent-contrast}}';
    &:not([disabled]) {
      .md-icon {
        color: '{{accent-contrast}}';
      }
      &:hover {
        background-color: '{{accent-color}}';
      }
      &.md-focused {
        background-color: '{{accent-A700}}';
      }
    }
  }

  &.md-raised {
    color: '{{background-contrast}}';
    background-color: '{{background-50}}';
    &:not([disabled]) {
      .md-icon {
        color: '{{background-contrast}}';
      }
      &:hover {
        background-color: '{{background-50}}';
      }
      &.md-focused {
        background-color: '{{background-200}}';
      }
    }
  }

  &.md-warn {
    color: '{{warn-color}}';

    &.md-raised,
    &.md-fab {
      color: '{{warn-contrast}}';
      background-color: '{{warn-color}}';
      &:not([disabled]) {
        md-icon {
          color: '{{warn-contrast}}';
        }
        &:hover {
          background-color: '{{warn-color}}';
        }
        &.md-focused {
          background-color: '{{warn-700}}';
        }
      }
    }
    &:not([disabled]) {
      md-icon {
        color: '{{warn-color}}';
      }
    }
  }

  &.md-accent {
    color: '{{accent-color}}';
    &.md-raised,
    &.md-fab {
      color: '{{accent-contrast}}';
      background-color: '{{accent-color}}';
      &:not([disabled]) {
        md-icon {
          color: '{{accent-contrast}}';
        }
        &:hover {
          background-color: '{{accent-color}}';
        }
        &.md-focused {
          background-color: '{{accent-700}}';
        }
      }
    }
    &:not([disabled]) {
      md-icon {
        color: '{{accent-color}}';
      }
    }
  }

  &[disabled],
  &.md-raised[disabled],
  &.md-fab[disabled],
  &.md-accent[disabled],
  &.md-warn[disabled] {
    color: '{{foreground-3}}';
    cursor: not-allowed;

    md-icon {
      color: '{{foreground-3}}';
    }
  }
  &.md-raised[disabled],
  &.md-fab[disabled] {
    background-color: '{{foreground-4}}';
  }
  &[disabled] {
    background-color: transparent;
  }
}
