@tailwind base;
@tailwind components;
@tailwind utilities;
@reference "tailwindcss";

/* util kecil opsional */
.btn { @apply inline-flex items-center justify-center rounded-lg border px-3 py-2 text-sm;
       @apply border-slate-300 bg-white text-slate-800 hover:bg-slate-50; }
.btn-primary { @apply border-transparent text-white hover:opacity-95; }
.card { @apply bg-white border border-slate-200 rounded-xl shadow-sm; }
.input { @apply w-full rounded-lg border border-slate-300 px-3 py-2 outline-none
               focus:border-green-400 focus:ring-2 focus:ring-green-200; }
.badge { @apply inline-flex items-center rounded-full border border-teal-200 bg-teal-50 px-2 py-0.5 text-xs text-teal-700; }