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

@layer components {
  .button {
    @apply transition-all duration-150 text-white bg-primary hover:bg-primary/85 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800;
  }
}

@layer utilities {
  .answeredQuestion {
    @apply font-bold dark:bg-gray-200 dark:border-2 dark:text-gray-600 border-[4px] !important;
  }
  .activeQuestion {
    @apply dark:bg-gray-900 bg-gray-600 dark:text-gray-200 text-white !important;
  }
}