@tailwind base;
@tailwind components;
@tailwind utilities;
/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/
@layer base {
h1 {
  @apply mb-2 text-primary-900 text-3xl font-bold tracking-tight dark:text-white;
}
h2 {
  @apply mb-2 text-primary-900 text-2xl font-bold tracking-tight dark:text-white;
}
h3 {
  @apply mb-2 text-primary-900 text-xl font-bold tracking-tight dark:text-white;
}
a {
   @apply md:hover:text-primary-900 hover:underline;
}
label {
  @apply block text-slate-700 text-sm mb-1;
}
}


@layer utilities {
  /* Chrome, Safari and Opera */
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }

  .no-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }

  /* Track */
.personal-scrolbar::-webkit-scrollbar {
  @apply h-1;
}

.personal-scrolbar::-webkit-scrollbar-thumb {
  @apply bg-primary-300;
}

.personal-scrolbar::-webkit-scrollbar-track {
  @apply bg-primary-100;
}

.personal-scrolbar::-webkit-scrollbar-thumb:hover {
  @apply bg-primary-500;
}



}