@tailwind components;

@layer components {
  .btn {
    @apply inline-flex justify-center items-center content-center h-9 leading-5 rounded-lg px-4 py-2 text-base cursor-pointer;
  }

  .btn-default {
    @apply border-solid border border-gray-200 cursor-pointer text-gray-500 hover:bg-white hover:shadow-sm hover:border-gray-300;
  }

  .btn-default-disabled {
    @apply border-solid border border-gray-200 bg-gray-200 cursor-not-allowed text-gray-800;
  }

  .btn-primary {
    @apply bg-primary-600 hover:bg-primary-600/75 cursor-pointer text-white hover:shadow-sm;
  }

  .btn-primary-disabled {
    @apply bg-primary-200 cursor-not-allowed text-white;
  }

  .btn-warning {
    @apply bg-red-600 hover:bg-red-600/75 cursor-pointer text-white hover:shadow-sm;
  }

  .btn-warning-disabled {
    @apply bg-red-600/75 cursor-not-allowed text-white;
  }
}