.glow-btn {
  border: 2px solid;
  color: @darkText !important;
  transition: all 0.5s ease;

  .glow(@color) {
    border-color: @color;
    background-color: rgba(@color, 0.2);
    &:hover {
      background-color: rgba(@color, 0.3);
      box-shadow: inset 0px 0px 10px 3px @color, 0px 0px 10px 3px @color;
      border-color: @black;
    }
  }

  .darkMode() {
    color: @white !important;
  }

  [data-theme="dark"] &,
  &.dark-mode {
    .darkMode();
  }

  &.blue-btn {
    .glow(@glowBlue);
  }

  &.green-btn {
    .glow(@glowGreen);
  }

  &.red-btn {
    .glow(@glowRed);
  }

  &.purple-btn {
    .glow(@glowPurple);
  }

  &.orange-btn {
    .glow(@glowOrange);
  }

  &.yellow-btn {
    .glow(@glowYellow);
  }

  &.pink-btn {
    .glow(@glowPink);
  }

  &.black-btn {
    .glow(@glowBlack);

    [data-theme="dark"] &,
    &.dark-mode {
      .glow(@glowWhite);
    }
  }

  &.white-btn {
    .glow(@glowWhite);
  }
}