@import-normalize;
@tailwind base;
@tailwind components;
@tailwind utilities;


*,
*::before,
*::after 
{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

@layer components {
  .sidebar-icon {
    @apply relative flex items-center justify-center 
    h-12 w-12 mt-2 mb-2 mx-auto  
  bg-orange-400 hover:bg-orange-800
  text-black hover:text-white
    hover:rounded-xl rounded-3xl
    transition-all duration-300 ease-linear
    cursor-pointer shadow-lg ;
    --bs-link-color: none;
    --bs-link-hover-color: none;
  }

  .sidebar-tooltip {
    @apply absolute w-auto p-2 m-2 min-w-max left-14 rounded-md shadow-md
    text-white bg-orange-800 
    text-xs font-bold 
    transition-all duration-100 scale-0 origin-left;
  }

  .sidebar-hr {
    @apply bg-gray-200
    border border-gray-200 rounded-full
    mx-2;
  }
}