@mixin navbar-vertical-variant($variant, $bg-color, $bg-image, $shadow) {
  .navbar-collapse {
    @if $bg-color {
      background-color: var(--#{$prefix}navbar-vertical-#{$variant}-bg-color);
    }
    @if $bg-image {
      background-image: var(--#{$prefix}navbar-vertical-#{$variant}-bg-image);
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      backface-visibility: hidden;
    }
    @if $shadow {
      box-shadow: $shadow !important;
    }
  }
  .navbar-nav .nav-item {
    .navbar-vertical-label-wrapper {
      min-height: 1.125rem;
    }
    .navbar-vertical-label {
      color: var(--#{$prefix}navbar-vertical-#{$variant}-label-color);
    }
    .nav-link {
      color: var(--#{$prefix}navbar-vertical-#{$variant}-link-color);
      &.dropdown-indicator:after {
        border-color: var(--#{$prefix}navbar-vertical-#{$variant}-link-color);
      }
      @include hover-focus {
        color: var(--#{$prefix}navbar-vertical-#{$variant}-link-hover-color);
        &.dropdown-indicator:after {
          border-color: var(
            --#{$prefix}navbar-vertical-#{$variant}-link-hover-color
          );
        }
      }
      &.active {
        color: var(--#{$prefix}navbar-vertical-#{$variant}-link-active-color);
      }
      &.nav-link-disable {
        color: var(
          --#{$prefix}navbar-vertical-#{$variant}-link-disable-color
        ) !important;
      }
    }
  }
  .navbar-vertical-divider {
    color: var(--#{$prefix}navbar-vertical-#{$variant}-hr-color);
  }
}

@mixin navbar-vertical-scrollbar($variant) {
  .windows {
    &.chrome {
      .navbar-vertical {
        @if ($variant) {
          &.navbar-#{$variant} .scrollbar::-webkit-scrollbar-thumb {
            background-color: var(
              --#{$prefix}navbar-vertical-#{$variant}-scrollbar-color
            );
          }
        } @else {
          .scrollbar::-webkit-scrollbar-thumb {
            background-color: var(
              --#{$prefix}navbar-vertical-#{$variant}-scrollbar-color
            );
          }
        }
      }
    }
    &.firefox {
      .navbar-vertical {
        @if ($variant) {
          &.navbar-#{$variant} .scrollbar {
            scrollbar-color: var(
                --#{$prefix}navbar-vertical-#{$variant}-scrollbar-color
              )
              transparent;
          }
        } @else {
          .scrollbar {
            scrollbar-color: var(
                --#{$prefix}navbar-vertical-#{$variant}-scrollbar-color
              )
              transparent;
          }
        }
      }
    }
  }
}
