@use 'variables' as *;

@mixin box-shadow-button() {
  box-shadow: rgba(0, 0, 0, 0.24) 0 2px 3px;
}

@mixin smooth-scrollbar() {
  scrollbar-gutter: stable;
  --scrollbar-color: transparent;

  &:hover {
    --scrollbar-color: #{$gray-light};
  }

  &::-webkit-scrollbar {
    width: 12px;
  }

  &::-webkit-scrollbar-track {
    border-radius: 8px;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 4px solid transparent;
    background-clip: content-box;
    background-color: var(--scrollbar-color);
  }
}