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

@layer components {
  .pagination a, .pagination span {
    @apply inline-flex items-center px-3 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 hover:bg-gray-50 hover:text-gray-700;
  }

  .pagination .current {
    @apply inline-flex items-center px-3 py-2 text-sm font-medium text-white bg-blue-600 border border-blue-600;
  }

  .pagination .first a, .pagination .prev a {
    @apply rounded-l-md;
  }

  .pagination .last a, .pagination .next a {
    @apply rounded-r-md;
  }

  .pagination .gap {
    @apply inline-flex items-center px-3 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300;
  }
}