//
// Scroll mixins
// -----------------------------------------

@mixin styled-scroll-hor(
  $height: $scroll-width,
  $background-color: null,
  $thumb-color: null
) {
  @each $theme, $map in $themes {
    .#{$theme} & {
      $background-color-2: null;
      @if ($background-color == null) {
        $background-color-2: map-get($map, scroll-bg);
      } @else {
        $background-color-2: map-get($map, $background-color);
      }

      $thumb-color-2: null;
      @if ($thumb-color == null) {
        $thumb-color-2: map-get($map, scroll-thumb);
      } @else {
        $thumb-color-2: map-get($map, $thumb-color);
      }

      @include styled-scroll-hor-no-themes(
        $height,
        $background-color-2,
        $thumb-color-2
      );
    }
  }
}

@mixin styled-scroll-hor-no-themes(
  $height: $scroll-width,
  $background-color,
  $thumb-color
) {
  &::-webkit-scrollbar {
    height: $height;
    background-color: $background-color;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: $thumb-color;
  }
}

@mixin styled-scroll-vert(
  $height: $scroll-width,
  $background-color: null,
  $thumb-color: null
) {
  @each $theme, $map in $themes {
    .#{$theme} & {
      $background-color-2: null;
      @if ($background-color == null) {
        $background-color-2: map-get($map, scroll-bg);
      } @else {
        $background-color-2: map-get($map, $background-color);
      }

      $thumb-color-2: null;
      @if ($thumb-color == null) {
        $thumb-color-2: map-get($map, scroll-thumb);
      } @else {
        $thumb-color-2: map-get($map, $thumb-color);
      }

      @include styled-scroll-vert-no-themes(
        $height,
        $background-color-2,
        $thumb-color-2
      );
    }
  }
}

@mixin styled-scroll-vert-no-themes(
  $width: $scroll-width,
  $background-color,
  $thumb-color
) {
  &::-webkit-scrollbar {
    width: $width;
    background-color: $background-color;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: $thumb-color;
  }
}