/*
✨ 全局通用样式（颜色体系、字体、高、行高、阴影、边框）
*/
// 中性色板
$white: #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #6c757d !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;

// 系统级色彩体系
$blue: #1890ff !default;
$indigo: #6610f2 !default;
$purple: #6f42c1 !default;
$pink: #d63384 !default;
$red: #dc3545 !default;
$orange: #fd7e14 !default;
$yellow: #fadb14 !default;
$green: #52c41a !default;
$teal: #20c997 !default;
$cyan: #17a2b8 !default;

// 产品级色彩体系
$brand-color: #1890ff; // 品牌的颜色
$selected-color: #e6f7ff; // 选择的颜色
$disabled-selected-color: $gray-500; // 禁用的颜色
$hover-color: #40a9ff;
$normal-color: #1890ff; // 正常的颜色
$click-color: #096dd9; // 点击颜色
$font-color: $gray-600; //字体的颜色


$primary: $blue !default;
$secondary: $gray-600 !default;
$success: $green !default;
$info: $cyan !default;
$warning: $orange !default;
$danger: $red !default;
$light: $gray-100 !default;
$dark: $gray-800 !default;

$theme-colors: (
  "primary": $primary,
  "secondary": $secondary,
  "success": $success,
  "info": $info,
  "warning": $warning,
  "danger": $danger,
  "light": $light,
  "dark": $dark
);


$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
$font-family-base: $font-family-sans-serif !default;

// 字体大小
$font-size-base: 14px !default; // Assumes the browser default, typically `16px`
$font-size-lg: 16px !default;
$font-size-sm: 12px !default;
$font-size-root: null !default;


// 字重
$font-weight-lighter: lighter !default;
$font-weight-light: 300 !default;
$font-weight-normal: 400 !default;
$font-weight-bold: bold !default;
$font-weight-bolder: bolder !default;
$font-weight-base: $font-weight-normal !default;

// 高
$height-base: 32px !default;
$height-lg: 40px !default;
$height-sm: 24px !default;

// 行高
$line-height-base: 22px !default;
$line-height-lg: 24px !default;
$line-height-sm: 20px !default;

// 标题大小
$h1-font-size: $font-size-base * 2.5 !default;
$h2-font-size: $font-size-base * 2 !default;
$h3-font-size: $font-size-base * 1.75 !default;
$h4-font-size: $font-size-base * 1.5 !default;
$h5-font-size: $font-size-base * 1.25 !default;
$h6-font-size: $font-size-base !default;


// 边距
$translate-xs: 6px;
$translate-ms: 10px;
$translate-md: 16px;
$translate-lg: 22px;


// 边框 和 border radius

$border-width: 1px !default;
$border-color: $gray-300 !default;

$border-radius: 6px !default;
$border-radius-lg: 8px !default;
$border-radius-sm: 2px !default;

// 不同类型的 box shadow
$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;
$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;

// 链接
$link-color: $primary !default;
$link-decoration: none !default;
$link-hover-color: darken($link-color, 15%) !default;
$link-hover-decoration: underline !default;

// body
$body-bg: $white !default;
$body-color: $gray-900 !default;
$body-text-align: null !default;


/*
👉 分割线：引用以上的全局变量，请在这后面写组件的通用样式 👈
*/


// 🟡 Spacing
$spacer: 1rem !default;

// 🟡 Paragraphs  (_reboot.scss)

$paragraph-margin-bottom: 1rem !default;

// 字体其他部分 heading list hr 等等  (_reboot.scss)
$headings-margin-bottom: calc($spacer / 2) !default;
$headings-font-family: null !default;
$headings-font-style: null !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default;
$headings-color: null !default;

$small-font-size: .875em !default;
$sub-sup-font-size: .75em !default;
$text-muted: $gray-600 !default;

$hr-color: inherit !default;
$hr-height: 1px !default;
$hr-opacity: .25 !default;

$legend-margin-bottom: .5rem !default;
$legend-font-size: 1.5rem !default;
$legend-font-weight: null !default;

$mark-padding: .2em !default;

$dt-font-weight: $font-weight-bold !default;

$mark-bg: #fcf8e3 !default;

$hr-margin-y: $spacer !default;


// 🟡 Code  (_reboot.scss)

$code-font-size: $small-font-size !default;
$code-color: $pink !default;
$pre-color: null !default;

// options 可配置选项  (_reboot.scss)
$enable-pointer-cursor-for-buttons: true !default;


// 🟡 按钮
// 按钮基本属性
$btn-font-weight: 400;
$btn-padding-y: .375rem !default;
$btn-padding-x: .75rem !default;
$btn-font-family: $font-family-base !default;
$btn-font-size: $font-size-base !default;
$btn-line-height: $line-height-base !default;

//不同大小按钮的 padding 和 font size
$btn-padding-y-sm: .25rem !default;
$btn-padding-x-sm: .5rem !default;
$btn-font-size-sm: $font-size-sm !default;

$btn-padding-y-middle: .375rem !default;
$btn-padding-x-middle: .75rem !default;
$btn-font-size-middle: $font-size-base !default;

$btn-padding-y-lg: .5rem !default;
$btn-padding-x-lg: 1rem !default;
$btn-font-size-lg: $font-size-lg !default;

// 按钮边框
$btn-border-width: $border-width !default;

// 按钮其他
$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;
$btn-disabled-opacity: .65 !default;

// 链接按钮
$btn-link-color: $link-color !default;
$btn-link-hover-color: $link-hover-color !default;
$btn-link-disabled-color: $gray-600 !default;

// 按钮 radius
$btn-border-radius: $border-radius !default;
$btn-border-radius-lg: $border-radius-lg !default;
$btn-border-radius-sm: $border-radius-sm !default;

$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;


//submenu
$submenu-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04);

// 🟡 Progress bars

$progress-font-size: $font-size-base * .75 !default;
$progress-bg: $gray-200 !default;
$progress-border-radius: $border-radius !default;
$progress-bar-color: $white !default;
$progress-bar-transition: width .6s ease !default;



// 🟡 menu
$menu-border-width: $border-width !default;
$menu-border-color: $border-color !default;
$menu-box-shadow: inset 0 1px 0 rgba($gray-500, .15), 0 1px 4px rgba($black, .075) !default;
$menu-transition: color .15s ease-in-out, border-color .15s ease-in-out, height .15s ease-in-out, opacity .15s ease-in-out !default;

// menu-item
$menu-item-padding-y: .5rem !default;
$menu-item-padding-x: 1rem !default;
$menu-item-active-color: $hover-color !default;
$menu-item-active-border-width: 2px !default;
$menu-item-disabled-color: $gray-600 !default;
$menu-option-color: $gray-900 !default;
$menu-dark-option-color: $white !default;
$menu-background-color: $white !default;
$menu-dark-background-color: $gray-900 !default;

// menu-item
$menu-item-padding-x: 1rem !default;
$menu-item-color: $black !default;
$menu-item-active-color: $primary !default;
$menu-dark-item-color: $white !default;
$menu-dark-item-active-color: $hover-color !default;
$menu-item-active-border-width: 3px !default;
$menu-item-disabled-color: $gray-600 !default;
$menu-item-height: 50px !default;
$menu-item-bg: $white !default;
$menu-item-border-bg-active: $primary !default;
$menu-item-bg-active: lighten($primary, 40%) !default;
$menu-dark-item-bg-active: $primary !default;
$menu-dark-item-bg: $black !default;


// 🟡 form
$form-before-after-color: #ff4d4f !default;
$form-half-opacity: 0.5 !default;
$form-none-opacity: 0 !default;
$form-full-opacity: 1 !default;


// 🟡 select
$select-width: 80px !default;
$select-box-shadow: 0 2px 3px 1px #9aa1b126, 0 4px 8px -8px #24282f40, 0 4px 4px -2px #5b5e6926;
$select-border-width: $border-width !default;
$select-border-color: $border-color !default;
$select-selected-background-color: lighten($primary, 40%) !default;
$select-selected-color: $black !default;
$select-transition: color .15s ease-in-out, border-color .15s ease-in-out, height .15s ease-in-out, opacity .15s ease-in-out !default;
$select-box-shadow: inset 0 1px 0 rgba($gray-500, .15), 0 1px 4px rgba($black, .075) !default;
$select-dark-color: $white !default;
$select-background-color: $white !default;
$select-dark-background-color: $gray-900 !default;
$select-option-color: $gray-900 !default;


// 🟡 pagination分页
$pagination-numbox-width: 30px;
$pagination-select-width: 80px;
$pagination-box-shadow: inset 0 1px 0 rgba($gray-500, .15), 0 1px 4px rgba($black, .075) !default;

$width: 3vw;
$commaWidth: 0.5vw;
$gap: 0.2vw;
$dis: -0.2vw;
$secTop: $width + $gap;
$thirdTop: $width * 2 + $gap * 2;
$secLineTop: $width + $gap * 2;
$screenTop: $width * 4;
$numberMargin: 3vw;
$transformDistance: 50px;
$bgColor: rgba(255, 255, 255, 1);
$scale: 0.9;
$normalColor: #181919;
$lightColor: #34eabc;
$drakColor: #3c4444;
$lightShadow: 0 0 1vw #0bfdfd, inset 0 0 0.125vmin #0bfdfd;
$drakShadow: 0 0 1vw #425454;
$animTime: 10s;