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

@layer components {
  input.form-control {
    @apply bg-slate-900 border-slate-700 border-2 max-w-full text-sm focus:ring-green-500 focus:border-green-500 md:text-base;
  }

  label.form-control {
    @apply block text-sm mb-1;
  }

  .btn-secondary {
    @apply block bg-green-500 text-slate-900 px-2 py-1 border-2 border-slate-900 hover:bg-slate-900 hover:text-green-500;
  }

  .btn-primary {
    @apply block bg-slate-900 text-green-500 px-2 py-1 border-2 border-transparent hover:bg-slate-800 hover:text-green-400;
  }
}