@mixin menu-group-link() { ... }@mixin menu-group-link() { 
  @include typography.style-as('paragraph-1');

  padding-left: spacing.get('s8');
  padding-right: spacing.get('s4');
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background-color: settings.$background-color;
  border: settings.$border-width solid settings.$border-color;
  height: settings.$height;
  transition: border-color 200ms, background-color 200ms;
  text-decoration: none;

  &,
  &:visited {
    color: settings.$text-color;
  }

  &:hover {
    color: settings.$text-color-hover;
    background-color: settings.$background-color-hover;
    text-decoration: none;
  }

  &:focus {
    border-color: settings.$border-color-focus;
    outline: none;
  }

  &:active {
    background-color: settings.$background-color-active;
  }

  &--current {
    font-weight: typography.get-weight('semibold');
  }
 }

@mixin menu-group-link-label() { ... }@mixin menu-group-link-label() { 
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
 }

@mixin menu-group-toggle() { ... }@mixin menu-group-toggle() { 
  @include typography.style-as('paragraph-1');

  padding: 0 spacing.get('s4');
  display: block;
  width: 100%;
  background-color: settings.$group-toggle-background;
  border: none;
  cursor: pointer;
  height: settings.$group-toggle-height;
  text-align: left;
  transition: background-color 200ms;

  &,
  &:hover {
    color: settings.$group-toggle-text-color;
  }

  &:hover {
    background-color: settings.$group-toggle-background-hover;
  }

  &:focus {
    background-color: settings.$group-toggle-background-focus;
    outline: none;
  }

  &:active {
    background-color: settings.$group-toggle-background-active;
  }
 }

@mixin fade-transition() { ... }@mixin fade-transition() { 
  animation-name: kibMenusGroupCollapse;
  animation-duration: 0.2s;

  // stylelint-disable-next-line keyframes-name-pattern
  @keyframes kibMenusGroupCollapse {
    from {
      height: 0;
      opacity: 0;
    }

    to {
      opacity: 1;
      height: max-content;
    }
  }
 }

$border-width: unit.rem(1px) !default;

$text-color: color.get('menu', 'alternate', 'active', 'text') !default;

$text-color-hover: $text-color !default;

$background-color: transparent !default;

$background-color-hover: color.get('menu', 'alternate', 'hover', 'primary') !default;

$background-color-active: color.get('menu', 'alternate', 'pressed', 'primary') !default;

$background-color-current: $background-color !default;

$border-color: transparent !default;

$border-color-focus: color.get('menu', 'alternate', 'focused', 'border') !default;

$height: kib-core.dimensions-get('huge') !default;

$group-toggle-text-color: color.get('menu', 'alternate', 'active', 'text') !default;

$group-toggle-background: transparent !default;

$group-toggle-background-hover: color.get('menu', 'alternate', 'hover', 'primary') !default;

$group-toggle-background-focus: color.get('menu', 'alternate', 'selected', 'primary') !default;

$group-toggle-background-active: color.get('menu', 'alternate', 'pressed', 'primary') !default;

$group-toggle-height: kib-core.dimensions-get('huge') !default;