/**
 * product-stock.css
 */

/* Component: Product Stock */
.product-stock {
  display: flex;
  align-items: center;
  align-self: flex-start;
  gap: 6px;
  margin-top: 2px;
  color: var(--color-grey-dark);
  font-size: var(--font-size-small);
  letter-spacing: -0.2px;

  &.is-sold-out::before,
  &.is-in-stock::before {
    content: '';
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-grey);
  }

  &.is-in-stock::before {
    background: var(--color-green);
  }

  &.is-returning,
  &.is-low-stock {
    padding: 2px 8px;
    border-radius: var(--border-radius-default);
  }

  &.is-returning {
    background: var(--color-purple);
    color: var(--color-white);
  }

  &.is-low-stock {
    background: var(--color-yellow);
    color: var(--color-black);
  }
}