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

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: theme('colors.gray.900');
}

::-webkit-scrollbar-thumb {
  background: theme('colors.gray.700');
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: theme('colors.gray.600');
}

/* Custom selection */
::selection {
  background: theme('colors.synor.500/30');
}

/* Prevent text selection during drag */
.no-select {
  user-select: none;
  -webkit-user-select: none;
}

/* Smooth transitions */
* {
  @apply transition-colors duration-150;
}

/* Focus styles */
*:focus-visible {
  @apply outline-none ring-2 ring-synor-500 ring-offset-2 ring-offset-gray-950;
}

/* Button base styles */
@layer components {
  .btn {
    @apply px-4 py-2 rounded-lg font-medium transition-all duration-200 inline-flex items-center justify-center gap-2;
  }

  .btn-primary {
    @apply bg-synor-600 hover:bg-synor-500 text-white;
  }

  .btn-secondary {
    @apply bg-gray-800 hover:bg-gray-700 text-gray-100;
  }

  .btn-danger {
    @apply bg-red-600 hover:bg-red-500 text-white;
  }

  .btn-ghost {
    @apply bg-transparent hover:bg-gray-800 text-gray-300 hover:text-white;
  }

  .input {
    @apply w-full px-4 py-3 bg-gray-900 border border-gray-700 rounded-lg text-white placeholder-gray-500 focus:border-synor-500 focus:ring-1 focus:ring-synor-500;
  }

  .card {
    @apply bg-gray-900 border border-gray-800 rounded-xl p-6;
  }
}