@mixin chip-action-container() { ... }@mixin chip-action-container() { 
  @include common.chip-container-styles;
 }

@mixin generate-styles() { ... }@mixin generate-styles() { 
  --kib-chip-action-border-width: #{border.get('ct', 'chip', 'border-width', 'standard')};
  --kib-chip-action-border-color: #{color.get(
      'ct',
      'chip',
      'action',
      $variant,
      'active',
      'border-color'
    )};

  @include common.chip-base-styles;

  border: 0;
  border-radius: border.get('ct', 'chip', 'border-radius', 'standard');
  outline-color: transparent;
  outline-offset: border.get('ct', 'chip', 'border-width', 'halo-gap');
  outline-style: solid;
  outline-width: border.get('ct', 'chip', 'border-width', 'halo');
  background: color.get('ct', 'chip', 'action', $variant, 'active', 'bg-color');
  box-shadow: inset 0 0 0 var(--kib-chip-action-border-width) var(--kib-chip-action-border-color);
  color: color.get('ct', 'chip', 'action', $variant, 'active', 'text-color');

  &:hover {
    --kib-chip-action-border-color: #{color.get(
        'ct',
        'chip',
        'action',
        $variant,
        'hover',
        'border-color'
      )};
    background: color.get('ct', 'chip', 'action', $variant, 'hover', 'bg-color');
    color: color.get('ct', 'chip', 'action', $variant, 'hover', 'text-color');
  }

  &:focus-visible {
    --kib-chip-action-border-width: #{border.get('ct', 'chip', 'border-width', 'focused')};
    --kib-chip-action-border-color: #{color.get(
        'ct',
        'chip',
        'action',
        $variant,
        'focus',
        'border-color'
      )};
    outline-color: color.get('ct', 'chip', 'action', $variant, 'focus', 'halo-color');
    background: color.get('ct', 'chip', 'action', $variant, 'focus', 'bg-color');
    color: color.get('ct', 'chip', 'action', $variant, 'focus', 'text-color');
  }

  &:active {
    --kib-chip-action-border-width: #{border.get('ct', 'chip', 'border-width', 'standard')};
    --kib-chip-action-border-color: #{color.get(
        'ct',
        'chip',
        'action',
        $variant,
        'pressed',
        'border-color'
      )};
    outline-color: transparent;
    background: color.get('ct', 'chip', 'action', $variant, 'pressed', 'bg-color');
    color: color.get('ct', 'chip', 'action', $variant, 'pressed', 'text-color');
  }
 }

@mixin generate-icon-styles() { ... }@mixin generate-icon-styles() { 
  @include common.chip-icon-styles;

  fill: color.get('ct', 'chip', 'action', $variant, 'active', 'icon-color');

  &:hover {
    fill: color.get('ct', 'chip', 'action', $variant, 'hover', 'icon-color');
  }

  &:focus-visible {
    fill: color.get('ct', 'chip', 'action', $variant, 'focus', 'icon-color');
  }

  &:active {
    fill: color.get('ct', 'chip', 'action', $variant, 'pressed', 'icon-color');
  }
 }

@mixin chip-action-disabled-styles() { ... }@mixin chip-action-disabled-styles() { 
  @include common.chip-disabled-styles;
 }

@mixin icon-only() { ... }@mixin icon-only() { 
  padding: spacing.get('s2');
  border-radius: 50%;
 }