/*
  ----------------------------------------
  Admin (superadmin shared layout)
  ----------------------------------------
*/

@layer styles {
  .admin {
    /* Admin nav links (left menu) */
    .nav-link-admin {
      display: flex;
      width: 100%;
      align-items: center;
      gap: 0.4rem;
      text-decoration: none;
      color: var(--midtone);
      padding: 0.5rem 0.5rem;
      border-radius: var(--rounded-sm);
      transition: color 300ms ease;

      &.active,
      &:hover,
      &:active {
        background: var(--darker);
        color: var(--white);
      }

      svg {
        width: 1.25rem;
        height: 1.25rem;
      }
    }
  }
}