@import "../main.css";

@utility scrollbar {
  &::-webkit-scrollbar {
    width: var(--spacing-micro);
    height: var(--spacing-micro);
  }

  &::-webkit-scrollbar-track {
    background: var(--color-ui);
  }

  &::-webkit-scrollbar-thumb {
    background: var(--color-ui--border);
  }

  &::-webkit-scrollbar-corner {
    background: var(--color-ui--border);
  }
}

@utility scrollbar--* {
  &::-webkit-scrollbar {
    width: --value(--spacing-micro-*, [integer]);
    height: --value(--spacing-micro-*, [integer]);
  }

  &::-webkit-scrollbar-thumb {
    background: --value(--color-ui-*, [color]);
  }

  &::-webkit-scrollbar-corner {
    background: --value(--color-ui-*, [color]);
  }
}