$amyui-number-input-button-width:		36px

.amyui-number-input
	display: inline-block
	position: relative
	vertical-align: middle

	input
		padding-left: $amyui-number-input-button-width
		padding-right: $amyui-number-input-button-width
		width: auto

		&::-webkit-outer-spin-button,
		&::-webkit-inner-spin-button
			-webkit-appearance: none
			margin: 0

	span
		position: absolute
		width: $amyui-number-input-button-width
		height: 16px
		line-height: 16px
		z-index: 1
		top: 12px
		color: $input-border
		cursor: pointer
		text-align: center
		vertical-align: middle
		display: inline-block

		&:hover
			color: $input-border-focus

		&.ni-up
			right: 2px
			border-left: 1px solid $input-border

			&:before
				content: "+"

		&.ni-down
			left: 2px
			border-right: 1px solid $input-border

			&:before
				content: "-"