@use '../core/style/spacing' as *;
@use '../icon/icon' as *;

$chip-height-dense: 18px;
$chip-icon-size-dense: 14px;
$chip-remove-icon-size-dense: 14px;

$chip-height: 24px;
$chip-icon-size: 18px;
$chip-remove-icon-size: 14px;

$chip-height-large: 32px;
$chip-icon-size-large: 24px;
$chip-remove-icon-size-large: 18px;

.mat-mdc-chip.mat-mdc-standard-chip {
  height: $chip-height;

  .mat-mdc-chip-avatar {
    @include icon-size($chip-icon-size);
  }

  .mat-mdc-chip-remove.mat-icon {
    @include icon-size($chip-remove-icon-size);
  }

  &[dense] {
    height: $chip-height-dense;

    .mat-mdc-chip-avatar {
      @include icon-size($chip-icon-size-dense);
    }

    .mat-mdc-chip-remove.mat-icon {
      @include icon-size($chip-remove-icon-size-dense);
    }
  }

  &[large] {
    height: $chip-height-large;

    .mat-mdc-chip-avatar {
      @include icon-size($chip-icon-size-large);
    }

    .mat-mdc-chip-remove.mat-icon {
      @include icon-size($chip-remove-icon-size-large);
    }
  }
}