// New Icons and Icon Buttons
//================================================== //

.icon {
  fill: transparent;

  &.icon-empty-state {
    fill: $ids-color-brand-primary-base;
    width: 80px;
  }
}

.empty-fill {
  fill: transparent;
}

.icon.app-header span:not(.audible) {
  height: 1px;
}

// Psuedo-element Icons
//================================================== //

.icon.plus-minus {
  &::before,
  &::after {
    border-radius: 0;
    content: '';
    height: 1px;
    left: 0.65em;
    top: 1.4em;
    width: 16px;
  }
}

.is-firefox {
  .icon-dirty.dirty-checkbox.is-checked {
    top: 1.5px !important;
  }
}

.field .icon-error {
  height: 18px;
  width: 18px;
  top: -3px !important
}