@layer components {
  .cart-item-quantity-stepper {
    width: 100%;

    .cart-item-quantity-stepper__controls {
      width: 100%;
      justify-content: space-between;
    }

    .cart-item-quantity-stepper__stepper-button[data-type="primary"] {
      width: 3rem;
      padding-block: 0.875rem;
    }

    .cart-item-quantity-stepper__add-button[data-type="primary"] {
      width: 100%;
      padding-block: 0.875rem;
    }

    .cart-item-quantity-stepper__value {
      font-size: 1.125rem;
      color: var(--color-red-600);
      white-space: nowrap;
      flex: 1;
      text-align: center;
    }
  }
}