@import url(~antd/lib/input-number/style/index-pure.less);
@import './mixin.less';
@import '../../style/themes/index.less';
@import '../../input/style/mixin.less';

@input-number-prefix-cls: ~'@{ant-prefix}-input-number';
@input-number-background: @input-bg;
@icon-prefix-cls: ~'@{ant-prefix}-icon';

.@{input-number-prefix-cls} {
	.input-base();
	padding: 0;
}

.@{input-number-prefix-cls} {
	width: 140px;
	display: inline-flex;

	&-prefix {
		color: @font-color-caption;
	}

	&-affix-wrapper:not(&-affix-wrapper-disabled):hover &-prefix {
		color: @text-color;
	}

	// Clear
	&:not(textarea) {
		padding: 0;
	}

	&&-nohandler {
		padding-right: 0;

		input {
			padding: 0 @padding-xss;
			text-align: center;
		}
	}

	&-handler {
		border: none;
	}
	// End of clear.

	&-handler-wrap,
	&-disabled &-handler-wrap {
		position: static;
		background: transparent;
		display: block;
		opacity: 1;
		order: 2;
		flex-shrink: 0;

		.@{icon-prefix-cls} {
			position: absolute;
		}
	}

	&-handler-up {
		border-top-right-radius: calc(@border-radius-base / 2);
	}

	&-handler-down {
		border-bottom-right-radius: calc(@border-radius-base / 2);
	}

	&-handler,
	&-handler-up:hover,
	&-handler-down:hover,
	&-handler-wrap:hover &-handler {
		height: 50% !important;
	}

	&-handler {
		color: @cloud-gray-50;

		&:hover {
			background-color: @input-number-handler-hover-bg;
			color: @heading-color;
		}

		&:focus,
		&:active {
			background-color: @input-number-handler-active-bg;
		}
	}

	&-handler-up {
		.@{icon-prefix-cls} {
			// height: 50%;
			transform: translateX(-50%);
		}
	}

	&-handler-down {
		.@{icon-prefix-cls} {
			// height: 50%;
			transform: translateX(-50%);
		}
	}

	&-disabled &-handler {
		border: 1px solid transparent !important;
		background-color: transparent !important;
		cursor: not-allowed;

		.@{icon-prefix-cls} {
			color: @disabled-color;
		}
	}

	.input-number-size(@input-height-md, @input-padding-horizontal-base, 16px, 30px);

	&-lg {
		.input-number-size(@input-height-lg, @input-padding-horizontal-lg, 16px, 40px);
	}

	&-sm {
		.input-number-size(@input-height-sm, @input-padding-horizontal-base, 14px, 30px);
	}

	&-xs {
		.input-number-size(@input-height-xs, @input-padding-horizontal-sm, 14px, 28px);
	}

	// error状态样式
	&-error {
		.error() !important;
	}

	&-group &-handler-wrap {
		position: absolute;
	}
}

@import './inline.less';
