@layer components {
  .primary-btn {
    @apply px-4 py-2 rounded-md bg-primary text-primary-content shadow hover:bg-primary-focus;
  }
  .secondary-btn {
    @apply px-4 py-2 rounded-md bg-secondary text-secondary-content shadow hover:bg-secondary-focus;
  }
  .small-btn {
    @apply px-2 py-1 text-sm rounded-md;
  }
  .icon-btn {
    @apply rounded-full p-2 w-10 h-10 inline-flex items-center justify-center shadow hover:bg-base-200;
  }
}