@import './global/variables.scss';
@import './global/mixins';

.label {
  position: relative;
  display: inline-block;
  padding-left: 18px;
  font-size: 12px;
  line-height: 20px;

  // label dots
  &::before {
    position: absolute;
    top: 3px;
    left: 0;
    width: 12px;
    height: 12px;
    background-color: $slate-20;
    border-radius: 50%;
    content: '';
  }

  &-sent,
  &-delivered,
  &-triggered {
    @include label($mantis);
  }

  &-live {
    @include label($sg-blue);
  }

  &-success {
    @include label($grass-stain);
  }

  &-scheduled {
    @include label($cobalt);
  }

  &-pick-winner {
    @include label($wild-strawberry);
  }

  &-expired {
    @include label($ron-burgundy);
  }

  &-draft,
  &-global {
    @include label($steel);
  }

  &-list,
  &-progress {
    @include label($bluebird);
  }

  &-segment {
    @include label($seafoam);
  }

  &-valid {
    @include label($spruce);
  }

  &-bounced,
  &-canceled,
  &-paused,
  &-disabled,
  &-error,
  &-invalid {
    @include label($ron-burgundy);
  }

  &-optimized {
    @include label($burnt-orange);
  }

  &-risky {
    @include label($carrot);
  }

  &-ab-test {
    display: block;
    font-size: 11px;
    line-height: 15px;
  }

  // remove status dot for a/b test labels
  &-ab-test::before {
    content: none;
  }
}

.filter-option.label {
  &-blocks {
    @include label($sangria);
  }
  &-bounce-drops {
    @include label($carrot);
  }
  &-bounces {
    @include label($ron-burgundy);
  }
  &-clicks {
    @include label($mantis);
  }
  &-deferred {
    @include label($lavender);
  }
  &-delivered {
    @include label($sg-blue);
  }
  &-invalid-emails {
    @include label($seafoam);
  }
  &-opens {
    @include label($lime);
  }
  &-processed {
    @include label($steel);
  }
  &-requests {
    @include label($spruce);
  }
  &-spam-report-drops {
    @include label($cobalt);
  }
  &-spam-reports {
    @include label($wild-strawberry);
  }
  &-unique-clicks {
    @include label($crown);
  }
  &-unique-opens {
    @include label($screample);
  }
  &-unsubscribe-drops {
    @include label($mango);
  }
  &-unsubscribes {
    @include label($burnt-orange);
  }
}