@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  * { box-sizing: border-box; }
  body { @apply text-gray-900; }
}

@layer components {
  .btn { @apply inline-flex items-center gap-2 px-4 py-2 rounded-lg font-medium text-sm transition-all duration-150 disabled:opacity-50 disabled:cursor-not-allowed; }
  .btn-primary { @apply btn bg-brand-500 text-white hover:bg-brand-600 shadow-sm; }
  .btn-secondary { @apply btn bg-white text-gray-700 border border-gray-200 hover:bg-gray-50; }
  .btn-danger { @apply btn bg-red-500 text-white hover:bg-red-600; }
  .input { @apply w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-transparent bg-white; }
  .badge { @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium; }
  .card { @apply bg-white rounded-xl border border-gray-100 shadow-sm; }
}