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

html {
  scroll-behavior: smooth;
  @apply bg-zinc-800 text-white autofill:bg-yellow-500;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0px 1000px #262626 inset;
  background: #27272a;
  transition: background-color 5000s ease-in-out 0s;
}

::-webkit-scrollbar {
  @apply h-4 w-4;
}

::-webkit-scrollbar-track {
  @apply rounded rounded-full bg-zinc-900;
}

body::-webkit-scrollbar-track {
  @apply rounded rounded-full bg-pink-600;
}

::-webkit-scrollbar-thumb {
  @apply rounded rounded-full bg-zinc-600 hover:bg-zinc-500;
}

body::-webkit-scrollbar-thumb {
  @apply rounded rounded-full bg-cyan-500 hover:bg-cyan-400;
}
