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

html {
  min-height: 100vh;
}

body {
  background-image: url("/assets/pkp-2b2b5481.webp");
  background-repeat: repeat;
  background-size: 100% auto;
  background-position: center top;
  background-attachment: scroll;
  min-height: 100vh;
}

/* PAGY */

.page-item {
  @apply inline-block;
}

.page-link {
  @apply relative z-10 inline-flex items-center justify-center px-4 py-2 mx-1 text-sm font-medium border border-gray-300 bg-white text-gray-700 hover:bg-slate-100 hover:text-blue-600 transition-colors duration-150 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:z-20;
}

.page-item.active .page-link {
  @apply bg-blue-600 text-white border-blue-600 cursor-default pointer-events-none shadow;
}

.page-item:not(.active) .page-link {
  @apply hover:bg-blue-50 hover:text-blue-700;
}

.page-item.disabled .page-link {
  @apply bg-gray-100 text-gray-400 border-gray-200 cursor-not-allowed pointer-events-none;
}

ul[aria-label="pager"] {
  @apply flex flex-row items-center justify-center gap-0;
}

nav[role="navigation"] {
  @apply my-4;
}