/* SIDE BAR */

@layer components {

  a.nav-item {
    @apply text-heaphy-200 hover:bg-heaphy-500 hover:text-white flex items-center px-2 py-3 md:py-2 rounded-md text-base md:text-sm font-medium focus:outline-none focus:ring focus:ring-tahuna-400;
  }

  a.nav-item.selected {
    @apply bg-heaphy-700 text-white;
  }

  .nav-section-header {
    @apply px-2 py-2 text-tahuna-500 text-xs font-medium tracking-wider uppercase;
  }
}