.v4-quantify {
  display: flex;
  align-items: center;
  gap: var(--lab-ds-semantic-selectable-space-gap-s);
}

.v4-quantify button {
  padding: var(--lab-ds-semantic-selectable-space-padding-sm);
  cursor: pointer;
  color: var(--lab-ds-semantic-color-fg-default);

  outline: none;

  background-color: var(--lab-ds-semantic-selectable-color-bg-default);
  border-radius: var(--lab-ds-semantic-selectable-border-radius-xs);
  border: var(--lab-ds-semantic-selectable-border-width-s) solid var(--lab-ds-semantic-selectable-color-border-default);
}

.v4-quantify-counter {
  display: flex;
  text-align: center;
  justify-content: center;
  padding-top: var(--lab-ds-semantic-selectable-space-padding-sm);
  padding-bottom: var(--lab-ds-semantic-selectable-space-padding-sm);
  padding-left: var(--lab-ds-semantic-selectable-space-padding-s);
  padding-right: var(--lab-ds-semantic-selectable-space-padding-s);
  gap: var(--lab-ds-semantic-selectable-space-gap-xs);
  font: var(--lab-ds-semantic-typography-body-none-decoration-p2-regular);
  color: var(--lab-ds-semantic-color-fg-default);
  min-width: 5.313rem;

  background-color: var(--lab-ds-semantic-selectable-color-bg-default);
  border-radius: var(--lab-ds-semantic-selectable-border-radius-xs);
  border: var(--lab-ds-semantic-selectable-border-width-s) solid var(--lab-ds-semantic-selectable-color-border-default);
}

.v4-quantify-option-divides {
  color: var(--lab-ds-semantic-color-fg-disabled);
}

.v4-quantify-option-max-item {
  color: var(--lab-ds-semantic-color-fg-disabled);
}

.v4-quantify button:hover {
  background-color: var(--lab-ds-semantic-selectable-color-bg-hover);
  border-color: var(--lab-ds-semantic-selectable-color-border-default);
}

.v4-quantify button:active {
  background-color: var(--lab-ds-semantic-selectable-color-bg-default);
  border-color: var(--lab-ds-semantic-selectable-color-primary-press);
  color: var(--lab-ds-semantic-selectable-color-primary-press);
  outline: none;
}

.v4-quantify button:focus {
  outline-style: solid;
  outline-offset: var(--lab-ds-semantic-selectable-space-padding-xxs);
  outline-color: var(--lab-ds-semantic-selectable-color-primary-focus);
  outline-width: var(--lab-ds-semantic-selectable-border-width-s);
  background-color: var(--lab-ds-semantic-selectable-color-bg-default);
}

.v4-quantify button:disabled {
  background-color: var(--lab-ds-semantic-selectable-color-bg-disabled);
  border-color: var(--lab-ds-semantic-selectable-color-border-disabled);
  color: var(--lab-ds-semantic-color-fg-disabled);
  cursor: not-allowed;
}