// 组件变量
// 名称可按如下规则定义：
// <component>-[type]-[attrtype]-<attr>-[status]

// component:组件名，如button，
// type: 组件类型，如 button 的次要按钮（line）
// attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（border）等
// attr: 属性名称，如color、height、radius等
// status: 表示组件状态或尺寸，如 hover、disabled、s、l 等

// 如：@button-line-bg-color-hover
// 如：@button-line-height-s

@import "../../_variables.less";

// 颜色
// @input-number-border-color: @border-level-2-color; // 数字输入框边框颜色

@input-number-inner-color: @text-color-primary; // 数字输入框文字颜色
@input-number-button-bg-color: transparent; // 数字输入框操作按钮背景颜色
@input-number-right-button-bg-color: @bg-color-secondarycontainer; // 右侧数字输入框操作按钮背景颜色
@input-number-right-button-hover-bg-color: @bg-color-component-hover; // 右侧数字输入框操作按钮背景颜色
@input-number-button-border-color: @border-level-2-color; // 数字输入框操作按钮边框颜色
@input-number-button-color: @text-color-disabled; // 数字输入框操作按钮图标颜色

@input-number-right-bg-color: @bg-color-container; // 右侧调整数字输入框背景颜色
@input-number-right-button-border-color: @border-level-2-color; // 右侧调整数字输入框操作按钮边框颜色

@input-number-border-color-hover: @brand-color-hover; // 数字输入框hover边框颜色
@input-number-right-border-color-hover: @brand-color-hover; // 数字输入框操作按钮hover边框颜色
@input-number-button-color-hover: @brand-color; // 数字输入框操作按钮hover字体色
@input-number-bg-color-disabled: @bg-color-component-disabled; // 数字输入区域disabled背景颜色
@input-number-inner-color-disabled: @text-color-disabled; // 数字输入区域disabled文字颜色
@input-number-button-color-disabled: @text-color-disabled; // 数字输入框操作按钮disabled图标颜色
@input-number-button-bg-color-disabled: @bg-color-component-disabled; // 数字输入框操作按钮disabled背景颜色

@input-number-text-color-tips: @text-color-placeholder;
@input-number-text-color-success: @success-color;
@input-number-text-color-warning: @warning-color;
@input-number-text-color-error: @error-color;

// 尺寸
@input-number-width-s: 120px; // 数字输入组件宽度 小
@input-number-width: 144px; // 数字输入组件宽度 中
@input-number-width-l: 168px; // 数字输入组件宽度 大

@input-number-button-width-s: @comp-size-xs; // 数字输入框操作按钮宽度 小
@input-number-button-width: @comp-size-m; // 数字输入框操作按钮的宽度 中
@input-number-button-width-l: @comp-size-xl; // 数字输入框操作按钮宽度 大

@input-number-button-height-s: @comp-size-xs; // 数字输入框操作按钮高度 小
@input-number-button-height: @comp-size-m; // 数字输入框操作按钮的高度 中
@input-number-button-height-l:  @comp-size-xl; // 数字输入框操作按钮高度 大

@input-number-inner-height-s: @comp-size-xs; // 数字输入框高度 小
@input-number-inner-height: @comp-size-m; // 数字输入框高度 中
@input-number-inner-height-l:  @comp-size-xl; // 数字输入框高度 大

@input-number-right-width-s: 88px; // 右侧调整数字输入组件宽度 小
@input-number-right-width: 96px; // 右侧调整数字输入组件宽度 中
@input-number-right-width-l: 120px; // 右侧调整数字输入组件宽度 大

@input-number-right-button-width: @comp-size-m; // 右侧调整数字输入框操作按钮宽度 中
@input-number-right-button-width-l: @comp-size-xl; // 右侧调整数字输入框操作按钮宽度 大

@input-number-button-column-height-s: calc(calc(@comp-size-xs / 2) - 2px); //  右侧调整数字操作按钮的高度 中
@input-number-button-column-height: calc(calc(@comp-size-m / 2) - 2px); //  右侧调整数字操作按钮的高度 中
@input-number-button-column-height-l: calc(calc(@comp-size-xl / 2) - 2px); //  右侧调整数字操作按钮的高度 大

@input-number-padding-horizontal-default: @comp-paddingLR-s;

// 字号
@input-number-font-size: @font-size-l; // 数字输入框操作按钮字号
@input-number-font-size-s: @font-size-base; // 小尺寸数字输入框操作按钮字号
@input-number-font-size-l: (@font-size * 1.8); // 大尺寸数字输入框操作按钮字号

@input-number-right-font-size: @font-size-s; // 右侧调整数字输入框操作按钮字号
@input-number-right-font-size-l: @font-size-l; // 大尺寸右侧调整数字输入框操作按钮字号

@input-number-tips-font-size: @font-size-s;