/**
 *
 * This file may have been modified by Bytedance Inc. (“Bytedance Inc.'s Modifications”). 
 * All Bytedance Inc.'s Modifications are Copyright (year) Bytedance Inc..  
 * 
 * This source code is licensed under the Apache license.
 * See LICENSE file in the project root for license information.
 *
 */
// 旧变量，逐渐弃用
// -------------------------------- global --------------------------------

@theme: default;
@auxo-prefix: auxo; // prefix classes
@ant-prefix: @auxo-prefix;
@html-selector: html; // An override for the html selector for theme prefixes
@iconfont-css-prefix: anticon; // iconfont


// color
// ---
@white: @White;
@black: @Black;
@primary-1: @color-primary-bright;
@primary-3: @color-primary-disable;
@primary-5: @color-primary-hover;
@primary-6: @color-primary-brand;
@primary-7: @color-primary-active;
@primary-color: @color-primary-brand;
@info-color: @color-primary-brand;
@success-color: @color-function-success-main;
@processing-color: @color-primary-brand;
@error-color: @color-function-danger-main;
@warning-color: @color-function-warning-main;
@highlight-color: @color-function-danger-main;
@normal-color: @color-line-1;

// 新增的antd里面的样式
// Outline
@outline-blur-size: 0;
@outline-width: 2px;
@outline-color: @primary-color; // No use anymore
@outline-fade: 20%;

// >>> Primary
@primary-color-hover: color(~`colorPalette('@{primary-color}', 5) `);
@primary-color-active: color(~`colorPalette('@{primary-color}', 7) `);
@primary-color-outline: fade(@primary-color, @outline-fade);

// >>> Info
@info-color: @primary-color;
@info-color-deprecated-bg: color(~`colorPalette('@{info-color}', 1) `);
@info-color-deprecated-border: color(~`colorPalette('@{info-color}', 3) `);

// >>> Success
@success-color-hover: color(~`colorPalette('@{success-color}', 5) `);
@success-color-active: color(~`colorPalette('@{success-color}', 7) `);
@success-color-outline: fade(@success-color, @outline-fade);
@success-color-deprecated-bg: color(~`colorPalette('@{success-color}', 1) `);
@success-color-deprecated-border: color(~`colorPalette('@{success-color}', 3) `);

// >>> Warning
@warning-color-hover: color(~`colorPalette('@{warning-color}', 5) `);
@warning-color-active: color(~`colorPalette('@{warning-color}', 7) `);
@warning-color-outline: fade(@warning-color, @outline-fade);
@warning-color-deprecated-bg: color(~`colorPalette('@{warning-color}', 1) `);
@warning-color-deprecated-border: color(~`colorPalette('@{warning-color}', 3) `);

// >>> Error
@error-color-hover: color(~`colorPalette('@{error-color}', 5) `);
@error-color-active: color(~`colorPalette('@{error-color}', 7) `);
@error-color-outline: fade(@error-color, @outline-fade);
@error-color-deprecated-bg: color(~`colorPalette('@{error-color}', 1) `);
@error-color-deprecated-border: color(~`colorPalette('@{error-color}', 3) `);



// background
// ---
@body-background: @White; // Background color for `<body>`
@component-background: @White; // Base background color for most components
@background-color-light: @color-background-module; // background of header and selected item
@background-color-base: @color-fill-deepen-4; // Default grey background color

// font base
// ---
@code-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
@text-color: @color-text-icon-1;
@text-color-secondary: @color-text-icon-2;
@text-color-inverse: @White;
@icon-color: inherit;
@icon-color-hover: @color-text-icon-2;
@heading-color: @color-text-icon-0;
@text-selection-bg: @color-primary-brand;
@font-variant-base: tabular-nums;
@font-feature-settings-base: 'tnum';
@font-size-sm: 12px;
@font-size-base: 14px;
@font-size-lg: @font-size-base + 2px;
@line-height-base: 1.5715; // https://github.com/ant-design/ant-design/issues/20210
// text dark
@text-color-dark: @color-fill-fade-1;
@text-color-secondary-dark: @color-fill-fade-2;

// vertical paddings
// ---
@padding-lg: @spacing-xxl; // containers
@padding-md: @spacing-xl; // small containers and buttons
@padding-sm: @spacing-l; // Form controls and items
@padding-xs: @spacing-m; // small items
@padding-xss: @spacing-xs; // more small
// vertical padding for all form controls
@control-padding-horizontal: @spacing-l;
@control-padding-horizontal-sm: @spacing-m;
// vertical margins
@margin-lg: @spacing-xxl; // containers
@margin-md: @spacing-xl; // small containers and buttons
@margin-sm: @spacing-l; // Form controls and items
@margin-xs: @spacing-m; // small items
@margin-xss: @spacing-xs; // more small

// height rules
// ---
@height-base: 32px;
@height-lg: 40px;
@height-sm: 28px;

// list items
// ---
@item-active-bg: @color-fill-deepen-4;
@item-hover-bg: @color-primary-highlight;

// link
// ---
@link-color: @color-function-link-main;
@link-hover-color: @color-function-link-hover;
@link-active-color: @color-function-link-active;
@link-decoration: none;
@link-hover-decoration: none;
@link-focus-decoration: none;
@link-focus-outline: 0;

// Animation
// ---
@ease-base-out: cubic-bezier(0.7, 0.3, 0.1, 1);
@ease-base-in: cubic-bezier(0.9, 0, 0.3, 0.7);
@ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
@ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
@ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
@ease-out-back: cubic-bezier(0.12, 0.4, 0.29, 1.46);
@ease-in-back: cubic-bezier(0.71, -0.46, 0.88, 0.6);
@ease-in-out-back: cubic-bezier(0.71, -0.46, 0.29, 1.46);
@ease-out-circ: cubic-bezier(0.08, 0.82, 0.17, 1);
@ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.34);
@ease-in-out-circ: cubic-bezier(0.78, 0.14, 0.15, 0.86);
@ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
@ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
@ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);

// Border color
// ---
@border-color-base: @color-line-0; // base border outline a component
@border-color-split: @color-line-1; // split border inside a component
@border-width-base: @Line-width-1; // width of the border for a component
@border-style-base: @Line-types-0; // style of a components border
@border-radius-sm: @border-radius-base;


// Disabled states
// ---
@disabled-color: @color-text-icon-3;
@disabled-bg: @color-fill-deepen-4;
@disabled-color-dark: @color-fill-fade-4;

// Shadow
// ---
@base-shadow: @shadow-base;
@shadow-color: @color-fill-deepen-2;
@shadow-color-inverse: @color-fill-fade-0;
@box-shadow-base: @shadow-2;
@shadow-1-up: @shadow-z1-up;
@shadow-1-down: @shadow-z1-down;
@shadow-1-left: @shadow-z1-left;
@shadow-1-right: @shadow-z1-right;
@shadow-2: @shadow-z2-down;

// Media queries breakpoints
// ---
@screen-xs: 480px; // Extra small screen / phone
@screen-xs-min: @screen-xs;
@screen-sm: 576px; // Small screen / tablet
@screen-sm-min: @screen-sm;
@screen-md: 768px; // Medium screen / desktop
@screen-md-min: @screen-md;
@screen-lg: 992px; // Large screen / wide desktop
@screen-lg-min: @screen-lg;
@screen-xl: 1200px; // Extra large screen / full hd
@screen-xl-min: @screen-xl;
@screen-xxl: 1600px; // Extra extra large screen / large desktop
@screen-xxl-min: @screen-xxl;
// provide a maximum
@screen-xs-max: (@screen-sm-min - 1px);
@screen-sm-max: (@screen-md-min - 1px);
@screen-md-max: (@screen-lg-min - 1px);
@screen-lg-max: (@screen-xl-min - 1px);
@screen-xl-max: (@screen-xxl-min - 1px);

// Grid system
// ---
@grid-columns: 24;

// Layout
// ---
@layout-body-background: #f0f2f5;
@layout-header-background: #001529;
@layout-header-height: 64px;
@layout-header-padding: 0 50px;
@layout-header-color: @color-text-icon-1;
@layout-footer-padding: 24px 50px;
@layout-footer-background: @layout-body-background;
@layout-sider-background: @layout-header-background;
@layout-trigger-height: 48px;
@layout-trigger-background: #002140;
@layout-trigger-color: @White;
@layout-zero-trigger-width: 36px;
@layout-zero-trigger-height: 42px;
// Layout light theme
@layout-sider-background-light: @White;
@layout-trigger-background-light: @White;
@layout-trigger-color-light: @color-text-icon-1;

// z-index list, order by `z-index`
// ---
@zindex-badge: auto;
@zindex-table-fixed: 2;
@zindex-affix: 10;
@zindex-back-top: 10;
@zindex-picker-panel: 10;
@zindex-popup-close: 10;
@zindex-modal: 1000;
@zindex-modal-mask: 1000;
@zindex-message: 1010;
@zindex-notification: 1010;
@zindex-popover: 1030;
@zindex-dropdown: 1050;
@zindex-picker: 1050;
@zindex-popoconfirm: 1060;
@zindex-tooltip: 1070;
@zindex-image: 1080;

// Animation
// ---
@animation-duration-slow: 0.3s; // Modal
@animation-duration-base: 0.2s;
@animation-duration-fast: 0.1s; // Tooltip

