@import 'projects/fei-components/src/scss/variables.scss';

:host {
  display: inline-block;
}

.button {
  padding: 8px 16px;
  cursor: pointer;
  -webkit-transition: 0.15s ease-out;
  transition: 0.15s ease-out;
  &.s {
    padding: 6px 12px;
  }
  &.m {
    padding: 8px 16px;
  }
  &.l {
    padding: 12px 20px;
  }
  &.full {
    width: 100%;
  }
  &.default, &.danger {
    &:hover {
      -webkit-box-shadow: map-get($map: $shadow, $key: '4');
              box-shadow: map-get($map: $shadow, $key: '4');
    }
  }
  &.cancel {
    background-color: rgba($color: #000000, $alpha: 0);
  }
  &:focus {
    outline: none;
  }
  &:disabled {
    background-color: map-get($map: $colors, $key: 'black250') !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
    -webkit-transform: none !important;
            transform: none !important;
    cursor: initial !important;
  }
}