ujiro99/tlt

@import '../../css/mixin.css';

.sync-button {
  @mixin interactable;

  @apply bg-white;
  @apply font-semibold;
  @apply pt-0.5;
  @apply pb-1.5;
  @apply px-2;
  @apply border;
  @apply border-gray-200;

  font-size: 14px;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-1);

  &.mod-disable {
    cursor: not-allowed;
    opacity: 0.5;
  }

  &.mod-sync {
    cursor: wait;
  }

  &__sync-icon {
    @apply animate-spin;

    animation-duration: 1.5s;
    margin-right: 8px;
    margin-top: -2px;
    width: 1.4rem;
    height: 1.4rem;
    display: inline-block;
  }
}