@import './antd-colors';
@import '../functions';

$remFactor: 16px;

$ns: 'antd-';

$primary: $blue-6;
$info: $primary;
$success: $green-6;
$warning: $gold-6;
$danger: $red-5;
$light: #d9d9d9;
$white: #fff;
$black: #000;

$info-bg: #eaf6fe;
$success-bg: #f1fdeb;
$warning-bg: #fcf7f1;
$danger-bg: #fff5f5;

// Border color
$border-color-base: #d9d9d9; // base border outline a component
$border-color-split: #5d5d5d; // split border inside a component
$border-color-inverse: $white;
$border-width-base: 1px; // width of the border for a component
$border-style-base: solid; // style of a components border

$text-color: rgba(0, 0, 0, 0.85);

$text--muted-color: #6c6c6c;
$text--loud-color: lighten($text-color, 10%);

$link-color: $info;

@import '../variables';
@import '../properties';

:root {
  --fontFamilyBase: -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';

  --lineHeightBase: 1.57;

  --borderColor: #eceff8;
  --text-color: #{$text-color};

  --text--muted-color: #999;
  --text--loud-color: #333;
  --link-onHover-decoration: none;

  --icon-color: inherit;
  --icon-onHover-color: var(--primary);

  --body-bg: #f0f2f5;

  --borderRadius: 2px;

  --Page-header-bg: #fff;

  --saas-crud-title-from-color: #f7f9fc;

  --Button-boxShadow: none;
  --Button-onActive-boxShadow: none;
  --Button-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  // --Button-textShadow: 0 -1px 0 rgb(0 0 0 / 12%);
  --Button--default-border: #d9d9d9;
  --Button--default-onHover-border: #{$blue-5};
  --Button--default-onHover-bg: #fff;
  --Button--default-onHover-color: #{$blue-5};
  --Button--default-onActive-bg: #fff;
  --Button--default-onActive-border: #{$blue-7};
  --Button--default-onActive-color: #{$blue-7};
  --Button-onDisabled-borderColor: #d9d9d9;

  --Button--primary-onHover-bg: #{$blue-5};
  --Button--primary-onHover-border: #{$blue-5};
  --Button--primary-bg: var(--primary);
  --Button--primary-border: var(--primary);
  --Button-onDisabled-bg: rgba(0,0,0,.25);

  --Card-onChecked-bg: #{$blue-1};
  --Card-onChecked-color: var(--body-color);
  --Card-onChecked-fieldLabel-color: var(--text--muted-color);
  --Card-onChecked-borderColor: #{$blue-5};

  --Calendar-btnCancel-bg: #fff;
  --Calendar-btnCancel-border: var(--Button--default-border);

  --Checkbox-onDisabled-color: #d9d9d9;
  --Checkbox-onDisabled-bg: #c5c5c5;

  --Radio-onDisabled-color: #c4c4c4;
  --Radio-onDisabled-bg: #f5f5f5;
  --Radio-onFocus-boxShadow: 0 0 0 3px rgb(24 144 255 / 8%);

  --Rating-onActive-color: #fadb14;

  --Panel--default-bg: #fff;

  --Layout-aside-bg: #001529;
  --Layout-brand-bg: #001529;
  --Layout-aside-color: hsla(0, 0%, 100%, 0.65);
  --Layout-aside-subList-bg: #000c17;
  --Layout-aside-onHover-bg: none;
  --Layout-aside-onAcitve-bg: var(--saas-Primary-Color);

  --ListControl-item-onHover-color: var(--primary);
  --ListControl-item-onHover-bg: var(--Button--default-onHover-bg);
  --ListControl-item-onHover-borderColor: var(--primary);

  --ListItem-onChecked-bg: #{$blue-1};
  --ListItem--strip-bg: #fff;

  --Nav-item-onActive-borderLeft: 0;

  --Modal-header-bg: #fff;
  --Modal-title-fontWeight: 500;

  --Form-item-fontSize: var(--fontSizeBase);
  --Form-item-fontColor: var(--body-color);
  --Form-input-onFocused-borderColor: #{$blue-5};
  --Form-input-borderColor: #{$border-color-base};
  --Form-input-boxShadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
  --Form-select-borderWidth: #{px2rem(1px)};
  --Form-select-borderRadius: 0;
  --Form-select-borderColor: #{$border-color-base};
  --Form-select-bg: var(--white);
  --Form-select-onHover-bg: var(--white);
  --Form-select-onHover-borderColor: #{$blue-5};
  --Form-select-placeholderColor: rgba(0,0,0, .45);
  --Form-select-color: #000;
  --Form-select-caret-iconColor: #999;
  --Form-select-caret-onHover-iconColor: var(--primary);
  --Form-select-caret-fontSize: #{px2rem(12px)};
  --Form-select-outer-borderWidth: 0;
  --Form-select-outer-top: #{px2rem(32px)};
  --Form-select-outer-boxShadow: 0 3px 6px -4px rgb(0 0 0 / 12%),
    0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%);
  --Form-select-menu-color: #333;
  --Form-select-menu-onHover-color: #000;
  --Form-select-menu-onHover-bg: #f5f5f5;
  --Form-select-menu-height: #{px2rem(24px)};
  --Form-select-popoverGap: #{px2rem(3px)};
  --Form-select-search-height: #{px2rem(30px)};
  --Form-selectValue-color: var(--primary);
  --Form-select-onFocus-boxShadow: 0 0 0 3px rgb(24 144 255 / 8%);

  --Page-aside-bg: #ffffff;
  // Jay
  // --Pagination-onActive-backgroundColor: #fff;
  // --Pagination-onActive-color: rgb(24, 144, 255);
  // --Pagination-onActive-border: #{px2rem(1px)} solid var(--primary);
  --Pagination-onActive-backgroundColor: #3582fb;
  --Pagination-onActive-color: #fff;
  --Pagination-onActive-border: #{px2rem(1px)} solid #3582fb;

  --Transfer-title-bg: #f0f2f5;
  // Tabs
  --Tabs-linkFontSize: #{px2rem(14px)};
  --Tabs--card-bg: var(--Table-thead-bg);
  --Tabs--radio-bg: var(--white);
  --Tabs--vertical-onActive-bg: #e7f7ff;
  --Tabs--vertical-onActive-borderWidth: 0 3px 0 0;
  --Tabs--vertical-onActive-container-bg: #fff;
  --Tabs--vertical-onActive-container-borderRight: 1px solid #f0f0f0;

  $Table-strip-bg: transparent;
  --Table-strip-bg: transparent;
  --Table-thead-bg: #fafafa;
  --Table-onHover-bg: rgb(250, 250, 250);
  --Table-onHover-borderColor: var(--Table-borderColor);
  --Table-onChecked-bg: #{$blue-1};
  --Table-onChecked-color: var(--Table-color);
  --Table-onChecked-borderColor: var(--Table-borderColor);

  --Switch-bgColor: #bfbfbf;

  // timeline
  --TimelineItem--axle-flex: 0 0 #{px2rem(24px)};
  --TimelineItem--left-line-width: #{px2rem(2px)};
  --TimelineItem--left-line-left: #{px2rem(13px)};
  --TimelineItem--left-line-top: #{px2rem(20px)};
  --TimelineItem--round-width: #{px2rem(8px)};
  --TimelineItem--round-height: #{px2rem(8px)};
  --TimelineItem--round-left: #{px2rem(10px)};
  --TimelineItem--round-top: #{px2rem(8px)};
  --TimelineItem--icon-width: #{px2rem(16px)};
  --TimelineItem--icon-height: #{px2rem(16px)};
  --TimelineItem--icon-left: #{px2rem(6px)};
  --TimelineItem--content-padding-bottom: #{px2rem(16px)};
  --TimelineItem--content-margin-left: #{px2rem(8px)};
  --TimelineItem--content-time-margin-bottom: #{px2rem(4px)};
  --TimelineItem--content-title-margin-bottom: #{px2rem(4px)};
  --TimelineItem--detail-button-margin-bottom: #{px2rem(8px)};
  --TimelineItem-detail-arrow-width: #{px2rem(16px)};
  --TimelineItem-detail-visible-padding: #{px2rem(10px)};
  --TimelineItem-detail-visible-max-width: #{px2rem(300px)};
  --Timeline-alternate-margin-left: #{px2rem(24px)};

  --TimelineItem--icon-radius: 50%;
  --TimelineItem--round-radius: 50%;
  --TimelineItem--content-radius: #{px2rem(2px)};

  --TimelineItem-detail-visible-shadow: 0 #{px2rem(1px)} #{px2rem(10px)} 0
    rgba(0 0 0 / 10%);

  --TimelineItem--font-size: #{px2rem(12px)};

  --TimelineItem--text-primary-color: #151a26;
  --TimelineItem--text-secondary-color: #83868c;
  --TimelineItem--detail-button-color: var(--primary);
  --TimelineItem--line-bg: #e6e6e8;
  --TimelineItem--content-bg: #f2f2f4;
  --TimelineItem-round-bg: #dadbdd;

  --Timeline--success-bg: var(--success);
  --Timeline--info-bg: var(--info);
  --Timeline--warning-bg: var(--warning);
  --Timeline--danger-bg: var(--danger);

  --Tree-item-onHover-bg: #edf7ff;

  //antd主题颜色变量
  --saas-main-bg: #fff;
  --saas-Title-Text: rgba(0,0,0,.9);
  --saas-Secondary-Text: rgba(0,0,0,.65);
  --saas-Placeholder-Text: rgba(0,0,0,.45);
  --saas-Disable-Text: rgba(0,0,0,.25);
  --saas-Border-Dividers: #f0f0f0;
  --saas-Background-Header: #f7f9fc;
  --saas-SelectedBg: #fafafa;
  --saas-SelectedBorder: #3574ee;
  --saas-Button-Disabled: rgba(0,0,0,0.04);
  //查询器相关
  --saas-crud-filters-bg-color: var(--saas-Background-Header);
  --saas-crud-filters-font-color: var(--saas-SelectedBorder);
  --saas-crud-filters-font-border-color: var(--saas-SelectedBorder);

  --saas-table-thead-border-color: #e7e7e7;
}