@import "tailwindcss";
@import "tom-select/dist/css/tom-select.default.css";
@import 'tippy.js/dist/tippy.css';

/* ── Pagination ──────────────────────────────────────────────────────── */

.pagination a,
.pagination span,
.pagination .current {
  @apply px-3 py-1.5 rounded-md bg-gray-200 transition font-medium dark:bg-gray-700 dark:text-gray-300 text-sm min-w-[2rem] text-center;
}

.pagination a:hover {
  @apply bg-gray-300 dark:bg-gray-600;
}

.pagination .current {
  @apply bg-gradient-to-r from-blue-500 to-blue-800 text-white font-bold shadow-md not-italic;
}

.pagination .gap {
  @apply text-gray-400 dark:text-gray-500 px-1 py-1.5 bg-transparent;
}

/* ── TomSelect — aligned with app input style ────────────────────────── */

/* Wrapper: full width, no extra margin */
.ts-wrapper {
  @apply w-full;
}

/* Control: the visible chip + input box */
.ts-wrapper .ts-control {
  @apply w-full rounded-md border border-gray-300 bg-white text-gray-900 text-sm px-3 py-2 shadow-none cursor-text;
  min-height: 42px;
}

.dark .ts-wrapper .ts-control {
  @apply border-gray-700 bg-gray-800 text-white;
}

/* Focus ring */
.ts-wrapper.focus .ts-control {
  @apply border-indigo-500 ring-2 ring-indigo-500/30 outline-none;
}

/* Search input inside the control */
.ts-wrapper .ts-control input {
  @apply text-gray-900 text-sm bg-transparent outline-none;
}

.dark .ts-wrapper .ts-control input {
  @apply text-white;
}

/* Selected chips */
.ts-wrapper .ts-control .item {
  @apply bg-indigo-600 text-white text-xs font-medium rounded px-2 py-0.5 mr-1 flex items-center gap-1;
}

/* Remove button on chips */
.ts-wrapper .ts-control .item .remove {
  @apply text-white/70 hover:text-white no-underline font-bold ml-0.5;
}

/* Dropdown container */
.ts-wrapper .ts-dropdown {
  @apply bg-white border border-gray-300 rounded-md shadow-lg text-sm mt-1;
}

.dark .ts-wrapper .ts-dropdown {
  @apply bg-gray-800 border-gray-700;
}

/* Each option in the dropdown */
.ts-wrapper .ts-dropdown .option {
  @apply text-gray-900 px-3 py-2 cursor-pointer;
}

.dark .ts-wrapper .ts-dropdown .option {
  @apply text-white;
}

/* Hovered / keyboard-focused option */
.ts-wrapper .ts-dropdown .option.active {
  @apply bg-indigo-50 text-indigo-700;
}

.dark .ts-wrapper .ts-dropdown .option.active {
  @apply bg-indigo-600 text-white;
}

/* ── Scrollbar utilities ─────────────────────────────────────────────── */

.scrollbar-none {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.scrollbar-none::-webkit-scrollbar {
  display: none;
}

/* ── Misc ────────────────────────────────────────────────────────────── */

button {
  @apply hover:cursor-pointer;
}
