.btn {
   @include btn;

   &.is-submitting {
      color: transparent !important;
      pointer-events: none !important;
      position: relative;

      &::after {
         animation: submit-loader 1.25s infinite linear;
         border: 3px solid $white;
         border-radius: 50%;
         border-right-color: transparent;
         content: "";
         display: block;
         position: absolute;
         left: calc(50% - 10px);
         top: calc(50% - 10px);
         width: 20px;
         height: 20px;
      }
   }
}

.btn-reset {
   appearance: none;
   border: 0;
   background: transparent;
   color: inherit;
}

.btn-link-reset {
   appearance: none;
   border: 0;
   background: transparent;
   color: inherit;
   padding: 0;
   cursor: pointer;

   @include underline-default;
}

.btn-primary {
   @include btn-primary;
}

.btn-ctr {
   @include btn-ctr;
}

.btn-secondary {
   @include btn-secondary;
}

.btn-white {
   @include btn-white;
}

.btn-primary-outline {
   @include btn-primary-outline;
}

.btn-outline {
   @include btn-outline;
}

.btn-error {
   @include btn-error;
}

.btn-block {
   display: flex;
   width: 100%;

   + .btn-block {
      margin-top: $gap-width;
   }
}

.btn-lg {
   @include btn-lg;
}

.btn-sm {
   @include btn-sm;
}

// na konci aby prebijel predchozi deklarace
.btn.disabled,
.btn:disabled {
   pointer-events: none;

   @include btn-disabled;
}

.btn-link {
   @include btn-link;
}

@keyframes submit-loader {
   0% {
      transform: rotate(0);
   }

   100% {
      transform: rotate(360deg);
   }
}
