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

/* Pagy Tailwind CSS styles */

/* Navigation container */
.pagy {
  @apply flex items-center justify-center space-x-1;
}

/* Navigation links */
.pagy a {
  @apply relative inline-flex items-center px-3 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:z-10 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500;
}

/* Current page */
.pagy .current {
  @apply relative inline-flex items-center px-3 py-2 text-sm font-medium text-white bg-blue-600 border border-blue-600 rounded-md cursor-default;
}

/* Disabled links */
.pagy .disabled {
  @apply relative inline-flex items-center px-3 py-2 text-sm font-medium text-gray-400 bg-gray-100 border border-gray-300 rounded-md cursor-not-allowed;
}

/* Gap indicator */
.pagy .gap {
  @apply relative inline-flex items-center px-3 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md cursor-default;
}

/* Info text */
.pagy-info {
  @apply text-sm text-gray-700;
}

/* Limit selector */
.pagy-limit-selector {
  @apply inline-flex items-center text-sm;
}

.pagy-limit-selector select {
  @apply ml-2 rounded-md border-gray-300 text-sm focus:border-blue-500 focus:ring-blue-500;
}

/* Configure dark mode variant for class-based toggling */
@variant dark (&:where(.dark, .dark *));

/* === Global Smooth Scrolling === */
html {
  scroll-behavior: smooth;
}

/* Enhanced smooth scrolling for better performance */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
  
  /* Smooth scrolling for all scroll containers */
  * {
    scroll-behavior: smooth;
  }
}

/* Respect user preference for reduced motion */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  
  * {
    scroll-behavior: auto;
  }
}