/*
@import "src/style/styles";

:host {
  @extend %inline-block;
  background-color: rgba(white, 0.25);
  width: 30px;
  height: 20px;

  > div {
    @extend %flex-center;
    @extend %full-width-height;
    > div {
      width: 5px;
      height: 5px;
      flex-shrink: 0;
      flex-grow: 0;
      margin-right: 2px;
    }

    &.low, &.empty, &.none {
      > div.square-1 {
        background-color: $tp-color-stock-low;
      }
      > div.square-2, div.square-3 {
        background-color: $tp-color-stock-empty;
      }
    }

    &.medium {
      > div.square-1, div.square-2 {
        background-color: $tp-color-stock-medium;
      }
      > div.square-3 {
        background-color: $tp-color-stock-empty;
      }
    }

    &.high {
      > div.square-1, div.square-2, div.square-3 {
        background-color: $tp-color-stock-high;
      }
    }
  }
}
*/