.reading-mode-tooltip {
  opacity: 1 !important;
  padding: 10px !important;
  line-height: 1;
}

.reading-mode-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 15px;
  border-radius: 0.25rem;
  border: 0;
  cursor: pointer;
  width: max-content;
  transition: all 0.2s ease-in-out;
  text-decoration: none;

  i {
    margin-right: 7px;
  }

  .components-spinner {
    margin: 0 7px 0 0;
  }

  &.disabled {
    opacity: 0.5;
    pointer-events: none;
  }

  &.btn-primary {
    background: #675ED5;
    color: #fff;

    &:hover {
      background: darken(#675ED5, 20%);
    }

  }

  &.btn-secondary {
    background-color: #fff;
    color: #00a0d2;

    &:hover {
      background-color: #fff;
      color: #00a0d2;
    }

  }

  &.btn-danger {
    background-color: #ff0000;
    color: #fff;

    &:hover {
      background-color: #ff0000;
      color: #fff;
    }

  }

  &.btn-success {
    background-color: #00a0d2;
    color: #fff;

    &:hover {
      background-color: #00a0d2;
      color: #fff;
    }

  }

  &.btn-warning {
    background-color: #ffc107;
    color: #fff;

    &:hover {
      background-color: #ffc107;
      color: #fff;
    }
  }

  &.btn-info {
    background-color: #00a0d2;
    color: #fff;

    &:hover {
      background-color: #00a0d2;
      color: #fff;
    }
  }

}