
$B1: #e6f0ff;
$B2: #d4e5ff;
$B3: #a7c2f9;
$B4: #a8caff;
$B5: #528eff;
$B6: #2468f2;
$B7: #144bcc;
$B8: #153e91;
$B9: #0e2960;
$B10: #091a3c;

$E1: #ffe8e6;
$E2: #ffdbd9;
$E3: #ffb6b3;
$E4: #ff908c;
$E5: #ff6966;
$E6: #f33e3e;
$E7: #cc292e;
$E8: #a61922;
$E9: #800d18;
$E10: #590410;

$S1: #ecffe6;
$S2: #d1f2c7;
$S3: #a5e693;
$S4: #7bd964;
$S5: #54cc39;
$S6: #30bf13;
$S7: #1b9908;
$S8: #0b7300;
$S9: #054d00;
$S10: #012600;

$W1: #fff4e6;
$W2: #ffecd4;
$W3: #ffd8a8;
$W4: #ffc27d;
$W5: #ffab52;
$W6: #ff9326;
$W7: #d97116;
$W8: #b35209;
$W9: #8c3800;
$W10: #662500;

$G1: #070c14;
$G2: #151b26;
$G3: #303540;
$G4: #5c5f66;
$G5: #84868c;
$G6: #b8babf;
$G7: #d4d6d9;
$G8: #e8e9eb;
$G9: #f2f2f4;
$G10: #f7f7f9;
$G11: #ffffff;

$blue-base: #1890ff;
$blue-1: #e6f7ff;
$blue-2: #bae7ff;
$blue-3: #91d5ff;
$blue-4: #69c0ff;
$blue-5: #40a9ff;
$blue-6: #1890ff;
$blue-7: #096dd9;
$blue-8: #0050b3;
$blue-9: #003a8c;
$blue-10: #002766;
$purple-base: #722ed1;
$purple-1: #f9f0ff;
$purple-2: #efdbff;
$purple-3: #d3adf7;
$purple-4: #b37feb;
$purple-5: #9254de;
$purple-6: #722ed1;
$purple-7: #531dab;
$purple-8: #391085;
$purple-9: #22075e;
$purple-10: #120338;
$cyan-base: #13c2c2;
$cyan-1: #e6fffb;
$cyan-2: #b5f5ec;
$cyan-3: #87e8de;
$cyan-4: #5cdbd3;
$cyan-5: #36cfc9;
$cyan-6: #13c2c2;
$cyan-7: #08979c;
$cyan-8: #006d75;
$cyan-9: #00474f;
$cyan-10: #002329;
$green-base: #52c41a;
$green-1: #f6ffed;
$green-2: #d9f7be;
$green-3: #b7eb8f;
$green-4: #95de64;
$green-5: #73d13d;
$green-6: #52c41a;
$green-7: #389e0d;
$green-8: #237804;
$green-9: #135200;
$green-10: #092b00;
$magenta-base: #eb2f96;
$magenta-1: #fff0f6;
$magenta-2: #ffd6e7;
$magenta-3: #ffadd2;
$magenta-4: #ff85c0;
$magenta-5: #f759ab;
$magenta-6: #eb2f96;
$magenta-7: #c41d7f;
$magenta-8: #9e1068;
$magenta-9: #780650;
$magenta-10: #520339;
$pink-base: #eb2f96;
$pink-1: #fff0f6;
$pink-2: #ffd6e7;
$pink-3: #ffadd2;
$pink-4: #ff85c0;
$pink-5: #f759ab;
$pink-6: #eb2f96;
$pink-7: #c41d7f;
$pink-8: #9e1068;
$pink-9: #780650;
$pink-10: #520339;
$red-base: #f5222d;
$red-1: #fff1f0;
$red-2: #ffccc7;
$red-3: #ffa39e;
$red-4: #ff7875;
$red-5: #ff4d4f;
$red-6: #f5222d;
$red-7: #cf1322;
$red-8: #a8071a;
$red-9: #820014;
$red-10: #5c0011;
$orange-base: #fa8c16;
$orange-1: #fff7e6;
$orange-2: #ffe7ba;
$orange-3: #ffd591;
$orange-4: #ffc069;
$orange-5: #ffa940;
$orange-6: #fa8c16;
$orange-7: #d46b08;
$orange-8: #ad4e00;
$orange-9: #873800;
$orange-10: #612500;
$yellow-base: #fadb14;
$yellow-1: #feffe6;
$yellow-2: #ffffb8;
$yellow-3: #fffb8f;
$yellow-4: #fff566;
$yellow-5: #ffec3d;
$yellow-6: #fadb14;
$yellow-7: #d4b106;
$yellow-8: #ad8b00;
$yellow-9: #876800;
$yellow-10: #614700;
$volcano-base: #fa541c;
$volcano-1: #fff2e8;
$volcano-2: #ffd8bf;
$volcano-3: #ffbb96;
$volcano-4: #ff9c6e;
$volcano-5: #ff7a45;
$volcano-6: #fa541c;
$volcano-7: #d4380d;
$volcano-8: #ad2102;
$volcano-9: #871400;
$volcano-10: #610b00;
$geekblue-base: #2f54eb;
$geekblue-1: #f0f5ff;
$geekblue-2: #d6e4ff;
$geekblue-3: #adc6ff;
$geekblue-4: #85a5ff;
$geekblue-5: #597ef7;
$geekblue-6: #2f54eb;
$geekblue-7: #1d39c4;
$geekblue-8: #10239e;
$geekblue-9: #061178;
$geekblue-10: #030852;
$lime-base: #a0d911;
$lime-1: #fcffe6;
$lime-2: #f4ffb8;
$lime-3: #eaff8f;
$lime-4: #d3f261;
$lime-5: #bae637;
$lime-6: #a0d911;
$lime-7: #7cb305;
$lime-8: #5b8c00;
$lime-9: #3f6600;
$lime-10: #254000;
$gold-base: #faad14;
$gold-1: #fffbe6;
$gold-2: #fff1b8;
$gold-3: #ffe58f;
$gold-4: #ffd666;
$gold-5: #ffc53d;
$gold-6: #faad14;
$gold-7: #d48806;
$gold-8: #ad6800;
$gold-9: #874d00;
$gold-10: #613400;
$preset-colors: pink, magenta, red, volcano, orange, yellow, gold, cyan, lime,
  green, blue, geekblue, purple;

  
@import '../functions';

$remFactor: 16px;

$ns: 'chinaRed-';

$primary: $red-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;

  --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: #{$red-5};
  --Button--default-onHover-bg: #fff;
  --Button--default-onHover-color: #{$red-5};
  --Button--default-onActive-bg: #fff;
  --Button--default-onActive-border: #{$red-7};
  --Button--default-onActive-color: #{$red-7};
  --Button-onDisabled-borderColor: #d9d9d9;

  --Button--primary-onHover-bg: #{$red-5};
  --Button--primary-onHover-border: #{$red-5};

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

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

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

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

  --Rating-onActive-color: #fadb14;

  // --Divider-borderStyle: solid;

  --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: #{$red-6};

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

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

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

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

  --Form-input-onFocused-borderColor: #{$red-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: #{$red-5};
  --Form-select-placeholderColor: #999;
  --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;

  --Pagination-onActive-backgroundColor: #fff;
  --Pagination-onActive-color: rgb(24, 144, 255);
  --Pagination-onActive-border: #{px2rem(1px)} solid var(--primary);

  --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: #{$red-1};
  --Table-onChecked-color: var(--Table-color);
  --Table-onChecked-borderColor: var(--Table-borderColor);

  --Switch-bgColor: #bfbfbf;
}
@import './common';

// reset
:root {
  --fontSizeBase: 13px;
  --fontSizeMd: 14px;
  --fontSizeLg: 18px;
  --fontSizeXl: 22px;
  --fontSizeSm: 12px;
  --fontSizeXs: 11px;

  --gap-xs: 3px;
  --gap-sm: 8px;
  --gap-base: 12px;
  --gap-md: 16px;
  --gap-lg: 26px;

  //--Form-item-gap: 14px;
  --Panel-bodyPadding: 12px;

  --Form-input-paddingX: 8px;
  --Form-input-height: 28px;

  //--Form-input-lineHeight: 1.4285714286;
  //--Button-height: var(--Form-input-height);
  //--Button-lineHeight: var(--Form-input-lineHeight);
  --Button--lg-height: 32px;
  //--Button--lg-lineHeight: 24 / 20;
  //--Button--md-height: var(--Button-height);
  //--Button--md-lineHeight: 1;
  --Button--sm-height: 26px;
  //--Button--sm-lineHeight: 18 / 12;
  --Button--xs-height: 22px;
  //--Button--xs-lineHeight: 18 / 11;

  --Switch-height: 20px;
  --Switch-width: 44px;

  --Checkbox-size: 16px;

  --ListControl-fontSize: 12px;
  --ListControl-item-paddingX: 8px;
  --ListControl-item-paddingY: 4px;

  --Calendar-btn-height: 24px;

  --InputRange-slider-height: 20px;
  --InputRange-slider-width: 16px;
  --InputRange-track-height: 8px;

  --TableCell-paddingY: 8px;
  --TableCell-paddingX: 8px;
  --TableCell-height: 38px;

  --Pagination-height: 24px;
  --Pagination-minWidth: 24px;
  --Pagination-padding: auto 4px;
}


.pandora-scope .monaco-inputbox > .wrapper {
  padding: 0;
}

.pandora-scope .#{$ns}-Table-content {
  overflow-y: hidden;
}

.pandora-scope .#{$ns}-Page-body {
  padding-top: 0.5rem;
}

.pandora-scope .#{$ns}-Button {
  line-height: 1;
}

.pandora-scope .#{$ns}-ListControl-item:hover:active:before, .pandora-scope .#{$ns}-ListControl-item.is-active:before {
  width: 12px;
  height: 12px;
}

.pandora-scope .#{$ns}-ImageControl-addBtn {
  width: 112px;
  height: 112px;
}

.pandora-scope .#{$ns}-FileControl-selectBtn {
  width: 112px;
}

.pandora-scope .#{$ns}-InputRange-slider:before {
  line-height: 16px;
}

.pandora-scope .#{$ns}-RangeControl .#{$ns}-InputRange-input {
  right: 1.625rem;
  top: 16px;
  height: 24px;

  > input {
    border-width: 1px;
    border: var(--Form-input-borderWidth) solid var(--Form-input-borderColor);
    border-radius: var(--Form-input-borderRadius);
  }
}

.pandora-scope .#{$ns}-RatingControl {
  line-height: 1;
}

.pandora-scope .#{$ns}-Crud-pageSwitch .#{$ns}-Select {
  height: 26px;
  min-height: 26px;
}

.pandora-scope .#{$ns}-Crud-pageSwitch .#{$ns}-Select .#{$ns}-Select-valueWrap {
  top: -1px;
}

.button.toggle.left.codicon.codicon-find-collapsed:focus, .button.toggle.left.codicon.codicon-find-expanded:focus {
  outline: #007fd4 solid 1px;
  outline-offset: -1px;
}


/* ----------------------------------------------------------------- form表单 */

.form-label-2x .#{$ns}Form-item .#{$ns}Form-label, .form-label-2x .#{$ns}Form-label {
  width: 2rem;
  text-align: right;
}

.form-label-3x .#{$ns}Form-item .#{$ns}Form-label, .form-label-3x .#{$ns}Form-label {
  width: 3rem;
  text-align: right;
}

.form-label-4x .#{$ns}Form-item .#{$ns}Form-label, .form-label-4x .#{$ns}Form-label {
  width: 4rem;
  text-align: right;
}

.form-label-5x .#{$ns}Form-item .#{$ns}Form-label, .form-label-5x .#{$ns}Form-label {
  width: 5rem;
  text-align: right;
}

.form-label-6x .#{$ns}Form-item .#{$ns}Form-label, .form-label-6x .#{$ns}Form-label {
  width: 6rem;
  text-align: right;
}

.form-label-7x .#{$ns}Form-item .#{$ns}Form-label, .form-label-7x .#{$ns}Form-label {
  width: 7rem;
  text-align: right;
}

.form-label-8x .#{$ns}Form-item .#{$ns}Form-label, .form-label-8x .#{$ns}Form-label {
  width: 8rem;
  text-align: right;
}

.form-label-9x .#{$ns}Form-item .#{$ns}Form-label, .form-label-9x .#{$ns}Form-label {
  width: 9rem;
  text-align: right;
}

.form-label-10x .#{$ns}Form-item .#{$ns}Form-label, .form-label-10x .#{$ns}Form-label {
  width: 10rem;
  text-align: right;
}

.form-input-10x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-10x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  min-width: 10rem;
  width: 10rem;
}

.form-input-12x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-12x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  min-width: 12rem;
  width: 12rem;
}

.form-input-14x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-14x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  min-width: 14rem;
  width: 14rem;
}

.form-input-16x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-16x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 16rem;
}

.form-input-18x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-18x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 18rem;
}

.form-input-20x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-20x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 20rem;
}

.form-input-22x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-22x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 22rem;
}

.form-input-24x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-24x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 24rem;
}

.form-input-26x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-26x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 26rem;
}

.form-input-28x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-28x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 28rem;
}

.form-input-30x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-30x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 30rem;
}

.form-input-32x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .form-input-32x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 32rem;
}

.flex-form-label-2x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-2x .#{$ns}Form-label {
  flex-basis: 2rem;
  max-width: 2rem;
}

.flex-form-label-3x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-3x .#{$ns}Form-label {
  flex-basis: 3rem;
  max-width: 3rem;
}

.flex-form-label-4x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-4x .#{$ns}Form-label {
  flex-basis: 4rem;
  max-width: 4rem;
}

.flex-form-label-5x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-5x .#{$ns}Form-label {
  flex-basis: 5rem;
  max-width: 5rem;
}

.flex-form-label-6x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-6x .#{$ns}Form-label {
  flex-basis: 6rem;
  max-width: 6rem;
}

.flex-form-label-6x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-6x .#{$ns}Form-label {
  flex-basis: 7rem;
  max-width: 7rem;
}

.flex-form-label-8x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-8x .#{$ns}Form-label {
  flex-basis: 8rem;
  max-width: 8rem;
}

.flex-form-label-9x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-9x .#{$ns}Form-label {
  flex-basis: 9rem;
  max-width: 9rem;
}

.flex-form-label-10x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-10x .#{$ns}Form-label {
  flex-basis: 10rem;
  max-width: 10rem;
}

.flex-form-label-11x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-11x .#{$ns}Form-item .#{$ns}Form-label, .flex-form-label-11x .#{$ns}Form-label {
  flex-basis: 11rem;
  max-width: 11rem;
}

.flex-form-input-10x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-10x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 10rem;
}

.flex-form-input-12x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-12x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 12rem;
}

.flex-form-input-14x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-14x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 14rem;
}

.flex-form-input-16x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-16x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 16rem;
}

.flex-form-input-18x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-18x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 18rem;
}

.flex-form-input-20x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-20x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 20rem;
}

.flex-form-input-22x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-22x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 22rem;
}

.flex-form-input-24x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-24x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 24rem;
}

.flex-form-input-26x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-26x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 26rem;
}

.flex-form-input-28x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-28x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 28rem;
}

.flex-form-input-30x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-30x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 30rem;
}

.flex-form-input-32x .#{$ns}Form-item .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button), .flex-form-input-32x .#{$ns}Form-value .#{$ns}Form-control:not(.#{$ns}Button) {
  width: 32rem;
}

.form-item-height-2_5x .#{$ns}Form-item {
  height: 2.5rem;
}

.form-item-height-3_5x .#{$ns}Form-item {
  height: 3.5rem;
}

/* --------------------------------------------------------------------------------------------------------------------- Dialog表单输入组件样式 */

.dialog-width-10x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 10rem;
  min-width: 10rem;
  max-width: 10rem;
}

.dialog-width-15x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 15rem;
  min-width: 15rem;
  max-width: 15rem;
}

.dialog-width-20x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 20rem;
  min-width: 20rem;
  max-width: 20rem;
}

.dialog-width-25x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 25rem;
  min-width: 25rem;
  max-width: 25rem;
}

.dialog-width-30x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 30rem;
  min-width: 30rem;
  max-width: 30rem;
}

.dialog-width-35x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 35rem;
  min-width: 35rem;
  max-width: 35rem;
}

.dialog-width-40x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 40rem;
  min-width: 40rem;
  max-width: 40rem;
}

.dialog-width-45x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 45rem;
  min-width: 45rem;
  max-width: 45rem;
}

.dialog-width-50x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 50rem;
  min-width: 50rem;
  max-width: 50rem;
}

.dialog-width-55x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 55rem;
  min-width: 55rem;
  max-width: 55rem;
}

.dialog-width-60x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 60rem;
  min-width: 60rem;
  max-width: 60rem;
}

.dialog-width-65x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 65rem;
  min-width: 65rem;
  max-width: 65rem;
}

.dialog-width-70x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 70rem;
  min-width: 70rem;
  max-width: 70rem;
}

.dialog-width-75x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 75rem;
  min-width: 75rem;
  max-width: 75rem;
}

.dialog-width-80x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 80rem;
  min-width: 80rem;
  max-width: 80rem;
}

.dialog-width-85x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 85rem;
  min-width: 85rem;
  max-width: 85rem;
}

.dialog-width-90x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 90rem;
  min-width: 90rem;
  max-width: 90rem;
}

.dialog-width-95x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 95rem;
  min-width: 95rem;
  max-width: 95rem;
}

.dialog-width-100x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 100rem;
  min-width: 100rem;
  max-width: 100rem;
}

.dialog-width-105x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 105rem;
  min-width: 105rem;
  max-width: 105rem;
}

.dialog-width-110x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 110rem;
  min-width: 110rem;
  max-width: 110rem;
}

.dialog-width-115x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 115rem;
  min-width: 115rem;
  max-width: 115rem;
}

.dialog-width-120x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 120rem;
  min-width: 120rem;
  max-width: 120rem;
}

.dialog-width-125x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 125rem;
  min-width: 125rem;
  max-width: 125rem;
}

.dialog-width-130x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 130rem;
  min-width: 130rem;
  max-width: 130rem;
}

.dialog-width-135x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 135rem;
  min-width: 135rem;
  max-width: 135rem;
}

.dialog-width-140x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 140rem;
  min-width: 140rem;
  max-width: 140rem;
}

.dialog-width-145x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 145rem;
  min-width: 145rem;
  max-width: 145rem;
}

.dialog-width-150x.pd-dialog-widget.#{$ns}Modal .#{$ns}Modal-content.in {
  width: 150rem;
  min-width: 150rem;
  max-width: 150rem;
}
