/**
 * Seeds thin-scrollbar utility.
 *
 * Tailwind-hybrid replacement for the legacy styled-components `thinScrollbar`
 * mixin. Apply `seeds-scrollbar-thin` to any scrollable element.
 *
 * Requires @sproutsocial/seeds-react-theme/dist/theme-all.css (or theme.css)
 * loaded for the --color-menuItem-bg-active variable and dark-mode support.
 *
 * Wrapped in `@layer components` so consumer Tailwind utilities (unlayered) win
 * the cascade over this component-level style.
 */

@layer components {
  .seeds-scrollbar-thin {
    scrollbar-width: thin;
    scrollbar-color: var(--color-menuItem-bg-active) transparent;
  }
}