/* Single Selection */
.select2-container--tailwindcss-3 .select2-selection--single {
  @apply relative w-full h-auto min-h-[2.25rem] py-1.5 pl-3 pr-8 text-left text-base sm:text-sm/6 transition-colors duration-200 ease-in-out bg-white border border-gray-300 rounded-md cursor-pointer dark:bg-white/5 dark:text-white dark:border-white/10;
}

/* Rendered text */
.select2-container--tailwindcss-3 .select2-selection--single .select2-selection__rendered {
  @apply block pl-0 pr-0 text-gray-900 truncate dark:text-white;
}

/* Placeholder */
.select2-container--tailwindcss-3 .select2-selection--single .select2-selection__placeholder {
  @apply text-gray-400 dark:text-gray-500;
}

/* Arrow container */
.select2-container--tailwindcss-3 .select2-selection--single .select2-selection__arrow {
  @apply absolute inset-y-0 right-0 flex items-center pr-2;
}

/* Arrow */
.select2-container--tailwindcss-3 .select2-selection--single .select2-selection__arrow b {
  @apply w-5 h-5 text-gray-400 bg-center bg-no-repeat bg-contain;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
}

/* Disabled state */
.select2-container--tailwindcss-3.select2-container--disabled .select2-selection--single {
  @apply text-gray-500 cursor-not-allowed bg-gray-50 border-gray-200 dark:bg-white/20 dark:border-white/5;
}

.select2-container--tailwindcss-3.select2-container--disabled.select2-container--focus .select2-selection--single {
  @apply ring-0 border-gray-200 dark:border-white/5;
}

/* Clear button */
.select2-container--tailwindcss-3 .select2-selection--single .select2-selection__clear {
  @apply font-bold absolute inset-y-0 right-0 flex items-center pr-[2rem] text-base sm:text-sm/6 text-gray-400 cursor-pointer hover:text-gray-700;
}

/* Hide clear button when disabled */
.select2-container--tailwindcss-3.select2-container--disabled .select2-selection--single .select2-selection__clear {
  @apply hidden;
}

/* Focus styles for keyboard navigation */
.select2-container--tailwindcss-3.select2-container--focus .select2-selection--single {
  @apply ring-1 ring-indigo-600 border-indigo-600 outline-none;
}

/* RTL Support */
.select2-container--tailwindcss-3[dir="rtl"] .select2-selection--single .select2-selection__rendered {
  @apply pl-10 pr-3;
}