@use 'sass:map';

$thy-prefix: 'thy';

// colors
$gray-10: var(--gray-10) !default; // 在默认皮肤下是白色，Dark 模式下非白色
$gray-70: var(--gray-70) !default;
$gray-80: var(--gray-80) !default;
$gray-100: var(--gray-100) !default;
$gray-200: var(--gray-200) !default;
$gray-300: var(--gray-300) !default;
$gray-400: var(--gray-400) !default;
$gray-500: var(--gray-500) !default;
$gray-600: var(--gray-600) !default;
$gray-700: var(--gray-700) !default;
$gray-800: var(--gray-800) !default;

$white: #fff !default;
$primary: #6698ff !default;
$success: #73d897 !default;
$info: #5dcfff !default;
$warning: #ffcd5d !default;
$danger: #ff7575 !default;
$black: #000 !default;

$body-color: $gray-800 !default;
$secondary: $gray-700 !default;
$secondary-item-active: rgba($primary, 0.1) !default;
$item-active-bg-color: rgba($primary, 0.1) !default;
$light: $gray-300 !default;
$dark: #48525c !default;
$pass: #2cccda !default;

// deprecated
$gray-210: #e9e9e9 !default; //整块区域的背景色为 #f3f3f3 后，某个卡片模块的背景色，用于文件详情
// deprecated
$gray-900: #212529 !default;

/** text color  */
$text-placeholder: $gray-400 !default;
$text-body: $gray-800 !default;
$text-desc: $gray-500 !default;
$text-primary: $primary !default;
$text-secondary: $gray-700 !default;
$text-success: $success !default;
$text-info: $info !default;
$text-warning: $warning !default;
$text-danger: $danger !default;
$text-light: $light !default;
$text-dark: $gray-800 !default;
$text-muted: $gray-600 !default;
$text-white: $white !default;

/** bg color */
$bg-default: var(--bg-color-default) !default;
$bg-lighter: $gray-100 !default;
$bg-bright: $gray-80 !default;
$bg-content: $gray-80 !default;
$bg-primary: $primary !default;
$bg-secondary: $secondary !default;
$bg-success: $success !default;
$bg-info: $info !default;
$bg-warning: $warning !default;
$bg-danger: $danger !default;
$bg-light: $light !default;
$bg-dark: $gray-800 !default;
$bg-panel: var(--bg-color-panel) !default;
$bg-float: var(--bg-color-float) !default;

//px to rem
$rem-5px: 0.3125rem;
$rem-10px: 0.625rem;
$rem-14px: 0.875rem;
$rem-15px: 0.9375rem;
$rem-18px: 1.125rem;
$rem-20px: 1.25rem;
$rem-26px: 1.625rem;

// font
$font-family-sans-serif:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    PingFang SC,
    Helvetica Neue,
    Noto Sans,
    Noto Sans CJK SC,
    Microsoft Yahei,
    Arial,
    Hiragino Sans GB,
    sans-serif !default;
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !default;
$font-family-base: $font-family-sans-serif !default;
$font-family-statistics-number: $font-family-base !default;
$font-size-base: 0.875rem !default; // 14px
$font-size-lg: 1.25rem !default; // 20px
$font-size-sm: 0.75rem !default; // 12px
// 标题字体大小，header Title of card、Layout、Sidebar、Slid
$font-size-title: 15px;

$text-color: var(--text-color) !default;
$text-color-inverse: $white !default;

// line-height
$line-height-lg: 1.5 !default;
$line-height-base: 1.5715 !default;
$line-height-sm: 1.5715 !default;
$line-height-xs: 1.5 !default;

$border-radius: 0.25rem !default;
$border-radius-lg: 0.3rem !default;
$border-radius-sm: 0.2rem !default;
$border-color: $gray-200 !default;

$enable-gradients: false !default;
$enable-shadows: true !default;
// transition-duration
$transition-duration-normal: 200ms !default;

// link
$link-color: $primary !default;
$link-decoration: none !default;
$link-hover-color: $primary !default;
$link-hover-decoration: underline !default;
$link-icon-padding-x: 4px !default;
$link-disabled-opacity: 50% !default;

// box shadow
$box-shadow: 0 0 16px rgb(0 0 0 / 8%) !default;
$box-shadow-none: none !default;

// icon
$icon-vertical-align: -0.16em !default;
$icon-text-horizontal-space: 0.5rem !default;
$icon-default-height: 24px !default;
$icon-default-width: 24px !default;

// 扩展
$font-size-md: 1rem !default; // 16px
$font-size-max-lg: 3.25rem !default; // 补充字体大小 52px
$font-size-xs: 0.625rem !default; // 10px
$font-size-xlg: 1.5rem !default; // 24px
// code
$code-color: $danger !default;
$code-font-size: 0.875rem !default;

// ---input-btn 输入框和按钮复用的变量---

// 按钮和输入框大小, 目前有5种大小, 按钮和输入框都是通过 padding 设置成对应大小的
// 为了方便记录或者在某些场景下使用, 新增了高度的变量
$input-btn-height-lg: 44px !default;
$input-btn-height: 36px !default;
$input-btn-height-md: 32px !default;
$input-btn-height-sm: 28px !default;
$input-btn-height-xs: 24px !default;

$input-btn-line-height: $line-height-base !default;
$input-btn-line-height-md: $line-height-base !default;
$input-btn-line-height-sm: $line-height-sm !default;
$input-btn-line-height-lg: $line-height-lg !default;
$input-btn-line-height-xs: $line-height-xs !default;

$input-btn-padding-x: 1.625rem !default;
$input-btn-padding-y: 0.375rem !default; // 36px
$input-btn-padding-x-md: 1rem !default;
$input-btn-padding-y-md: 0.25rem !default; // 32px
$input-btn-padding-x-sm: 0.5rem !default;
$input-btn-padding-y-sm: 0.125rem !default;
$input-btn-padding-x-lg: 1rem !default;
$input-btn-padding-y-lg: 0.656rem !default;

$input-btn-focus-width: 0.0625rem !default; // 1px

// Buttons
$btn-border-radius: 4px !default;
$btn-border-radius-lg: 4px !default;
$btn-border-radius-sm: 4px !default;
$btn-border-radius-xs: 4px !default;
$btn-box-shadow: null !default;
$btn-active-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125) !default;

$btn-line-height: $input-btn-line-height;
$btn-line-height-sm: $input-btn-line-height-sm;
$btn-line-height-lg: $input-btn-line-height-lg;
$btn-line-height-md: $input-btn-line-height-md;
$btn-line-height-xs: $input-btn-line-height-xs;

$btn-padding-y: $input-btn-padding-y !default; //108*38px
$btn-padding-x: 1.25rem !default;
$btn-padding-y-md: $input-btn-padding-y-md !default;
$btn-padding-x-md: 15px !default; // 1.25rem !default;
$btn-padding-y-sm: $input-btn-padding-y-sm !default; // 70*28px
$btn-padding-x-sm: 15px !default;
$btn-padding-y-lg: 0.375rem !default;
$btn-padding-x-lg: 2.215rem !default;
$btn-padding-y-xs: 0.125rem !default;
$btn-padding-x-xs: 15px !default;

$btn-disabled-color: $gray-400 !default;
$btn-disabled-bg-color: $gray-100 !default;
$btn-disabled-border-color: $gray-100 !default;
$btn-outline-disabled-border-color: $gray-300 !default;
$btn-link-color-default: $gray-500 !default;
$btn-link-color-disabled: $gray-400 !default;
$btn-icon-light-color: $gray-300 !default;
$btn-link-disabled-color: $gray-400 !default;
$btn-icon-color: $gray-400 !default;
$btn-icon-thick-dashed-color: $gray-300 !default;
$btn-icon-thick-solid-color: $gray-400 !default;

$btn-icon-circle-padding-lg: 11px;
$btn-icon-circle-padding-base: 8px;
$btn-icon-circle-padding-md: 7px;
$btn-icon-circle-padding-sm: 6px;
$btn-icon-circle-padding-xs: 5px;
$btn-icon-circle-padding-difference: 1;

// min-width
$btn-base-min-width: 97px !default;
$btn-md-min-width: 70px !default;
$btn-sm-min-width: 70px !default;
$btn-xs-min-width: 60px !default;
$btn-lg-min-width: 108px !default;
// font-size
$btn-font-size-xs: $font-size-sm !default;
$btn-font-size-sm: $font-size-base !default;
$btn-font-size-md: $font-size-base !default;
$btn-font-size-base: $font-size-base !default;
$btn-font-size-lg: $font-size-lg !default;

// btn-pair
$btn-pair-child-margin-left: 20px !default;
$btn-pair-child-link-margin-left: 10px !default;
$btn-pair-sm-child-margin-left: 4px !default;

// btn-group
$btn-group-btn-padding-y-lg: $btn-padding-y-lg !default;
$btn-group-btn-padding-y-md: $btn-padding-y-md !default;
$btn-group-btn-padding-y-sm: $btn-padding-y-sm !default;
$btn-group-btn-padding-y-xs: $btn-padding-y-xs !default;

$btn-group-btn-padding-x-lg: 25px !default;
$btn-group-btn-padding-x-md: 20px !default;
$btn-group-btn-padding-x-sm: 15px !default;
$btn-group-btn-padding-x-xs: 10px !default;

// Forms
// 输入框左右 padding 和 按钮大小不一致， bootstrap 是一致的
// input-padding-x 之前是 0.875rem, 芳美说太大了，改成了 10px 大小
$input-font-size: $font-size-base !default;
$input-font-size-sm: $font-size-base !default;
$input-font-size-lg: $font-size-xlg !default;

$input-line-height-xs: $input-btn-line-height-xs !default;
$input-line-height-md: $input-btn-line-height-md !default;
$input-line-height-sm: $input-btn-line-height-sm !default;
$input-line-height-lg: $input-btn-line-height-lg !default;

// 大于等于 36px 的输入框左右间距 12px，小于 36px 高度的输入框左右间距 8px
$input-padding-x-fixed: 0.5rem !default;
$input-padding-x-fixed-lg: 0.75rem !default;
$input-padding-x: $input-padding-x-fixed-lg !default;
$input-padding-y: $input-btn-padding-y !default;
$input-padding-x-md: $input-padding-x-fixed !default;
$input-padding-y-md: $input-btn-padding-y-md !default;
$input-padding-x-sm: $input-padding-x-fixed !default;
$input-padding-y-sm: $input-btn-padding-y-sm !default;
$input-padding-x-lg: $input-padding-x-fixed-lg !default;
$input-padding-y-lg: 0.1875rem !default;
$input-padding-x-xs: $input-padding-x-fixed !default;
$input-padding-y-xs: 0.125rem !default;
// input border-radius
$input-border-radius-xs: 0.25rem !default;
$input-border-radius-md: 0.25rem !default;
$input-border-radius: 0.25rem !default;
// input height
$input-height-xs: $input-btn-height-xs !default;
$input-height-sm: $input-btn-height-sm !default;
$input-height-md: $input-btn-height-md !default;
$input-height-lg: $input-btn-height-lg !default;
// others
$input-focus-border-color: $primary !default;
$input-placeholder-color: $gray-400 !default;
$input-color: $gray-800 !default;
$input-focus-bg: transparent !default;
$input-label-color: $gray-600 !default; // label 文本的颜色，包括 Checkbox 和 Radio Label 的颜色
$input-label-checked-color: $gray-800 !default; // Checkbox 和 Radio Label 选中后的颜色
$input-border-color: $gray-200 !default;
$input-hover-border-color: $primary !default;
$input-disabled-bg: $gray-100 !default;
$input-disabled-border-color: $gray-200 !default;
$input-disabled-color: $gray-600 !default;
$input-icon-color: $gray-400 !default;
$input-group-addon-color: $gray-700 !default;
$input-group-addon-bg: $gray-100 !default;
$form-text-margin-top: 0.5rem !default;
$input-ellipse-radius: 1.25rem !default;
$input-ellipse-background-color: $gray-100 !default;
$input-ellipse-focus-border-color: $primary !default;
$input-ellipse-hover-border-color: $gray-300 !default;
$input-ellipse-hover-focus-background-color: $white !default;
$input-form-check-size: 1rem !default;
$input-form-check-disable-color: $gray-400 !default;
$input-form-check-border-color: $gray-300 !default;
$form-label-color: $gray-800 !default;
$form-check-input-margin-t: 0.3rem !default;
$form-check-input-margin-l: 1rem !default;
$form-check-inline-margin-r: 0.75rem !default;
$form-check-inline-input-margin-r: 0 !default;
$form-check-label-margin-l: 0.5rem !default;
$checkbox-disabled-bg-color: var(--checkbox-disabled-bg-color) !default;

// Dropdown
$dropdown-menu-width: 240px !default;
$dropdown-menu-group-width: 280px !default;
$dropdown-menu-padding-y: 12px;
$dropdown-menu-max-height: 400px !default;
$dropdown-menu-item-padding-x: 20px !default;
$dropdown-menu-item-padding-y: 9px !default;
$dropdown-menu-item-color: $gray-800 !default;
$dropdown-menu-item-hover-color: $gray-800 !default;
$dropdown-menu-item-icon-color: $gray-500 !default;
$dropdown-menu-item-extend-color: $gray-500 !default;
$dropdown-menu-item-hover-bg: $gray-100 !default;
$dropdown-menu-divider-title-color: $gray-400 !default;
$dropdown-menu-divider-border-color: $gray-200 !default;
$dropdown-menu-divider-margin-y: 4px !default;
$dropdown-menu-divider-margin-x: 20px !default;
$dropdown-menu-group-name-color: $gray-400 !default;
$dropdown-menu-group-name-padding-y: 2px;
$dropdown-menu-group-name-padding-x: 20px;

// PopBox
$pop-box-divider: $gray-100 !default;
$pop-box-bg-hover: $gray-100 !default;
$pop-box-text: $gray-700 !default;
$pop-box-text-hover: $gray-900 !default;
$pop-box-body-padding: 15px 20px !default;
$pop-box-footer-padding: 15px 20px !default;
$pop-box-top-margin: 3px !default;
$zindex-pop-box: 1080 !default;

// Layout
$layout-header-background: $bg-default !default;
$layout-header-padding: 0 20px !default;
$layout-header-height: 48px !default;
$layout-header-height-sm: 44px !default;
$layout-header-height-lg: 52px !default;
$layout-header-height-xlg: 100px !default;
$layout-header-prefix-icon-size: 20px !default;
$layout-header-separator-color: $gray-500 !default;
$layout-header-icon-link-opacity: 0.85;
$layout-header-box-shadow: var(--layout-header-box-shadow) !default;
$layout-content-background: $gray-80 !default;
$layout-content-padding: 15px 20px 15px 20px !default;
$layout-sidebar-width: 240px !default;
$layout-sidebar-background-light: var(--layout-sidebar-light-bg-color) !default;
$layout-sidebar-background-dark: $gray-800 !default;
$layout-sidebar-border-color: $gray-200 !default;
$layout-sidebar-border-right: 1px solid $layout-sidebar-border-color !default;
$layout-sidebar-drag-background-hover: $gray-300 !default;
$layout-sidebar-drag-background-active: $primary !default;
$layout-sidebar-header-height: 48px !default;
$layout-sidebar-header-title-font-size: $font-size-title !default;
$layout-sidebar-header-padding: $layout-header-padding !default;
$layout-sidebar-footer-height: 48px !default;
$layout-content-section-border-radius: 0px !default;
$layout-content-section-background: $bg-default !default;
$layout-content-section-margin-bottom: 8px !default;

$float-btn-box-shadow: var(--float-btn-box-shadow) !default;
$float-btn-hover-box-shadow: var(--float-btn-hover-box-shadow) !default;

// Tables
$table-color: $gray-800;
$table-bg: transparent !default;
$table-accent-bg: rgba($black, 0.05) !default;
$table-hover-bg: rgba($black, 0.075) !default;
$table-active-bg: $table-hover-bg !default;
$table-footer-margin-top: 1.25rem;
$table-hover-color: $gray-80;
$table-border-width: 1px !default;
$table-border-color: $gray-200 !default;
$table-head-bg: $gray-200 !default;
$table-head-color: $gray-800 !default;
$table-default-header-color: $gray-700 !default;
$table-cell-height-xlg: 60px !default;
$table-cell-padding-xlg: 12px 16px !default;
$table-header-padding-xlg: 16px 16px !default;
$table-cell-height-lg: 56px !default;
$table-cell-padding-lg: 12px 16px !default;
$table-header-padding-lg: 12px 16px !default;
$table-cell-height: 52px !default;
$table-cell-padding: 12px 16px !default;
$table-header-padding: 12px 16px !default;
$table-cell-height-sm: 48px !default;
$table-cell-padding-sm: 8px 16px !default;
$table-header-padding-sm: 8px 16px !default;
$table-cell-height-xs: 44px !default;
$table-cell-padding-xs: 8px 16px !default;
$table-header-padding-xs: 8px 16px !default;
$table-bordered-bg: $gray-100 !default;
$table-bordered-header-color: $gray-800 !default;
$table-boxed-border-radius: 4px !default;
$table-draggable-first-th-padding-left: 16px !default;
$table-draggable-first-td-padding-left: 16px !default;
$table-draggable-icon-color: $gray-600 !default;
$table-draggable-icon-left: 0px !default;
$table-default-header-cell-padding: 0 16px !default;
$table-default-header-padding: 12px 16px !default;
$table-default-sm-header-padding: 8px 16px !default;
$table-default-header-height: inherit !default;
$table-group-first-cell-padding-left: 43px !default;
$table-operation-column-spacing: 32px !default;
$table-fixed-column-left-box-shadow: var(--table-fixed-column-left-box-shadow) !default;
$table-fixed-column-right-box-shadow: var(--table-fixed-column-right-box-shadow) !default;

// grid
$table-footer-padding: 0 20px !default;
// badges
$badge-font-size: 75% !default;
$badge-font-weight: normal !default;
$badge-padding-y: 0.25em !default;
$badge-padding-x: 7px !default;
$badge-border-radius: 14px !default;
$badge-pill-padding-x: 0.6em !default;
$badge-pill-border-radius: 10rem !default;
$badge-bg: $gray-200 !default; //#eee
$badge-color: $gray-600 !default; //#888
$badge-danger-color: #ff7461 !default;

// tag
$tag-default-color: $gray-700 !default;
$tag-default-border-color: $gray-200 !default;
$tag-default-bg: $gray-100 !default;
$tag-default-hover-bg: $gray-200 !default;
$tag-colors: () !default;
$tag-colors: map.merge(
    (
        'primary': $primary,
        'info': $info,
        'success': $success,
        'warning': $warning,
        'danger': $danger
    ),
    $tag-colors
);

$tag-height-sm: 20px !default;
$tag-height-md: 24px !default;
$tag-height-lg: 28px !default;
$tag-size-heights: () !default;
$tag-size-heights: (
    sm: $tag-height-sm,
    md: $tag-height-md,
    lg: $tag-height-lg
);
$tag-size-paddings: () !default;
$tag-size-paddings: (
    sm: 8px,
    md: 12px,
    lg: 12px
);

$tag-size-font-sizes: () !default;
$tag-size-font-sizes: (
    sm: $font-size-sm $font-size-sm,
    md: $font-size-sm $font-size-base,
    lg: $font-size-base $font-size-md
);
$tag-border-radius: 4px !default;
$tag-space-row-gap: 8px !default;
$tag-space-column-gap: 8px !default;

//avatar
$avatar-sizes: () !default;
$avatar-sizes: map.merge(
    (
        16: 12,
        22: 12,
        24: 12,
        28: 12,
        32: 12,
        36: 12,
        44: 12,
        48: 14,
        68: 16,
        110: 36,
        160: 50
    ),
    $avatar-sizes
);
// avatar-list
$avatar-item-space: 4px !default;
$overlap-avatar-item-space-percent: 0.25 !default;
$avatar-disabled-color: var(--avatar-disabled-color) !default;

// Navs
$nav-item-disabled-color: $gray-400 !default;
$nav-item-color: $gray-800 !default;
$nav-item-weak-color: $gray-600 !default;
$nav-item-hover-color: $primary !default;
$nav-item-icon-color: $gray-600 !default;
$nav-item-primary-color: $gray-800 !default;
$nav-border-color: $gray-200 !default;
$nav-divider-color: $gray-200 !default;
$nav-border-width: 2px !default;
$nav-border-bottom: $nav-border-width solid $primary !default;
$nav-border-left: $nav-border-width solid $primary !default;
$nav-item-font-size: $font-size-base !default;
// 新的大小
//lg
$nav-height-lg: $layout-header-height-lg !default;
$nav-item-padding-y-lg: 0.875rem !default; // 高度 52px, 文字 15px
$nav-item-padding-x-lg: 1rem !default;
$nav-item-right-lg: 20px !default;
$nav-item-font-size-lg: 15px !default;
// md
$nav-height: $layout-header-height !default;
$nav-item-padding-y: 0.75rem !default; // 高度 48px,
$nav-item-padding-x: 0.5rem !default;
$nav-item-right: 20px !default;
$nav-item-font-size: 14px !default;
//sm
$nav-height-sm: $layout-header-height-sm !default;
$nav-item-padding-y-sm: 0.625rem !default; // 高度 44px
$nav-item-padding-x-sm: 0.5rem !default;
$nav-item-right-sm: 20px !default;
$nav-item-font-size-sm: 14px !default;
// nav card item size
$nav-card-item-padding-y: 0px !default;
$nav-card-item-padding-x: 20px !default;
$nav-card-item-right: 0px !default;

$nav-item-primary-padding-y: 0.9512rem !default; // 高度 56px, 文字 15px
$nav-item-primary-padding-x: 1rem !default;
$nav-item-primary-right: 20px !default;
$nav-item-primary-font-size: 15px !default;
$nav-item-primary-min-width: 80px !default;

$nav-item-secondary-padding-y: 0.438rem !default; // 高度 50px
$nav-item-secondary-padding-x: 0rem !default;
$nav-item-secondary-right: 40px !default;
$nav-item-secondary-split-right: 60px !default;
$nav-item-thirdly-padding-y: 0.5rem !default; // 高度 38px
$nav-item-thirdly-padding-x: 0rem !default;
$nav-item-thirdly-right: 40px !default;
$nav-item-thirdly-split-line-height: 15px !default;
$nav-item-thirdly-padding-y-sm: 0.4375rem !default;
$nav-item-thirdly-padding-x-sm: 0rem !default;
$nav-item-thirdly-right-sm: 40px !default;
$nav-item-thirdly-split-line-height-sm: 11px !default;
$nav-vertical-border-left: 2px solid $primary !default;
$nav-vertical-border-left-empty: 2px solid transparent !default;

$icon-nav-link-color: $gray-600 !default;
$icon-nav-link-hover-color: $primary !default;
$icon-nav-link-spacing: 16px !default;
$icon-nav-link-secondary-color: $gray-400 !default;
$icon-nav-link-secondary-spacing: 8px !default;
$icon-nav-link-individual-spacing: 4px !default;
$icon-nav-link-padding-x: 0.438rem !default;
$icon-nav-link-padding-y: 0.282rem !default;

$action-color: $gray-600 !default;
$action-hover-color: $primary !default;
$action-hover-bg-color: rgba($primary, 0.1) !default;
$action-padding-x: 0.5rem !default;
$action-padding-y: 0.5rem !default;

// Modals
// Padding applied to the modal body
// Deprecated
$modal-inner-padding: 1.25rem 1.875rem 1.875rem 1.875rem !default;
$modal-has-footer-inner-padding: 1.25rem 1.875rem 0 1.875rem !default;
$modal-dialog-margin: 0.5rem !default;
$modal-dialog-margin-y-sm-up: 3.75rem !default;
$modal-title-line-height: 1.5 !default;
$modal-content-bg: $white !default;
$modal-content-border-color: rgba($black, 0.2) !default;
$modal-content-border-width: 0 !default;
$modal-content-box-shadow-xs: 0 0 1.5rem rgba($black, 0.4) !default;
$modal-content-box-shadow-sm-up: 0 0 1.5rem rgba($black, 0.5) !default;
$modal-backdrop-bg: $black !default;
$modal-backdrop-opacity: 0.3 !default;
$modal-header-border-color: $gray-200 !default;
$modal-footer-border-color: $modal-header-border-color !default;
$modal-header-border-width: 1px !default;
$modal-footer-border-width: $modal-header-border-width !default;
$modal-header-padding: 1.875rem !default;
$modal-lg: 980px !default;
$modal-blg: 800px !default; //稍微大点，自定义属性
$modal-md: 660px !default;
$modal-sm: 400px !default;
$modal-transition: transform 0.3s ease-out !default;

// Dialog
$dialog-border-radius: 4px !default;
$dialog-header-height: 56px !default;
$dialog-header-title-line-height: 1.5rem !default;
$dialog-header-padding: 0rem 2rem !default;
$dialog-header-padding-lg: 1.25rem !default;

$dialog-header-border-width: 1px !default;
$dialog-header-border-color: $gray-200 !default;
$dialog-box-shadow: 0 0 24px rgba(0, 0, 0, 0.25) !default;
$dialog-body-padding: 0.5rem 2rem 1rem 2rem !default;

$dialog-footer-padding: 1rem 2rem !default;
$dialog-footer-border-width: 1px !default;
$dialog-footer-border-color: $dialog-header-border-color !default;

$dialog-default-max-height: 85vh !default;
$dialog-max-lg: 980px !default;
$dialog-lg: 800px !default;
$dialog-md: 660px !default;
$dialog-sm: 400px !default;
$dialog-super-lg-max-height: 1000px !default;
$dialog-super-lg-max-width: 1800px !default;
$dialog-super-lg-height: 94vh !default;
$dialog-super-lg-width: 94vw !default;

$btn-dialog-confirm-cancel: $btn-pair-child-link-margin-left !default;

// Card
$card-border-radius: 2px !default;
$card-border-color: $gray-200 !default;
$card-title-icon-color: $primary !default;
$card-title-color: $gray-800 !default;
$card-title-font-size: $font-size-title !default;
$card-title-line-height: 32px !default;
$card-title-info-color: $gray-500 !default;
$card-header-divider-color: $gray-200 !default;
$card-header-padding-x: 20px !default;
$card-header-padding-y: 12px !default;
$card-content-padding-x: 20px !default;
$card-content-padding-y: 20px !default;
$card-header-padding-x-lg: 28px !default;
$card-header-padding-y-lg: 16px !default;
$card-content-padding-x-lg: 28px !default;
$card-content-padding-y-lg: 24px !default;
$card-header-padding-x-sm: 16px !default;
$card-header-padding-y-sm: 8px !default;
$card-content-padding-x-sm: 16px !default;
$card-content-padding-y-sm: 16px !default;

// divided 分割模式，内容区域的上下间距
$card-divided-content-spacing-y: 12px;

//Datepicker
$datepicker-z-index: 1100 !default;
// Notify
$notify-width: 320px !default;
$notify-z-index: 1100 !default;
$notify-spacing: 20px !default;
$notify-margin-bottom: 10px !default;
$notify-line-height: 1.5 !default;
$notify-padding: 18px !default;
$notify-border-radius-width: 4px !default;
$notify-success: $success !default;
$notify-info: $info !default;
$notify-warning: $warning !default;
$notify-danger: $danger !default;
$notify-title-color: $gray-800 !default;
$notify-icon-font-size: 18px !default;
$notify-content-color: $gray-500 !default;
$notify-close-color: $gray-400 !default;
$notify-close-hover-color: $gray-600 !default;
$notify-icon-padding-right: 15px !default;
$notify-states: (
    'success': $notify-success,
    'warning': $notify-warning,
    'error': $notify-danger,
    'info': $notify-info
);

// Message
$message-z-index: 1100 !default;
$message-spacing: 20px !default;
$message-margin-bottom: 10px !default;
$message-border-radius-width: 4px !default;
$message-border: 1px solid $gray-200 !default;
$message-box-shadow: $box-shadow !default;
$message-icon-font-size: $font-size-md !default;
$message-icon-margin: 8px !default;
$message-close-color: $gray-400 !default;
$message-states: (
    'success': $success,
    'warning': $warning,
    'error': $danger,
    'info': $info,
    'loading': $pass
);

//close
$close-font-size: $font-size-md !default;
$close-font-weight: normal !default;
$close-color: $black !default;
$close-text-shadow: 0 1px 0 $white !default;
$close-text-color: $gray-400 !default;

//empty
$empty-icon-size: 3.125rem !default;
$empty-icon-size-lg: 5rem !default;

$empty-icon-color: $gray-200 !default;
$empty-svg-width: 102px !default;
$empty-svg-height: 92px !default;
$empty-svg-width-lg: 148px !default;
$empty-svg-height-lg: 134px !default;
$empty-svg-width-sm: 64px !default;
$empty-svg-height-sm: 58px !default;
$empty-text-color: $gray-400 !default;
$empty-text-color-with-extra: $gray-800 !default;
$empty-text-size: $font-size-base !default;
$empty-text-size-lg: $font-size-base !default;
$empty-text-size-sm: $font-size-base !default;
$empty-text-margin-top: 12px !default;
$empty-text-margin-top-lg: 18px !default;
$empty-text-margin-top-sm: 6px !default;
$empty-description-color: $gray-600 !default;
$empty-description-size: $font-size-base !default;
$empty-description-margin-top: 14px !default;

//switch
$switch-width: 42px !default;
$switch-height: 24px !default;
$handle-margin: 2px !default;
$switch-sm-width: 36px !default;
$switch-sm-height: 20px !default;
$switch-xs-width: 28px !default;
$switch-xs-height: 16px !default;
$switch-margin-bottom: 0 !default;
//Transfer
$transfer-width: 596px !default;
$transfer-list-header-padding: 10px 0 !default;
$transfer-list-header-font-color: $gray-600 !default;
$transfer-list-header-font-size: $font-size-base !default;
$transfer-list-border-width: 1px !default;
$transfer-list-border-color: $gray-200 !default;
$transfer-list-border-radius: 5px !default;
$transfer-list-width: 270px !default;
$transfer-list-height: 360px !default;
$transfer-list-padding: 10px 0 !default;
$transfer-list-item-padding: 0 15px 0 20px !default;
$transfer-list-item-line-hight: 38px !default;
$transfer-list-item-hover-color: $gray-200 !default;
$transfer-operation-padding: 0 10px !default;
$transfer-operation-font-size: 22px !default;
$transfer-operation-color: $gray-500 !default;
//progress
$progress-colors: () !default;
$progress-height: 10px !default;
$progress-height-lg: 16px !default;
$progress-height-sm: 6px !default;
$progress-height-xs: 4px !default;
$progress-circle-height: 112px !default;
$progress-circle-height-lg: 160px !default;
$progress-circle-height-sm: 80px !default;
$progress-circle-height-xs: 44px !default;
$progress-bg: $gray-200 !default;
$progress-split-color: $bg-default !default;
$progress-circle-border-radius: 100px !default;
$progress-circle-font-size: 1rem !default;
$progress-circle-color: $gray-800 !default;
$progress-colors: () !default;
$progress-colors: map.merge(
    (
        'primary': $primary,
        'info': $info,
        'success': $success,
        'warning': $warning,
        'danger': $danger
    ),
    $progress-colors
);
$progress-size: () !default;
$progress-size: map.merge(
    (
        'xs': $progress-height-xs,
        'sm': $progress-height-sm,
        'md': $progress-height,
        'lg': $progress-height-lg
    ),
    $progress-size
);

$progress-circle-size: () !default;
$progress-circle-size: map.merge(
    (
        'xs': $progress-circle-height-xs,
        'sm': $progress-circle-height-sm,
        'md': $progress-circle-height,
        'lg': $progress-circle-height-lg
    ),
    $progress-circle-size
);
//Slide
$slide-bg: $white !default;
$slide-width: 360px !default;
$slide-z-index: 900 !default;
$slide-header-height: $layout-header-height !default;
$slide-header-title-font-size: $font-size-title !default;
$slide-header-padding: 1.25rem !default;
$slide-header-main-padding: 0 20px !default;
$slide-body-content-padding: 0 1.25rem 0.75rem 1.25rem !default;
$slide-body-section-padding: 20px !default;
$slide-divider: $gray-200 !default;
$slide-footer-padding: 15px 20px 0 !default;
$slide-footer-height: 56px !default;
$slide-border-color: $gray-200 !default;
$slide-box-shadow:
    inset 0px 4px 8px 0px #00000008,
    -4px 0px 12px 4px #00000008 !default;
//slider
$slider-height-sm: 6px !default;
$slider-height-md: 10px !default;
$slider-height-lg: 16px !default;
//tree
$tree-padding: 10px 0 10px 0;
$tree-node-padding: 0 0 0 0 !default;
$tree-node-wrapper-padding: 0 20px 0 20px !default;
$tree-node-wrapper-height: 44px !default;
$tree-node-wrapper-line-height: 44px !default;
$tree-node-wrapper-border-bottom: 1px solid $gray-200 !default;
$tree-node-wrapper-active-border-color: rgba($primary, 0.3) !default;
$tree-node-wrapper-active-background-color: rgba($primary, 0.1) !default;
$tree-node-wrapper-hover-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.08) !default;
$tree-node-wrapper-height-sm: 42px !default;
// stepper
$stepper-header: 70px !default;
$stepper-padding: 0 50px !default;
$stepper-header-padding: 0 5px !default;
$stepper-number-size: 24px !default;
$stepper-selected-icon-bottom: -24px !default;
$stepper-label-padding: 0 8px !default;
$stepper-line-margin: 0 10px 0 0 !default;
$stepper-line-min-width: 30px !default;

//#region scrollbar
$scrollbar-track-piece: $gray-200 !default;
$scrollbar-thumb: $gray-300 !default;
// #endregion

// breadcrumb

$breadcrumb-icon-color: $gray-600 !default;
$breadcrumb-separator-color: $gray-500 !default;
$breadcrumb-text-color: $gray-600 !default;
$breadcrumb-active-color: $gray-800 !default;

// thyMenu
$menu-height: 40px !default;
$menu-shadow: 0 0 8px 2px $gray-200 !default;
$menu-item-padding: 0 20px !default;
$menu-group-header-padding: 0 1020px !default;
$menu-group-margin-left: 15px !default;
$menu-divider-margin: 10px 20px !default;
$menu-loose-item-padding: 0 12px 0 20px !default;
$menu-loose-item-border-radius: 4px !default;
$menu-theme-dark-color: var(--menu-theme-dark-text-color) !default;
$menu-theme-dark-icon-color: var(--menu-theme-dark-icon-color) !default;
$menu-theme-dark-hover-color: var(--menu-theme-dark-hover-color) !default;
$menu-theme-dark-bg-color: #48525c !default;
$menu-theme-dark-hover-bg-color: #39414c !default;
$menu-theme-dark-divider-color: var(--menu-theme-dark-divider-color) !default;
$menu-collapsed-width: 60px !default;
$menu-collapsed-height: 60px !default;
$menu-collapsed-icon-size: 20px !default;

// editable
$editable-border-color: $gray-200 !default;
$editable-padding-y: $input-padding-y !default;
$editable-padding-x: $input-padding-x !default;
$editable-padding-y-lg: $input-padding-y-lg !default;
$editable-padding-x-lg: $input-padding-x-lg !default;

// arrow-switcher
$arrow-switcher-btn-size: 30px !default;
$arrow-switcher-sm-btn-size: 24px !default;
$arrow-switcher-btn-bac: $gray-200 !default;
$arrow-switcher-btn-disabled-bac: $gray-80 !default;
$arrow-switcher-btn-disabled-color: $gray-300 !default;
$arrow-switcher-btn-hover-bac: $primary !default;
$arrow-switcher-btn-hover-color: $white !default;

// pagination
$pagination-item-width: 2rem;
$pagination-item-width-sm: 1.75rem;
$pagination-item-width-lg: 2.75rem;
$pagination-item-height: 2rem;
$pagination-item-height-sm: 1.75rem;
$pagination-item-height-lg: 2.75rem;
$pagination-line-height: 1.5rem !default;
$pagination-line-height-lg: 2.1875rem !default;
$pagination-line-height-sm: 1.375rem !default;
$pagination-padding-y: 0.282rem !default;
$pagination-padding-x: 0.375rem !default;
$pagination-color: $gray-500 !default;
$pagination-number-color: $gray-700 !default;
$pagination-font-size: 12px !default;
$pagination-bg: $bg-default !default;
$pagination-border-width: 1px !default;
$pagination-border-color: $gray-200 !default;
$pagination-hover-color: $link-hover-color !default;
$pagination-hover-bg: $bg-default !default;
$pagination-hover-border-color: $gray-200 !default;
$pagination-active-color: $white !default;
$pagination-active-bg: $primary !default;
$pagination-active-border-color: $primary !default;
$pagination-disabled-color: $gray-400 !default;
$pagination-disabled-bg: $bg-default !default;
$pagination-disabled-border-color: $gray-200 !default;
$pagination-total-pages-color: $gray-700;
$pagination-jumper-margin: 0 10px !default;
$pagination-jumper-input-color: $gray-700;
$pagination-jumper-button-color: $gray-700;
$pagination-page-size-width: 6.375rem;
$pagination-page-size-width-sm: 5.625rem;
$pagination-page-size-width-lg: 7.875rem;

// tooltip
$tooltip-font-size: $font-size-base !default;
$tooltip-max-width: 350px !default;
$tooltip-color: $white !default;
$tooltip-bg: var(--tooltip-bg-color) !default;
$tooltip-border-radius: $border-radius !default;
$tooltip-opacity: 0.9 !default;
$tooltip-padding-y: 0.375rem !default;
$tooltip-padding-x: 0.75rem !default;
$tooltip-margin: 0 !default;
$tooltip-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15) !default;
$tooltip-content-min-height: 34px !default;

$tooltip-arrow-width: 0.75rem !default;
$tooltip-arrow-height: 0.375rem !default;
$tooltip-arrow-color: $tooltip-bg !default;

// alert
$alert-padding-y: 0.625rem !default;
$alert-padding-x: 1.125rem !default;
$thy-alert-weak-colors: (
    'primary-weak': $primary,
    'success-weak': $success,
    'warning-weak': $warning,
    'danger-weak': $danger
) !default;
$alert-operation-margin-left: 40px !default;
$alert-icon-margin-right: 8px !default;

// list
$list-item-padding: 4px 8px !default;
$list-grid-option-margin: 0 25px 25px 0 !default;
$list-grid-option-width: 150px !default;
$list-grid-option-height: 120px !default;
$list-grid-option-sm: 95px !default;
$list-grid-option-margin-sm: 0 10px 10px 0 !default;
$list-grid-option-icon-size: 32px;
$list-grid-option-name-margin-top: 15px;
$list-grid-option-sm-name-margin-top: 7px;

// list-item-meta
$thy-list-item-border-bottom: 1px solid $gray-200 !default;
$list-item-meta-padding: 15px 0 !default;
$thy-list-item-meta-content-margin-left: 20px !default;
$thy-list-item-meta-title-font-size: 18px !default;
$thy-list-item-meta-description-margin-top: 10px !default;

// vote
$vote-layout-vertical-sm: 36px;
$vote-layout-vertical-default: 48px;
$vote-layout-vertical-padding-sm: 5px;
$vote-layout-vertical-padding-default: 7px;
$vote-layout-vertical-icon-margin-bottom: 4px;
$vote-layout-horizontal-padding: 4px 7px;
$vote-layout-horizontal-icon-margin-right: 5px;

// statistic
$statistic-size-default: 30px;
$statistic-suffix-size-default: $font-size-base;
$statistic-title-size-default: $font-size-base;

// result
$result-padding: 30px !default;
$result-title-font-size: $font-size-xlg !default;
$result-subtitle-font-size: $font-size-base !default;
$result-subtitle-color: $gray-600 !default;
$result-extra-margin-top: 17px !default;
$result-extra-item-margin: 6px !default;
$result-title-margin-top: 30px !default;
$result-subtitle-margin-top: 8px !default;

// markdown
$markdown-color-width: $rem-14px !default;
$markdown-color-height: $rem-14px !default;
$markdown-color-border-color: $gray-200 !default;

// mention
$mention-suggestions-width: 280px !default;
$mention-suggestions-height: 315px !default;
$mention-suggestions-list-padding: 12px 0 !default;

// Popover
$popover-divider: $gray-100 !default;
$popover-header-padding: 12px 20px !default;
$popover-body-padding: 15px 20px !default;

// divider
$divider-orientation-margin: 5% !default;
$divider-spacing: 16px !default;
$divider-text-padding: 8px !default;
$divider-color: $gray-200 !default;
$divider-deeper-color: $gray-300 !default;
$divider-width: 1px !default;
$divider-text-color: $gray-600 !default;
$divider-colors: () !default;
$divider-colors: map.merge(
    (
        'primary': $primary,
        'secondary': $secondary,
        'success': $success,
        'warning': $warning,
        'danger': $danger,
        'default': $gray-200,
        'lighter': $gray-200,
        'light': $gray-300,
        'deeper': $gray-300
    ),
    $divider-colors
);

// segment
$segment-container-padding: 2px !default;
$segment-border-radius: 2px !default;
$segment-active-bg-color: var(--segment-active-bg-color) !default;
$segment-height-default: 36px !default;
$segment-height-md: 32px !default;
$segment-height-sm: 28px !default;
$segment-height-xs: 24px !default;
$segment-sizes: (
    'xs': $segment-height-xs,
    'sm': $segment-height-sm,
    'md': $segment-height-md,
    'default': $segment-height-default
) !default;
$segment-item-only-icon-xs-width: 28px !default;
$segment-item-only-icon-width: 38px !default;
$segment-item-only-icon-default-color: $gray-600 !default;
$segment-item-only-icon-active-color: $gray-700 !default;
$segment-item-only-icon-hover-color: $gray-700 !default;
$segment-text-margin-left: 8px !default;
$segment-item-xs-padding-x: 8px !default;
$segment-item-padding-x: 12px !default;
$segment-default-color: $gray-700 !default;
$segment-active-color: $gray-800 !default;
$segment-hover-color: $gray-800 !default;
$segment-icon-with-text-default-color: $gray-600 !default;
$segment-icon-with-text-active-color: $gray-700 !default;
$segment-icon-with-text-hover-color: $gray-700 !default;
$segment-disabled-color: $gray-500 !default;
$segment-active-box-shadow:
    0 0 1px 0 rgba(0, 0, 0, 0.1),
    0 1px 4px -1px rgba(0, 0, 0, 0.1) !default;

// collapse
$collapse-border-color: $gray-200 !default;
$collapse-header-hover-color: null !default;
$collapse-header-font-size: $font-size-base !default;
$collapse-spacing-x: 8px !default;
$collapse-spacing-y: 12px !default;

// property
$properties-row-gap: 0.8rem !default;
$properties-column-gap: 1rem !default;
$property-item-label-color: $gray-700 !default;
$property-item-content-color: $gray-800 !default;
$property-item-min-height: 32px !default;
$property-item-padding-x: 1rem !default;
$property-item-padding-y: 0.4rem !default;
$property-item-horizontal-label-width: 100px !default;
$property-item-editor-offset: calc($property-item-padding-x * 0.5 + 0.0625rem) * -1;

// tabs
$tabs-content-space: 1rem !default;

// select-control
$select-control-padding-y-xs: 1px !default;
$select-control-padding-y-sm: 3px !default;
$select-control-padding-y-md: 3px !default;
$select-control-padding-y-default: 5px !default;
$select-control-padding-y-lg: 7px !default;
$select-option-disabled-opacity: 0.5 !default;
$select-control-height-xs: 20px;
$select-control-height-sm: 20px;
$select-control-height-md: 24px;
$select-control-height-default: 24px;
$select-control-height-lg: 28px;

// z-index
$z-index-1: 10;
$z-index-2: 20;
$z-index-3: 30;
$z-index-4: 40;
$z-index-5: 50;
$z-index-6: 60;
$z-index-7: 70;
$z-index-8: 80;
$z-index-9: 90;
$z-index-10: 100;

// comment
$comment-bg: transparent;
$comment-avatar-margin-right: 12px !default;
$comment-author-padding-right: 8px !default;
$comment-author-line-height: 24px !default;
$comment-content-margin-bottom: 16px !default;
$comment-actions-min-width: 40px !default;
$comment-actions-height: 40px !default;
$comment-actions-position-right: 0 !default;
$comment-actions-position-top: -10px !default;
$comment-actions-padding: 4px !default;
$comment-actions-border: 1px solid $gray-200 !default;
$comment-actions-border-radius: 4px !default;
$comment-nest-indent: 40px !default;

// skeleton
$skeleton-horizontal-gap: 12px;
$skeleton-vertical-gap: 12px;
$skeleton-row-height: 20px;
$skeleton-row-radius: 4px;
$skeleton-row-width: 100%;
$skeleton-primary-color: $gray-70;
$skeleton-animated-interval: 1.5s;

// image
$image-preview-bg-color: var(--image-preview-bg-color) !default;
$image-preview-backdrop-bg-color: var(--image-preview-backdrop-bg-color) !default;
$image-preview-text-color: var(--image-preview-text-color) !default;
$image-preview-action-bg-color: var(--image-preview-action-bg-color) !default;
$image-preview-action-icon-color: var(--image-preview-action-icon-color) !default;
$image-preview-switch-bg-color: var(--image-preview-switch-bg-color) !default;
$image-preview-switch-hover-bg-color: var(--image-preview-switch-hover-bg-color) !default;
$image-preview-switch-icon-color: var(--image-preview-switch-icon-color) !default;
$image-preview-switch-icon-hover-color: var(--image-preview-switch-icon-hover-color) !default;

// carousel
$carousel-dot-bg-color: var(--carousel-dot-bg-color) !default;
$carousel-control-bg-color: var(--carousel-control-bg-color) !default;
$carousel-control-hover-bg-color: var(--carousel-control-hover-bg-color) !default;

// color-picker
$color-picker-pointer-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.5) !default;

// calendar
$calendar-active-box-shadow: var(--calendar-active-box-shadow) !default;

// drag drop
$cdk-drag-preview-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.08) !default;

// Prevent style packing optimization
$zero: 0;

// cursor
$disabled-cursor: not-allowed;
$hand-cursor: pointer;
