@import "./../../../../../assets/style/colors.scss";

.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  background-color: blue;
  border: 1px solid blue;
  transition: 300ms ease-in-out;
  cursor: pointer;
  &:not(:disabled):hover {
    background-color: white;
    border: 1px solid blue;
    .icon {
      transition: 300ms ease-in-out;
      filter: brightness(0) saturate(100%) invert(26%) sepia(77%)
        saturate(2342%) hue-rotate(228deg) brightness(83%) contrast(115%);
    }
  }
  &:disabled {
    background-color: lightblue;
    color: darken(white, 10%);
    border: 1px solid lightblue;
    cursor: default;
  }
  .icon {
    height: 32px;
    width: auto;
  }
}
