@mixin container() { ... }@mixin container() { 
  display: block;
  width: 100%;
 }

@mixin label() { ... }@mixin label() { 
  @include kib-core.type-size-block-element(base);

  margin-bottom: settings.$label-spacing;
 }

@mixin indicator() { ... }@mixin indicator() { 
  display: block;
  width: 100%;
  height: settings.$height;
  transform-origin: left;
  transition: transform 0.3s, background-color 0.3s;
  background-color: settings.$default-color;
  border-radius: settings.$border-radius;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }
 }

@mixin value() { ... }@mixin value() { 
  color: settings.$value-color;
 }

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

$background-color: color.get('action', 'switch', 'background', 'on', '03') !default;

$default-color: color.get('action', 'switch', 'background', 'on', 'primary') !default;

$border-radius: kib-core.dimensions-get(small) !default;

$value-color: color.get('text', 'secondary') !default;

$label-spacing: spacing.get('s2') !default;

$wrapper-spacing: spacing.get('s1') !default;

$indicator-spacing: spacing.get('s2') !default;