:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
.x-mobile-iframe {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 18.5rem;
  height: 37.5rem;
  border: solid 1px var(--fdm-color-split);
  border-radius: var(--fdm-border-radius-xs);
}
.x-mobile-iframe.hidden {
  visibility: hidden;
}
.x-qr-code-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 10rem;
  height: 10rem;
  background: var(--fdm-color-bg-container-grey-secondary);
  border: solid 1px var(--fdm-color-split);
  border-left: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-qr-code-wrapper .tip {
  margin-bottom: 1rem;
  color: var(--fdm-color-text-secondary);
}
.x-qr-code-wrapper .qr-code {
  width: 5rem;
  height: 5rem;
  margin: 0 auto;
}

:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
.x-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 3.5rem;
  -webkit-box-shadow: 0 0.1rem 0.25rem 0 rgba(99, 99, 99, 0.15);
          box-shadow: 0 0.1rem 0.25rem 0 rgba(99, 99, 99, 0.15);
}
.x-header .logo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  cursor: pointer;
}
.x-header .logo-wrapper .logo-text {
  margin-left: 0.5rem;
  font-weight: bold;
  font-size: 1rem;
}
.x-header .btn-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 1rem;
}
.x-header .btn-wrapper .btn-item {
  margin-right: 2rem;
  padding: 0.25rem;
  cursor: pointer;
  -webkit-transition: color 100ms ease;
  transition: color 100ms ease;
}
.x-header .btn-wrapper .btn-item:hover {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-header .btn-wrapper .version {
  padding: 0.2rem 0.5rem;
  color: #5f5f5f;
  border: 1px solid var(--fdm-color-border);
  border-radius: 0.2rem;
  cursor: default;
}
.page-example-theme-list .theme-item {
  width: 5rem;
  height: 1.5rem;
  margin: 0.25rem;
  cursor: pointer;
}
.page-example-theme-list .theme-item.select {
  border: solid 1px #000000;
}

:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
.x-doc-list {
  padding: 0 1rem 1rem;
}
.x-doc-list .component-group .group-title {
  margin-top: 0.5rem;
  color: #49515E;
  font-size: 0.7rem;
  line-height: 1.5rem;
}
.x-doc-list .component-group .group-item {
  margin: 0.25rem 0;
  padding: 0.4rem 0.75rem;
  overflow: hidden;
  border-radius: 0.25rem;
  cursor: pointer;
}
.x-doc-list .component-group .group-item .list-item-main {
  padding: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.x-doc-list .component-group .group-item:hover {
  background: #E9F7F6;
  background: var(--fdm-color-primary-bg, #E9F7F6);
}
.x-doc-list .component-group .group-item.selected {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background: #E9F7F6;
  background: var(--fdm-color-primary-bg, #E9F7F6);
}
.x-doc-list .component-group .group-item.selected .list-item-subtitle {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}

.CodeMirror {
  z-index: 0;
  height: auto;
  color: #484848;
  font-size: 0.65rem;
  font-family: 'source-code-pro', Menlo, 'Courier New', Consolas, monospace;
  line-height: 1rem;
  background: transparent;
}
.CodeMirror .CodeMirror-gutters {
  z-index: 0;
  background: transparent;
  border-right: 0;
}
.CodeMirror .CodeMirror-selected {
  background: #e6effb;
}
.CodeMirror pre {
  padding: 0 1.25rem;
}
.CodeMirror span.cm-keyword {
  color: #1990b8;
}
.CodeMirror span.cm-atom {
  color: #c92c2c;
}
.CodeMirror span.cm-number {
  color: #c92c2c;
}
.CodeMirror span.cm-variable {
  color: black;
}
.CodeMirror span.cm-variable-2 {
  color: #0000c0;
}
.CodeMirror span.cm-variable-3 {
  color: #0000c0;
}
.CodeMirror span.cm-property {
  color: black;
}
.CodeMirror span.cm-operator {
  color: black;
}
.CodeMirror span.cm-comment {
  color: #7d8b99;
}
.CodeMirror span.cm-string {
  color: #2f9c0a;
}
.CodeMirror span.cm-string-2 {
  color: #2f9c0a;
}
.CodeMirror span.cm-link {
  color: #c92c2c;
}

:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
.markdown-toc {
  position: fixed;
  top: 9rem;
  right: 3rem;
  width: 9rem;
}
.markdown-toc::before {
  display: block;
  height: 0.05rem;
  margin-bottom: 0.45rem;
  background: #c3cdda;
  content: '';
}
.markdown-toc li > a {
  display: block;
  margin: 0.25rem 0;
  padding-left: 0.5rem;
  overflow: hidden;
  color: #1f2d3d;
  line-height: 1rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.markdown-toc li > a:hover,
.markdown-toc li > a.toc-active {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.demo-block {
  height: 30rem;
  overflow: hidden;
  border: 1px solid var(--fdm-color-split);
  border-radius: 0.6rem;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.demo-block .meta {
  position: relative;
  height: 100%;
  padding: 0.5rem 0 0 0.5rem;
  overflow: hidden;
  border-left: solid 0.05rem var(--fdm-color-split);
}
.demo-block .meta.no-border {
  border-top: none;
}
.demo-block .meta .editor {
  height: 100%;
}
.demo-block .meta .editor .CodeMirror {
  height: 100%;
}
.demo-block .x-grid-row {
  height: 100%;
}
.demo-block .x-grid-row .x-grid-col {
  height: 100%;
  overflow: auto;
}
.demo-block .x-grid-row .x-grid-col .source {
  min-height: 100%;
  background: var(--fdm-color-bg-container-grey-secondary);
}

:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
.x-comp-item-doc {
  padding: 1rem 12rem 5rem 1rem;
}
.x-comp-item-doc table {
  width: 100%;
  border-radius: var(--fdm-border-radius-xs);
}
.x-comp-item-doc table tr {
  line-height: 1.5rem;
}
.x-comp-item-doc table tr:nth-child(even) {
  background: var(--fdm-color-bg-container-grey-secondary);
}
.x-comp-item-doc table th,
.x-comp-item-doc table td {
  padding: 0.5rem;
  text-align: left;
  border: solid 1px var(--fdm-color-split);
}
.x-comp-item-doc table th {
  background: var(--fdm-color-bg-container-grey-secondary);
}
.x-comp-item-doc pre {
  max-height: 30rem;
  padding: 1rem;
  overflow: auto;
  line-height: 1rem;
  background: var(--fdm-color-bg-container-grey-secondary);
  border-radius: var(--fdm-border-radius-xs);
}

:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
.page-tree .custom-key-label {
  margin-left: var(--fdm-gap-xs);
  color: var(--fdm-color-text-secondary);
  font-size: var(--fdm-font-size-sm);
}

:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
.page-comp-doc {
  padding: 0 !important;
}
.page-comp-doc .x-header {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
}
.page-comp-doc .comp-doc-body {
  position: absolute;
  top: 3.5rem;
  right: 0;
  bottom: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}
.page-comp-doc .comp-doc-body > .left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 12.5rem;
          flex: 0 0 12.5rem;
  overflow: auto;
}
.page-comp-doc .comp-doc-body > .right {
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  overflow: auto;
}
.page-comp-doc .comp-doc-body > .right .comp-demo {
  position: fixed;
  top: 5rem;
  right: 3rem;
}
.page-comp-doc .comp-doc-body > .right .doc-content {
  min-width: 52.5rem;
}
.page-comp-doc .comp-doc-body > .right .doc-content .playground {
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 1313px) {
  .page-comp-doc .comp-doc-body > .right .markdown-toc {
    display: none;
  }
  .page-comp-doc .comp-doc-body > .right .x-comp-item-doc {
    padding-right: 1rem;
  }
}

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
*::before,
*::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
html {
  height: 100%;
  font-size: var(--fdm-font-size-3xl);
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
}
body {
  position: relative;
  height: 100%;
  margin: 0;
  padding: 0;
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size);
  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', Roboto, 'Noto Sans CJK SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
pre {
  margin: 0;
  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', Roboto, 'Noto Sans CJK SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
  white-space: pre-wrap;
}
a {
  text-decoration: none;
  outline: none;
}
a:active,
a:hover {
  outline: 0;
}
input,
textarea {
  margin: 0;
  padding: 0.15rem 0.3rem;
  color: var(--fdm-color-text);
  font-family: sans-serif;
  vertical-align: middle;
  border: 1px solid var(--fdm-color-border);
  outline: none;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  color: var(--fdm-color-text-disabled);
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
input::placeholder,
textarea::placeholder {
  color: var(--fdm-color-text-disabled);
}
textarea {
  color: var(--fdm-color-text);
  line-height: 1.05rem;
  resize: none;
}
textarea,
input,
button {
  font-size: var(--fdm-font-size);
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
img {
  border: 0;
  outline: none;
}
button {
  outline: none;
}
ul,
ol {
  margin: 0;
  padding: 0;
}
li {
  list-style-type: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
@-webkit-keyframes x-rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes x-rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes x-zoom-in {
  from {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
    opacity: 0;
  }
  to {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes x-zoom-in {
  from {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
    opacity: 0;
  }
  to {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@-webkit-keyframes x-slide-to-right {
  from {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes x-slide-to-right {
  from {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes x-slide-to-left {
  from {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes x-slide-to-left {
  from {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes x-move-bottom-small {
  from {
    -webkit-transform: translateY(0.15rem);
            transform: translateY(0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes x-move-bottom-small {
  from {
    -webkit-transform: translateY(0.15rem);
            transform: translateY(0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes x-move-top-small {
  from {
    -webkit-transform: translateY(-0.15rem);
            transform: translateY(-0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes x-move-top-small {
  from {
    -webkit-transform: translateY(-0.15rem);
            transform: translateY(-0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes x-move-right-small {
  from {
    -webkit-transform: translateX(0.15rem);
            transform: translateX(0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes x-move-right-small {
  from {
    -webkit-transform: translateX(0.15rem);
            transform: translateX(0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes x-move-left-small {
  from {
    -webkit-transform: translateX(-0.15rem);
            transform: translateX(-0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes x-move-left-small {
  from {
    -webkit-transform: translateX(-0.15rem);
            transform: translateX(-0.15rem);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
.x-ui-hidden {
  display: none !important;
}
.x-loading-icon {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: inherit;
  border-radius: 50%;
  -webkit-transform-origin: center;
          transform-origin: center;
}
.x-loading-icon::before,
.x-loading-icon::after {
  position: absolute;
  border: solid 2px currentColor;
  border-radius: inherit;
  content: '';
  inset: 0;
}
.x-loading-icon::before {
  opacity: 0.2;
}
.x-loading-icon::after {
  border-color: transparent;
  border-top-color: currentColor;
  -webkit-animation: x-rotate 0.8s infinite cubic-bezier(0.43, 0.1, 0.54, 0.85);
          animation: x-rotate 0.8s infinite cubic-bezier(0.43, 0.1, 0.54, 0.85);
}
.x-loading-icon.inline {
  display: inline-block;
}
.x-loading-icon.size-small {
  width: var(--fdm-icon-size-sm);
  height: var(--fdm-icon-size-sm);
}
.x-loading-icon.size-normal {
  width: var(--fdm-icon-size);
  height: var(--fdm-icon-size);
}
.x-loading-icon.size-large {
  width: var(--fdm-icon-size-lg);
  height: var(--fdm-icon-size-lg);
}
.x-button {
  gap: var(--fdm-gap-sm);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: var(--fdm-height);
  padding: 0 var(--fdm-padding-lg);
  font-size: var(--fdm-font-size);
  border: 1px solid transparent;
  border-radius: var(--fdm-border-radius-full);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-button .text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: var(--fdm-line-height);
}
.x-button > .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--fdm-icon-size);
}
.x-button.inline {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.x-button.type-primary {
  color: #FFFFFF;
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
  border-color: #03ABA0;
  border-color: var(--fdm-color-primary, #03ABA0);
}
.x-button.type-primary:not(.disabled):not(.loading):active {
  background: #05948A;
  background: var(--fdm-color-primary-active, #05948A);
  border-color: #05948A;
  border-color: var(--fdm-color-primary-active, #05948A);
}
.x-button.type-secondary {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background: #D8F2F0;
  background: var(--fdm-color-primary-bg-deep, #D8F2F0);
  border-color: #D8F2F0;
  border-color: var(--fdm-color-primary-bg-deep, #D8F2F0);
}
.x-button.type-secondary:not(.disabled):not(.loading):active {
  color: #05948A;
  color: var(--fdm-color-primary-active, #05948A);
  background: #B0E8E3;
  background: var(--fdm-color-primary-bg-active, #B0E8E3);
  border-color: #B0E8E3;
  border-color: var(--fdm-color-primary-bg-active, #B0E8E3);
}
.x-button.type-normal {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background: #FFFFFF;
  border-color: #03ABA0;
  border-color: var(--fdm-color-primary, #03ABA0);
}
.x-button.type-normal:not(.disabled):not(.loading):active {
  background: #D8F2F0;
  background: var(--fdm-color-primary-bg-text-active, #D8F2F0);
}
.x-button.type-negative {
  color: var(--fdm-color-text);
  background: #FFFFFF;
  border-color: var(--fdm-color-border);
}
.x-button.type-negative:not(.disabled):not(.loading):active {
  background: var(--fdm-color-bg-text-normal-active);
}
.x-button.type-text {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-button.type-text:not(.disabled):not(.loading):active {
  background: #D8F2F0;
  background: var(--fdm-color-primary-bg-text-active, #D8F2F0);
}
.x-button.type-text-normal {
  color: var(--fdm-color-text);
}
.x-button.type-text-normal:not(.disabled):not(.loading):active {
  background: var(--fdm-color-bg-text-normal-active);
}
.x-button.is-only-icon {
  gap: 0;
  width: var(--fdm-height);
  height: var(--fdm-height);
  padding: 0;
}
.x-button.is-only-icon > .text {
  display: none;
}
.x-button.is-only-icon > .icon {
  text-align: center;
}
.x-button.size-large {
  height: var(--fdm-height-xl);
  padding: 0 var(--fdm-padding-xl);
  font-size: var(--fdm-font-size-lg);
}
.x-button.size-large .text {
  line-height: var(--fdm-line-height-lg);
}
.x-button.size-large > .icon {
  font-size: var(--fdm-icon-size-lg);
}
.x-button.size-large.is-only-icon {
  width: var(--fdm-height-xl);
}
.x-button.size-small {
  gap: var(--fdm-gap-xs);
  height: var(--fdm-height-xs);
  padding: 0 var(--fdm-padding);
  font-size: var(--fdm-font-size-sm);
}
.x-button.size-small .text {
  line-height: var(--fdm-line-height-sm);
}
.x-button.size-small > .icon {
  font-size: var(--fdm-icon-size-sm);
}
.x-button.size-small.is-only-icon {
  width: var(--fdm-height-xs);
}
.x-button.loading.type-primary,
.x-button.disabled.type-primary {
  background: #B0E8E3;
  background: var(--fdm-color-primary-disabled, #B0E8E3);
  border-color: #B0E8E3;
  border-color: var(--fdm-color-primary-disabled, #B0E8E3);
}
.x-button.loading.type-secondary,
.x-button.disabled.type-secondary {
  color: #B0E8E3;
  color: var(--fdm-color-primary-disabled, #B0E8E3);
  background: #E9F7F6;
  background: var(--fdm-color-primary-bg, #E9F7F6);
  border-color: #E9F7F6;
  border-color: var(--fdm-color-primary-bg, #E9F7F6);
}
.x-button.loading.type-normal,
.x-button.disabled.type-normal {
  color: #B0E8E3;
  color: var(--fdm-color-primary-disabled, #B0E8E3);
  border-color: #B0E8E3;
  border-color: var(--fdm-color-primary-disabled, #B0E8E3);
}
.x-button.loading.type-negative,
.x-button.disabled.type-negative {
  color: var(--fdm-color-text-disabled);
  border-color: var(--fdm-color-border);
}
.x-button.loading.type-text,
.x-button.disabled.type-text {
  color: #B0E8E3;
  color: var(--fdm-color-primary-disabled, #B0E8E3);
}
.x-button.loading.type-text-normal,
.x-button.disabled.type-text-normal {
  color: var(--fdm-color-text-disabled);
}
.x-button.danger.type-primary {
  color: #FFFFFF;
  background: var(--fdm-color-error);
  border-color: var(--fdm-color-error);
}
.x-button.danger.type-primary:not(.disabled):not(.loading):active {
  background: var(--fdm-color-error-active);
  border-color: var(--fdm-color-error-active);
}
.x-button.danger.type-secondary {
  color: var(--fdm-color-error);
  background: var(--fdm-color-error-bg-deep);
  border-color: var(--fdm-color-error-bg-deep);
}
.x-button.danger.type-secondary:not(.disabled):not(.loading):active {
  color: var(--fdm-color-error);
  background: var(--fdm-color-error-bg-active);
  border-color: var(--fdm-color-error-bg-active);
}
.x-button.danger.type-normal,
.x-button.danger.type-negative {
  color: var(--fdm-color-error);
  background: #FFFFFF;
  border-color: var(--fdm-color-error);
}
.x-button.danger.type-normal:not(.disabled):not(.loading):active,
.x-button.danger.type-negative:not(.disabled):not(.loading):active {
  background: var(--fdm-color-error-bg-text-active);
}
.x-button.danger.type-text,
.x-button.danger.type-text-normal {
  color: var(--fdm-color-error);
}
.x-button.danger.type-text:not(.disabled):not(.loading):active,
.x-button.danger.type-text-normal:not(.disabled):not(.loading):active {
  background: var(--fdm-color-error-bg-text-active);
}
.x-button.danger.loading.type-primary,
.x-button.danger.disabled.type-primary {
  background: var(--fdm-color-error-disabled);
  border-color: var(--fdm-color-error-disabled);
}
.x-button.danger.loading.type-secondary,
.x-button.danger.disabled.type-secondary {
  color: var(--fdm-color-error-disabled);
  background: var(--fdm-color-error-bg);
  border-color: var(--fdm-color-error-bg);
}
.x-button.danger.loading.type-normal,
.x-button.danger.disabled.type-normal,
.x-button.danger.loading.type-negative,
.x-button.danger.disabled.type-negative {
  color: var(--fdm-color-error-disabled);
  border-color: var(--fdm-color-error-disabled);
}
.x-button.danger.loading.type-text,
.x-button.danger.disabled.type-text,
.x-button.danger.loading.type-text-normal,
.x-button.danger.disabled.type-text-normal {
  color: var(--fdm-color-error-disabled);
}
.x-button.shape-rect {
  border-radius: var(--fdm-border-radius);
}
.x-window-mask {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.25);
}
.x-window-mask.hidden {
  display: none;
}
.x-window-mask.mask-enter,
.x-window-mask.mask-appear {
  opacity: 0;
}
.x-window-mask.mask-enter-active,
.x-window-mask.mask-appear-active {
  opacity: 1;
  -webkit-transition: opacity 200ms ease;
  transition: opacity 200ms ease;
}
.x-window-mask.mask-exit {
  opacity: 1;
}
.x-window-mask.mask-exit.hidden {
  display: block;
}
.x-window-mask.mask-exit-active {
  opacity: 0;
  -webkit-transition: opacity 200ms ease;
  transition: opacity 200ms ease;
}
.x-window-mask.mask-exit-done {
  display: none;
}
.x-drawer {
  position: fixed;
  z-index: 1000;
  overflow: hidden;
  background: #FFFFFF;
}
.x-drawer.with-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.x-drawer-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: var(--fdm-padding-sm) var(--fdm-padding-layout-lg);
}
.x-drawer-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 0;
  height: var(--fdm-height-xl);
  color: var(--fdm-color-text);
  font-weight: var(--fdm-font-weight-bold);
  font-size: var(--fdm-font-size-xl);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-drawer-body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.x-drawer-close {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--fdm-icon-size-2xl);
  height: var(--fdm-icon-size-2xl);
  color: var(--fdm-color-icon-normal);
  font-size: var(--fdm-icon-size);
}
.x-drawer > .x-drawer-close {
  position: absolute;
  top: var(--fdm-padding-layout-lg);
  right: var(--fdm-padding-layout-lg);
  z-index: 1;
}
.x-drawer.from-bottom {
  right: 0;
  bottom: 0;
  left: 0;
}
.x-drawer.from-bottom.bottom-appear,
.x-drawer.from-bottom.bottom-enter {
  -webkit-transform: translate3d(0, 100%, 0);
          transform: translate3d(0, 100%, 0);
}
.x-drawer.from-bottom.bottom-appear-active,
.x-drawer.from-bottom.bottom-enter-active {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-bottom.bottom-exit {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.x-drawer.from-bottom.bottom-exit-active {
  -webkit-transform: translate3d(0, 100%, 0);
          transform: translate3d(0, 100%, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-bottom.bottom-exit-done {
  display: none;
}
.x-drawer.from-top {
  top: 0;
  right: 0;
  left: 0;
}
.x-drawer.from-top.from-top-with-header {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}
.x-drawer.from-top.top-appear,
.x-drawer.from-top.top-enter {
  -webkit-transform: translate3d(0, -100%, 0);
          transform: translate3d(0, -100%, 0);
}
.x-drawer.from-top.top-appear-active,
.x-drawer.from-top.top-enter-active {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-top.top-exit {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.x-drawer.from-top.top-exit-active {
  -webkit-transform: translate3d(0, -100%, 0);
          transform: translate3d(0, -100%, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-top.top-exit-done {
  display: none;
}
.x-drawer.from-left {
  top: 0;
  bottom: 0;
  left: 0;
}
.x-drawer.from-left.left-appear,
.x-drawer.from-left.left-enter {
  -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
}
.x-drawer.from-left.left-appear-active,
.x-drawer.from-left.left-enter-active {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-left.left-exit {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.x-drawer.from-left.left-exit-active {
  -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-left.left-exit-done {
  display: none;
}
.x-drawer.from-right {
  top: 0;
  right: 0;
  bottom: 0;
}
.x-drawer.from-right.right-appear,
.x-drawer.from-right.right-enter {
  -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);
}
.x-drawer.from-right.right-appear-active,
.x-drawer.from-right.right-enter-active {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-right.right-exit {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.x-drawer.from-right.right-exit-active {
  -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.x-drawer.from-right.right-exit-done {
  display: none;
}
.x-action-sheet {
  background: var(--fdm-color-bg-container-grey-secondary);
}
.x-action-sheet .action-sheet-title,
.x-action-sheet .action-sheet-item {
  padding: var(--fdm-padding-lg);
  text-align: center;
  background: #FFFFFF;
  border-bottom: solid 0.05rem var(--fdm-color-split);
}
.x-action-sheet .action-sheet-title {
  color: var(--fdm-color-text-description);
  font-size: var(--fdm-font-size-sm);
}
.x-action-sheet .action-sheet-item {
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size);
}
.x-action-sheet .action-sheet-item .action-sheet-item-content {
  color: inherit;
}
.x-action-sheet .action-sheet-item .action-sheet-item-description {
  color: var(--fdm-color-text-description);
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height);
}
.x-action-sheet .action-sheet-item.danger {
  color: var(--fdm-color-error);
}
.x-action-sheet .action-sheet-item.disabled {
  color: var(--fdm-color-text-disabled);
}
.x-action-sheet .action-sheet-item.disabled .action-sheet-item-description {
  color: var(--fdm-color-text-disabled);
}
.x-action-sheet .action-sheet-item.with-sep {
  margin-bottom: var(--fdm-gap);
  border-bottom: none;
}
.x-action-sheet .action-sheet-item:last-child {
  border-bottom: none;
}
.x-action-sheet .action-sheet-item:not(.disabled):active {
  background: var(--fdm-color-fill-tertiary);
}
.x-spin {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
}
.x-spin .spin-loader {
  position: relative;
  top: 0.05rem;
  width: 1.25rem;
  height: 1.25rem;
  border: solid 0.1rem #B0E8E3;
  border: solid 0.1rem var(--fdm-color-primary-disabled, #B0E8E3);
  border-top-color: #03ABA0;
  border-top-color: var(--fdm-color-primary, #03ABA0);
  border-radius: 50%;
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation: x-rotate 0.8s infinite cubic-bezier(0.43, 0.1, 0.54, 0.85);
          animation: x-rotate 0.8s infinite cubic-bezier(0.43, 0.1, 0.54, 0.85);
}
.x-spin .spin-content {
  margin-top: 0.8rem;
  color: var(--fdm-color-text-disabled);
  font-size: 0.6rem;
}
.x-spin.spin-mask-dark {
  background-color: rgba(0, 0, 0, 0.5);
}
.x-spin.spin-mask-dark .spin-loader {
  border-color: rgba(255, 255, 255, 0.3);
  border-top-color: #FFFFFF;
}
.x-spin.spin-mask-dark .spin-content {
  color: #FFFFFF;
}
.x-spin.spin-mask-light {
  background-color: #FFFFFF;
}
.x-spin.spin-size-large .spin-loader {
  width: 2.5rem;
  height: 2.5rem;
  margin-top: 1rem;
}
.x-spin.spin-size-large .spin-content {
  font-size: 0.8rem;
}
.x-spin.spin-size-small .spin-loader {
  width: 0.75rem;
  height: 0.75rem;
}
.x-spin.spin-full-screen {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
}
.x-file-preview {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  color: #FFFFFF;
}
.x-file-preview .preview-header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 2.5rem;
  padding: 0 0.8rem;
  line-height: 2.5rem;
  background: rgba(0, 0, 0, 0.7);
}
.x-file-preview .preview-header .file-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  margin-right: 0.8rem;
}
.x-file-preview .preview-header .file-info .file-name {
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-file-preview .preview-header .file-info .file-ext {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.x-file-preview .preview-header .action-icons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-file-preview .preview-header .action-icons .download-btn {
  margin-right: 0.8rem;
}
.x-file-preview .action-btn {
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
}
.x-file-preview .action-btn > i {
  font-size: 0.8rem;
}
.x-file-preview .action-btn.disabled {
  color: rgba(255, 255, 255, 0.37);
}
.x-file-preview .preview-body {
  position: absolute;
  top: 2.5rem;
  width: 100%;
  height: calc(100% - 5rem);
  text-align: center;
  -ms-touch-action: none;
      touch-action: none;
}
.x-file-preview .preview-body .preview-center {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-file-preview .preview-body .preview-image.invisible {
  visibility: hidden;
}
.x-file-preview .preview-body .image-loader {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.x-file-preview .preview-body .image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
.x-file-preview .preview-body .image-wrapper > img {
  position: absolute;
  top: 50%;
  left: 50%;
  background: #FFFFFF;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.x-file-preview .preview-body .preview-iframe {
  width: 100%;
  height: 100%;
}
.x-file-preview .preview-body .preview-video video {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 100%;
}
.x-file-preview .preview-body .preview-audio audio {
  max-width: 100%;
  max-height: 100%;
}
.x-file-preview .preview-body .preview-content {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.x-file-preview .preview-body .preview-content .file-info {
  margin-top: 1rem;
  font-size: 0.9rem;
}
.x-file-preview .preview-body .preview-content .file-info .file-name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 100%;
  margin-bottom: 0.5rem;
  padding: 0 0.5rem;
}
.x-file-preview .preview-body .preview-content .file-info .file-name .name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-file-preview .preview-body .preview-content .file-info .file-name .ext {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.x-file-preview .preview-body .preview-content .file-button-group {
  margin-top: 4rem;
}
.x-file-preview .preview-body .preview-content .file-button-group .btn {
  display: block;
  width: 10rem;
  height: 2rem;
  margin: 0 auto 2rem;
  font-size: var(--fdm-font-size);
  line-height: 2rem;
  text-align: center;
  border-radius: 0.88rem;
}
.x-file-preview .preview-body .preview-content .file-button-group .btn.preview {
  color: var(--fdm-color-text);
  background: #FFFFFF;
}
.x-file-preview .preview-body .preview-content .file-button-group .btn.preview:active {
  background: #cccccc;
}
.x-file-preview .preview-body .preview-content .file-button-group .btn.download {
  color: #FFFFFF;
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
}
.x-file-preview .preview-body .preview-content .file-button-group .btn.download:active {
  background: #05948A;
  background: var(--fdm-color-primary-active, #05948A);
}
.x-file-preview .preview-body .preview-content .file-button-group .unsupported-tip {
  margin-bottom: 2rem;
}
.x-file-preview .preview-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  height: 2.5rem;
  background: rgba(0, 0, 0, 0.7);
}
.x-file-preview .preview-footer .left-switch-btn {
  margin-right: 1.2rem;
}
.x-file-preview .preview-footer .right-switch-btn {
  margin-left: 1.2rem;
}
.x-file-preview .preview-footer .preview-origin-image-icon {
  position: absolute;
  left: 0.8rem;
  max-width: 6rem;
  padding: 0.1rem 0.2rem;
  font-size: var(--fdm-font-size-xs);
  border: 1px solid var(--fdm-color-border-secondary);
  border-radius: 0.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-file-preview .preview-footer .preview-rotate-icon {
  position: absolute;
  right: 0.8rem;
}
.x-file-preview .hidden {
  display: none;
}
.x-file-preview-mask {
  background: rgba(0, 0, 0, 0.7);
}
.x-toast {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1004;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-height: 1.9rem;
  padding: var(--fdm-padding-layout);
  color: #FFFFFF;
  font-weight: var(--fdm-font-weight-bold);
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
}
.x-toast .toast-icon {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-right: var(--fdm-gap);
  font-size: var(--fdm-icon-size-2xl);
}
.x-toast .toast-content {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  text-align: center;
  word-break: break-all;
  word-wrap: break-word;
}
.x-toast.type-success {
  background: var(--fdm-color-success);
}
.x-toast.type-warning {
  background: var(--fdm-color-warning);
}
.x-toast.type-error {
  background: var(--fdm-color-error);
}
.x-toast.toast-left {
  width: calc(1vh) * 100;
  width: calc(var(--vh, 1vh) * 100);
  -webkit-transform: rotate(-90deg) translate(-100%, 0);
          transform: rotate(-90deg) translate(-100%, 0);
  -webkit-transform-origin: left top;
          transform-origin: left top;
}
.x-toast.toast-right {
  left: 100vw;
  width: calc(1vh) * 100;
  width: calc(var(--vh, 1vh) * 100);
  -webkit-transform: rotate(90deg) translate(0, 0);
          transform: rotate(90deg) translate(0, 0);
  -webkit-transform-origin: left top;
          transform-origin: left top;
}
.x-toast.toast-enter,
.x-toast.toast-appear {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  opacity: 0;
}
.x-toast.toast-enter-active,
.x-toast.toast-appear-active {
  -webkit-animation: enter-in-top 100ms ease forwards;
          animation: enter-in-top 100ms ease forwards;
}
.x-toast.toast-exit {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}
.x-toast.toast-exit-active {
  -webkit-animation: exit-in-top 100ms ease forwards;
          animation: exit-in-top 100ms ease forwards;
}
.x-toast.toast-left-enter,
.x-toast.toast-left-appear {
  -webkit-transform: rotate(-90deg) translate(-100%, -100%);
          transform: rotate(-90deg) translate(-100%, -100%);
  opacity: 0;
}
.x-toast.toast-left-enter-active,
.x-toast.toast-left-appear-active {
  -webkit-animation: enter-in-left 100ms ease forwards;
          animation: enter-in-left 100ms ease forwards;
}
.x-toast.toast-left-exit {
  -webkit-transform: rotate(-90deg) translate(-100%, 0);
          transform: rotate(-90deg) translate(-100%, 0);
  opacity: 1;
}
.x-toast.toast-left-exit-active {
  -webkit-animation: exit-in-left 100ms ease forwards;
          animation: exit-in-left 100ms ease forwards;
}
.x-toast.toast-right-enter,
.x-toast.toast-right-appear {
  -webkit-transform: rotate(90deg) translate(0, -100%);
          transform: rotate(90deg) translate(0, -100%);
  opacity: 0;
}
.x-toast.toast-right-enter-active,
.x-toast.toast-right-appear-active {
  -webkit-animation: enter-in-right 100ms ease forwards;
          animation: enter-in-right 100ms ease forwards;
}
.x-toast.toast-right-exit {
  -webkit-transform: rotate(90deg) translate(0, 0);
          transform: rotate(90deg) translate(0, 0);
  opacity: 1;
}
.x-toast.toast-right-exit-active {
  -webkit-animation: exit-in-right 100ms ease forwards;
          animation: exit-in-right 100ms ease forwards;
}
@-webkit-keyframes enter-in-top {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes enter-in-top {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes exit-in-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
}
@keyframes exit-in-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0;
  }
}
@-webkit-keyframes enter-in-left {
  0% {
    -webkit-transform: rotate(-90deg) translate(-100%, -100%);
            transform: rotate(-90deg) translate(-100%, -100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(-90deg) translate(-100%, 0);
            transform: rotate(-90deg) translate(-100%, 0);
    opacity: 1;
  }
}
@keyframes enter-in-left {
  0% {
    -webkit-transform: rotate(-90deg) translate(-100%, -100%);
            transform: rotate(-90deg) translate(-100%, -100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(-90deg) translate(-100%, 0);
            transform: rotate(-90deg) translate(-100%, 0);
    opacity: 1;
  }
}
@-webkit-keyframes exit-in-left {
  0% {
    -webkit-transform: rotate(-90deg) translate(-100%, 0);
            transform: rotate(-90deg) translate(-100%, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-90deg) translate(-100%, -100%);
            transform: rotate(-90deg) translate(-100%, -100%);
    opacity: 0;
  }
}
@keyframes exit-in-left {
  0% {
    -webkit-transform: rotate(-90deg) translate(-100%, 0);
            transform: rotate(-90deg) translate(-100%, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-90deg) translate(-100%, -100%);
            transform: rotate(-90deg) translate(-100%, -100%);
    opacity: 0;
  }
}
@-webkit-keyframes enter-in-right {
  0% {
    -webkit-transform: rotate(90deg) translate(0, -100%);
            transform: rotate(90deg) translate(0, -100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(90deg) translate(0, 0);
            transform: rotate(90deg) translate(0, 0);
    opacity: 1;
  }
}
@keyframes enter-in-right {
  0% {
    -webkit-transform: rotate(90deg) translate(0, -100%);
            transform: rotate(90deg) translate(0, -100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(90deg) translate(0, 0);
            transform: rotate(90deg) translate(0, 0);
    opacity: 1;
  }
}
@-webkit-keyframes exit-in-right {
  0% {
    -webkit-transform: rotate(90deg) translate(0, 0);
            transform: rotate(90deg) translate(0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(90deg) translate(0, -100%);
            transform: rotate(90deg) translate(0, -100%);
    opacity: 0;
  }
}
@keyframes exit-in-right {
  0% {
    -webkit-transform: rotate(90deg) translate(0, 0);
            transform: rotate(90deg) translate(0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(90deg) translate(0, -100%);
            transform: rotate(90deg) translate(0, -100%);
    opacity: 0;
  }
}
.x-snack-bar {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1004;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0.6rem 0.25rem 0.6rem 1.25rem;
  background: #FFFFFF;
  -webkit-box-shadow: 0 -0.2rem 0.4rem 0 rgba(0, 0, 0, 0.08);
          box-shadow: 0 -0.2rem 0.4rem 0 rgba(0, 0, 0, 0.08);
  -webkit-transition: all 100ms ease;
  transition: all 100ms ease;
}
.x-snack-bar .left {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  font-size: var(--fdm-font-size);
  word-wrap: break-word;
}
.x-snack-bar .right {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.x-snack-bar.snack-bar-enter,
.x-snack-bar.snack-bar-appear {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  opacity: 0;
}
.x-snack-bar.snack-bar-enter-active,
.x-snack-bar.snack-bar-appear-active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}
.x-snack-bar.snack-bar-exit {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}
.x-snack-bar.snack-bar-exit-active {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  opacity: 0;
}
.x-list-item {
  padding-left: var(--fdm-padding-xl);
  background: #FFFFFF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-list-item:active {
  background: var(--fdm-color-bg-text-normal-active);
}
.x-list-item:last-child .list-item-main {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.x-list-item .list-item-selector {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -ms-flex-item-align: center;
      align-self: center;
}
.x-list-item .list-item-selector .x-radio,
.x-list-item .list-item-selector .x-check {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.x-list-item .list-item-selector.list-item-selector-front {
  margin-right: var(--fdm-gap-xl);
}
.x-list-item .list-item-selector.list-item-selector-back {
  margin-left: var(--fdm-gap-xl);
}
.x-list-item .list-item-prefix {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -ms-flex-item-align: start;
      align-self: flex-start;
  margin-right: var(--fdm-gap-xl);
  padding-top: 0.675rem;
}
.x-list-item .list-item-prefix > i {
  color: var(--fdm-color-icon);
  font-size: 1.2rem;
}
.x-list-item .list-item-main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.675rem var(--fdm-padding-xl) 0.675rem 0;
  overflow: hidden;
  -webkit-box-shadow: inset 0 -0.05rem 0 var(--fdm-color-split);
          box-shadow: inset 0 -0.05rem 0 var(--fdm-color-split);
}
.x-list-item .list-item-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  gap: var(--fdm-gap-sm);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  min-width: 0;
  overflow: hidden;
}
.x-list-item .list-item-inner-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-width: 0;
}
.x-list-item .list-item-inner-content.default {
  font-size: var(--fdm-font-size-lg);
}
.x-list-item .list-item-inner-content.default .list-item-title,
.x-list-item .list-item-inner-content.default .list-item-subtitle {
  line-height: var(--fdm-line-height-lg);
  word-wrap: break-word;
}
.x-list-item .list-item-inner-content.default .list-item-subtitle {
  color: var(--fdm-color-text-placeholder);
}
.x-list-item .list-item-inner-content.default .list-item-title-nowrap,
.x-list-item .list-item-inner-content.default .list-item-subtitle-nowrap {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-list-item .list-item-suffix {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-list-item .list-item-suffix > i {
  color: var(--fdm-color-icon-normal);
  font-size: 0.8rem;
}
.x-list-item.list-item-nowrap .list-item-inner-content.default .list-item-title,
.x-list-item.list-item-nowrap .list-item-inner-content.default .list-item-subtitle {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-tab-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--fdm-gap);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: var(--fdm-height-2xl);
  padding: 0 var(--fdm-padding-layout-sm);
  background: var(--fdm-color-bg-container);
  border-top: 0.05rem solid var(--fdm-color-border-secondary);
}
.x-tab-bar-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 0 0;
          flex: 1 0 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--fdm-gap-sm);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  color: var(--fdm-color-text);
  text-align: center;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.x-tab-bar-item .tab-bar-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  color: var(--fdm-color-icon-normal);
  font-size: var(--fdm-icon-size-xl);
  line-height: 1;
}
.x-tab-bar-item .tab-bar-icon > .x-svgicon {
  display: block;
  line-height: 1;
}
.x-tab-bar-item .tab-bar-text {
  width: 100%;
  color: inherit;
  font-weight: var(--fdm-font-weight);
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height-xs);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-tab-bar-item .tab-bar-icon:only-child {
  font-size: var(--fdm-icon-size-2xl);
}
.x-tab-bar-item .tab-bar-text:only-child {
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
}
.x-tab-bar-item.tab-bar-item-active {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-tab-bar-item.tab-bar-item-active .tab-bar-icon {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-tab-bar-item.tab-bar-item-active .tab-bar-text {
  font-weight: var(--fdm-font-weight-bold);
}
.x-nav-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: var(--fdm-height-xl);
  padding: 0 var(--fdm-padding);
}
.x-nav-bar .x-nav-bar-left,
.x-nav-bar .x-nav-bar-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
}
.x-nav-bar .x-nav-bar-left {
  gap: var(--fdm-gap);
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.x-nav-bar .x-nav-bar-right {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.x-nav-bar .x-nav-bar-title {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
  padding: 0 var(--fdm-padding-lg);
  color: var(--fdm-color-text);
  font-weight: var(--fdm-font-weight-bold);
  font-size: var(--fdm-icon-size-lg);
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-nav-bar .x-nav-bar-action {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
  color: var(--fdm-color-icon-normal);
  font-size: var(--fdm-icon-size-2xl);
  cursor: pointer;
}
.x-nav-bar .x-nav-bar-action.disabled {
  color: var(--fdm-color-text-disabled);
  cursor: not-allowed;
}
.x-tab .tab-header {
  position: relative;
  height: var(--fdm-height-2xl);
  border-bottom: 0.05rem solid var(--fdm-color-split);
}
.x-tab .tab-header .tab-header-wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
}
.x-tab .tab-header .tab-header-wrapper .tab-header-item {
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  width: 100%;
  overflow: hidden;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-tab .tab-header .tab-header-wrapper .tab-header-item.active {
  font-weight: var(--fdm-font-weight-bold);
}
.x-tab .tab-header .tab-header-wrapper .tab-header-item.disabled {
  cursor: not-allowed;
}
.x-tab .tab-header .tab-header-wrapper .tab-header-item .tab-header-content {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-tab .tab-header .tab-header-wrapper.has-animation {
  -webkit-transition: -webkit-transform 200ms ease;
  transition: -webkit-transform 200ms ease;
  transition: transform 200ms ease;
  transition: transform 200ms ease, -webkit-transform 200ms ease;
}
.x-tab .tab-header .tab-header-wrapper .tab-active-line {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0.15rem;
  background-color: #03ABA0;
  background-color: var(--fdm-color-primary, #03ABA0);
  -webkit-transition: width 300ms ease, -webkit-transform 300ms ease;
  transition: width 300ms ease, -webkit-transform 300ms ease;
  transition: transform 300ms ease, width 300ms ease;
  transition: transform 300ms ease, width 300ms ease, -webkit-transform 300ms ease;
  pointer-events: none;
}
.x-tab .tab-header.need-swipe {
  overflow: hidden;
}
.x-tab .tab-header.need-swipe .tab-header-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
}
.x-tab .tab-header.need-swipe .tab-header-wrapper .tab-header-item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: auto;
  height: 100%;
}
.x-tab .tab-header.need-swipe .tab-extra-content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-tab.theme-line > .tab-header .tab-header-wrapper .tab-header-item.active {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-tab.theme-line > .tab-header .tab-header-wrapper .tab-header-item.disabled {
  color: var(--fdm-color-text-disabled);
}
.x-tab.theme-line > .tab-header.need-swipe .tab-header-item {
  margin-right: var(--fdm-gap-3xl);
}
.x-tab.theme-line > .tab-header.need-swipe .tab-header-item:last-child {
  margin-right: 0;
}
.x-tab.theme-capsule > .tab-header {
  border-bottom: none;
}
.x-tab.theme-capsule > .tab-header .tab-header-wrapper {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-tab.theme-capsule > .tab-header .tab-header-wrapper .tab-header-item {
  height: var(--fdm-height-sm);
  margin-right: var(--fdm-gap-lg);
  padding: 0 var(--fdm-padding-xl);
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background-color: #E9F7F6;
  background-color: var(--fdm-color-primary-bg, #E9F7F6);
  border-radius: var(--fdm-border-radius-full);
}
.x-tab.theme-capsule > .tab-header .tab-header-wrapper .tab-header-item:last-child {
  margin-right: 0;
}
.x-tab.theme-capsule > .tab-header .tab-header-wrapper .tab-header-item.active {
  color: #FFFFFF;
  background-color: #03ABA0;
  background-color: var(--fdm-color-primary, #03ABA0);
}
.x-tab.theme-capsule > .tab-header .tab-header-wrapper .tab-header-item.active::before {
  display: none;
}
.x-tab.theme-capsule > .tab-header .tab-header-wrapper .tab-header-item.disabled {
  color: var(--fdm-color-text-disabled);
  background-color: var(--fdm-color-bg-container-disabled);
}
.x-tab.theme-classic > .tab-header {
  border-bottom: none;
}
.x-tab.theme-classic > .tab-header::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  height: 0.05rem;
  background-color: var(--fdm-color-border);
  content: '';
}
.x-tab.theme-classic > .tab-header .tab-header-wrapper {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.x-tab.theme-classic > .tab-header .tab-header-wrapper .tab-header-item {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: var(--fdm-height-xs);
  margin-right: var(--fdm-gap-lg);
  padding: var(--fdm-padding);
  color: var(--fdm-color-text);
  background-color: var(--fdm-color-bg-container-grey-secondary);
  border: 1px var(--fdm-color-border) solid;
  border-radius: var(--fdm-border-radius) var(--fdm-border-radius) 0 0;
}
.x-tab.theme-classic > .tab-header .tab-header-wrapper .tab-header-item:last-child {
  margin-right: 0;
}
.x-tab.theme-classic > .tab-header .tab-header-wrapper .tab-header-item.active {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background-color: #FFFFFF;
  border-bottom: 0.05rem #FFFFFF solid;
}
.x-tab.theme-classic > .tab-header .tab-header-wrapper .tab-header-item.active::before {
  display: none;
}
.x-tab.theme-classic > .tab-header .tab-header-wrapper .tab-header-item.disabled {
  color: var(--fdm-color-text-disabled);
  background-color: var(--fdm-color-bg-container-disabled);
}
.x-tab .tab-content {
  overflow: hidden;
}
.x-tab .tab-content .tab-content-wrapper {
  height: 100%;
  white-space: nowrap;
}
.x-tab-item {
  display: inline-block;
  width: 100%;
  padding: var(--fdm-gap-lg);
  white-space: normal;
  vertical-align: top;
}
.x-progress.type-line {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 0.15rem;
}
.x-progress.type-line .progress-wrapper {
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  height: 100%;
  overflow: hidden;
  border-radius: 0.1rem;
}
.x-progress.type-line .progress-wrapper .value-bar {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  -webkit-transition: width 200ms ease-out;
  transition: width 200ms ease-out;
}
.x-progress.type-line .value-info {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  margin-left: 0.45rem;
}
.x-progress.type-square {
  position: relative;
  display: inline-block;
  width: 4.1rem;
  height: 4.1rem;
  overflow: hidden;
  border-radius: 0.25rem;
}
.x-progress.type-square.has-children {
  width: auto;
  height: auto;
}
.x-progress.type-square.has-children img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}
.x-progress.type-square .bg-mask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  opacity: 0.1;
}
.x-progress.type-square .filled-mask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  bottom: auto;
  opacity: 0.3;
  -webkit-transition: height 200ms ease-out;
  transition: height 200ms ease-out;
}
.x-progress.type-square .value-info {
  position: absolute;
  top: 50%;
  width: 100%;
  color: rgba(255, 255, 255, 0.9);
  text-align: center;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.x-badge {
  position: relative;
  display: inline-block;
}
.x-badge .badge-count {
  position: absolute;
  height: 0.95rem;
  padding: 0 0.28rem;
  color: #FFFFFF;
  font-size: var(--fdm-font-size-xs);
  line-height: 0.95rem;
  background: #EF5655;
  border-radius: 0.48rem;
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}
.x-badge .badge-count.badge-dot {
  width: 0.4rem;
  height: 0.4rem;
  padding: 0;
  border-radius: 50%;
}
.x-badge .badge-count.badge-no-children {
  position: relative;
  -webkit-transform: none;
          transform: none;
}
.x-skeleton {
  position: relative;
  padding: 1rem;
}
.x-skeleton .skeleton-lines-wrapper .skeleton-line {
  background: #E6E8ED;
  border-radius: var(--fdm-border-radius-xs);
}
.x-skeleton .skeleton-lines-wrapper .skeleton-line.title-line {
  width: 45%;
}
.x-skeleton .skeleton-lines-wrapper .skeleton-line:last-child {
  margin-bottom: 0 !important;
}
.x-skeleton.has-avatar .skeleton-avatar {
  position: absolute;
  top: 0.6rem;
  left: 0.6rem;
  width: 1.5rem;
  height: 1.5rem;
  background: #E6E8ED;
  border-radius: 50%;
}
.x-skeleton.has-avatar .skeleton-lines-wrapper {
  padding-left: 1.7rem;
}
.x-skeleton.has-animation .skeleton-line,
.x-skeleton.has-animation .skeleton-avatar {
  background-image: -webkit-gradient(linear, left top, right top, color-stop(25%, #E6E8ED), color-stop(37%, #F0F2F5), color-stop(63%, #E6E8ED));
  background-image: linear-gradient(90deg, #E6E8ED 25%, #F0F2F5 37%, #E6E8ED 63%);
  background-size: 400% 100%;
  -webkit-animation: x-skeleton 1.4s ease infinite;
          animation: x-skeleton 1.4s ease infinite;
}
@-webkit-keyframes x-skeleton {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0 0;
  }
}
@keyframes x-skeleton {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0 0;
  }
}
.x-switch {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: var(--fdm-padding-xs);
  color: var(--fdm-color-icon-disabled);
  vertical-align: middle;
  background: var(--fdm-color-icon-disabled);
  border-radius: var(--fdm-border-radius-full);
  cursor: pointer;
  -webkit-transition: background-color 200ms ease, opacity 200ms ease;
  transition: background-color 200ms ease, opacity 200ms ease;
}
.x-switch .switch-inner-label {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 100%;
  margin: 0 var(--fdm-padding-xs) 0 calc(1.2rem + var(--fdm-padding-xs));
  color: #FFFFFF;
  font-size: var(--fdm-icon-size);
  line-height: 1;
  white-space: nowrap;
  -webkit-transition: margin 200ms ease;
  transition: margin 200ms ease;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.x-switch .switch-inner-label.is-text {
  font-size: var(--fdm-font-size-sm);
}
.x-switch .switch-handle {
  position: absolute;
  top: 50%;
  left: var(--fdm-padding-xs);
  z-index: 2;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 1.2rem;
  height: 1.2rem;
  background: var(--fdm-color-bg-container);
  border-radius: var(--fdm-border-radius-full);
  -webkit-box-shadow: var(--fdm-box-shadow-subtle);
          box-shadow: var(--fdm-box-shadow-subtle);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: left 200ms ease;
  transition: left 200ms ease;
}
.x-switch.state-open {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
}
.x-switch.state-open .switch-inner-label {
  margin: 0 calc(1.2rem + var(--fdm-padding-xs)) 0 var(--fdm-padding-xs);
}
.x-switch.state-open .switch-handle {
  left: calc(100% - 1.2rem - var(--fdm-padding-xs));
}
.x-switch.size-normal {
  width: 2.8rem;
  height: var(--fdm-height-sm);
}
.x-switch.size-large {
  width: 3.2rem;
  height: var(--fdm-height);
}
.x-switch.size-large .switch-handle {
  width: 1.4rem;
  height: 1.4rem;
}
.x-switch.size-large .switch-inner-label {
  margin: 0 var(--fdm-padding-sm) 0 calc(1.4rem + var(--fdm-padding-xs));
  font-size: var(--fdm-icon-size-lg);
}
.x-switch.size-large .switch-inner-label.is-text {
  font-size: var(--fdm-font-size-lg);
}
.x-switch.size-large.state-open .switch-inner-label {
  margin: 0 calc(1.4rem + var(--fdm-padding-xs)) 0 var(--fdm-padding-sm);
}
.x-switch.size-large.state-open .switch-handle {
  left: calc(100% - 1.4rem - var(--fdm-padding-xs));
}
.x-switch.disabled,
.x-switch.loading {
  cursor: default;
  opacity: 0.4;
}
.x-check {
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
}
.x-check .check-label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--fdm-gap-xs);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  cursor: pointer;
}
.x-check .check-label .check-icon {
  position: relative;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 0.8rem;
  height: 0.8rem;
  margin: 0.2rem 0;
  background: #FFFFFF;
  border: solid 1px var(--fdm-color-border-primary);
  border-radius: var(--fdm-border-radius-sm);
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
}
.x-check .check-label .check-icon .yes-icon {
  position: absolute;
  top: 0.5rem;
  left: 0.2rem;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  opacity: 0;
  -webkit-transition: top 200ms ease, left 200ms ease, opacity 200ms ease;
  transition: top 200ms ease, left 200ms ease, opacity 200ms ease;
}
.x-check .check-label .check-icon .yes-icon::before,
.x-check .check-label .check-icon .yes-icon::after {
  position: absolute;
  display: block;
  background: var(--fdm-color-white-fixation);
  -webkit-transition: top 200ms ease, left 200ms ease, width 200ms ease, height 200ms ease, background 200ms ease, border-radius 200ms ease;
  transition: top 200ms ease, left 200ms ease, width 200ms ease, height 200ms ease, background 200ms ease, border-radius 200ms ease;
  content: '';
}
.x-check .check-label .check-icon .yes-icon::before {
  bottom: -0.1rem;
  width: 0.1rem;
  height: 0;
  border-radius: 0.05rem 0.05rem 0 0.1rem;
}
.x-check .check-label .check-icon .yes-icon::after {
  width: 0;
  height: 0.1rem;
  border-radius: 0 0.05rem 0.05rem 0.1rem;
}
.x-check .check-label .check-icon .indeterminate-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.4rem;
  height: 0.4rem;
  background: var(--fdm-color-primary);
  border-radius: 0;
  translate: -50% -50%;
  opacity: 0;
  -webkit-transition: opacity 200ms ease;
  transition: opacity 200ms ease;
}
.x-check .check-label .check-origin {
  display: none;
}
.x-check .check-label .check-text {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  padding: 0 var(--fdm-padding-xs);
  word-wrap: break-word;
}
.x-check.check-text-left .check-label {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.x-check.check-text-left .check-label .check-text {
  text-align: left;
}
.x-check.check-checked .check-label .check-icon {
  background: var(--fdm-color-primary);
  border-color: var(--fdm-color-primary);
}
.x-check.check-checked .check-label .check-icon .yes-icon {
  opacity: 1;
}
.x-check.check-checked .check-label .check-icon .yes-icon::before {
  height: 0.3rem;
}
.x-check.check-checked .check-label .check-icon .yes-icon::after {
  width: 0.55rem;
}
.x-check.check-indeterminate .check-label .check-icon {
  background: var(--fdm-color-bg-container);
  border-color: var(--fdm-color-primary);
}
.x-check.check-indeterminate .check-label .check-icon .yes-icon {
  opacity: 0;
}
.x-check.check-indeterminate .check-label .check-icon .indeterminate-icon {
  opacity: 1;
}
.x-check:active .check-icon {
  border-color: var(--fdm-color-primary);
}
.x-check.check-disable .check-label .check-icon {
  background: var(--fdm-color-fill-tertiary);
  border-color: var(--fdm-color-border);
}
.x-check.check-disable.check-checked .check-label .check-icon .yes-icon::before,
.x-check.check-disable.check-checked .check-label .check-icon .yes-icon::after {
  background: var(--fdm-color-bg-container-grey-deep);
}
.x-check.check-disable.check-indeterminate .check-label .check-icon {
  background: var(--fdm-color-bg-container-grey-secondary);
  border-color: var(--fdm-color-border);
}
.x-check.check-disable.check-indeterminate .check-label .check-icon .indeterminate-icon {
  background: var(--fdm-color-bg-container-grey-deep);
}
.x-check-group {
  display: inline-block;
  max-width: 100%;
}
.x-check-group.check-group-horizontal .x-check {
  display: inline-block;
  margin-right: var(--fdm-gap-2xl);
}
.x-check-group.check-group-vertical .x-check {
  display: block;
  margin-bottom: var(--fdm-gap-lg);
}
.x-segment {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
  border-radius: var(--fdm-border-radius);
}
.x-segment-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: var(--fdm-height);
  padding: var(--fdm-padding-sm) var(--fdm-padding-lg);
  color: var(--fdm-color-primary);
  text-align: center;
  background: #FFFFFF;
  border: solid 1px var(--fdm-color-primary);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-segment-item:not(:first-child) {
  border-left: none;
}
.x-segment-item:first-child {
  border-top-left-radius: var(--fdm-border-radius);
  border-bottom-left-radius: var(--fdm-border-radius);
}
.x-segment-item:last-child {
  border-top-right-radius: var(--fdm-border-radius);
  border-bottom-right-radius: var(--fdm-border-radius);
}
.x-segment-item.item-selected {
  color: #FFFFFF;
  background: var(--fdm-color-primary);
}
.x-segment-item.item-disabled {
  color: var(--fdm-color-primary-disabled);
  border-color: var(--fdm-color-primary-disabled);
}
.x-segment-item.item-disabled.item-selected {
  color: #FFFFFF;
  background: var(--fdm-color-primary-disabled);
}
.x-segment-item .item-content {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-segment-item .item-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--fdm-icon-size);
  height: var(--fdm-icon-size);
  font-size: var(--fdm-icon-size);
}
.x-segment-item .item-icon.prefix {
  margin-right: var(--fdm-gap-sm);
}
.x-segment-item .item-icon.suffix {
  margin-left: var(--fdm-gap-sm);
}
.x-segment-item.is-only-icon {
  width: var(--fdm-height);
  margin: 0;
  padding: 0;
}
.x-segment-item.is-only-icon .item-icon {
  margin: 0;
}
.x-segment.block {
  width: 100%;
}
.x-segment.block .x-segment-item {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 0;
          flex: 1 0 0;
}
.x-segment.size-small {
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height-xs);
}
.x-segment.size-small .x-segment-item {
  height: var(--fdm-height-xs);
  padding: var(--fdm-padding-xs) var(--fdm-padding);
}
.x-segment.size-small .x-segment-item.is-only-icon {
  width: var(--fdm-height-xs);
}
.x-textarea {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
}
.x-textarea .inner-wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  overflow: hidden;
  background-color: var(--fdm-color-bg-container);
  border: 1px solid var(--fdm-color-border);
  border-radius: var(--fdm-border-radius);
  -webkit-transition: border-color 200ms;
  transition: border-color 200ms;
}
.x-textarea .textarea-inner {
  position: relative;
  z-index: 1;
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 4rem;
  max-height: 100%;
  margin: 0;
  padding: var(--fdm-padding-sm) var(--fdm-padding);
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size);
  font-family: inherit;
  line-height: var(--fdm-line-height);
  background: transparent;
  border: none;
  outline: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  resize: none;
}
.x-textarea .textarea-inner::-webkit-input-placeholder {
  color: var(--fdm-color-text-placeholder);
  font-family: inherit;
}
.x-textarea .textarea-inner::-moz-placeholder {
  color: var(--fdm-color-text-placeholder);
  font-family: inherit;
}
.x-textarea .textarea-inner:-ms-input-placeholder {
  color: var(--fdm-color-text-placeholder);
  font-family: inherit;
}
.x-textarea .textarea-inner::-ms-input-placeholder {
  color: var(--fdm-color-text-placeholder);
  font-family: inherit;
}
.x-textarea .textarea-inner::placeholder {
  color: var(--fdm-color-text-placeholder);
  font-family: inherit;
}
.x-textarea .textarea-inner:disabled {
  color: var(--fdm-color-text-disabled);
  cursor: not-allowed;
}
.x-textarea .textarea-inner.textarea-inner-hidden {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1000;
  height: auto;
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
}
.x-textarea.has-count .textarea-inner {
  padding-bottom: 0.1rem;
}
.x-textarea.allow-clear-visible .textarea-inner {
  padding-right: 1.5rem;
}
.x-textarea.textarea-rows .textarea-inner {
  min-height: auto;
}
.x-textarea .textarea-count {
  width: 100%;
  padding: 0.1rem var(--fdm-padding) var(--fdm-padding-xs);
  color: var(--fdm-color-text-description);
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height-xs);
  text-align: right;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
}
.x-textarea .textarea-error-tip {
  margin-top: var(--fdm-padding-xs);
  color: var(--fdm-color-error);
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height-xs);
}
.x-textarea .clear-icon {
  position: absolute;
  top: 50%;
  right: var(--fdm-padding);
  z-index: 3;
  color: var(--fdm-color-icon);
  font-size: 0.8rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
}
.x-textarea .clear-icon:hover {
  color: var(--fdm-color-icon-hover);
}
.x-textarea.textarea-disable .inner-wrapper,
.x-textarea.textarea-readonly .inner-wrapper {
  background: var(--fdm-color-bg-container-disabled);
  border-color: var(--fdm-color-border);
}
.x-textarea.textarea-disable .clear-icon,
.x-textarea.textarea-readonly .clear-icon {
  color: var(--fdm-color-icon-disabled);
  cursor: not-allowed;
}
.x-textarea.textarea-disable .textarea-inner {
  color: var(--fdm-color-text-disabled);
  cursor: not-allowed;
}
.x-textarea.textarea-disable .textarea-inner::-webkit-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-textarea.textarea-disable .textarea-inner::-moz-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-textarea.textarea-disable .textarea-inner:-ms-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-textarea.textarea-disable .textarea-inner::-ms-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-textarea.textarea-disable .textarea-inner::placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-textarea.textarea-readonly .textarea-inner {
  color: var(--fdm-color-text);
}
.x-textarea.textarea-focus .inner-wrapper {
  border-color: var(--fdm-color-primary);
}
.x-textarea.textarea-primary .inner-wrapper {
  border-color: var(--fdm-color-primary);
}
.x-textarea.textarea-error .inner-wrapper {
  border-color: var(--fdm-color-error);
}
.x-textarea.textarea-warning .inner-wrapper {
  border-color: var(--fdm-color-warning);
}
.x-input {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  height: auto;
}
.x-input.has-before-addon,
.x-input.has-after-addon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-input.has-before-addon .x-input-inner-wrapper,
.x-input.has-after-addon .x-input-inner-wrapper {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
}
.x-input.has-before-addon .x-input-inner-wrapper {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.x-input.has-after-addon .x-input-inner-wrapper {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.x-input .x-input-inner-wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: var(--fdm-height);
  overflow: hidden;
  background-color: var(--fdm-color-bg-container);
  border: 1px solid var(--fdm-color-border);
  border-radius: var(--fdm-border-radius);
  -webkit-transition: border-color 200ms;
  transition: border-color 200ms;
}
.x-input .x-input-inner-wrapper .x-input-prefix {
  position: absolute;
  top: 50%;
  left: 0.4rem;
  color: var(--fdm-color-icon-normal);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.x-input .x-input-inner-wrapper .x-input-suffix,
.x-input .x-input-inner-wrapper .clear-icon {
  position: absolute;
  top: 50%;
  right: 0.4rem;
  color: var(--fdm-color-icon);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.x-input .x-input-inner-wrapper .clear-icon {
  font-size: 0.8rem;
  cursor: pointer;
}
.x-input .x-input-inner-wrapper .input-password-icon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: var(--fdm-color-icon-normal);
  cursor: pointer;
}
.x-input .x-input-inner-wrapper .input-password-icon:hover {
  color: var(--fdm-color-icon-hover);
}
.x-input .x-input-inner-wrapper .input-inner {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 100%;
  height: auto;
  padding: 0 var(--fdm-padding);
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
  background: transparent;
  border: none;
  outline: none;
}
.x-input .x-input-inner-wrapper .input-inner::-webkit-input-placeholder {
  color: var(--fdm-color-text-placeholder);
}
.x-input .x-input-inner-wrapper .input-inner::-moz-placeholder {
  color: var(--fdm-color-text-placeholder);
}
.x-input .x-input-inner-wrapper .input-inner:-ms-input-placeholder {
  color: var(--fdm-color-text-placeholder);
}
.x-input .x-input-inner-wrapper .input-inner::-ms-input-placeholder {
  color: var(--fdm-color-text-placeholder);
}
.x-input .x-input-inner-wrapper .input-inner::placeholder {
  color: var(--fdm-color-text-placeholder);
}
.x-input .x-input-inner-wrapper .input-inner::-ms-reveal,
.x-input .x-input-inner-wrapper .input-inner::-ms-clear {
  display: none;
}
.x-input .x-input-inner-wrapper .input-inner::-webkit-credentials-auto-fill-button {
  visibility: hidden;
  pointer-events: none;
}
.x-input.has-prefix .input-inner {
  padding-left: 1.5rem;
}
.x-input.has-suffix .input-inner {
  padding-right: 1.5rem;
}
.x-input.allow-clear-visible .input-inner {
  padding-right: 1.5rem;
}
.x-input.allow-clear-visible.has-suffix .input-inner {
  padding-right: 2.6rem;
}
.x-input.allow-clear-visible.has-suffix .clear-icon {
  right: 1.6rem;
}
.x-input.is-focused .x-input-inner-wrapper {
  border-color: var(--fdm-color-primary);
}
.x-input.disabled .x-input-inner-wrapper,
.x-input.input-readonly .x-input-inner-wrapper {
  background: var(--fdm-color-bg-container-disabled);
  border-color: var(--fdm-color-border);
}
.x-input.disabled .x-input-prefix,
.x-input.input-readonly .x-input-prefix,
.x-input.disabled .x-input-suffix,
.x-input.input-readonly .x-input-suffix,
.x-input.disabled .input-password-icon,
.x-input.input-readonly .input-password-icon,
.x-input.disabled .clear-icon,
.x-input.input-readonly .clear-icon {
  color: var(--fdm-color-icon-disabled);
  cursor: not-allowed;
}
.x-input.disabled .input-inner {
  color: var(--fdm-color-text-disabled);
  cursor: not-allowed;
}
.x-input.disabled .input-inner::-webkit-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-input.disabled .input-inner::-moz-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-input.disabled .input-inner:-ms-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-input.disabled .input-inner::-ms-input-placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-input.disabled .input-inner::placeholder {
  color: var(--fdm-color-text-disabled);
}
.x-input.input-readonly .input-inner {
  color: var(--fdm-color-text);
}
.x-input.input-primary .x-input-inner-wrapper {
  border-color: var(--fdm-color-primary);
}
.x-input.input-error .x-input-inner-wrapper {
  border-color: var(--fdm-color-error);
}
.x-input.input-warning .x-input-inner-wrapper {
  border-color: var(--fdm-color-warning);
}
.x-input .x-input-error-tip {
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  width: 100%;
  margin-top: var(--fdm-padding-xs);
  color: var(--fdm-color-error);
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height-xs);
}
.x-dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 72%;
  background: #FFFFFF;
  border-radius: 0.63rem;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.x-dialog .dialog-body {
  padding: 1rem 0.8rem;
}
.x-dialog .dialog-body .dialog-title {
  margin-bottom: 0.2rem;
  font-weight: bold;
  font-size: var(--fdm-font-size-lg);
  line-height: 1.2rem;
  text-align: center;
}
.x-dialog .dialog-body .dialog-message {
  color: var(--fdm-color-text-description);
  font-size: 0.6rem;
  line-height: 0.9rem;
  text-align: center;
}
.x-dialog .dialog-body .dialog-message + .dialog-content {
  margin-top: 0.6rem;
}
.x-dialog .dialog-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 2.23rem;
  border-top: solid 0.05rem var(--fdm-color-border);
}
.x-dialog .dialog-footer .dialog-btn {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  font-size: var(--fdm-font-size-lg);
  text-align: center;
}
.x-dialog .dialog-footer .dialog-btn.cancel + .ok {
  border-left: solid 0.05rem var(--fdm-color-border);
}
.x-dialog .dialog-footer .dialog-btn.type-secondary {
  color: var(--fdm-color-text-secondary);
}
.x-dialog .dialog-footer .dialog-btn.type-secondary:active {
  color: var(--fdm-color-text-description);
}
.x-dialog .dialog-footer .dialog-btn.type-primary {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-dialog .dialog-footer .dialog-btn.type-primary:active {
  color: #05948A;
  color: var(--fdm-color-primary-active, #05948A);
}
.x-dialog .dialog-footer .dialog-btn.type-danger {
  color: #EF5655;
}
.x-dialog .dialog-footer .dialog-btn.type-danger:active {
  color: #C54746;
}
.x-popup {
  position: absolute;
  z-index: 1003;
  display: inline-block;
}
.x-tooltip-popup {
  display: inline-block;
  padding: 0.4rem;
  font-size: var(--fdm-font-size-xs);
  background: #FFFFFF;
  border-radius: var(--fdm-border-radius-xs);
  -webkit-box-shadow: 0 0.05rem 0.2rem 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 0.05rem 0.2rem 0 rgba(0, 0, 0, 0.2);
}
.x-tooltip-popup::before {
  position: absolute;
  width: 0.3rem;
  height: 0.3rem;
  background: #FFFFFF;
  -webkit-box-shadow: 0.05rem 0.05rem 0.05rem 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0.05rem 0.05rem 0.05rem 0 rgba(0, 0, 0, 0.1);
  content: '';
  pointer-events: none;
}
.x-tooltip-popup.top::before,
.x-tooltip-popup.top-left::before,
.x-tooltip-popup.top-right::before {
  top: 100%;
  margin-top: -0.15rem;
  margin-left: -0.15rem;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.x-tooltip-popup.bottom::before,
.x-tooltip-popup.bottom-left::before,
.x-tooltip-popup.bottom-right::before {
  bottom: 100%;
  margin-bottom: -0.15rem;
  margin-left: -0.15rem;
  -webkit-box-shadow: 0.05rem 0.05rem 0.05rem 0 rgba(0, 0, 0, 0.05);
          box-shadow: 0.05rem 0.05rem 0.05rem 0 rgba(0, 0, 0, 0.05);
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.x-tooltip-popup.top::before,
.x-tooltip-popup.bottom::before {
  left: 50%;
}
.x-tooltip-popup.top-left::before,
.x-tooltip-popup.bottom-left::before {
  left: 1rem;
  margin-left: 0;
}
.x-tooltip-popup.top-right::before,
.x-tooltip-popup.bottom-right::before {
  right: 1rem;
}
.x-tooltip-popup.left::before,
.x-tooltip-popup.left-top::before,
.x-tooltip-popup.left-bottom::before {
  left: 100%;
  margin-top: -0.15rem;
  margin-left: -0.15rem;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.x-tooltip-popup.right::before,
.x-tooltip-popup.right-top::before,
.x-tooltip-popup.right-bottom::before {
  right: 100%;
  margin-top: -0.15rem;
  margin-right: -0.15rem;
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
}
.x-tooltip-popup.left::before,
.x-tooltip-popup.right::before {
  top: 50%;
}
.x-tooltip-popup.left-top::before,
.x-tooltip-popup.right-top::before {
  top: 0.7rem;
  margin-top: 0;
}
.x-tooltip-popup.left-bottom::before,
.x-tooltip-popup.right-bottom::before {
  bottom: 0.7rem;
}
.x-tooltip-popup.dark {
  color: #FFFFFF;
  background: rgba(0, 0, 0, 0.85);
  -webkit-box-shadow: none;
          box-shadow: none;
}
.x-tooltip-popup.dark::before {
  width: 0;
  height: 0;
  background: none;
  border: solid transparent 0.2rem;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transform: none;
          transform: none;
}
.x-tooltip-popup.dark.top::before,
.x-tooltip-popup.dark.top-left::before,
.x-tooltip-popup.dark.top-right::before {
  margin-top: 0;
  border-top-color: rgba(0, 0, 0, 0.85);
}
.x-tooltip-popup.dark.bottom::before,
.x-tooltip-popup.dark.bottom-left::before,
.x-tooltip-popup.dark.bottom-right::before {
  margin-bottom: 0;
  border-bottom-color: rgba(0, 0, 0, 0.85);
}
.x-tooltip-popup.dark.left::before,
.x-tooltip-popup.dark.left-top::before,
.x-tooltip-popup.dark.left-bottom::before {
  margin-left: 0;
  border-left-color: rgba(0, 0, 0, 0.85);
}
.x-tooltip-popup.dark.right::before,
.x-tooltip-popup.dark.right-top::before,
.x-tooltip-popup.dark.right-bottom::before {
  margin-right: 0;
  border-right-color: rgba(0, 0, 0, 0.85);
}
.x-tooltip-popup.dark.top-left::before,
.x-tooltip-popup.dark.bottom-left::before {
  left: 0.8rem;
}
.x-tooltip-popup.dark.top-right::before,
.x-tooltip-popup.dark.bottom-right::before {
  right: 0.8rem;
}
.x-tooltip-popup.no-padding {
  padding: 0;
}
.x-tooltip-popup.no-triangle::before {
  display: none;
}
.x-tooltip-top-appear,
.x-tooltip-top-enter {
  -webkit-animation: x-move-bottom-small 200ms ease;
          animation: x-move-bottom-small 200ms ease;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-top-exit {
  animation: x-move-bottom-small 100ms ease-in reverse;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-right-appear,
.x-tooltip-right-enter {
  -webkit-animation: x-move-left-small 200ms ease;
          animation: x-move-left-small 200ms ease;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-right-exit {
  animation: x-move-left-small 100ms ease-in reverse;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-bottom-appear,
.x-tooltip-bottom-enter {
  -webkit-animation: x-move-top-small 200ms ease;
          animation: x-move-top-small 200ms ease;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-bottom-exit {
  animation: x-move-top-small 100ms ease-in reverse;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-left-appear,
.x-tooltip-left-enter {
  -webkit-animation: x-move-right-small 200ms ease;
          animation: x-move-right-small 200ms ease;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tooltip-left-exit {
  animation: x-move-right-small 100ms ease-in reverse;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.x-tree {
  display: inline-block;
  min-width: 100%;
  height: 100%;
  overflow: auto;
  vertical-align: middle;
}
.x-tree .tree-node {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: var(--fdm-height-2xl);
  margin-bottom: var(--fdm-gap-sm);
  padding: 0 0.8rem;
  line-height: var(--fdm-line-height-lg);
  cursor: pointer;
  -webkit-transition: background-color 0.1s ease-in-out;
  transition: background-color 0.1s ease-in-out;
}
.x-tree .tree-node .node-checkbox {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--fdm-font-size-4xl);
          flex: 0 0 var(--fdm-font-size-4xl);
  -webkit-box-ordinal-group: 101;
      -ms-flex-order: 100;
          order: 100;
  margin-left: auto;
}
.x-tree .tree-node .node-checkbox .circle-checkbox.x-check .check-label .check-icon {
  border-radius: 50%;
}
.x-tree .tree-node .node-checkbox .circle-checkbox.x-check .check-label .check-icon .indeterminate-icon {
  border-radius: 50%;
}
.x-tree .tree-node .node-content-wrapper {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  line-height: var(--fdm-line-height-lg);
}
.x-tree .tree-node .node-content-wrapper .node-content {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-tree .tree-node .node-content-wrapper .node-content .node-title {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size-lg);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-tree .tree-node .node-content-wrapper .node-content .node-icon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-right: var(--fdm-padding-lg);
  color: var(--fdm-color-icon);
  font-size: var(--fdm-font-size-4xl);
}
.x-tree .tree-node .node-content-wrapper .node-content .node-icon .node-icon-group {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-tree .tree-node .node-switcher {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--fdm-font-size-lg);
          flex: 0 0 var(--fdm-font-size-lg);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--fdm-font-size-lg);
  height: var(--fdm-font-size-lg);
  margin-right: var(--fdm-padding-lg);
  color: var(--fdm-color-icon);
  font-size: var(--fdm-font-size-lg);
  line-height: 1;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.x-tree .tree-node .node-switcher .x-svgicon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: inherit;
}
.x-tree .tree-node .node-indent {
  display: inline-block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 0;
      -ms-flex: 0 0 var(--tree-indent-width, 0px);
          flex: 0 0 0;
          flex: 0 0 var(--tree-indent-width, 0px);
  width: 0;
  width: var(--tree-indent-width, 0);
}
.x-tree .tree-node:active {
  background-color: var(--fdm-color-bg-text-normal-active);
}
.x-tree .tree-node.node-selected .node-content-wrapper .node-icon {
  color: var(--fdm-color-icon);
}
.x-tree .tree-node.node-selected .node-content-wrapper .node-icon .node-icon-group {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-tree .tree-node.disabled {
  background-color: transparent;
  cursor: not-allowed;
}
.x-tree .tree-node.disabled:active {
  background-color: transparent;
}
.x-tree .tree-node.disabled .node-content-wrapper .node-title,
.x-tree .tree-node.disabled .node-content-wrapper .node-icon {
  color: var(--fdm-color-text-disabled);
}
.x-tree .tree-node.disabled .node-content-wrapper .node-icon .node-icon-group {
  color: var(--fdm-color-text-disabled);
}
.x-tree .tree-node.disabled .node-switcher {
  color: var(--fdm-color-text-disabled);
}
.x-tree .tree-node.disabled .node-checkbox {
  color: var(--fdm-color-text-disabled);
}
.x-tree .tree-node.switcher-pos-right .node-switcher {
  -webkit-box-ordinal-group: 100;
      -ms-flex-order: 99;
          order: 99;
  margin-right: var(--fdm-padding-lg);
}
.x-tree .tree-node-motion-enter,
.x-tree .tree-node-motion-appear,
.x-tree .tree-node-motion-exit {
  overflow: hidden;
  -webkit-transition: opacity 0.1s ease-in-out, height 0.1s ease-in-out;
  transition: opacity 0.1s ease-in-out, height 0.1s ease-in-out;
}
.x-tree.x-tree-small .tree-node {
  height: var(--fdm-height-lg);
}
.x-tree.x-tree-small .tree-node .node-checkbox {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--fdm-font-size-2xl);
          flex: 0 0 var(--fdm-font-size-2xl);
}
.x-tree.x-tree-small .tree-node .node-content-wrapper .node-content .node-icon {
  margin-right: var(--fdm-padding);
  font-size: var(--fdm-font-size-2xl);
}
.x-tree.x-tree-small .tree-node .node-switcher {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--fdm-font-size-2xl);
          flex: 0 0 var(--fdm-font-size-2xl);
  width: var(--fdm-font-size-2xl);
  height: var(--fdm-font-size-2xl);
  margin-right: var(--fdm-padding);
  font-size: var(--fdm-font-size-2xl);
  line-height: var(--fdm-font-size-2xl);
}
.x-tree.x-tree-small .tree-node.switcher-pos-right .node-switcher {
  margin-right: 0;
  margin-left: var(--fdm-padding);
}
.x-affix.is-fixed {
  z-index: 1001;
}
.x-menu {
  font-size: var(--fdm-font-size-sm);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.x-menu .x-menu-item {
  position: relative;
  background: #FFFFFF;
}
.x-menu .x-menu-item .item-content-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 2.5rem;
  padding: 0 0.6rem;
}
.x-menu .x-menu-item .item-content-wrapper .item-icon {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  padding-right: 0.6rem;
  color: #2E3642;
  font-size: 1rem;
}
.x-menu .x-menu-item .item-content-wrapper .item-label {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  font-size: var(--fdm-font-size-lg);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-menu .x-menu-item .item-content-wrapper .item-check-icon {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  font-size: 1rem;
}
.x-menu .x-menu-item:not(.disabled):active .item-content-wrapper {
  background: var(--fdm-color-fill-tertiary);
}
.x-menu .x-menu-item:not(:last-child)::after {
  display: block;
  height: 0.05rem;
  margin-left: 0.6rem;
  background: var(--fdm-color-split);
  content: '';
}
.x-menu .x-menu-item.selected .item-icon,
.x-menu .x-menu-item.selected .item-label,
.x-menu .x-menu-item.selected .item-check-icon {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-menu .x-menu-item.disabled .item-icon,
.x-menu .x-menu-item.disabled .item-label,
.x-menu .x-menu-item.disabled .item-check-icon {
  color: var(--fdm-color-text-disabled);
}
.x-menu.size-small .x-menu-item .item-content-wrapper {
  height: 2.3rem;
}
.x-menu.size-small .x-menu-item .item-content-wrapper .item-icon {
  font-size: var(--fdm-font-size-lg);
}
.x-menu.size-small .x-menu-item .item-content-wrapper .item-label {
  font-size: var(--fdm-font-size-sm);
}
.x-menu.size-small .x-menu-item .item-content-wrapper .item-check-icon {
  font-size: 0.9rem;
}
.x-empty {
  text-align: center;
}
.x-empty .empty-img > img {
  height: 7.5rem;
  vertical-align: middle;
}
.x-empty .empty-title {
  max-width: 80%;
  margin: 0.5rem auto 0;
  color: var(--fdm-color-text);
  font-size: 0.9rem;
}
.x-empty .empty-description {
  max-width: 80%;
  margin: 0.25rem auto 0;
  color: var(--fdm-color-text-secondary);
  font-size: var(--fdm-font-size-sm);
}
.x-empty .empty-extra {
  margin-top: 1rem;
}
.x-avatar {
  display: inline-block;
  overflow: hidden;
  color: #FFFFFF;
  text-align: center;
  vertical-align: middle;
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
  border-radius: 50%;
}
.x-avatar > img {
  width: 100%;
  height: 100%;
}
.x-avatar.color-0 {
  background: #EDA426;
}
.x-avatar.color-1 {
  background: #2B73F0;
}
.x-avatar.color-2 {
  background: #0DADD9;
}
.x-avatar.color-3 {
  background: #3BAD4A;
}
.x-avatar.color-4 {
  background: #EF5655;
}
.x-avatar.color-5 {
  background: #7758E8;
}
.x-avatar.is-image-type {
  background: #FFFFFF;
}
.x-tag {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: var(--fdm-gap-sm);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  max-width: 100%;
  height: var(--fdm-height-xs);
  padding: 0 var(--fdm-padding-sm);
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size-xs);
  line-height: var(--fdm-line-height-xs);
  background: var(--fdm-color-fill-tertiary);
  border: 1px solid var(--fdm-color-zero);
  border-radius: var(--fdm-border-radius-sm);
  cursor: pointer;
}
.x-tag.single-line .tag-content {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-tag.multi-line {
  height: auto;
  min-height: var(--fdm-height-xs);
  padding-top: 0.05rem;
  padding-bottom: 0.05rem;
}
.x-tag.multi-line .tag-content {
  word-wrap: break-word;
}
.x-tag .tag-prefix-icon,
.x-tag .tag-close-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: currentColor;
  font-size: var(--fdm-icon-size-2sm);
}
.x-tag .tag-content {
  min-width: 0;
}
.x-tag.has-border {
  background: var(--fdm-color-fill-quaternary);
  border-color: var(--fdm-color-border);
}
.x-tag.type-primary {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
  background: #D8F2F0;
  background: var(--fdm-color-primary-bg-deep, #D8F2F0);
}
.x-tag.type-primary.has-border {
  background: #E9F7F6;
  background: var(--fdm-color-primary-bg, #E9F7F6);
  border-color: #03ABA0;
  border-color: var(--fdm-color-primary, #03ABA0);
}
.x-tag.type-info {
  color: var(--fdm-color-info);
  background: var(--fdm-color-info-bg-deep);
}
.x-tag.type-info.has-border {
  background: var(--fdm-color-info-bg);
  border-color: var(--fdm-color-info-border);
}
.x-tag.type-warning {
  color: var(--fdm-color-warning);
  background: var(--fdm-color-warning-bg-deep);
}
.x-tag.type-warning.has-border {
  background: var(--fdm-color-warning-bg);
  border-color: var(--fdm-color-warning-border);
}
.x-tag.type-success {
  color: var(--fdm-color-success);
  background: var(--fdm-color-success-bg-deep);
}
.x-tag.type-success.has-border {
  background: var(--fdm-color-success-bg);
  border-color: var(--fdm-color-success-border);
}
.x-tag.type-error {
  color: var(--fdm-color-error);
  background: var(--fdm-color-error-bg-deep);
}
.x-tag.type-error.has-border {
  background: var(--fdm-color-error-bg);
  border-color: var(--fdm-color-error-border);
}
.x-tag.selected {
  color: var(--fdm-color-white-fixation);
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
  border-color: var(--fdm-color-zero);
}
.x-tag.selected.type-primary {
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
}
.x-tag.selected.type-info {
  background: var(--fdm-color-info);
}
.x-tag.selected.type-warning {
  background: var(--fdm-color-warning);
}
.x-tag.selected.type-success {
  background: var(--fdm-color-success);
}
.x-tag.selected.type-error {
  background: var(--fdm-color-error);
}
.x-tag.shape-round {
  border-radius: var(--fdm-border-radius-full);
}
.x-tag.shape-rect {
  border-radius: var(--fdm-border-radius-sm);
}
.x-tag.size-small {
  gap: var(--fdm-gap-xs);
  height: var(--fdm-height-2xs);
  min-height: var(--fdm-height-2xs);
  padding: 0 var(--fdm-padding-xs);
  font-size: var(--fdm-font-size-2xs);
  line-height: var(--fdm-line-height-2xs);
}
.x-radio {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  color: var(--fdm-color-text);
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
}
.x-radio .x-radio-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--fdm-gap-sm);
}
.x-radio.radio-text-left .x-radio-wrapper {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.x-radio .radio-check-icon {
  position: relative;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 0.8rem;
  height: 0.8rem;
  margin: 0.2rem 0;
  background: var(--fdm-color-bg-container);
  border: solid 1px var(--fdm-color-border-primary);
  border-radius: 50%;
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
}
.x-radio .radio-check-icon::before {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 0;
  height: 0;
  background: var(--fdm-color-white-fixation);
  border-radius: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-transition: all 100ms ease;
  transition: all 100ms ease;
  content: '';
}
.x-radio.is-check-icon .radio-check-icon::before {
  display: none;
}
.x-radio.is-check-icon .radio-check-icon .yes-icon {
  position: absolute;
  top: 0.5rem;
  left: 0.2rem;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.x-radio.is-check-icon .radio-check-icon .yes-icon::before,
.x-radio.is-check-icon .radio-check-icon .yes-icon::after {
  position: absolute;
  display: block;
  background: var(--fdm-color-white-fixation);
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
  content: '';
}
.x-radio.is-check-icon .radio-check-icon .yes-icon::before {
  bottom: -0.1rem;
  width: 0.1rem;
  height: 0;
  border-radius: 0.05rem 0.05rem 0 0.1rem;
}
.x-radio.is-check-icon .radio-check-icon .yes-icon::after {
  width: 0;
  height: 0.1rem;
  border-radius: 0 0.05rem 0.05rem 0.1rem;
}
.x-radio .radio-text {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  padding: 0 var(--fdm-padding-xs);
  word-wrap: break-word;
}
.x-radio.radio-checked .radio-check-icon {
  background: var(--fdm-color-primary);
  border-color: var(--fdm-color-primary);
}
.x-radio.radio-checked .radio-check-icon::before {
  width: 0.4rem;
  height: 0.4rem;
}
.x-radio.radio-checked .radio-check-icon .yes-icon::before {
  height: 0.25rem;
}
.x-radio.radio-checked .radio-check-icon .yes-icon::after {
  width: 0.45rem;
}
.x-radio.radio-disable .radio-check-icon {
  background: var(--fdm-color-bg-container-grey-secondary);
  border-color: var(--fdm-color-border);
}
.x-radio.radio-disable .radio-check-icon::before {
  background: transparent;
}
.x-radio.radio-disable.radio-checked .radio-check-icon {
  background: var(--fdm-color-icon-disabled);
  border-color: transparent;
}
.x-radio.radio-disable.radio-checked .radio-check-icon::before {
  background: var(--fdm-color-bg-container-grey);
}
.x-radio.radio-disable.is-check-icon .radio-check-icon {
  background: var(--fdm-color-bg-container-grey-secondary);
  border-color: var(--fdm-color-border);
}
.x-radio.radio-disable.is-check-icon .radio-check-icon .yes-icon::before,
.x-radio.radio-disable.is-check-icon .radio-check-icon .yes-icon::after {
  background: var(--fdm-color-bg-container-grey-deep);
}
.x-radio-group {
  display: inline-block;
}
.x-radio-group.radio-group-horizontal .x-radio {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-right: var(--fdm-gap-5xl);
}
.x-radio-group.radio-group-vertical .x-radio:not(:last-child) {
  margin-bottom: var(--fdm-gap-lg);
}
.x-radio-field {
  width: 100%;
}
.x-radio-field .radio-text {
  padding: 0;
}
.x-radio-field.x-radio-field-horizontal-with-input {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-radio-field.x-radio-field-horizontal-with-input .x-radio-wrapper {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-radio-field.x-radio-field-horizontal-with-input .radio-check-icon {
  margin: 0;
}
.x-radio-field-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--fdm-gap);
  width: 100%;
  font-size: var(--fdm-font-size);
  line-height: var(--fdm-line-height);
}
.x-radio-field-content.x-radio-field-content-input-vertical .x-radio-field-header {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.x-radio-field-content.x-radio-field-content-input-vertical .x-radio-field-input-wrap {
  width: 100%;
}
.x-radio-field-content.x-radio-field-content-input-vertical .x-radio-field-input-wrap .x-input {
  width: 100%;
  min-width: 0;
}
.x-radio-field-content.x-radio-field-content-input-horizontal .x-radio-field-header {
  gap: var(--fdm-gap-lg);
}
.x-radio-field-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--fdm-gap-sm);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
}
.x-radio-field-title {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  padding: 0 var(--fdm-padding-xs);
}
.x-radio-field-subtitle {
  padding: 0 var(--fdm-padding-xs);
  color: var(--fdm-color-text-placeholder);
}
.x-radio-field-input-wrap {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.x-radio-field-input-wrap .x-input {
  min-width: 12rem;
}
.x-instruction {
  position: relative;
  padding: 0.4rem 0.6rem;
  line-height: normal;
}
.x-instruction.has-close {
  padding-right: 2rem;
}
.x-instruction.has-close .btn-close {
  position: absolute;
  top: 0.5rem;
  right: 0.6rem;
}
.x-instruction.type-info {
  color: var(--fdm-color-success);
  background: var(--fdm-color-success-bg);
}
.x-instruction.type-warning {
  color: var(--fdm-color-warning);
  background: var(--fdm-color-warning-bg);
}
.x-instruction.type-error {
  color: var(--fdm-color-error);
  background: var(--fdm-color-error-bg);
}
.x-indicator {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1004;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-indicator .item-icon {
  font-size: 3rem;
}
.x-indicator .indicator-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-width: 6.5rem;
  max-width: 10rem;
  min-height: 6.5rem;
  padding: 0.5rem;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 0.6rem;
}
.x-indicator .indicator-content > i {
  margin: 0.3rem;
  color: #FFFFFF;
}
.x-indicator .indicator-content .msg {
  min-width: 3.5rem;
  margin: 0.3rem;
  color: #FFFFFF;
  text-align: center;
}
.x-indicator.show {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.x-picker {
  position: relative;
  background: #FFFFFF;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.x-picker .picker-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 2.25rem;
  border-bottom: solid 0.05rem var(--fdm-color-split);
}
.x-picker .picker-body {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
}
.x-picker .picker-body .picker-col {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: auto;
  height: 100%;
  overflow: hidden;
}
.x-picker .picker-body .picker-col .picker-col-items.has-animation {
  -webkit-transition: -webkit-transform 300ms ease-out;
  transition: -webkit-transform 300ms ease-out;
  transition: transform 300ms ease-out;
  transition: transform 300ms ease-out, -webkit-transform 300ms ease-out;
}
.x-picker .picker-body .picker-col .picker-col-items .picker-col-item {
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-picker .picker-body .picker-col.is-divider {
  pointer-events: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-picker .picker-body::before,
.x-picker .picker-body::after {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 2;
  display: block;
  height: calc(50% - 2.25rem / 2);
  content: '';
  pointer-events: none;
}
.x-picker .picker-body::before {
  top: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to bottom, #FFFFFF 0%, rgba(255, 255, 255, 0.3) 100%);
  border-bottom: solid 0.05rem var(--fdm-color-split);
}
.x-picker .picker-body::after {
  bottom: 0;
  background: -webkit-gradient(linear, left bottom, left top, from(#FFFFFF), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to top, #FFFFFF 0%, rgba(255, 255, 255, 0.3) 100%);
  border-top: solid 0.05rem var(--fdm-color-split);
}
.x-datetime-picker {
  min-height: 18.3rem;
  color: var(--fdm-color-text);
}
.x-datetime-picker.mode-date.has-day {
  min-height: 20.5rem;
}
.x-datetime-picker .calender-box {
  overflow: hidden;
}
.x-datetime-picker.mode-datetime {
  min-height: 23rem;
}
.x-datetime-picker.mode-datetime .picker-time.x-picker {
  top: 1.2rem;
}
.x-datetime-picker .show-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 2.25rem;
}
.x-datetime-picker .show-box.active .show-text {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-datetime-picker .show-box.active .show-text .x-svgicon {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-datetime-picker .show-box .show-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.25rem 0.8rem;
  color: var(--fdm-color-text);
  font-weight: 500;
}
.x-datetime-picker .show-box .show-text .x-svgicon {
  margin-left: 0.2rem;
  color: var(--fdm-color-text-description);
  font-size: 0.8rem;
  vertical-align: middle;
}
.x-datetime-picker .show-box .show-text .month-text {
  margin-left: 0.4rem;
}
.x-datetime-picker .show-box .icon-box {
  margin-right: 0.2rem;
  padding: 0.2rem;
  color: var(--fdm-color-text-description);
}
.x-datetime-picker .show-box .icon-box i {
  margin-left: 0.6rem;
  font-size: 1rem;
  background: #FFFFFF;
}
.x-datetime-picker .show-box .icon-box .disable-click {
  color: #878D99;
  pointer-events: none;
}
.x-datetime-picker .x-datetime-top-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 2.25rem;
  border-bottom: solid 0.05rem var(--fdm-color-split);
}
.x-datetime-picker .x-datetime-top-head .left-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.x-datetime-picker .x-datetime-top-head .left-box .x-button {
  margin-right: 0.6rem;
  padding: 0;
}
.x-datetime-picker .x-datetime-top-head .left-box .x-button:first-child {
  margin-left: 0.8rem;
}
.x-datetime-picker .x-datetime-top-head .right-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.x-datetime-picker .tag-show-box {
  margin: 0.5rem 0;
}
.x-datetime-picker .tag-show-box .tag-show-text {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  margin-left: 0.5rem;
  padding: 0.23rem 0.75rem;
  color: #2B73F0;
  font-size: 0.65rem;
  background: #EBF3FF;
  border-radius: 2.5rem;
}
.x-datetime-picker .tag-show-box .tag-show-text.active {
  color: #FFFFFF;
  background: #2B73F0;
}
.x-datetime-picker .tag-show-box .month-text {
  margin: 0 0.2rem;
}
.x-datetime-picker .x-datetime-calender .week-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 0.4rem;
}
.x-datetime-picker .x-datetime-calender .week-box.week-title {
  color: #49515E;
}
.x-datetime-picker .x-datetime-calender .week-box .cell-text {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  height: 1.8rem;
  margin: 0.2rem;
  border: 1px solid #FFFFFF;
  border-radius: 0.2rem;
}
.x-datetime-picker .x-datetime-calender .week-box .cell-text.select {
  color: #FFFFFF;
  text-align: center;
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
}
.x-datetime-picker .x-datetime-calender .week-box .cell-text.disabled {
  color: var(--fdm-color-text);
  background: var(--fdm-color-bg-container-grey-tertiary);
}
.x-datetime-picker .x-datetime-calender .week-box .cell-text.disabled.select {
  background: #878D99;
}
.x-datetime-picker .x-datetime-calender .week-box .grey-text {
  color: #49515E;
}
.x-datetime-picker .picker-body .picker-col {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  padding: 0 0.5rem;
}
.x-datetime-picker .picker-body .picker-col.datetime-divider-col {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 0.15rem;
  padding: 0;
}
.x-upload .upload-form {
  display: none;
}
.x-table {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 100%;
  overflow: auto;
}
.x-table-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.x-table table {
  width: 100%;
  table-layout: fixed;
  border-top: 0.05rem solid var(--fdm-color-border-secondary);
  border-collapse: separate;
  border-spacing: 0;
}
.x-table th,
.x-table td {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-width: 2.5rem;
  height: 2.2rem;
  padding: 0 0.4rem;
  font-size: 0.65rem;
  border: 1px solid var(--fdm-color-border-secondary);
  border-top: 0;
  border-left: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-table .measure-cell {
  padding: 0 0.5rem;
  font-weight: normal;
  font-size: 0.7rem;
}
.x-table thead th {
  color: var(--fdm-color-text-description);
  font-weight: normal;
  font-size: 0.7rem;
  text-align: left;
  background: #E6E8ED;
  border-color: var(--fdm-color-border-secondary);
}
.x-table-header {
  overflow: hidden;
  border-left: 0.05rem solid var(--fdm-color-border-secondary);
}
.x-table tbody > tr > td {
  color: var(--fdm-color-text);
  background: #FFFFFF;
}
.x-table tbody.striped .table-row.odd {
  background: var(--fdm-color-bg-container-grey-secondary);
}
.x-table tbody.striped .table-row.odd > td {
  background: var(--fdm-color-bg-container-grey-secondary);
}
.x-table-content {
  overflow: auto;
  border-left: 0.05rem solid var(--fdm-color-border-secondary);
}
.x-table-body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  overflow: scroll;
  border-left: 0.05rem solid var(--fdm-color-border-secondary);
  -webkit-overflow-scrolling: touch;
}
.x-table-body table {
  border-top: 0;
}
.x-table .turn-180 {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.x-table .sort-icon {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-weight: normal;
  font-size: 0.65rem;
  line-height: 0.6;
}
.x-table.ping-left .fix-left.last-fix-left::after {
  background: #D7DBE0;
}
.x-table.ping-right .fix-right.first-fix-right::after {
  background: #D7DBE0;
}
.x-table .x-table-cell.fix-left,
.x-table .x-table-cell.fix-right {
  z-index: 1;
}
.x-table .x-table-cell.fix-right:last-child {
  border-right-color: transparent;
}
.x-table .x-table-cell.fix-left {
  overflow: visible;
}
.x-table .x-table-cell.fix-left.last-fix-left::after {
  position: absolute;
  top: 0;
  right: -0.05rem;
  bottom: -0.05rem;
  width: 0.1rem;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  content: '';
}
.x-table .x-table-cell.fix-right {
  overflow: visible;
}
.x-table .x-table-cell.fix-right.first-fix-right::after {
  position: absolute;
  top: 0;
  bottom: -0.05rem;
  left: -0.05rem;
  width: 0.1rem;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  content: '';
  pointer-events: none;
}
.x-table .x-table-cell .cell-content {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-space {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.x-space.vertical {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.x-space.align-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-space.align-start {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.x-space.align-end {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.x-space.align-baseline {
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.x-space .x-space-item:empty {
  display: none;
}
.x-grid-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
}
.x-grid-row::before,
.x-grid-row::after {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.x-grid-row.no-wrap {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.x-grid-row.row-start {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.x-grid-row.row-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.x-grid-row.row-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.x-grid-row.row-space-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.x-grid-row.row-space-around {
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.x-grid-row.row-space-evenly {
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}
.x-grid-row.row-top {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.x-grid-row.row-middle {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.x-grid-row.row-bottom {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.x-grid-row .x-grid-col {
  position: relative;
  max-width: 100%;
  min-height: 0.05rem;
}
.x-grid-row .col-24 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%;
}
.x-grid-row .col-push-24 {
  left: 100%;
}
.x-grid-row .col-pull-24 {
  right: 100%;
}
.x-grid-row .col-offset-24 {
  margin-left: 100%;
}
.x-grid-row .col-order-24 {
  -webkit-box-ordinal-group: 25;
      -ms-flex-order: 24;
          order: 24;
}
.x-grid-row .col-23 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 95.83333333%;
          flex: 0 0 95.83333333%;
  max-width: 95.83333333%;
}
.x-grid-row .col-push-23 {
  left: 95.83333333%;
}
.x-grid-row .col-pull-23 {
  right: 95.83333333%;
}
.x-grid-row .col-offset-23 {
  margin-left: 95.83333333%;
}
.x-grid-row .col-order-23 {
  -webkit-box-ordinal-group: 24;
      -ms-flex-order: 23;
          order: 23;
}
.x-grid-row .col-22 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 91.66666667%;
          flex: 0 0 91.66666667%;
  max-width: 91.66666667%;
}
.x-grid-row .col-push-22 {
  left: 91.66666667%;
}
.x-grid-row .col-pull-22 {
  right: 91.66666667%;
}
.x-grid-row .col-offset-22 {
  margin-left: 91.66666667%;
}
.x-grid-row .col-order-22 {
  -webkit-box-ordinal-group: 23;
      -ms-flex-order: 22;
          order: 22;
}
.x-grid-row .col-21 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 87.5%;
          flex: 0 0 87.5%;
  max-width: 87.5%;
}
.x-grid-row .col-push-21 {
  left: 87.5%;
}
.x-grid-row .col-pull-21 {
  right: 87.5%;
}
.x-grid-row .col-offset-21 {
  margin-left: 87.5%;
}
.x-grid-row .col-order-21 {
  -webkit-box-ordinal-group: 22;
      -ms-flex-order: 21;
          order: 21;
}
.x-grid-row .col-20 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 83.33333333%;
          flex: 0 0 83.33333333%;
  max-width: 83.33333333%;
}
.x-grid-row .col-push-20 {
  left: 83.33333333%;
}
.x-grid-row .col-pull-20 {
  right: 83.33333333%;
}
.x-grid-row .col-offset-20 {
  margin-left: 83.33333333%;
}
.x-grid-row .col-order-20 {
  -webkit-box-ordinal-group: 21;
      -ms-flex-order: 20;
          order: 20;
}
.x-grid-row .col-19 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 79.16666667%;
          flex: 0 0 79.16666667%;
  max-width: 79.16666667%;
}
.x-grid-row .col-push-19 {
  left: 79.16666667%;
}
.x-grid-row .col-pull-19 {
  right: 79.16666667%;
}
.x-grid-row .col-offset-19 {
  margin-left: 79.16666667%;
}
.x-grid-row .col-order-19 {
  -webkit-box-ordinal-group: 20;
      -ms-flex-order: 19;
          order: 19;
}
.x-grid-row .col-18 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 75%;
          flex: 0 0 75%;
  max-width: 75%;
}
.x-grid-row .col-push-18 {
  left: 75%;
}
.x-grid-row .col-pull-18 {
  right: 75%;
}
.x-grid-row .col-offset-18 {
  margin-left: 75%;
}
.x-grid-row .col-order-18 {
  -webkit-box-ordinal-group: 19;
      -ms-flex-order: 18;
          order: 18;
}
.x-grid-row .col-17 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 70.83333333%;
          flex: 0 0 70.83333333%;
  max-width: 70.83333333%;
}
.x-grid-row .col-push-17 {
  left: 70.83333333%;
}
.x-grid-row .col-pull-17 {
  right: 70.83333333%;
}
.x-grid-row .col-offset-17 {
  margin-left: 70.83333333%;
}
.x-grid-row .col-order-17 {
  -webkit-box-ordinal-group: 18;
      -ms-flex-order: 17;
          order: 17;
}
.x-grid-row .col-16 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 66.66666667%;
          flex: 0 0 66.66666667%;
  max-width: 66.66666667%;
}
.x-grid-row .col-push-16 {
  left: 66.66666667%;
}
.x-grid-row .col-pull-16 {
  right: 66.66666667%;
}
.x-grid-row .col-offset-16 {
  margin-left: 66.66666667%;
}
.x-grid-row .col-order-16 {
  -webkit-box-ordinal-group: 17;
      -ms-flex-order: 16;
          order: 16;
}
.x-grid-row .col-15 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 62.5%;
          flex: 0 0 62.5%;
  max-width: 62.5%;
}
.x-grid-row .col-push-15 {
  left: 62.5%;
}
.x-grid-row .col-pull-15 {
  right: 62.5%;
}
.x-grid-row .col-offset-15 {
  margin-left: 62.5%;
}
.x-grid-row .col-order-15 {
  -webkit-box-ordinal-group: 16;
      -ms-flex-order: 15;
          order: 15;
}
.x-grid-row .col-14 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 58.33333333%;
          flex: 0 0 58.33333333%;
  max-width: 58.33333333%;
}
.x-grid-row .col-push-14 {
  left: 58.33333333%;
}
.x-grid-row .col-pull-14 {
  right: 58.33333333%;
}
.x-grid-row .col-offset-14 {
  margin-left: 58.33333333%;
}
.x-grid-row .col-order-14 {
  -webkit-box-ordinal-group: 15;
      -ms-flex-order: 14;
          order: 14;
}
.x-grid-row .col-13 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 54.16666667%;
          flex: 0 0 54.16666667%;
  max-width: 54.16666667%;
}
.x-grid-row .col-push-13 {
  left: 54.16666667%;
}
.x-grid-row .col-pull-13 {
  right: 54.16666667%;
}
.x-grid-row .col-offset-13 {
  margin-left: 54.16666667%;
}
.x-grid-row .col-order-13 {
  -webkit-box-ordinal-group: 14;
      -ms-flex-order: 13;
          order: 13;
}
.x-grid-row .col-12 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  max-width: 50%;
}
.x-grid-row .col-push-12 {
  left: 50%;
}
.x-grid-row .col-pull-12 {
  right: 50%;
}
.x-grid-row .col-offset-12 {
  margin-left: 50%;
}
.x-grid-row .col-order-12 {
  -webkit-box-ordinal-group: 13;
      -ms-flex-order: 12;
          order: 12;
}
.x-grid-row .col-11 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 45.83333333%;
          flex: 0 0 45.83333333%;
  max-width: 45.83333333%;
}
.x-grid-row .col-push-11 {
  left: 45.83333333%;
}
.x-grid-row .col-pull-11 {
  right: 45.83333333%;
}
.x-grid-row .col-offset-11 {
  margin-left: 45.83333333%;
}
.x-grid-row .col-order-11 {
  -webkit-box-ordinal-group: 12;
      -ms-flex-order: 11;
          order: 11;
}
.x-grid-row .col-10 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 41.66666667%;
          flex: 0 0 41.66666667%;
  max-width: 41.66666667%;
}
.x-grid-row .col-push-10 {
  left: 41.66666667%;
}
.x-grid-row .col-pull-10 {
  right: 41.66666667%;
}
.x-grid-row .col-offset-10 {
  margin-left: 41.66666667%;
}
.x-grid-row .col-order-10 {
  -webkit-box-ordinal-group: 11;
      -ms-flex-order: 10;
          order: 10;
}
.x-grid-row .col-9 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 37.5%;
          flex: 0 0 37.5%;
  max-width: 37.5%;
}
.x-grid-row .col-push-9 {
  left: 37.5%;
}
.x-grid-row .col-pull-9 {
  right: 37.5%;
}
.x-grid-row .col-offset-9 {
  margin-left: 37.5%;
}
.x-grid-row .col-order-9 {
  -webkit-box-ordinal-group: 10;
      -ms-flex-order: 9;
          order: 9;
}
.x-grid-row .col-8 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.33333333%;
          flex: 0 0 33.33333333%;
  max-width: 33.33333333%;
}
.x-grid-row .col-push-8 {
  left: 33.33333333%;
}
.x-grid-row .col-pull-8 {
  right: 33.33333333%;
}
.x-grid-row .col-offset-8 {
  margin-left: 33.33333333%;
}
.x-grid-row .col-order-8 {
  -webkit-box-ordinal-group: 9;
      -ms-flex-order: 8;
          order: 8;
}
.x-grid-row .col-7 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 29.16666667%;
          flex: 0 0 29.16666667%;
  max-width: 29.16666667%;
}
.x-grid-row .col-push-7 {
  left: 29.16666667%;
}
.x-grid-row .col-pull-7 {
  right: 29.16666667%;
}
.x-grid-row .col-offset-7 {
  margin-left: 29.16666667%;
}
.x-grid-row .col-order-7 {
  -webkit-box-ordinal-group: 8;
      -ms-flex-order: 7;
          order: 7;
}
.x-grid-row .col-6 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 25%;
          flex: 0 0 25%;
  max-width: 25%;
}
.x-grid-row .col-push-6 {
  left: 25%;
}
.x-grid-row .col-pull-6 {
  right: 25%;
}
.x-grid-row .col-offset-6 {
  margin-left: 25%;
}
.x-grid-row .col-order-6 {
  -webkit-box-ordinal-group: 7;
      -ms-flex-order: 6;
          order: 6;
}
.x-grid-row .col-5 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 20.83333333%;
          flex: 0 0 20.83333333%;
  max-width: 20.83333333%;
}
.x-grid-row .col-push-5 {
  left: 20.83333333%;
}
.x-grid-row .col-pull-5 {
  right: 20.83333333%;
}
.x-grid-row .col-offset-5 {
  margin-left: 20.83333333%;
}
.x-grid-row .col-order-5 {
  -webkit-box-ordinal-group: 6;
      -ms-flex-order: 5;
          order: 5;
}
.x-grid-row .col-4 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 16.66666667%;
          flex: 0 0 16.66666667%;
  max-width: 16.66666667%;
}
.x-grid-row .col-push-4 {
  left: 16.66666667%;
}
.x-grid-row .col-pull-4 {
  right: 16.66666667%;
}
.x-grid-row .col-offset-4 {
  margin-left: 16.66666667%;
}
.x-grid-row .col-order-4 {
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4;
}
.x-grid-row .col-3 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 12.5%;
          flex: 0 0 12.5%;
  max-width: 12.5%;
}
.x-grid-row .col-push-3 {
  left: 12.5%;
}
.x-grid-row .col-pull-3 {
  right: 12.5%;
}
.x-grid-row .col-offset-3 {
  margin-left: 12.5%;
}
.x-grid-row .col-order-3 {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
.x-grid-row .col-2 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 8.33333333%;
          flex: 0 0 8.33333333%;
  max-width: 8.33333333%;
}
.x-grid-row .col-push-2 {
  left: 8.33333333%;
}
.x-grid-row .col-pull-2 {
  right: 8.33333333%;
}
.x-grid-row .col-offset-2 {
  margin-left: 8.33333333%;
}
.x-grid-row .col-order-2 {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.x-grid-row .col-1 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 4.16666667%;
          flex: 0 0 4.16666667%;
  max-width: 4.16666667%;
}
.x-grid-row .col-push-1 {
  left: 4.16666667%;
}
.x-grid-row .col-pull-1 {
  right: 4.16666667%;
}
.x-grid-row .col-offset-1 {
  margin-left: 4.16666667%;
}
.x-grid-row .col-order-1 {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.x-grid-row .col-0 {
  display: none;
}
.x-grid-row .col-push-0 {
  left: auto;
}
.x-grid-row .col-pull-0 {
  right: auto;
}
.x-grid-row .col-push-0 {
  left: auto;
}
.x-grid-row .col-pull-0 {
  right: auto;
}
.x-grid-row .col-offset-0 {
  margin-left: 0;
}
.x-grid-row .col-order-0 {
  -webkit-box-ordinal-group: 1;
      -ms-flex-order: 0;
          order: 0;
}
.x-grid-row .col-xs-24 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%;
}
.x-grid-row .col-xs-push-24 {
  left: 100%;
}
.x-grid-row .col-xs-pull-24 {
  right: 100%;
}
.x-grid-row .col-xs-offset-24 {
  margin-left: 100%;
}
.x-grid-row .col-xs-order-24 {
  -webkit-box-ordinal-group: 25;
      -ms-flex-order: 24;
          order: 24;
}
.x-grid-row .col-xs-23 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 95.83333333%;
          flex: 0 0 95.83333333%;
  max-width: 95.83333333%;
}
.x-grid-row .col-xs-push-23 {
  left: 95.83333333%;
}
.x-grid-row .col-xs-pull-23 {
  right: 95.83333333%;
}
.x-grid-row .col-xs-offset-23 {
  margin-left: 95.83333333%;
}
.x-grid-row .col-xs-order-23 {
  -webkit-box-ordinal-group: 24;
      -ms-flex-order: 23;
          order: 23;
}
.x-grid-row .col-xs-22 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 91.66666667%;
          flex: 0 0 91.66666667%;
  max-width: 91.66666667%;
}
.x-grid-row .col-xs-push-22 {
  left: 91.66666667%;
}
.x-grid-row .col-xs-pull-22 {
  right: 91.66666667%;
}
.x-grid-row .col-xs-offset-22 {
  margin-left: 91.66666667%;
}
.x-grid-row .col-xs-order-22 {
  -webkit-box-ordinal-group: 23;
      -ms-flex-order: 22;
          order: 22;
}
.x-grid-row .col-xs-21 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 87.5%;
          flex: 0 0 87.5%;
  max-width: 87.5%;
}
.x-grid-row .col-xs-push-21 {
  left: 87.5%;
}
.x-grid-row .col-xs-pull-21 {
  right: 87.5%;
}
.x-grid-row .col-xs-offset-21 {
  margin-left: 87.5%;
}
.x-grid-row .col-xs-order-21 {
  -webkit-box-ordinal-group: 22;
      -ms-flex-order: 21;
          order: 21;
}
.x-grid-row .col-xs-20 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 83.33333333%;
          flex: 0 0 83.33333333%;
  max-width: 83.33333333%;
}
.x-grid-row .col-xs-push-20 {
  left: 83.33333333%;
}
.x-grid-row .col-xs-pull-20 {
  right: 83.33333333%;
}
.x-grid-row .col-xs-offset-20 {
  margin-left: 83.33333333%;
}
.x-grid-row .col-xs-order-20 {
  -webkit-box-ordinal-group: 21;
      -ms-flex-order: 20;
          order: 20;
}
.x-grid-row .col-xs-19 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 79.16666667%;
          flex: 0 0 79.16666667%;
  max-width: 79.16666667%;
}
.x-grid-row .col-xs-push-19 {
  left: 79.16666667%;
}
.x-grid-row .col-xs-pull-19 {
  right: 79.16666667%;
}
.x-grid-row .col-xs-offset-19 {
  margin-left: 79.16666667%;
}
.x-grid-row .col-xs-order-19 {
  -webkit-box-ordinal-group: 20;
      -ms-flex-order: 19;
          order: 19;
}
.x-grid-row .col-xs-18 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 75%;
          flex: 0 0 75%;
  max-width: 75%;
}
.x-grid-row .col-xs-push-18 {
  left: 75%;
}
.x-grid-row .col-xs-pull-18 {
  right: 75%;
}
.x-grid-row .col-xs-offset-18 {
  margin-left: 75%;
}
.x-grid-row .col-xs-order-18 {
  -webkit-box-ordinal-group: 19;
      -ms-flex-order: 18;
          order: 18;
}
.x-grid-row .col-xs-17 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 70.83333333%;
          flex: 0 0 70.83333333%;
  max-width: 70.83333333%;
}
.x-grid-row .col-xs-push-17 {
  left: 70.83333333%;
}
.x-grid-row .col-xs-pull-17 {
  right: 70.83333333%;
}
.x-grid-row .col-xs-offset-17 {
  margin-left: 70.83333333%;
}
.x-grid-row .col-xs-order-17 {
  -webkit-box-ordinal-group: 18;
      -ms-flex-order: 17;
          order: 17;
}
.x-grid-row .col-xs-16 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 66.66666667%;
          flex: 0 0 66.66666667%;
  max-width: 66.66666667%;
}
.x-grid-row .col-xs-push-16 {
  left: 66.66666667%;
}
.x-grid-row .col-xs-pull-16 {
  right: 66.66666667%;
}
.x-grid-row .col-xs-offset-16 {
  margin-left: 66.66666667%;
}
.x-grid-row .col-xs-order-16 {
  -webkit-box-ordinal-group: 17;
      -ms-flex-order: 16;
          order: 16;
}
.x-grid-row .col-xs-15 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 62.5%;
          flex: 0 0 62.5%;
  max-width: 62.5%;
}
.x-grid-row .col-xs-push-15 {
  left: 62.5%;
}
.x-grid-row .col-xs-pull-15 {
  right: 62.5%;
}
.x-grid-row .col-xs-offset-15 {
  margin-left: 62.5%;
}
.x-grid-row .col-xs-order-15 {
  -webkit-box-ordinal-group: 16;
      -ms-flex-order: 15;
          order: 15;
}
.x-grid-row .col-xs-14 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 58.33333333%;
          flex: 0 0 58.33333333%;
  max-width: 58.33333333%;
}
.x-grid-row .col-xs-push-14 {
  left: 58.33333333%;
}
.x-grid-row .col-xs-pull-14 {
  right: 58.33333333%;
}
.x-grid-row .col-xs-offset-14 {
  margin-left: 58.33333333%;
}
.x-grid-row .col-xs-order-14 {
  -webkit-box-ordinal-group: 15;
      -ms-flex-order: 14;
          order: 14;
}
.x-grid-row .col-xs-13 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 54.16666667%;
          flex: 0 0 54.16666667%;
  max-width: 54.16666667%;
}
.x-grid-row .col-xs-push-13 {
  left: 54.16666667%;
}
.x-grid-row .col-xs-pull-13 {
  right: 54.16666667%;
}
.x-grid-row .col-xs-offset-13 {
  margin-left: 54.16666667%;
}
.x-grid-row .col-xs-order-13 {
  -webkit-box-ordinal-group: 14;
      -ms-flex-order: 13;
          order: 13;
}
.x-grid-row .col-xs-12 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  max-width: 50%;
}
.x-grid-row .col-xs-push-12 {
  left: 50%;
}
.x-grid-row .col-xs-pull-12 {
  right: 50%;
}
.x-grid-row .col-xs-offset-12 {
  margin-left: 50%;
}
.x-grid-row .col-xs-order-12 {
  -webkit-box-ordinal-group: 13;
      -ms-flex-order: 12;
          order: 12;
}
.x-grid-row .col-xs-11 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 45.83333333%;
          flex: 0 0 45.83333333%;
  max-width: 45.83333333%;
}
.x-grid-row .col-xs-push-11 {
  left: 45.83333333%;
}
.x-grid-row .col-xs-pull-11 {
  right: 45.83333333%;
}
.x-grid-row .col-xs-offset-11 {
  margin-left: 45.83333333%;
}
.x-grid-row .col-xs-order-11 {
  -webkit-box-ordinal-group: 12;
      -ms-flex-order: 11;
          order: 11;
}
.x-grid-row .col-xs-10 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 41.66666667%;
          flex: 0 0 41.66666667%;
  max-width: 41.66666667%;
}
.x-grid-row .col-xs-push-10 {
  left: 41.66666667%;
}
.x-grid-row .col-xs-pull-10 {
  right: 41.66666667%;
}
.x-grid-row .col-xs-offset-10 {
  margin-left: 41.66666667%;
}
.x-grid-row .col-xs-order-10 {
  -webkit-box-ordinal-group: 11;
      -ms-flex-order: 10;
          order: 10;
}
.x-grid-row .col-xs-9 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 37.5%;
          flex: 0 0 37.5%;
  max-width: 37.5%;
}
.x-grid-row .col-xs-push-9 {
  left: 37.5%;
}
.x-grid-row .col-xs-pull-9 {
  right: 37.5%;
}
.x-grid-row .col-xs-offset-9 {
  margin-left: 37.5%;
}
.x-grid-row .col-xs-order-9 {
  -webkit-box-ordinal-group: 10;
      -ms-flex-order: 9;
          order: 9;
}
.x-grid-row .col-xs-8 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.33333333%;
          flex: 0 0 33.33333333%;
  max-width: 33.33333333%;
}
.x-grid-row .col-xs-push-8 {
  left: 33.33333333%;
}
.x-grid-row .col-xs-pull-8 {
  right: 33.33333333%;
}
.x-grid-row .col-xs-offset-8 {
  margin-left: 33.33333333%;
}
.x-grid-row .col-xs-order-8 {
  -webkit-box-ordinal-group: 9;
      -ms-flex-order: 8;
          order: 8;
}
.x-grid-row .col-xs-7 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 29.16666667%;
          flex: 0 0 29.16666667%;
  max-width: 29.16666667%;
}
.x-grid-row .col-xs-push-7 {
  left: 29.16666667%;
}
.x-grid-row .col-xs-pull-7 {
  right: 29.16666667%;
}
.x-grid-row .col-xs-offset-7 {
  margin-left: 29.16666667%;
}
.x-grid-row .col-xs-order-7 {
  -webkit-box-ordinal-group: 8;
      -ms-flex-order: 7;
          order: 7;
}
.x-grid-row .col-xs-6 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 25%;
          flex: 0 0 25%;
  max-width: 25%;
}
.x-grid-row .col-xs-push-6 {
  left: 25%;
}
.x-grid-row .col-xs-pull-6 {
  right: 25%;
}
.x-grid-row .col-xs-offset-6 {
  margin-left: 25%;
}
.x-grid-row .col-xs-order-6 {
  -webkit-box-ordinal-group: 7;
      -ms-flex-order: 6;
          order: 6;
}
.x-grid-row .col-xs-5 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 20.83333333%;
          flex: 0 0 20.83333333%;
  max-width: 20.83333333%;
}
.x-grid-row .col-xs-push-5 {
  left: 20.83333333%;
}
.x-grid-row .col-xs-pull-5 {
  right: 20.83333333%;
}
.x-grid-row .col-xs-offset-5 {
  margin-left: 20.83333333%;
}
.x-grid-row .col-xs-order-5 {
  -webkit-box-ordinal-group: 6;
      -ms-flex-order: 5;
          order: 5;
}
.x-grid-row .col-xs-4 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 16.66666667%;
          flex: 0 0 16.66666667%;
  max-width: 16.66666667%;
}
.x-grid-row .col-xs-push-4 {
  left: 16.66666667%;
}
.x-grid-row .col-xs-pull-4 {
  right: 16.66666667%;
}
.x-grid-row .col-xs-offset-4 {
  margin-left: 16.66666667%;
}
.x-grid-row .col-xs-order-4 {
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4;
}
.x-grid-row .col-xs-3 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 12.5%;
          flex: 0 0 12.5%;
  max-width: 12.5%;
}
.x-grid-row .col-xs-push-3 {
  left: 12.5%;
}
.x-grid-row .col-xs-pull-3 {
  right: 12.5%;
}
.x-grid-row .col-xs-offset-3 {
  margin-left: 12.5%;
}
.x-grid-row .col-xs-order-3 {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
.x-grid-row .col-xs-2 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 8.33333333%;
          flex: 0 0 8.33333333%;
  max-width: 8.33333333%;
}
.x-grid-row .col-xs-push-2 {
  left: 8.33333333%;
}
.x-grid-row .col-xs-pull-2 {
  right: 8.33333333%;
}
.x-grid-row .col-xs-offset-2 {
  margin-left: 8.33333333%;
}
.x-grid-row .col-xs-order-2 {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.x-grid-row .col-xs-1 {
  display: block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 4.16666667%;
          flex: 0 0 4.16666667%;
  max-width: 4.16666667%;
}
.x-grid-row .col-xs-push-1 {
  left: 4.16666667%;
}
.x-grid-row .col-xs-pull-1 {
  right: 4.16666667%;
}
.x-grid-row .col-xs-offset-1 {
  margin-left: 4.16666667%;
}
.x-grid-row .col-xs-order-1 {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.x-grid-row .col-xs-0 {
  display: none;
}
.x-grid-row .col-push-0 {
  left: auto;
}
.x-grid-row .col-pull-0 {
  right: auto;
}
.x-grid-row .col-xs-push-0 {
  left: auto;
}
.x-grid-row .col-xs-pull-0 {
  right: auto;
}
.x-grid-row .col-xs-offset-0 {
  margin-left: 0;
}
.x-grid-row .col-xs-order-0 {
  -webkit-box-ordinal-group: 1;
      -ms-flex-order: 0;
          order: 0;
}
@media (min-width: 375px) {
  .x-grid-row .col-sm-24 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
  .x-grid-row .col-sm-push-24 {
    left: 100%;
  }
  .x-grid-row .col-sm-pull-24 {
    right: 100%;
  }
  .x-grid-row .col-sm-offset-24 {
    margin-left: 100%;
  }
  .x-grid-row .col-sm-order-24 {
    -webkit-box-ordinal-group: 25;
        -ms-flex-order: 24;
            order: 24;
  }
  .x-grid-row .col-sm-23 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 95.83333333%;
            flex: 0 0 95.83333333%;
    max-width: 95.83333333%;
  }
  .x-grid-row .col-sm-push-23 {
    left: 95.83333333%;
  }
  .x-grid-row .col-sm-pull-23 {
    right: 95.83333333%;
  }
  .x-grid-row .col-sm-offset-23 {
    margin-left: 95.83333333%;
  }
  .x-grid-row .col-sm-order-23 {
    -webkit-box-ordinal-group: 24;
        -ms-flex-order: 23;
            order: 23;
  }
  .x-grid-row .col-sm-22 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66666667%;
            flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .x-grid-row .col-sm-push-22 {
    left: 91.66666667%;
  }
  .x-grid-row .col-sm-pull-22 {
    right: 91.66666667%;
  }
  .x-grid-row .col-sm-offset-22 {
    margin-left: 91.66666667%;
  }
  .x-grid-row .col-sm-order-22 {
    -webkit-box-ordinal-group: 23;
        -ms-flex-order: 22;
            order: 22;
  }
  .x-grid-row .col-sm-21 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 87.5%;
            flex: 0 0 87.5%;
    max-width: 87.5%;
  }
  .x-grid-row .col-sm-push-21 {
    left: 87.5%;
  }
  .x-grid-row .col-sm-pull-21 {
    right: 87.5%;
  }
  .x-grid-row .col-sm-offset-21 {
    margin-left: 87.5%;
  }
  .x-grid-row .col-sm-order-21 {
    -webkit-box-ordinal-group: 22;
        -ms-flex-order: 21;
            order: 21;
  }
  .x-grid-row .col-sm-20 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333333%;
            flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .x-grid-row .col-sm-push-20 {
    left: 83.33333333%;
  }
  .x-grid-row .col-sm-pull-20 {
    right: 83.33333333%;
  }
  .x-grid-row .col-sm-offset-20 {
    margin-left: 83.33333333%;
  }
  .x-grid-row .col-sm-order-20 {
    -webkit-box-ordinal-group: 21;
        -ms-flex-order: 20;
            order: 20;
  }
  .x-grid-row .col-sm-19 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 79.16666667%;
            flex: 0 0 79.16666667%;
    max-width: 79.16666667%;
  }
  .x-grid-row .col-sm-push-19 {
    left: 79.16666667%;
  }
  .x-grid-row .col-sm-pull-19 {
    right: 79.16666667%;
  }
  .x-grid-row .col-sm-offset-19 {
    margin-left: 79.16666667%;
  }
  .x-grid-row .col-sm-order-19 {
    -webkit-box-ordinal-group: 20;
        -ms-flex-order: 19;
            order: 19;
  }
  .x-grid-row .col-sm-18 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .x-grid-row .col-sm-push-18 {
    left: 75%;
  }
  .x-grid-row .col-sm-pull-18 {
    right: 75%;
  }
  .x-grid-row .col-sm-offset-18 {
    margin-left: 75%;
  }
  .x-grid-row .col-sm-order-18 {
    -webkit-box-ordinal-group: 19;
        -ms-flex-order: 18;
            order: 18;
  }
  .x-grid-row .col-sm-17 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70.83333333%;
            flex: 0 0 70.83333333%;
    max-width: 70.83333333%;
  }
  .x-grid-row .col-sm-push-17 {
    left: 70.83333333%;
  }
  .x-grid-row .col-sm-pull-17 {
    right: 70.83333333%;
  }
  .x-grid-row .col-sm-offset-17 {
    margin-left: 70.83333333%;
  }
  .x-grid-row .col-sm-order-17 {
    -webkit-box-ordinal-group: 18;
        -ms-flex-order: 17;
            order: 17;
  }
  .x-grid-row .col-sm-16 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66666667%;
            flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .x-grid-row .col-sm-push-16 {
    left: 66.66666667%;
  }
  .x-grid-row .col-sm-pull-16 {
    right: 66.66666667%;
  }
  .x-grid-row .col-sm-offset-16 {
    margin-left: 66.66666667%;
  }
  .x-grid-row .col-sm-order-16 {
    -webkit-box-ordinal-group: 17;
        -ms-flex-order: 16;
            order: 16;
  }
  .x-grid-row .col-sm-15 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 62.5%;
            flex: 0 0 62.5%;
    max-width: 62.5%;
  }
  .x-grid-row .col-sm-push-15 {
    left: 62.5%;
  }
  .x-grid-row .col-sm-pull-15 {
    right: 62.5%;
  }
  .x-grid-row .col-sm-offset-15 {
    margin-left: 62.5%;
  }
  .x-grid-row .col-sm-order-15 {
    -webkit-box-ordinal-group: 16;
        -ms-flex-order: 15;
            order: 15;
  }
  .x-grid-row .col-sm-14 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333333%;
            flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .x-grid-row .col-sm-push-14 {
    left: 58.33333333%;
  }
  .x-grid-row .col-sm-pull-14 {
    right: 58.33333333%;
  }
  .x-grid-row .col-sm-offset-14 {
    margin-left: 58.33333333%;
  }
  .x-grid-row .col-sm-order-14 {
    -webkit-box-ordinal-group: 15;
        -ms-flex-order: 14;
            order: 14;
  }
  .x-grid-row .col-sm-13 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 54.16666667%;
            flex: 0 0 54.16666667%;
    max-width: 54.16666667%;
  }
  .x-grid-row .col-sm-push-13 {
    left: 54.16666667%;
  }
  .x-grid-row .col-sm-pull-13 {
    right: 54.16666667%;
  }
  .x-grid-row .col-sm-offset-13 {
    margin-left: 54.16666667%;
  }
  .x-grid-row .col-sm-order-13 {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }
  .x-grid-row .col-sm-12 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .x-grid-row .col-sm-push-12 {
    left: 50%;
  }
  .x-grid-row .col-sm-pull-12 {
    right: 50%;
  }
  .x-grid-row .col-sm-offset-12 {
    margin-left: 50%;
  }
  .x-grid-row .col-sm-order-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
  .x-grid-row .col-sm-11 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 45.83333333%;
            flex: 0 0 45.83333333%;
    max-width: 45.83333333%;
  }
  .x-grid-row .col-sm-push-11 {
    left: 45.83333333%;
  }
  .x-grid-row .col-sm-pull-11 {
    right: 45.83333333%;
  }
  .x-grid-row .col-sm-offset-11 {
    margin-left: 45.83333333%;
  }
  .x-grid-row .col-sm-order-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
  .x-grid-row .col-sm-10 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66666667%;
            flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .x-grid-row .col-sm-push-10 {
    left: 41.66666667%;
  }
  .x-grid-row .col-sm-pull-10 {
    right: 41.66666667%;
  }
  .x-grid-row .col-sm-offset-10 {
    margin-left: 41.66666667%;
  }
  .x-grid-row .col-sm-order-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
  .x-grid-row .col-sm-9 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 37.5%;
            flex: 0 0 37.5%;
    max-width: 37.5%;
  }
  .x-grid-row .col-sm-push-9 {
    left: 37.5%;
  }
  .x-grid-row .col-sm-pull-9 {
    right: 37.5%;
  }
  .x-grid-row .col-sm-offset-9 {
    margin-left: 37.5%;
  }
  .x-grid-row .col-sm-order-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
  .x-grid-row .col-sm-8 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333333%;
            flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .x-grid-row .col-sm-push-8 {
    left: 33.33333333%;
  }
  .x-grid-row .col-sm-pull-8 {
    right: 33.33333333%;
  }
  .x-grid-row .col-sm-offset-8 {
    margin-left: 33.33333333%;
  }
  .x-grid-row .col-sm-order-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
  .x-grid-row .col-sm-7 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 29.16666667%;
            flex: 0 0 29.16666667%;
    max-width: 29.16666667%;
  }
  .x-grid-row .col-sm-push-7 {
    left: 29.16666667%;
  }
  .x-grid-row .col-sm-pull-7 {
    right: 29.16666667%;
  }
  .x-grid-row .col-sm-offset-7 {
    margin-left: 29.16666667%;
  }
  .x-grid-row .col-sm-order-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
  .x-grid-row .col-sm-6 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .x-grid-row .col-sm-push-6 {
    left: 25%;
  }
  .x-grid-row .col-sm-pull-6 {
    right: 25%;
  }
  .x-grid-row .col-sm-offset-6 {
    margin-left: 25%;
  }
  .x-grid-row .col-sm-order-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
  .x-grid-row .col-sm-5 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20.83333333%;
            flex: 0 0 20.83333333%;
    max-width: 20.83333333%;
  }
  .x-grid-row .col-sm-push-5 {
    left: 20.83333333%;
  }
  .x-grid-row .col-sm-pull-5 {
    right: 20.83333333%;
  }
  .x-grid-row .col-sm-offset-5 {
    margin-left: 20.83333333%;
  }
  .x-grid-row .col-sm-order-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
  .x-grid-row .col-sm-4 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66666667%;
            flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .x-grid-row .col-sm-push-4 {
    left: 16.66666667%;
  }
  .x-grid-row .col-sm-pull-4 {
    right: 16.66666667%;
  }
  .x-grid-row .col-sm-offset-4 {
    margin-left: 16.66666667%;
  }
  .x-grid-row .col-sm-order-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .x-grid-row .col-sm-3 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .x-grid-row .col-sm-push-3 {
    left: 12.5%;
  }
  .x-grid-row .col-sm-pull-3 {
    right: 12.5%;
  }
  .x-grid-row .col-sm-offset-3 {
    margin-left: 12.5%;
  }
  .x-grid-row .col-sm-order-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .x-grid-row .col-sm-2 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333333%;
            flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .x-grid-row .col-sm-push-2 {
    left: 8.33333333%;
  }
  .x-grid-row .col-sm-pull-2 {
    right: 8.33333333%;
  }
  .x-grid-row .col-sm-offset-2 {
    margin-left: 8.33333333%;
  }
  .x-grid-row .col-sm-order-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .x-grid-row .col-sm-1 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 4.16666667%;
            flex: 0 0 4.16666667%;
    max-width: 4.16666667%;
  }
  .x-grid-row .col-sm-push-1 {
    left: 4.16666667%;
  }
  .x-grid-row .col-sm-pull-1 {
    right: 4.16666667%;
  }
  .x-grid-row .col-sm-offset-1 {
    margin-left: 4.16666667%;
  }
  .x-grid-row .col-sm-order-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .x-grid-row .col-sm-0 {
    display: none;
  }
  .x-grid-row .col-push-0 {
    left: auto;
  }
  .x-grid-row .col-pull-0 {
    right: auto;
  }
  .x-grid-row .col-sm-push-0 {
    left: auto;
  }
  .x-grid-row .col-sm-pull-0 {
    right: auto;
  }
  .x-grid-row .col-sm-offset-0 {
    margin-left: 0;
  }
  .x-grid-row .col-sm-order-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
}
@media (min-width: 414px) {
  .x-grid-row .col-md-24 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
  .x-grid-row .col-md-push-24 {
    left: 100%;
  }
  .x-grid-row .col-md-pull-24 {
    right: 100%;
  }
  .x-grid-row .col-md-offset-24 {
    margin-left: 100%;
  }
  .x-grid-row .col-md-order-24 {
    -webkit-box-ordinal-group: 25;
        -ms-flex-order: 24;
            order: 24;
  }
  .x-grid-row .col-md-23 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 95.83333333%;
            flex: 0 0 95.83333333%;
    max-width: 95.83333333%;
  }
  .x-grid-row .col-md-push-23 {
    left: 95.83333333%;
  }
  .x-grid-row .col-md-pull-23 {
    right: 95.83333333%;
  }
  .x-grid-row .col-md-offset-23 {
    margin-left: 95.83333333%;
  }
  .x-grid-row .col-md-order-23 {
    -webkit-box-ordinal-group: 24;
        -ms-flex-order: 23;
            order: 23;
  }
  .x-grid-row .col-md-22 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66666667%;
            flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .x-grid-row .col-md-push-22 {
    left: 91.66666667%;
  }
  .x-grid-row .col-md-pull-22 {
    right: 91.66666667%;
  }
  .x-grid-row .col-md-offset-22 {
    margin-left: 91.66666667%;
  }
  .x-grid-row .col-md-order-22 {
    -webkit-box-ordinal-group: 23;
        -ms-flex-order: 22;
            order: 22;
  }
  .x-grid-row .col-md-21 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 87.5%;
            flex: 0 0 87.5%;
    max-width: 87.5%;
  }
  .x-grid-row .col-md-push-21 {
    left: 87.5%;
  }
  .x-grid-row .col-md-pull-21 {
    right: 87.5%;
  }
  .x-grid-row .col-md-offset-21 {
    margin-left: 87.5%;
  }
  .x-grid-row .col-md-order-21 {
    -webkit-box-ordinal-group: 22;
        -ms-flex-order: 21;
            order: 21;
  }
  .x-grid-row .col-md-20 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333333%;
            flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .x-grid-row .col-md-push-20 {
    left: 83.33333333%;
  }
  .x-grid-row .col-md-pull-20 {
    right: 83.33333333%;
  }
  .x-grid-row .col-md-offset-20 {
    margin-left: 83.33333333%;
  }
  .x-grid-row .col-md-order-20 {
    -webkit-box-ordinal-group: 21;
        -ms-flex-order: 20;
            order: 20;
  }
  .x-grid-row .col-md-19 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 79.16666667%;
            flex: 0 0 79.16666667%;
    max-width: 79.16666667%;
  }
  .x-grid-row .col-md-push-19 {
    left: 79.16666667%;
  }
  .x-grid-row .col-md-pull-19 {
    right: 79.16666667%;
  }
  .x-grid-row .col-md-offset-19 {
    margin-left: 79.16666667%;
  }
  .x-grid-row .col-md-order-19 {
    -webkit-box-ordinal-group: 20;
        -ms-flex-order: 19;
            order: 19;
  }
  .x-grid-row .col-md-18 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .x-grid-row .col-md-push-18 {
    left: 75%;
  }
  .x-grid-row .col-md-pull-18 {
    right: 75%;
  }
  .x-grid-row .col-md-offset-18 {
    margin-left: 75%;
  }
  .x-grid-row .col-md-order-18 {
    -webkit-box-ordinal-group: 19;
        -ms-flex-order: 18;
            order: 18;
  }
  .x-grid-row .col-md-17 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70.83333333%;
            flex: 0 0 70.83333333%;
    max-width: 70.83333333%;
  }
  .x-grid-row .col-md-push-17 {
    left: 70.83333333%;
  }
  .x-grid-row .col-md-pull-17 {
    right: 70.83333333%;
  }
  .x-grid-row .col-md-offset-17 {
    margin-left: 70.83333333%;
  }
  .x-grid-row .col-md-order-17 {
    -webkit-box-ordinal-group: 18;
        -ms-flex-order: 17;
            order: 17;
  }
  .x-grid-row .col-md-16 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66666667%;
            flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .x-grid-row .col-md-push-16 {
    left: 66.66666667%;
  }
  .x-grid-row .col-md-pull-16 {
    right: 66.66666667%;
  }
  .x-grid-row .col-md-offset-16 {
    margin-left: 66.66666667%;
  }
  .x-grid-row .col-md-order-16 {
    -webkit-box-ordinal-group: 17;
        -ms-flex-order: 16;
            order: 16;
  }
  .x-grid-row .col-md-15 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 62.5%;
            flex: 0 0 62.5%;
    max-width: 62.5%;
  }
  .x-grid-row .col-md-push-15 {
    left: 62.5%;
  }
  .x-grid-row .col-md-pull-15 {
    right: 62.5%;
  }
  .x-grid-row .col-md-offset-15 {
    margin-left: 62.5%;
  }
  .x-grid-row .col-md-order-15 {
    -webkit-box-ordinal-group: 16;
        -ms-flex-order: 15;
            order: 15;
  }
  .x-grid-row .col-md-14 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333333%;
            flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .x-grid-row .col-md-push-14 {
    left: 58.33333333%;
  }
  .x-grid-row .col-md-pull-14 {
    right: 58.33333333%;
  }
  .x-grid-row .col-md-offset-14 {
    margin-left: 58.33333333%;
  }
  .x-grid-row .col-md-order-14 {
    -webkit-box-ordinal-group: 15;
        -ms-flex-order: 14;
            order: 14;
  }
  .x-grid-row .col-md-13 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 54.16666667%;
            flex: 0 0 54.16666667%;
    max-width: 54.16666667%;
  }
  .x-grid-row .col-md-push-13 {
    left: 54.16666667%;
  }
  .x-grid-row .col-md-pull-13 {
    right: 54.16666667%;
  }
  .x-grid-row .col-md-offset-13 {
    margin-left: 54.16666667%;
  }
  .x-grid-row .col-md-order-13 {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }
  .x-grid-row .col-md-12 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .x-grid-row .col-md-push-12 {
    left: 50%;
  }
  .x-grid-row .col-md-pull-12 {
    right: 50%;
  }
  .x-grid-row .col-md-offset-12 {
    margin-left: 50%;
  }
  .x-grid-row .col-md-order-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
  .x-grid-row .col-md-11 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 45.83333333%;
            flex: 0 0 45.83333333%;
    max-width: 45.83333333%;
  }
  .x-grid-row .col-md-push-11 {
    left: 45.83333333%;
  }
  .x-grid-row .col-md-pull-11 {
    right: 45.83333333%;
  }
  .x-grid-row .col-md-offset-11 {
    margin-left: 45.83333333%;
  }
  .x-grid-row .col-md-order-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
  .x-grid-row .col-md-10 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66666667%;
            flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .x-grid-row .col-md-push-10 {
    left: 41.66666667%;
  }
  .x-grid-row .col-md-pull-10 {
    right: 41.66666667%;
  }
  .x-grid-row .col-md-offset-10 {
    margin-left: 41.66666667%;
  }
  .x-grid-row .col-md-order-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
  .x-grid-row .col-md-9 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 37.5%;
            flex: 0 0 37.5%;
    max-width: 37.5%;
  }
  .x-grid-row .col-md-push-9 {
    left: 37.5%;
  }
  .x-grid-row .col-md-pull-9 {
    right: 37.5%;
  }
  .x-grid-row .col-md-offset-9 {
    margin-left: 37.5%;
  }
  .x-grid-row .col-md-order-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
  .x-grid-row .col-md-8 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333333%;
            flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .x-grid-row .col-md-push-8 {
    left: 33.33333333%;
  }
  .x-grid-row .col-md-pull-8 {
    right: 33.33333333%;
  }
  .x-grid-row .col-md-offset-8 {
    margin-left: 33.33333333%;
  }
  .x-grid-row .col-md-order-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
  .x-grid-row .col-md-7 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 29.16666667%;
            flex: 0 0 29.16666667%;
    max-width: 29.16666667%;
  }
  .x-grid-row .col-md-push-7 {
    left: 29.16666667%;
  }
  .x-grid-row .col-md-pull-7 {
    right: 29.16666667%;
  }
  .x-grid-row .col-md-offset-7 {
    margin-left: 29.16666667%;
  }
  .x-grid-row .col-md-order-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
  .x-grid-row .col-md-6 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .x-grid-row .col-md-push-6 {
    left: 25%;
  }
  .x-grid-row .col-md-pull-6 {
    right: 25%;
  }
  .x-grid-row .col-md-offset-6 {
    margin-left: 25%;
  }
  .x-grid-row .col-md-order-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
  .x-grid-row .col-md-5 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20.83333333%;
            flex: 0 0 20.83333333%;
    max-width: 20.83333333%;
  }
  .x-grid-row .col-md-push-5 {
    left: 20.83333333%;
  }
  .x-grid-row .col-md-pull-5 {
    right: 20.83333333%;
  }
  .x-grid-row .col-md-offset-5 {
    margin-left: 20.83333333%;
  }
  .x-grid-row .col-md-order-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
  .x-grid-row .col-md-4 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66666667%;
            flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .x-grid-row .col-md-push-4 {
    left: 16.66666667%;
  }
  .x-grid-row .col-md-pull-4 {
    right: 16.66666667%;
  }
  .x-grid-row .col-md-offset-4 {
    margin-left: 16.66666667%;
  }
  .x-grid-row .col-md-order-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .x-grid-row .col-md-3 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .x-grid-row .col-md-push-3 {
    left: 12.5%;
  }
  .x-grid-row .col-md-pull-3 {
    right: 12.5%;
  }
  .x-grid-row .col-md-offset-3 {
    margin-left: 12.5%;
  }
  .x-grid-row .col-md-order-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .x-grid-row .col-md-2 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333333%;
            flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .x-grid-row .col-md-push-2 {
    left: 8.33333333%;
  }
  .x-grid-row .col-md-pull-2 {
    right: 8.33333333%;
  }
  .x-grid-row .col-md-offset-2 {
    margin-left: 8.33333333%;
  }
  .x-grid-row .col-md-order-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .x-grid-row .col-md-1 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 4.16666667%;
            flex: 0 0 4.16666667%;
    max-width: 4.16666667%;
  }
  .x-grid-row .col-md-push-1 {
    left: 4.16666667%;
  }
  .x-grid-row .col-md-pull-1 {
    right: 4.16666667%;
  }
  .x-grid-row .col-md-offset-1 {
    margin-left: 4.16666667%;
  }
  .x-grid-row .col-md-order-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .x-grid-row .col-md-0 {
    display: none;
  }
  .x-grid-row .col-push-0 {
    left: auto;
  }
  .x-grid-row .col-pull-0 {
    right: auto;
  }
  .x-grid-row .col-md-push-0 {
    left: auto;
  }
  .x-grid-row .col-md-pull-0 {
    right: auto;
  }
  .x-grid-row .col-md-offset-0 {
    margin-left: 0;
  }
  .x-grid-row .col-md-order-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
}
@media (min-width: 540px) {
  .x-grid-row .col-lg-24 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
  .x-grid-row .col-lg-push-24 {
    left: 100%;
  }
  .x-grid-row .col-lg-pull-24 {
    right: 100%;
  }
  .x-grid-row .col-lg-offset-24 {
    margin-left: 100%;
  }
  .x-grid-row .col-lg-order-24 {
    -webkit-box-ordinal-group: 25;
        -ms-flex-order: 24;
            order: 24;
  }
  .x-grid-row .col-lg-23 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 95.83333333%;
            flex: 0 0 95.83333333%;
    max-width: 95.83333333%;
  }
  .x-grid-row .col-lg-push-23 {
    left: 95.83333333%;
  }
  .x-grid-row .col-lg-pull-23 {
    right: 95.83333333%;
  }
  .x-grid-row .col-lg-offset-23 {
    margin-left: 95.83333333%;
  }
  .x-grid-row .col-lg-order-23 {
    -webkit-box-ordinal-group: 24;
        -ms-flex-order: 23;
            order: 23;
  }
  .x-grid-row .col-lg-22 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66666667%;
            flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .x-grid-row .col-lg-push-22 {
    left: 91.66666667%;
  }
  .x-grid-row .col-lg-pull-22 {
    right: 91.66666667%;
  }
  .x-grid-row .col-lg-offset-22 {
    margin-left: 91.66666667%;
  }
  .x-grid-row .col-lg-order-22 {
    -webkit-box-ordinal-group: 23;
        -ms-flex-order: 22;
            order: 22;
  }
  .x-grid-row .col-lg-21 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 87.5%;
            flex: 0 0 87.5%;
    max-width: 87.5%;
  }
  .x-grid-row .col-lg-push-21 {
    left: 87.5%;
  }
  .x-grid-row .col-lg-pull-21 {
    right: 87.5%;
  }
  .x-grid-row .col-lg-offset-21 {
    margin-left: 87.5%;
  }
  .x-grid-row .col-lg-order-21 {
    -webkit-box-ordinal-group: 22;
        -ms-flex-order: 21;
            order: 21;
  }
  .x-grid-row .col-lg-20 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333333%;
            flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .x-grid-row .col-lg-push-20 {
    left: 83.33333333%;
  }
  .x-grid-row .col-lg-pull-20 {
    right: 83.33333333%;
  }
  .x-grid-row .col-lg-offset-20 {
    margin-left: 83.33333333%;
  }
  .x-grid-row .col-lg-order-20 {
    -webkit-box-ordinal-group: 21;
        -ms-flex-order: 20;
            order: 20;
  }
  .x-grid-row .col-lg-19 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 79.16666667%;
            flex: 0 0 79.16666667%;
    max-width: 79.16666667%;
  }
  .x-grid-row .col-lg-push-19 {
    left: 79.16666667%;
  }
  .x-grid-row .col-lg-pull-19 {
    right: 79.16666667%;
  }
  .x-grid-row .col-lg-offset-19 {
    margin-left: 79.16666667%;
  }
  .x-grid-row .col-lg-order-19 {
    -webkit-box-ordinal-group: 20;
        -ms-flex-order: 19;
            order: 19;
  }
  .x-grid-row .col-lg-18 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .x-grid-row .col-lg-push-18 {
    left: 75%;
  }
  .x-grid-row .col-lg-pull-18 {
    right: 75%;
  }
  .x-grid-row .col-lg-offset-18 {
    margin-left: 75%;
  }
  .x-grid-row .col-lg-order-18 {
    -webkit-box-ordinal-group: 19;
        -ms-flex-order: 18;
            order: 18;
  }
  .x-grid-row .col-lg-17 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70.83333333%;
            flex: 0 0 70.83333333%;
    max-width: 70.83333333%;
  }
  .x-grid-row .col-lg-push-17 {
    left: 70.83333333%;
  }
  .x-grid-row .col-lg-pull-17 {
    right: 70.83333333%;
  }
  .x-grid-row .col-lg-offset-17 {
    margin-left: 70.83333333%;
  }
  .x-grid-row .col-lg-order-17 {
    -webkit-box-ordinal-group: 18;
        -ms-flex-order: 17;
            order: 17;
  }
  .x-grid-row .col-lg-16 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66666667%;
            flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .x-grid-row .col-lg-push-16 {
    left: 66.66666667%;
  }
  .x-grid-row .col-lg-pull-16 {
    right: 66.66666667%;
  }
  .x-grid-row .col-lg-offset-16 {
    margin-left: 66.66666667%;
  }
  .x-grid-row .col-lg-order-16 {
    -webkit-box-ordinal-group: 17;
        -ms-flex-order: 16;
            order: 16;
  }
  .x-grid-row .col-lg-15 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 62.5%;
            flex: 0 0 62.5%;
    max-width: 62.5%;
  }
  .x-grid-row .col-lg-push-15 {
    left: 62.5%;
  }
  .x-grid-row .col-lg-pull-15 {
    right: 62.5%;
  }
  .x-grid-row .col-lg-offset-15 {
    margin-left: 62.5%;
  }
  .x-grid-row .col-lg-order-15 {
    -webkit-box-ordinal-group: 16;
        -ms-flex-order: 15;
            order: 15;
  }
  .x-grid-row .col-lg-14 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333333%;
            flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .x-grid-row .col-lg-push-14 {
    left: 58.33333333%;
  }
  .x-grid-row .col-lg-pull-14 {
    right: 58.33333333%;
  }
  .x-grid-row .col-lg-offset-14 {
    margin-left: 58.33333333%;
  }
  .x-grid-row .col-lg-order-14 {
    -webkit-box-ordinal-group: 15;
        -ms-flex-order: 14;
            order: 14;
  }
  .x-grid-row .col-lg-13 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 54.16666667%;
            flex: 0 0 54.16666667%;
    max-width: 54.16666667%;
  }
  .x-grid-row .col-lg-push-13 {
    left: 54.16666667%;
  }
  .x-grid-row .col-lg-pull-13 {
    right: 54.16666667%;
  }
  .x-grid-row .col-lg-offset-13 {
    margin-left: 54.16666667%;
  }
  .x-grid-row .col-lg-order-13 {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }
  .x-grid-row .col-lg-12 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .x-grid-row .col-lg-push-12 {
    left: 50%;
  }
  .x-grid-row .col-lg-pull-12 {
    right: 50%;
  }
  .x-grid-row .col-lg-offset-12 {
    margin-left: 50%;
  }
  .x-grid-row .col-lg-order-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
  .x-grid-row .col-lg-11 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 45.83333333%;
            flex: 0 0 45.83333333%;
    max-width: 45.83333333%;
  }
  .x-grid-row .col-lg-push-11 {
    left: 45.83333333%;
  }
  .x-grid-row .col-lg-pull-11 {
    right: 45.83333333%;
  }
  .x-grid-row .col-lg-offset-11 {
    margin-left: 45.83333333%;
  }
  .x-grid-row .col-lg-order-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
  .x-grid-row .col-lg-10 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66666667%;
            flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .x-grid-row .col-lg-push-10 {
    left: 41.66666667%;
  }
  .x-grid-row .col-lg-pull-10 {
    right: 41.66666667%;
  }
  .x-grid-row .col-lg-offset-10 {
    margin-left: 41.66666667%;
  }
  .x-grid-row .col-lg-order-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
  .x-grid-row .col-lg-9 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 37.5%;
            flex: 0 0 37.5%;
    max-width: 37.5%;
  }
  .x-grid-row .col-lg-push-9 {
    left: 37.5%;
  }
  .x-grid-row .col-lg-pull-9 {
    right: 37.5%;
  }
  .x-grid-row .col-lg-offset-9 {
    margin-left: 37.5%;
  }
  .x-grid-row .col-lg-order-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
  .x-grid-row .col-lg-8 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333333%;
            flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .x-grid-row .col-lg-push-8 {
    left: 33.33333333%;
  }
  .x-grid-row .col-lg-pull-8 {
    right: 33.33333333%;
  }
  .x-grid-row .col-lg-offset-8 {
    margin-left: 33.33333333%;
  }
  .x-grid-row .col-lg-order-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
  .x-grid-row .col-lg-7 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 29.16666667%;
            flex: 0 0 29.16666667%;
    max-width: 29.16666667%;
  }
  .x-grid-row .col-lg-push-7 {
    left: 29.16666667%;
  }
  .x-grid-row .col-lg-pull-7 {
    right: 29.16666667%;
  }
  .x-grid-row .col-lg-offset-7 {
    margin-left: 29.16666667%;
  }
  .x-grid-row .col-lg-order-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
  .x-grid-row .col-lg-6 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .x-grid-row .col-lg-push-6 {
    left: 25%;
  }
  .x-grid-row .col-lg-pull-6 {
    right: 25%;
  }
  .x-grid-row .col-lg-offset-6 {
    margin-left: 25%;
  }
  .x-grid-row .col-lg-order-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
  .x-grid-row .col-lg-5 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20.83333333%;
            flex: 0 0 20.83333333%;
    max-width: 20.83333333%;
  }
  .x-grid-row .col-lg-push-5 {
    left: 20.83333333%;
  }
  .x-grid-row .col-lg-pull-5 {
    right: 20.83333333%;
  }
  .x-grid-row .col-lg-offset-5 {
    margin-left: 20.83333333%;
  }
  .x-grid-row .col-lg-order-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
  .x-grid-row .col-lg-4 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66666667%;
            flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .x-grid-row .col-lg-push-4 {
    left: 16.66666667%;
  }
  .x-grid-row .col-lg-pull-4 {
    right: 16.66666667%;
  }
  .x-grid-row .col-lg-offset-4 {
    margin-left: 16.66666667%;
  }
  .x-grid-row .col-lg-order-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .x-grid-row .col-lg-3 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .x-grid-row .col-lg-push-3 {
    left: 12.5%;
  }
  .x-grid-row .col-lg-pull-3 {
    right: 12.5%;
  }
  .x-grid-row .col-lg-offset-3 {
    margin-left: 12.5%;
  }
  .x-grid-row .col-lg-order-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .x-grid-row .col-lg-2 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333333%;
            flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .x-grid-row .col-lg-push-2 {
    left: 8.33333333%;
  }
  .x-grid-row .col-lg-pull-2 {
    right: 8.33333333%;
  }
  .x-grid-row .col-lg-offset-2 {
    margin-left: 8.33333333%;
  }
  .x-grid-row .col-lg-order-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .x-grid-row .col-lg-1 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 4.16666667%;
            flex: 0 0 4.16666667%;
    max-width: 4.16666667%;
  }
  .x-grid-row .col-lg-push-1 {
    left: 4.16666667%;
  }
  .x-grid-row .col-lg-pull-1 {
    right: 4.16666667%;
  }
  .x-grid-row .col-lg-offset-1 {
    margin-left: 4.16666667%;
  }
  .x-grid-row .col-lg-order-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .x-grid-row .col-lg-0 {
    display: none;
  }
  .x-grid-row .col-push-0 {
    left: auto;
  }
  .x-grid-row .col-pull-0 {
    right: auto;
  }
  .x-grid-row .col-lg-push-0 {
    left: auto;
  }
  .x-grid-row .col-lg-pull-0 {
    right: auto;
  }
  .x-grid-row .col-lg-offset-0 {
    margin-left: 0;
  }
  .x-grid-row .col-lg-order-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
}
@media (min-width: 750px) {
  .x-grid-row .col-xl-24 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
  .x-grid-row .col-xl-push-24 {
    left: 100%;
  }
  .x-grid-row .col-xl-pull-24 {
    right: 100%;
  }
  .x-grid-row .col-xl-offset-24 {
    margin-left: 100%;
  }
  .x-grid-row .col-xl-order-24 {
    -webkit-box-ordinal-group: 25;
        -ms-flex-order: 24;
            order: 24;
  }
  .x-grid-row .col-xl-23 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 95.83333333%;
            flex: 0 0 95.83333333%;
    max-width: 95.83333333%;
  }
  .x-grid-row .col-xl-push-23 {
    left: 95.83333333%;
  }
  .x-grid-row .col-xl-pull-23 {
    right: 95.83333333%;
  }
  .x-grid-row .col-xl-offset-23 {
    margin-left: 95.83333333%;
  }
  .x-grid-row .col-xl-order-23 {
    -webkit-box-ordinal-group: 24;
        -ms-flex-order: 23;
            order: 23;
  }
  .x-grid-row .col-xl-22 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66666667%;
            flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .x-grid-row .col-xl-push-22 {
    left: 91.66666667%;
  }
  .x-grid-row .col-xl-pull-22 {
    right: 91.66666667%;
  }
  .x-grid-row .col-xl-offset-22 {
    margin-left: 91.66666667%;
  }
  .x-grid-row .col-xl-order-22 {
    -webkit-box-ordinal-group: 23;
        -ms-flex-order: 22;
            order: 22;
  }
  .x-grid-row .col-xl-21 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 87.5%;
            flex: 0 0 87.5%;
    max-width: 87.5%;
  }
  .x-grid-row .col-xl-push-21 {
    left: 87.5%;
  }
  .x-grid-row .col-xl-pull-21 {
    right: 87.5%;
  }
  .x-grid-row .col-xl-offset-21 {
    margin-left: 87.5%;
  }
  .x-grid-row .col-xl-order-21 {
    -webkit-box-ordinal-group: 22;
        -ms-flex-order: 21;
            order: 21;
  }
  .x-grid-row .col-xl-20 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333333%;
            flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .x-grid-row .col-xl-push-20 {
    left: 83.33333333%;
  }
  .x-grid-row .col-xl-pull-20 {
    right: 83.33333333%;
  }
  .x-grid-row .col-xl-offset-20 {
    margin-left: 83.33333333%;
  }
  .x-grid-row .col-xl-order-20 {
    -webkit-box-ordinal-group: 21;
        -ms-flex-order: 20;
            order: 20;
  }
  .x-grid-row .col-xl-19 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 79.16666667%;
            flex: 0 0 79.16666667%;
    max-width: 79.16666667%;
  }
  .x-grid-row .col-xl-push-19 {
    left: 79.16666667%;
  }
  .x-grid-row .col-xl-pull-19 {
    right: 79.16666667%;
  }
  .x-grid-row .col-xl-offset-19 {
    margin-left: 79.16666667%;
  }
  .x-grid-row .col-xl-order-19 {
    -webkit-box-ordinal-group: 20;
        -ms-flex-order: 19;
            order: 19;
  }
  .x-grid-row .col-xl-18 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .x-grid-row .col-xl-push-18 {
    left: 75%;
  }
  .x-grid-row .col-xl-pull-18 {
    right: 75%;
  }
  .x-grid-row .col-xl-offset-18 {
    margin-left: 75%;
  }
  .x-grid-row .col-xl-order-18 {
    -webkit-box-ordinal-group: 19;
        -ms-flex-order: 18;
            order: 18;
  }
  .x-grid-row .col-xl-17 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70.83333333%;
            flex: 0 0 70.83333333%;
    max-width: 70.83333333%;
  }
  .x-grid-row .col-xl-push-17 {
    left: 70.83333333%;
  }
  .x-grid-row .col-xl-pull-17 {
    right: 70.83333333%;
  }
  .x-grid-row .col-xl-offset-17 {
    margin-left: 70.83333333%;
  }
  .x-grid-row .col-xl-order-17 {
    -webkit-box-ordinal-group: 18;
        -ms-flex-order: 17;
            order: 17;
  }
  .x-grid-row .col-xl-16 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66666667%;
            flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .x-grid-row .col-xl-push-16 {
    left: 66.66666667%;
  }
  .x-grid-row .col-xl-pull-16 {
    right: 66.66666667%;
  }
  .x-grid-row .col-xl-offset-16 {
    margin-left: 66.66666667%;
  }
  .x-grid-row .col-xl-order-16 {
    -webkit-box-ordinal-group: 17;
        -ms-flex-order: 16;
            order: 16;
  }
  .x-grid-row .col-xl-15 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 62.5%;
            flex: 0 0 62.5%;
    max-width: 62.5%;
  }
  .x-grid-row .col-xl-push-15 {
    left: 62.5%;
  }
  .x-grid-row .col-xl-pull-15 {
    right: 62.5%;
  }
  .x-grid-row .col-xl-offset-15 {
    margin-left: 62.5%;
  }
  .x-grid-row .col-xl-order-15 {
    -webkit-box-ordinal-group: 16;
        -ms-flex-order: 15;
            order: 15;
  }
  .x-grid-row .col-xl-14 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333333%;
            flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .x-grid-row .col-xl-push-14 {
    left: 58.33333333%;
  }
  .x-grid-row .col-xl-pull-14 {
    right: 58.33333333%;
  }
  .x-grid-row .col-xl-offset-14 {
    margin-left: 58.33333333%;
  }
  .x-grid-row .col-xl-order-14 {
    -webkit-box-ordinal-group: 15;
        -ms-flex-order: 14;
            order: 14;
  }
  .x-grid-row .col-xl-13 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 54.16666667%;
            flex: 0 0 54.16666667%;
    max-width: 54.16666667%;
  }
  .x-grid-row .col-xl-push-13 {
    left: 54.16666667%;
  }
  .x-grid-row .col-xl-pull-13 {
    right: 54.16666667%;
  }
  .x-grid-row .col-xl-offset-13 {
    margin-left: 54.16666667%;
  }
  .x-grid-row .col-xl-order-13 {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }
  .x-grid-row .col-xl-12 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .x-grid-row .col-xl-push-12 {
    left: 50%;
  }
  .x-grid-row .col-xl-pull-12 {
    right: 50%;
  }
  .x-grid-row .col-xl-offset-12 {
    margin-left: 50%;
  }
  .x-grid-row .col-xl-order-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
  .x-grid-row .col-xl-11 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 45.83333333%;
            flex: 0 0 45.83333333%;
    max-width: 45.83333333%;
  }
  .x-grid-row .col-xl-push-11 {
    left: 45.83333333%;
  }
  .x-grid-row .col-xl-pull-11 {
    right: 45.83333333%;
  }
  .x-grid-row .col-xl-offset-11 {
    margin-left: 45.83333333%;
  }
  .x-grid-row .col-xl-order-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
  .x-grid-row .col-xl-10 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66666667%;
            flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .x-grid-row .col-xl-push-10 {
    left: 41.66666667%;
  }
  .x-grid-row .col-xl-pull-10 {
    right: 41.66666667%;
  }
  .x-grid-row .col-xl-offset-10 {
    margin-left: 41.66666667%;
  }
  .x-grid-row .col-xl-order-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
  .x-grid-row .col-xl-9 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 37.5%;
            flex: 0 0 37.5%;
    max-width: 37.5%;
  }
  .x-grid-row .col-xl-push-9 {
    left: 37.5%;
  }
  .x-grid-row .col-xl-pull-9 {
    right: 37.5%;
  }
  .x-grid-row .col-xl-offset-9 {
    margin-left: 37.5%;
  }
  .x-grid-row .col-xl-order-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
  .x-grid-row .col-xl-8 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333333%;
            flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .x-grid-row .col-xl-push-8 {
    left: 33.33333333%;
  }
  .x-grid-row .col-xl-pull-8 {
    right: 33.33333333%;
  }
  .x-grid-row .col-xl-offset-8 {
    margin-left: 33.33333333%;
  }
  .x-grid-row .col-xl-order-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
  .x-grid-row .col-xl-7 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 29.16666667%;
            flex: 0 0 29.16666667%;
    max-width: 29.16666667%;
  }
  .x-grid-row .col-xl-push-7 {
    left: 29.16666667%;
  }
  .x-grid-row .col-xl-pull-7 {
    right: 29.16666667%;
  }
  .x-grid-row .col-xl-offset-7 {
    margin-left: 29.16666667%;
  }
  .x-grid-row .col-xl-order-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
  .x-grid-row .col-xl-6 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .x-grid-row .col-xl-push-6 {
    left: 25%;
  }
  .x-grid-row .col-xl-pull-6 {
    right: 25%;
  }
  .x-grid-row .col-xl-offset-6 {
    margin-left: 25%;
  }
  .x-grid-row .col-xl-order-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
  .x-grid-row .col-xl-5 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20.83333333%;
            flex: 0 0 20.83333333%;
    max-width: 20.83333333%;
  }
  .x-grid-row .col-xl-push-5 {
    left: 20.83333333%;
  }
  .x-grid-row .col-xl-pull-5 {
    right: 20.83333333%;
  }
  .x-grid-row .col-xl-offset-5 {
    margin-left: 20.83333333%;
  }
  .x-grid-row .col-xl-order-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
  .x-grid-row .col-xl-4 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66666667%;
            flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .x-grid-row .col-xl-push-4 {
    left: 16.66666667%;
  }
  .x-grid-row .col-xl-pull-4 {
    right: 16.66666667%;
  }
  .x-grid-row .col-xl-offset-4 {
    margin-left: 16.66666667%;
  }
  .x-grid-row .col-xl-order-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .x-grid-row .col-xl-3 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .x-grid-row .col-xl-push-3 {
    left: 12.5%;
  }
  .x-grid-row .col-xl-pull-3 {
    right: 12.5%;
  }
  .x-grid-row .col-xl-offset-3 {
    margin-left: 12.5%;
  }
  .x-grid-row .col-xl-order-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .x-grid-row .col-xl-2 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333333%;
            flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .x-grid-row .col-xl-push-2 {
    left: 8.33333333%;
  }
  .x-grid-row .col-xl-pull-2 {
    right: 8.33333333%;
  }
  .x-grid-row .col-xl-offset-2 {
    margin-left: 8.33333333%;
  }
  .x-grid-row .col-xl-order-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .x-grid-row .col-xl-1 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 4.16666667%;
            flex: 0 0 4.16666667%;
    max-width: 4.16666667%;
  }
  .x-grid-row .col-xl-push-1 {
    left: 4.16666667%;
  }
  .x-grid-row .col-xl-pull-1 {
    right: 4.16666667%;
  }
  .x-grid-row .col-xl-offset-1 {
    margin-left: 4.16666667%;
  }
  .x-grid-row .col-xl-order-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .x-grid-row .col-xl-0 {
    display: none;
  }
  .x-grid-row .col-push-0 {
    left: auto;
  }
  .x-grid-row .col-pull-0 {
    right: auto;
  }
  .x-grid-row .col-xl-push-0 {
    left: auto;
  }
  .x-grid-row .col-xl-pull-0 {
    right: auto;
  }
  .x-grid-row .col-xl-offset-0 {
    margin-left: 0;
  }
  .x-grid-row .col-xl-order-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
}
@media (min-width: 960px) {
  .x-grid-row .col-xxl-24 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
  .x-grid-row .col-xxl-push-24 {
    left: 100%;
  }
  .x-grid-row .col-xxl-pull-24 {
    right: 100%;
  }
  .x-grid-row .col-xxl-offset-24 {
    margin-left: 100%;
  }
  .x-grid-row .col-xxl-order-24 {
    -webkit-box-ordinal-group: 25;
        -ms-flex-order: 24;
            order: 24;
  }
  .x-grid-row .col-xxl-23 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 95.83333333%;
            flex: 0 0 95.83333333%;
    max-width: 95.83333333%;
  }
  .x-grid-row .col-xxl-push-23 {
    left: 95.83333333%;
  }
  .x-grid-row .col-xxl-pull-23 {
    right: 95.83333333%;
  }
  .x-grid-row .col-xxl-offset-23 {
    margin-left: 95.83333333%;
  }
  .x-grid-row .col-xxl-order-23 {
    -webkit-box-ordinal-group: 24;
        -ms-flex-order: 23;
            order: 23;
  }
  .x-grid-row .col-xxl-22 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66666667%;
            flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .x-grid-row .col-xxl-push-22 {
    left: 91.66666667%;
  }
  .x-grid-row .col-xxl-pull-22 {
    right: 91.66666667%;
  }
  .x-grid-row .col-xxl-offset-22 {
    margin-left: 91.66666667%;
  }
  .x-grid-row .col-xxl-order-22 {
    -webkit-box-ordinal-group: 23;
        -ms-flex-order: 22;
            order: 22;
  }
  .x-grid-row .col-xxl-21 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 87.5%;
            flex: 0 0 87.5%;
    max-width: 87.5%;
  }
  .x-grid-row .col-xxl-push-21 {
    left: 87.5%;
  }
  .x-grid-row .col-xxl-pull-21 {
    right: 87.5%;
  }
  .x-grid-row .col-xxl-offset-21 {
    margin-left: 87.5%;
  }
  .x-grid-row .col-xxl-order-21 {
    -webkit-box-ordinal-group: 22;
        -ms-flex-order: 21;
            order: 21;
  }
  .x-grid-row .col-xxl-20 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333333%;
            flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .x-grid-row .col-xxl-push-20 {
    left: 83.33333333%;
  }
  .x-grid-row .col-xxl-pull-20 {
    right: 83.33333333%;
  }
  .x-grid-row .col-xxl-offset-20 {
    margin-left: 83.33333333%;
  }
  .x-grid-row .col-xxl-order-20 {
    -webkit-box-ordinal-group: 21;
        -ms-flex-order: 20;
            order: 20;
  }
  .x-grid-row .col-xxl-19 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 79.16666667%;
            flex: 0 0 79.16666667%;
    max-width: 79.16666667%;
  }
  .x-grid-row .col-xxl-push-19 {
    left: 79.16666667%;
  }
  .x-grid-row .col-xxl-pull-19 {
    right: 79.16666667%;
  }
  .x-grid-row .col-xxl-offset-19 {
    margin-left: 79.16666667%;
  }
  .x-grid-row .col-xxl-order-19 {
    -webkit-box-ordinal-group: 20;
        -ms-flex-order: 19;
            order: 19;
  }
  .x-grid-row .col-xxl-18 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .x-grid-row .col-xxl-push-18 {
    left: 75%;
  }
  .x-grid-row .col-xxl-pull-18 {
    right: 75%;
  }
  .x-grid-row .col-xxl-offset-18 {
    margin-left: 75%;
  }
  .x-grid-row .col-xxl-order-18 {
    -webkit-box-ordinal-group: 19;
        -ms-flex-order: 18;
            order: 18;
  }
  .x-grid-row .col-xxl-17 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70.83333333%;
            flex: 0 0 70.83333333%;
    max-width: 70.83333333%;
  }
  .x-grid-row .col-xxl-push-17 {
    left: 70.83333333%;
  }
  .x-grid-row .col-xxl-pull-17 {
    right: 70.83333333%;
  }
  .x-grid-row .col-xxl-offset-17 {
    margin-left: 70.83333333%;
  }
  .x-grid-row .col-xxl-order-17 {
    -webkit-box-ordinal-group: 18;
        -ms-flex-order: 17;
            order: 17;
  }
  .x-grid-row .col-xxl-16 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66666667%;
            flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .x-grid-row .col-xxl-push-16 {
    left: 66.66666667%;
  }
  .x-grid-row .col-xxl-pull-16 {
    right: 66.66666667%;
  }
  .x-grid-row .col-xxl-offset-16 {
    margin-left: 66.66666667%;
  }
  .x-grid-row .col-xxl-order-16 {
    -webkit-box-ordinal-group: 17;
        -ms-flex-order: 16;
            order: 16;
  }
  .x-grid-row .col-xxl-15 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 62.5%;
            flex: 0 0 62.5%;
    max-width: 62.5%;
  }
  .x-grid-row .col-xxl-push-15 {
    left: 62.5%;
  }
  .x-grid-row .col-xxl-pull-15 {
    right: 62.5%;
  }
  .x-grid-row .col-xxl-offset-15 {
    margin-left: 62.5%;
  }
  .x-grid-row .col-xxl-order-15 {
    -webkit-box-ordinal-group: 16;
        -ms-flex-order: 15;
            order: 15;
  }
  .x-grid-row .col-xxl-14 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333333%;
            flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .x-grid-row .col-xxl-push-14 {
    left: 58.33333333%;
  }
  .x-grid-row .col-xxl-pull-14 {
    right: 58.33333333%;
  }
  .x-grid-row .col-xxl-offset-14 {
    margin-left: 58.33333333%;
  }
  .x-grid-row .col-xxl-order-14 {
    -webkit-box-ordinal-group: 15;
        -ms-flex-order: 14;
            order: 14;
  }
  .x-grid-row .col-xxl-13 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 54.16666667%;
            flex: 0 0 54.16666667%;
    max-width: 54.16666667%;
  }
  .x-grid-row .col-xxl-push-13 {
    left: 54.16666667%;
  }
  .x-grid-row .col-xxl-pull-13 {
    right: 54.16666667%;
  }
  .x-grid-row .col-xxl-offset-13 {
    margin-left: 54.16666667%;
  }
  .x-grid-row .col-xxl-order-13 {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }
  .x-grid-row .col-xxl-12 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .x-grid-row .col-xxl-push-12 {
    left: 50%;
  }
  .x-grid-row .col-xxl-pull-12 {
    right: 50%;
  }
  .x-grid-row .col-xxl-offset-12 {
    margin-left: 50%;
  }
  .x-grid-row .col-xxl-order-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
  .x-grid-row .col-xxl-11 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 45.83333333%;
            flex: 0 0 45.83333333%;
    max-width: 45.83333333%;
  }
  .x-grid-row .col-xxl-push-11 {
    left: 45.83333333%;
  }
  .x-grid-row .col-xxl-pull-11 {
    right: 45.83333333%;
  }
  .x-grid-row .col-xxl-offset-11 {
    margin-left: 45.83333333%;
  }
  .x-grid-row .col-xxl-order-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
  .x-grid-row .col-xxl-10 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66666667%;
            flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .x-grid-row .col-xxl-push-10 {
    left: 41.66666667%;
  }
  .x-grid-row .col-xxl-pull-10 {
    right: 41.66666667%;
  }
  .x-grid-row .col-xxl-offset-10 {
    margin-left: 41.66666667%;
  }
  .x-grid-row .col-xxl-order-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }
  .x-grid-row .col-xxl-9 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 37.5%;
            flex: 0 0 37.5%;
    max-width: 37.5%;
  }
  .x-grid-row .col-xxl-push-9 {
    left: 37.5%;
  }
  .x-grid-row .col-xxl-pull-9 {
    right: 37.5%;
  }
  .x-grid-row .col-xxl-offset-9 {
    margin-left: 37.5%;
  }
  .x-grid-row .col-xxl-order-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }
  .x-grid-row .col-xxl-8 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333333%;
            flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .x-grid-row .col-xxl-push-8 {
    left: 33.33333333%;
  }
  .x-grid-row .col-xxl-pull-8 {
    right: 33.33333333%;
  }
  .x-grid-row .col-xxl-offset-8 {
    margin-left: 33.33333333%;
  }
  .x-grid-row .col-xxl-order-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }
  .x-grid-row .col-xxl-7 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 29.16666667%;
            flex: 0 0 29.16666667%;
    max-width: 29.16666667%;
  }
  .x-grid-row .col-xxl-push-7 {
    left: 29.16666667%;
  }
  .x-grid-row .col-xxl-pull-7 {
    right: 29.16666667%;
  }
  .x-grid-row .col-xxl-offset-7 {
    margin-left: 29.16666667%;
  }
  .x-grid-row .col-xxl-order-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
  .x-grid-row .col-xxl-6 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .x-grid-row .col-xxl-push-6 {
    left: 25%;
  }
  .x-grid-row .col-xxl-pull-6 {
    right: 25%;
  }
  .x-grid-row .col-xxl-offset-6 {
    margin-left: 25%;
  }
  .x-grid-row .col-xxl-order-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
  .x-grid-row .col-xxl-5 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 20.83333333%;
            flex: 0 0 20.83333333%;
    max-width: 20.83333333%;
  }
  .x-grid-row .col-xxl-push-5 {
    left: 20.83333333%;
  }
  .x-grid-row .col-xxl-pull-5 {
    right: 20.83333333%;
  }
  .x-grid-row .col-xxl-offset-5 {
    margin-left: 20.83333333%;
  }
  .x-grid-row .col-xxl-order-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
  .x-grid-row .col-xxl-4 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66666667%;
            flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .x-grid-row .col-xxl-push-4 {
    left: 16.66666667%;
  }
  .x-grid-row .col-xxl-pull-4 {
    right: 16.66666667%;
  }
  .x-grid-row .col-xxl-offset-4 {
    margin-left: 16.66666667%;
  }
  .x-grid-row .col-xxl-order-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .x-grid-row .col-xxl-3 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .x-grid-row .col-xxl-push-3 {
    left: 12.5%;
  }
  .x-grid-row .col-xxl-pull-3 {
    right: 12.5%;
  }
  .x-grid-row .col-xxl-offset-3 {
    margin-left: 12.5%;
  }
  .x-grid-row .col-xxl-order-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .x-grid-row .col-xxl-2 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333333%;
            flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .x-grid-row .col-xxl-push-2 {
    left: 8.33333333%;
  }
  .x-grid-row .col-xxl-pull-2 {
    right: 8.33333333%;
  }
  .x-grid-row .col-xxl-offset-2 {
    margin-left: 8.33333333%;
  }
  .x-grid-row .col-xxl-order-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .x-grid-row .col-xxl-1 {
    display: block;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 4.16666667%;
            flex: 0 0 4.16666667%;
    max-width: 4.16666667%;
  }
  .x-grid-row .col-xxl-push-1 {
    left: 4.16666667%;
  }
  .x-grid-row .col-xxl-pull-1 {
    right: 4.16666667%;
  }
  .x-grid-row .col-xxl-offset-1 {
    margin-left: 4.16666667%;
  }
  .x-grid-row .col-xxl-order-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .x-grid-row .col-xxl-0 {
    display: none;
  }
  .x-grid-row .col-push-0 {
    left: auto;
  }
  .x-grid-row .col-pull-0 {
    right: auto;
  }
  .x-grid-row .col-xxl-push-0 {
    left: auto;
  }
  .x-grid-row .col-xxl-pull-0 {
    right: auto;
  }
  .x-grid-row .col-xxl-offset-0 {
    margin-left: 0;
  }
  .x-grid-row .col-xxl-order-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
}
.x-cascader-drawer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.x-cascader-drawer .x-cascader-action-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 2.4rem;
  border-bottom: 0.05rem solid var(--fdm-color-border-secondary);
}
.x-cascader-drawer .x-cascader-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0 0.75rem;
  overflow: hidden;
}
.x-cascader-drawer .x-cascader-content .x-cascader-view {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.x-cascader-drawer .x-cascader-header-clear {
  color: var(--fdm-color-text-secondary);
}
.x-cascader-drawer .x-cascader-header-ok {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-cascader-drawer .x-cascader-header-clear,
.x-cascader-drawer .x-cascader-header-ok {
  padding: var(--fdm-padding) var(--fdm-padding-lg);
  cursor: pointer;
}
.x-cascader-view {
  height: 18.5rem;
  overflow: auto;
}
.x-cascader-view .cascader-view-tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
}
.x-cascader-view .cascader-view-tab .tab-header {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  height: 2.8rem;
  margin-bottom: var(--fdm-gap-sm);
  font-weight: var(--fdm-font-weight);
}
.x-cascader-view .cascader-view-tab .tab-header::before {
  height: 0;
}
.x-cascader-view .cascader-view-tab .tab-header .tab-header-item {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: auto;
  max-width: 5.3rem;
  margin-right: var(--fdm-gap-3xl);
  padding: 0 !important;
}
.x-cascader-view .cascader-view-tab .tab-header .tab-header-item .cascader-header-title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.x-cascader-view .cascader-view-tab .tab-content {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.x-cascader-view .cascader-view-tab .x-tab-item {
  height: 100%;
  padding: 0;
}
.x-cascader-view .cascader-view-tab .x-tab-item .x-cascader-view-content {
  height: 100%;
  overflow: auto;
}
.x-cascader-view .cascader-view-tab .cascader-list .cascader-view-item {
  height: 2.2rem;
  padding: 0.5rem var(--fdm-padding-layout);
  color: var(--fdm-color-text);
  border: 0;
}
.x-cascader-view .cascader-view-tab .cascader-list .cascader-view-item.disabled {
  color: var(--fdm-color-text-disabled);
}
.x-cascader-view .cascader-view-tab .cascader-list .cascader-view-item.disabled .x-svgicon {
  color: var(--fdm-color-text-disabled);
}
.x-cascader-view .cascader-view-tab .cascader-list .cascader-view-item.active {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-cascader-view .cascader-view-tab .cascader-list .cascader-view-item.active .x-svgicon {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.x-svgicon {
  display: inline-block;
  text-align: center;
  text-transform: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.x-svgicon > svg {
  vertical-align: -0.125em;
}
.x-svgicon.spin {
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation: x-rotate 1s infinite linear;
          animation: x-rotate 1s infinite linear;
}
:root {
  --fdm-color-primary-bg: #E9F7F6;
  --fdm-color-primary-bg-deep: #D8F2F0;
  --fdm-color-primary-bg-active: #B0E8E3;
  --fdm-color-primary-bg-text-active: #D8F2F0;
  --fdm-color-primary: #03ABA0;
  --fdm-color-primary-active: #05948A;
  --fdm-color-primary-disabled: #B0E8E3;
}
.x-page-demo-block .block-title {
  padding: 0.6rem 0.6rem 0.4rem;
  color: var(--fdm-color-text);
  font-size: 0.7rem;
}
.x-page-demo-block .block-content {
  padding: 0.6rem;
  background: #fff;
}
:root {
  --fdm-font-size-4xs: 0.45rem;
  --fdm-font-size-3xs: 0.5rem;
  --fdm-font-size-2xs: 0.55rem;
  --fdm-font-size-xs: 0.6rem;
  --fdm-font-size-sm: 0.7rem;
  --fdm-font-size: 0.75rem;
  --fdm-font-size-lg: 0.8rem;
  --fdm-font-size-xl: 0.85rem;
  --fdm-font-size-2xl: 0.9rem;
  --fdm-font-size-3xl: 1rem;
  --fdm-font-size-4xl: 1.2rem;
  --fdm-icon-size-2sm: 0.6rem;
  --fdm-icon-size-sm: 0.7rem;
  --fdm-icon-size: 0.8rem;
  --fdm-icon-size-lg: 0.9rem;
  --fdm-icon-size-xl: 1rem;
  --fdm-icon-size-2xl: 1.2rem;
  --fdm-line-height-2xs: 0.6rem;
  --fdm-line-height-xs: 0.8rem;
  --fdm-line-height-sm: 1rem;
  --fdm-line-height: 1.2rem;
  --fdm-line-height-lg: 1.4rem;
  --fdm-line-height-xl: 1.6rem;
  --fdm-line-height-2xl: 1.8rem;
  --fdm-font-weight: 400;
  --fdm-font-weight-bold: 600;
  --fdm-gap-none: 0;
  --fdm-gap-xs: 0.1rem;
  --fdm-gap-sm: 0.2rem;
  --fdm-gap: 0.4rem;
  --fdm-gap-lg: 0.5rem;
  --fdm-gap-xl: 0.6rem;
  --fdm-gap-2xl: 0.8rem;
  --fdm-gap-3xl: 1rem;
  --fdm-gap-4xl: 1.2rem;
  --fdm-gap-5xl: 1.6rem;
  --fdm-gap-6xl: 2.4rem;
  --fdm-padding-none: 0;
  --fdm-padding-2xs: 0.1rem;
  --fdm-padding-xs: 0.2rem;
  --fdm-padding-sm: 0.3rem;
  --fdm-padding: 0.4rem;
  --fdm-padding-lg: 0.6rem;
  --fdm-padding-xl: 0.8rem;
  --fdm-padding-2xl: 1rem;
  --fdm-padding-layout-none: 0;
  --fdm-padding-layout-sm: 0.4rem;
  --fdm-padding-layout: 0.6rem;
  --fdm-padding-layout-lg: 0.8rem;
  --fdm-padding-layout-xl: 1rem;
  --fdm-padding-layout-2xl: 1.2rem;
  --fdm-height-2xs: 0.9rem;
  --fdm-height-xs: 1.2rem;
  --fdm-height-sm: 1.6rem;
  --fdm-height: 1.8rem;
  --fdm-height-lg: 2.2rem;
  --fdm-height-xl: 2.4rem;
  --fdm-height-2xl: 2.8rem;
  --fdm-height-3xl: 4.4rem;
  --fdm-border-radius-none: 0;
  --fdm-border-radius-xs: 0.1rem;
  --fdm-border-radius-sm: 0.2rem;
  --fdm-border-radius: 0.3rem;
  --fdm-border-radius-lg: 0.4rem;
  --fdm-border-radius-xl: 0.5rem;
  --fdm-border-radius-full: 499.95rem;
  --fdm-color-red-1: #FEF1F0;
  --fdm-color-red-2: #FFDFDD;
  --fdm-color-red-3: #FFC4C2;
  --fdm-color-red-4: #FFA3A0;
  --fdm-color-red-5: #FD7D79;
  --fdm-color-red-6: #EF5655;
  --fdm-color-red-7: #C54746;
  --fdm-color-red-8: #9F3937;
  --fdm-color-red-9: #782A28;
  --fdm-color-red-10: #4A1817;
  --fdm-color-yellow-1: #FFF7E4;
  --fdm-color-yellow-2: #FFEEC7;
  --fdm-color-yellow-3: #FFE29E;
  --fdm-color-yellow-4: #FCD379;
  --fdm-color-yellow-5: #F7BE54;
  --fdm-color-yellow-6: #EDA426;
  --fdm-color-yellow-7: #C77F14;
  --fdm-color-yellow-8: #A8660A;
  --fdm-color-yellow-9: #824A01;
  --fdm-color-yellow-10: #4D2B00;
  --fdm-color-green-1: #ECF8ED;
  --fdm-color-green-2: #D2F3D6;
  --fdm-color-green-3: #AFE6B6;
  --fdm-color-green-4: #88D593;
  --fdm-color-green-5: #64C871;
  --fdm-color-green-6: #3BAD4A;
  --fdm-color-green-7: #358C41;
  --fdm-color-green-8: #316F39;
  --fdm-color-green-9: #2B5530;
  --fdm-color-green-10: #1F4024;
  --fdm-color-blue-1: #EBF3FF;
  --fdm-color-blue-2: #D9E8FF;
  --fdm-color-blue-3: #B7D2FE;
  --fdm-color-blue-4: #80B1FF;
  --fdm-color-blue-5: #4D91FF;
  --fdm-color-blue-6: #2B73F0;
  --fdm-color-blue-7: #3062C1;
  --fdm-color-blue-8: #174291;
  --fdm-color-blue-9: #143266;
  --fdm-color-blue-10: #0B224D;
  --fdm-color-orange-1: #FFF5E8;
  --fdm-color-orange-2: #FFE5C7;
  --fdm-color-orange-3: #FFCF99;
  --fdm-color-orange-4: #FFB566;
  --fdm-color-orange-5: #FF9F3E;
  --fdm-color-orange-6: #FA851E;
  --fdm-color-orange-7: #D26919;
  --fdm-color-orange-8: #B5560D;
  --fdm-color-orange-9: #773503;
  --fdm-color-orange-10: #471F00;
  --fdm-color-maize-1: #FBF8DD;
  --fdm-color-maize-2: #F7F3BE;
  --fdm-color-maize-3: #F5ED98;
  --fdm-color-maize-4: #EBE067;
  --fdm-color-maize-5: #E0D236;
  --fdm-color-maize-6: #D1C004;
  --fdm-color-maize-7: #AB9E03;
  --fdm-color-maize-8: #807602;
  --fdm-color-maize-9: #575002;
  --fdm-color-maize-10: #383401;
  --fdm-color-lime-1: #F6F9E6;
  --fdm-color-lime-2: #E7F0C0;
  --fdm-color-lime-3: #DBE8A0;
  --fdm-color-lime-4: #CDE079;
  --fdm-color-lime-5: #B8CF53;
  --fdm-color-lime-6: #9BBA04;
  --fdm-color-lime-7: #829B03;
  --fdm-color-lime-8: #617402;
  --fdm-color-lime-9: #414E02;
  --fdm-color-lime-10: #313A01;
  --fdm-color-leaf-1: #F1F9EC;
  --fdm-color-leaf-2: #DCF5CE;
  --fdm-color-leaf-3: #C3EDAB;
  --fdm-color-leaf-4: #B2E396;
  --fdm-color-leaf-5: #92D66B;
  --fdm-color-leaf-6: #69B83B;
  --fdm-color-leaf-7: #599F30;
  --fdm-color-leaf-8: #427724;
  --fdm-color-leaf-9: #2C5018;
  --fdm-color-leaf-10: #1F3811;
  --fdm-color-teal-1: #E9F7F6;
  --fdm-color-teal-2: #D8F2F0;
  --fdm-color-teal-3: #B0E8E3;
  --fdm-color-teal-4: #74DBD4;
  --fdm-color-teal-5: #3CC7BE;
  --fdm-color-teal-6: #03ABA0;
  --fdm-color-teal-7: #05948A;
  --fdm-color-teal-8: #037A72;
  --fdm-color-teal-9: #01615C;
  --fdm-color-teal-10: #004D49;
  --fdm-color-cyan-1: #EBF8FC;
  --fdm-color-cyan-2: #CFF1FC;
  --fdm-color-cyan-3: #AAE6FA;
  --fdm-color-cyan-4: #83DAF2;
  --fdm-color-cyan-5: #4AC6E8;
  --fdm-color-cyan-6: #0DADD9;
  --fdm-color-cyan-7: #038CB2;
  --fdm-color-cyan-8: #036C8A;
  --fdm-color-cyan-9: #015066;
  --fdm-color-cyan-10: #013B4F;
  --fdm-color-indigo-1: #EDF1FF;
  --fdm-color-indigo-2: #DCE3FD;
  --fdm-color-indigo-3: #C3CEFA;
  --fdm-color-indigo-4: #9AACF9;
  --fdm-color-indigo-5: #7187F5;
  --fdm-color-indigo-6: #5169E0;
  --fdm-color-indigo-7: #3F52BF;
  --fdm-color-indigo-8: #2D3EA1;
  --fdm-color-indigo-9: #212F80;
  --fdm-color-indigo-10: #131E5C;
  --fdm-color-violet-1: #F2EFFE;
  --fdm-color-violet-2: #E3DBFF;
  --fdm-color-violet-3: #CDC0FC;
  --fdm-color-violet-4: #B09CF7;
  --fdm-color-violet-5: #9176F5;
  --fdm-color-violet-6: #7758E8;
  --fdm-color-violet-7: #6246C7;
  --fdm-color-violet-8: #5036AD;
  --fdm-color-violet-9: #3F2B8A;
  --fdm-color-violet-10: #2E2259;
  --fdm-color-purple-1: #FAF0FE;
  --fdm-color-purple-2: #F6DFFF;
  --fdm-color-purple-3: #EEC5FF;
  --fdm-color-purple-4: #E5A4FF;
  --fdm-color-purple-5: #D181F0;
  --fdm-color-purple-6: #B94FDB;
  --fdm-color-purple-7: #9A31BD;
  --fdm-color-purple-8: #81299E;
  --fdm-color-purple-9: #601E75;
  --fdm-color-purple-10: #40204D;
  --fdm-color-lilac-1: #FBECF9;
  --fdm-color-lilac-2: #FAD9F4;
  --fdm-color-lilac-3: #F0B3E6;
  --fdm-color-lilac-4: #ECA0E0;
  --fdm-color-lilac-5: #E47AD3;
  --fdm-color-lilac-6: #D952C3;
  --fdm-color-lilac-7: #AE349A;
  --fdm-color-lilac-8: #822773;
  --fdm-color-lilac-9: #571A4D;
  --fdm-color-lilac-10: #41143A;
  --fdm-color-pink-1: #FEECF2;
  --fdm-color-pink-2: #FBD0DE;
  --fdm-color-pink-3: #F9B4CB;
  --fdm-color-pink-4: #F8A1BE;
  --fdm-color-pink-5: #F57BA4;
  --fdm-color-pink-6: #E54E81;
  --fdm-color-pink-7: #C03664;
  --fdm-color-pink-8: #90284B;
  --fdm-color-pink-9: #601B32;
  --fdm-color-pink-10: #481426;
  --fdm-color-slate-1: #EDEEF1;
  --fdm-color-slate-2: #D7DBE0;
  --fdm-color-slate-3: #BCC2CC;
  --fdm-color-slate-4: #9FA7B2;
  --fdm-color-slate-5: #778291;
  --fdm-color-slate-6: #5B687A;
  --fdm-color-slate-7: #465263;
  --fdm-color-slate-8: #36404F;
  --fdm-color-slate-9: #272F3B;
  --fdm-color-slate-10: #191E26;
  --fdm-color-grey-1: #FFFFFF;
  --fdm-color-grey-2: #F7F8FA;
  --fdm-color-grey-3: #F0F2F5;
  --fdm-color-grey-4: #E6E8ED;
  --fdm-color-grey-5: #DADEE5;
  --fdm-color-grey-6: #C9CED6;
  --fdm-color-grey-7: #B4B9C2;
  --fdm-color-grey-8: #9EA4AD;
  --fdm-color-grey-9: #878D99;
  --fdm-color-grey-10: #646C7A;
  --fdm-color-grey-11: #49515E;
  --fdm-color-grey-12: #2E3642;
  --fdm-color-grey-13: #151C29;
  --fdm-color-transparent-1: #131d2e;
  --fdm-color-transparent-2: rgba(19, 29, 46, 0.9);
  --fdm-color-transparent-3: rgba(19, 29, 46, 0.78);
  --fdm-color-transparent-4: rgba(19, 29, 46, 0.66);
  --fdm-color-transparent-5: rgba(19, 29, 46, 0.47);
  --fdm-color-transparent-6: rgba(19, 29, 46, 0.37);
  --fdm-color-transparent-7: rgba(19, 29, 46, 0.29);
  --fdm-color-transparent-8: rgba(19, 29, 46, 0.24);
  --fdm-color-transparent-9: rgba(19, 29, 46, 0.19);
  --fdm-color-transparent-10: rgba(19, 29, 46, 0.13);
  --fdm-color-transparent-11: rgba(19, 29, 46, 0.08);
  --fdm-color-transparent-12: rgba(19, 29, 46, 0.05);
  --fdm-color-transparent-13: rgba(19, 29, 46, 0);
  --fdm-color-transparent-white-1: #ffffff;
  --fdm-color-transparent-white-2: rgba(255, 255, 255, 0.9);
  --fdm-color-transparent-white-3: rgba(255, 255, 255, 0.78);
  --fdm-color-transparent-white-4: rgba(255, 255, 255, 0.66);
  --fdm-color-transparent-white-5: rgba(255, 255, 255, 0.47);
  --fdm-color-transparent-white-6: rgba(255, 255, 255, 0.37);
  --fdm-color-transparent-white-7: rgba(255, 255, 255, 0.29);
  --fdm-color-transparent-white-8: rgba(255, 255, 255, 0.24);
  --fdm-color-transparent-white-9: rgba(255, 255, 255, 0.19);
  --fdm-color-transparent-white-10: rgba(255, 255, 255, 0.13);
  --fdm-color-transparent-white-11: rgba(255, 255, 255, 0.07);
  --fdm-color-transparent-white-12: rgba(255, 255, 255, 0.03);
  --fdm-color-transparent-white-13: rgba(255, 255, 255, 0);
  --fdm-color-brand-1: #E9F7F6;
  --fdm-color-brand-2: #D8F2F0;
  --fdm-color-brand-3: #B0E8E3;
  --fdm-color-brand-4: #74DBD4;
  --fdm-color-brand-5: #3CC7BE;
  --fdm-color-brand-6: #03ABA0;
  --fdm-color-brand-7: #05948A;
  --fdm-color-brand-8: #037A72;
  --fdm-color-brand-9: #01615C;
  --fdm-color-brand-10: #004D49;
  --fdm-color-primary: var(--fdm-color-brand-6);
  --fdm-color-primary-active: var(--fdm-color-brand-7);
  --fdm-color-primary-bg: var(--fdm-color-brand-1);
  --fdm-color-primary-bg-deep: var(--fdm-color-brand-2);
  --fdm-color-primary-bg-active: var(--fdm-color-brand-3);
  --fdm-color-bg-text-active: var(--fdm-color-brand-2);
  --fdm-color-primary-disabled: var(--fdm-color-brand-3);
  --fdm-color-info: var(--fdm-color-blue-6);
  --fdm-color-info-bg: var(--fdm-color-blue-1);
  --fdm-color-info-bg-deep: var(--fdm-color-blue-2);
  --fdm-color-info-border: var(--fdm-color-blue-3);
  --fdm-color-success: var(--fdm-color-green-6);
  --fdm-color-success-bg: var(--fdm-color-green-1);
  --fdm-color-success-bg-deep: var(--fdm-color-green-2);
  --fdm-color-success-border: var(--fdm-color-green-3);
  --fdm-color-warning: var(--fdm-color-yellow-6);
  --fdm-color-warning-bg: var(--fdm-color-yellow-1);
  --fdm-color-warning-bg-deep: var(--fdm-color-yellow-2);
  --fdm-color-warning-border: var(--fdm-color-yellow-3);
  --fdm-color-error: var(--fdm-color-red-6);
  --fdm-color-error-active: var(--fdm-color-red-7);
  --fdm-color-error-bg: var(--fdm-color-red-1);
  --fdm-color-error-bg-deep: var(--fdm-color-red-2);
  --fdm-color-error-bg-active: var(--fdm-color-red-3);
  --fdm-color-error-border: var(--fdm-color-red-3);
  --fdm-color-error-bg-text-active: var(--fdm-color-red-2);
  --fdm-color-error-disabled: var(--fdm-color-red-3);
  --fdm-color-white-fixation: #FFFFFF;
  --fdm-color-bg-mask: rgba(0, 0, 0, 0.6);
  --fdm-color-zero: var(--fdm-color-transparent-13);
  --fdm-color-text: var(--fdm-color-transparent-1);
  --fdm-color-text-secondary: var(--fdm-color-transparent-3);
  --fdm-color-text-description: var(--fdm-color-transparent-4);
  --fdm-color-text-placeholder: var(--fdm-color-transparent-5);
  --fdm-color-text-disabled: var(--fdm-color-transparent-6);
  --fdm-color-icon: var(--fdm-color-transparent-4);
  --fdm-color-icon-hover: var(--fdm-color-transparent-3);
  --fdm-color-icon-active: var(--fdm-color-transparent-1);
  --fdm-color-icon-normal: var(--fdm-color-transparent-3);
  --fdm-color-icon-disabled: var(--fdm-color-transparent-7);
  --fdm-color-border-primary: var(--fdm-color-grey-7);
  --fdm-color-border: var(--fdm-color-grey-5);
  --fdm-color-border-secondary: var(--fdm-color-grey-4);
  --fdm-color-border-tertiary: var(--fdm-color-grey-3);
  --fdm-color-split: var(--fdm-color-grey-4);
  --fdm-color-fill: var(--fdm-color-transparent-8);
  --fdm-color-fill-secondary: var(--fdm-color-transparent-9);
  --fdm-color-fill-tertiary: var(--fdm-color-transparent-11);
  --fdm-color-fill-quaternary: var(--fdm-color-transparent-12);
  --fdm-color-bg-container: var(--fdm-color-grey-1);
  --fdm-color-bg-container-disabled: var(--fdm-color-fill-quaternary);
  --fdm-color-bg-elevated: var(--fdm-color-grey-1);
  --fdm-color-bg-container-grey: var(--fdm-color-grey-2);
  --fdm-color-bg-container-grey-secondary: var(--fdm-color-grey-3);
  --fdm-color-bg-container-grey-tertiary: var(--fdm-color-grey-4);
  --fdm-color-bg-container-grey-deep: var(--fdm-color-grey-7);
  --fdm-color-bg-text-normal-active: var(--fdm-color-fill-tertiary);
  --fdm-box-shadow-subtle: 0 0 0.2rem 0 rgba(0, 0, 0, 0.08);
  --fdm-box-shadow: 0 2 0.4rem 0 rgba(0, 0, 0, 0.1);
}
#app {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  background: white;
}
#app [class^="page-"] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 0 1rem 1rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
#app [class^="page-"] .demo-title {
  margin: 0.75rem 0 0.5rem;
  font-weight: bold;
  font-size: 1rem;
}
#app [class^="page-"] .demo-sub-title {
  margin: 0.5rem 0;
  font-weight: bold;
}
#app [class^="page-"] .demo-desc {
  margin-bottom: 0.5rem;
  color: var(--fdm-color-text-secondary);
}
#app [class^="page-"] .demo-container .demo-title {
  font-size: var(--fdm-font-size-lg);
}
.page-home {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.page-home .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 45%;
          flex: 0 0 45%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 50%;
}
.page-home .left .title {
  margin-top: 1rem;
  text-align: center;
}
.page-home .left .title .version {
  margin-top: 0.4rem;
  color: var(--fdm-color-text-secondary);
  font-size: var(--fdm-font-size-sm);
}
.page-home .left .btn-group {
  margin-top: 1rem;
}
.page-home .left .btn-group .x-button {
  cursor: pointer;
}
.page-home .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 55%;
          flex: 0 0 55%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.page-home:not(.is-pc) .left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 100%;
  height: 100%;
}
.page-changelog h1 {
  font-size: 1rem;
}
.page-changelog h2 {
  font-weight: normal;
  font-size: 0.8rem;
}
.page-changelog code {
  padding: 0.2rem;
  background: #E6E8ED;
  border-radius: var(--fdm-border-radius-xs);
}
.page-changelog ul {
  padding-left: 1rem;
  color: var(--fdm-color-text-secondary);
  /* stylelint-disable */
  /* stylelint-enable */
}
.page-changelog ul li {
  margin: 0.2rem 0;
}
.page-changelog ul > li {
  list-style-type: disc;
  word-wrap: break-word;
}
.page-changelog ul > li ul li {
  list-style-type: circle;
}
.page-changelog a {
  color: #03ABA0;
  color: var(--fdm-color-primary, #03ABA0);
}
.page-changelog .changelog {
  position: relative;
  margin-top: 2rem;
  padding-left: 2rem;
}
.page-changelog .changelog h1 {
  position: relative;
}
.page-changelog .changelog h1::before {
  position: absolute;
  top: 0.45rem;
  left: -2rem;
  width: 0.5rem;
  height: 0.5rem;
  background: white;
  border: solid 0.1rem #03ABA0;
  border: solid 0.1rem var(--fdm-color-primary, #03ABA0);
  border-radius: 50%;
  content: '';
}
.page-changelog .changelog::before {
  position: absolute;
  top: 0.5rem;
  bottom: 0;
  left: 0.2rem;
  width: 0.1rem;
  background: #E6E8ED;
  content: '';
}
.page-components {
  padding: 1rem 0 !important;
  background: var(--fdm-color-bg-container-grey-secondary);
}
.page-components .component-list .component-group .group-title {
  padding: 0 0.5rem;
  color: var(--fdm-color-text-secondary);
  line-height: 2rem;
}
.page-components .component-list .component-group .group-item {
  position: relative;
  padding-left: 1rem;
  border-bottom: none;
}
.page-components .component-list .component-group .group-item:not(:last-child)::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 1rem;
  height: 0.05rem;
  background: var(--fdm-color-split);
  content: '';
}
.page-button {
  background: var(--fdm-color-bg-container-grey-secondary);
}
.page-button .x-button {
  margin-bottom: 0.25rem;
}
.page-spin .spin-wrapper {
  position: relative;
  height: 5rem;
  margin-bottom: 1rem;
  border: solid 1px var(--fdm-color-split);
  border-radius: var(--fdm-border-radius-xs);
}
.page-spin .blue-wrapper .spin-wrapper {
  background-color: #9cc8f8;
}
.page-list-view .demo-list-view {
  border: solid 1px var(--fdm-color-split);
}
.page-list-view .demo-custom-item .list-item-prefix {
  margin-right: 0.5rem;
}
.page-list-view .demo-custom-item .list-item-prefix > img {
  width: 100%;
}
.page-list-view .demo-custom-item .list-item-suffix {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.page-list-view .demo-custom-item .list-item-suffix .tip {
  color: var(--fdm-color-text-secondary);
  font-size: var(--fdm-font-size-sm);
}
.page-list-view .demo-custom-item .list-item-suffix .expand-operation {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 1.1rem;
  height: 1.1rem;
  margin-right: 0.6rem;
  background: #fff;
  border: solid 1px var(--fdm-color-split);
  border-radius: var(--fdm-border-radius);
  cursor: pointer;
  -webkit-transition: background-color 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease;
  transition: background-color 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease;
}
.page-list-view .demo-custom-item .list-item-suffix .expand-operation-dots {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: 0.1rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.page-list-view .demo-custom-item .list-item-suffix .expand-operation-dots > span {
  width: 0.1rem;
  height: 0.1rem;
  background-color: var(--fdm-color-text-secondary);
  border-radius: 50%;
}
.page-list-view .demo-custom-item .expand-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 5rem;
  margin-right: 0.2rem;
}
.page-tab-bar .demo-tab-bar {
  border: solid 1px var(--fdm-color-split);
}
.page-tab-bar .demo-tab-bar .custom-active {
  color: #EF5655;
}
.page-nav-bar .nav-bar-demo {
  margin-bottom: 0.6rem;
  background: #fff;
}
.page-nav-bar .nav-bar-right-actions {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: 0.6rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 0.9rem;
}
.page-nav-bar .nav-bar-link,
.page-nav-bar .nav-bar-action-text {
  color: #1677ff;
}
.page-nav-bar .nav-bar-action-text {
  margin-bottom: 0.8rem;
  font-size: 0.6rem;
}
.custom-layout-tab {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.custom-layout-tab .custom-tab-content {
  position: absolute;
  top: 3rem;
  right: 0;
  bottom: 0;
  left: 0;
}
.custom-layout-tab .custom-tab-content .custom-tab-item {
  position: relative;
  height: 100%;
}
.custom-layout-tab .custom-tab-content .custom-tab-item .x-button {
  position: absolute;
  right: 2rem;
  bottom: 2rem;
  left: 2rem;
}
.page-badge .x-badge {
  margin-right: 1rem;
}
.page-badge .x-badge .badge-content {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  background: var(--fdm-color-bg-container-grey-secondary);
  border-radius: var(--fdm-border-radius-xs);
}
.page-skeleton .x-skeleton {
  margin-bottom: 0.8rem;
  border: solid 1px var(--fdm-color-split);
}
.page-tree .custom-key-label {
  margin-left: var(--fdm-gap-xs);
  color: var(--fdm-color-text-secondary);
  font-size: var(--fdm-font-size-sm);
}
.page-menu .x-menu {
  border: solid 1px var(--fdm-color-split);
}
.page-menu .x-menu .custom-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  font-size: var(--fdm-font-size-lg);
}
.page-empty .x-empty {
  padding: 1rem;
  border: solid 1px var(--fdm-color-split);
}
.page-avatar .x-avatar {
  margin: 0.3rem;
}
.page-tag .x-tag {
  margin: 0 0.5rem 0.5rem 0;
}
.page-tag .tag-demo-block,
.page-tag .tag-demo-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.page-tag .tag-demo-column {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: 0.5rem;
}
.page-affix .affix-view {
  height: 20rem;
  overflow: auto;
  border: solid 1px var(--fdm-color-split);
}
.page-tooltip .box {
  padding-bottom: 2rem;
}
.page-tooltip .box .top,
.page-tooltip .box .right,
.page-tooltip .box .bottom,
.page-tooltip .box .left {
  text-align: center;
}
.page-tooltip .box .top.top,
.page-tooltip .box .right.top,
.page-tooltip .box .bottom.top,
.page-tooltip .box .left.top,
.page-tooltip .box .top.bottom,
.page-tooltip .box .right.bottom,
.page-tooltip .box .bottom.bottom,
.page-tooltip .box .left.bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.page-tooltip .box .top.right,
.page-tooltip .box .right.right,
.page-tooltip .box .bottom.right,
.page-tooltip .box .left.right,
.page-tooltip .box .top.left,
.page-tooltip .box .right.left,
.page-tooltip .box .bottom.left,
.page-tooltip .box .left.left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.page-tooltip .box .top.right .x-button,
.page-tooltip .box .right.right .x-button,
.page-tooltip .box .bottom.right .x-button,
.page-tooltip .box .left.right .x-button,
.page-tooltip .box .top.left .x-button,
.page-tooltip .box .right.left .x-button,
.page-tooltip .box .bottom.left .x-button,
.page-tooltip .box .left.left .x-button {
  width: 2rem;
  height: 5rem;
  padding: 0;
}
.page-tooltip .box .x-button {
  width: 5rem;
  margin: 1rem auto;
  border-radius: 0;
}
.page-tooltip .x-button {
  border-radius: 0;
}
.page-picker .x-picker {
  border: solid 1px var(--fdm-color-split);
}
.page-address-picker .x-address-picker {
  border: solid 1px var(--fdm-color-split);
}
.page-datetime-picker .x-datetime-picker {
  border: solid 1px var(--fdm-color-split);
}
.page-table {
  overflow: hidden;
}
.page-table .demo-container .demo-change-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 0.3rem;
}
.page-table .demo-container .demo-change-row .x-tag {
  margin-right: 0.5rem;
}
.page-table .demo-container .demo-desc {
  margin-top: 0.1rem;
}
.page-table .demo-container .demo {
  padding: 1rem 0;
}
.page-table .demo-container .demo .table-wrapper.fit-container {
  height: 15rem;
}
.page-table .demo-container .demo .table-wrapper .low-table td {
  height: 2rem;
}
.page-table .demo-container .demo .table-wrapper .middle-table td {
  height: 4.5rem;
}
.page-table .demo-container .demo .table-wrapper .high-table td {
  height: 6.5rem;
}
.page-table .demo-container .demo .table-wrapper .auto-table tr {
  height: 1rem;
}
.page-table .demo-container .demo .table-wrapper .auto-table td {
  height: auto;
  white-space: normal;
}
.page-table .demo-container .demo .table-wrapper .auto-table td .cell-content {
  white-space: normal;
}
.page-action-sheet .demo-desc {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.page-space .demo-containers {
  margin-top: 2rem;
  border-top: 0.05rem dashed var(--fdm-color-border);
}
.page-space .space-block {
  padding: 1rem;
  background: var(--fdm-color-bg-container-grey-secondary);
}
.page-grid .x-grid-col {
  margin-bottom: 0.8rem;
  padding: 0.8rem 0;
  color: #fff;
  text-align: center;
  border-radius: 0;
}
.page-grid .x-grid-col:not(.gutter-row) {
  background-color: #03ABA0;
  background-color: var(--fdm-color-primary, #03ABA0);
}
.page-grid .x-grid-col:not(.gutter-row):nth-child(2n+1) {
  background: #B0E8E3;
  background: var(--fdm-color-primary-disabled, #B0E8E3);
}
.page-grid .x-grid-col .col-content {
  background: #03ABA0;
  background: var(--fdm-color-primary, #03ABA0);
}
.page-svg-icon .icon-list,
.page-svgIcon .icon-list {
  margin: 1rem 0;
}
.page-svg-icon .icon-list .icon-item,
.page-svgIcon .icon-list .icon-item {
  display: inline-block;
  width: 50%;
  height: 3rem;
  margin: 0.5rem 0;
  text-align: center;
  vertical-align: middle;
}
.page-svg-icon .icon-list .icon-item .x-svgicon,
.page-svgIcon .icon-list .icon-item .x-svgicon {
  margin: 0.2rem 0;
  color: #2B73F0;
  font-size: 1.4rem;
}
::-webkit-scrollbar {
  width: 0.45rem;
  height: 0.45rem;
}
::-webkit-scrollbar-thumb {
  background: #c2c2c2;
  border-radius: 0.3rem;
}
::-webkit-scrollbar-track {
  background: rgba(250, 250, 250, 0.9);
  border-radius: 0.3rem;
}
html {
  font-size: 20px;
}