:root {
  --okd-color-gray-050: #f9f9f9;
  --okd-color-gray-100: #ebebeb;
  --okd-color-gray-200: #dbdbdb;
  --okd-color-gray-300: #bdbdbd;
  --okd-color-gray-400: #929292;
  --okd-color-gray-500: #6e6e6e;
  --okd-color-gray-600: #545454;
  --okd-color-gray-700: #3d3d3d;
  --okd-color-gray-800: #1a1a1a;
  --okd-color-gray-900: #000;
  --okd-color-blue-050: #f5f9ff;
  --okd-color-blue-100: #d1e3ff;
  --okd-color-blue-200: #afcfff;
  --okd-color-blue-300: #8dbbff;
  --okd-color-blue-400: #6ba6ff;
  --okd-color-blue-500: #4992ff;
  --okd-color-blue-600: #277dff;
  --okd-color-blue-700: #0569ff;
  --okd-color-blue-800: #005eea;
  --okd-color-blue-900: #0051ca;
  --okd-color-green-050: #f2fff7;
  --okd-color-green-100: #d2f4de;
  --okd-color-green-200: #a5e9be;
  --okd-color-green-300: #78de9d;
  --okd-color-green-400: #4bd37d;
  --okd-color-green-500: #31bd65;
  --okd-color-green-600: #18a04a;
  --okd-color-green-700: #127837;
  --okd-color-green-800: #0c5025;
  --okd-color-green-900: #0c5025;
  --okd-color-red-050: #fff8f9;
  --okd-color-red-100: #fcdce5;
  --okd-color-red-200: #f9b9ca;
  --okd-color-red-300: #f796b0;
  --okd-color-red-400: #f07596;
  --okd-color-red-500: #f1507b;
  --okd-color-red-600: #c14062;
  --okd-color-red-700: #91304a;
  --okd-color-red-800: #602031;
  --okd-color-red-900: #301019;
  --okd-color-orange-050: #fef9f6;
  --okd-color-orange-100: #fce3d4;
  --okd-color-orange-200: #fbceb4;
  --okd-color-orange-300: #f9b994;
  --okd-color-orange-400: #f7a474;
  --okd-color-orange-500: #f58f54;
  --okd-color-orange-600: #f6813d;
  --okd-color-orange-700: #f16514;
  --okd-color-orange-800: #e96010;
  --okd-color-orange-900: #bf4803;
  --okd-color-yellow-050: #fffcf5;
  --okd-color-yellow-100: #fff2d1;
  --okd-color-yellow-200: #ffe9af;
  --okd-color-yellow-300: #ffdf8d;
  --okd-color-yellow-400: #ffd66b;
  --okd-color-yellow-500: #ffcc49;
  --okd-color-yellow-600: #ffc327;
  --okd-color-yellow-700: #ffb905;
  --okd-color-yellow-800: #eaa900;
  --okd-color-yellow-900: #d29801;
  --okd-color-text-white: #fff;
  --okd-color-text-black: #1f2933;
  --okd-color-background-1: #fff;
  --okd-color-background-2: #f7f7f7;
  --okd-color-transparent: transparent;
  --okd-color-white: #fff;
  --okd-color-black: #000;
  --okd-color-line-muted: #ebebeb;
  --okd-color-line-secondary: #dbdbdb;
  --okd-color-line-amplifed: #bdbdbd;
  --okd-color-text-lighter: #bdbdbd;
  --okd-color-text-light: #929292;
  --okd-color-text-secondary: #3d3d3d;
  --okd-color-text-amplifed: #000;
  --okd-color-background-3: #f2f2f2;
  --okd-color-fq-blue-lv1: #0569ff;
  --okd-color-fq-green-lv1: #19cc5b;
  --okd-color-fq-red-lv1: #f1507b;
  --okd-color-fq-orange-lv1: #f16514;
  --okd-color-fq-blue-lv2: #0569ff;
  --okd-color-background-hover: #ebebeb;
  --okd-color-prefer-red-chart: #f1507b;
  --okd-color-prefer-red-bg: #eb4b6d;
  --okd-color-prefer-green-chart: #19cc5b;
  --okd-color-prefer-green-bg: #31bd65;
  --okd-color-prefer-red-text: #eb4b6d;
  --okd-color-prefer-green-text: #31bd65;
  --okd-color-branded-primary: #bcff2f;
  --okd-color-fq-critical: #eb4b6d;
  --okd-color-fq-warning: #f16514;
  --okd-color-fq-positive: #31bd65;
  --okd-color-fq-neutral: #000;
  --okd-color-fq-accent: #0569ff;
  --okd-color-prefer-neutral-text: #929292;
  --okd-color-prefer-neutral-bg: #929292;
  --okd-color-white-opacity-5: #fff;
  --okd-color-white-opacity-10: hsla(0, 0%, 100%, 0.94);
  --okd-color-white-opacity-20: hsla(0, 0%, 100%, 0.88);
  --okd-color-white-opacity-30: hsla(0, 0%, 100%, 0.78);
  --okd-color-white-opacity-40: hsla(0, 0%, 100%, 0.76);
  --okd-color-white-opacity-50: hsla(0, 0%, 100%, 0.54);
  --okd-color-white-opacity-60: hsla(0, 0%, 100%, 0.36);
  --okd-color-white-opacity-70: hsla(0, 0%, 100%, 0.19);
  --okd-color-white-opacity-80: hsla(0, 0%, 100%, 0.12);
  --okd-color-white-opacity-90: hsla(0, 0%, 100%, 0.06);
  --okd-color-black-opacity-5: #000;
  --okd-color-black-opacity-10: rgba(0, 0, 0, 0.9);
  --okd-color-black-opacity-20: rgba(0, 0, 0, 0.76);
  --okd-color-black-opacity-30: rgba(0, 0, 0, 0.68);
  --okd-color-black-opacity-40: rgba(0, 0, 0, 0.57);
  --okd-color-black-opacity-50: rgba(0, 0, 0, 0.43);
  --okd-color-black-opacity-60: rgba(0, 0, 0, 0.26);
  --okd-color-black-opacity-70: rgba(0, 0, 0, 0.14);
  --okd-color-black-opacity-80: rgba(0, 9, 3, 0.08);
  --okd-color-black-opacity-90: rgba(0, 0, 0, 0.04);
  --okd-color-neutral-5: #fff;
  --okd-color-neutral-10: #fafafa;
  --okd-color-neutral-20: #f3f3f3;
  --okd-color-neutral-30: #e6e6e6;
  --okd-color-neutral-40: #d9d9d9;
  --okd-color-neutral-50: #c7c7c7;
  --okd-color-neutral-60: #b3b3b3;
  --okd-color-neutral-70: #a7a7a7;
  --okd-color-neutral-80: #999;
  --okd-color-neutral-90: #909090;
  --okd-color-neutral-100: grey;
  --okd-color-neutral-110: #757575;
  --okd-color-neutral-120: #666;
  --okd-color-neutral-130: #5b5b5b;
  --okd-color-neutral-140: #4d4d4d;
  --okd-color-neutral-150: #414141;
  --okd-color-neutral-160: #383838;
  --okd-color-neutral-170: #272727;
  --okd-color-neutral-180: #1d1d1d;
  --okd-color-neutral-190: #0e0e0e;
  --okd-color-neutral-200: #000;
  --okd-color-tangerine-5: #ffedcb;
  --okd-color-tangerine-10: #ffd37d;
  --okd-color-tangerine-30: #ffb117;
  --okd-color-tangerine-40: #db8f00;
  --okd-color-tangerine-50: #a06900;
  --okd-color-tangerine-60: #664300;
  --okd-color-lemon-5: #fffdc4;
  --okd-color-lemon-10: #fffa7a;
  --okd-color-lemon-20: #fff500;
  --okd-color-lemon-30: #e5dd00;
  --okd-color-lemon-40: #b2ab00;
  --okd-color-lemon-50: #797400;
  --okd-color-lemon-60: #5c5800;
  --okd-color-tangerine-20: #ffc452;
  --okd-color-neonlime-5: #e6ffb0;
  --okd-color-neonlime-10: #d5ff7d;
  --okd-color-neonlime-20: #bcff2f;
  --okd-color-neonlime-30: #9fe212;
  --okd-color-neonlime-40: #8ec51d;
  --okd-color-neonlime-50: #568000;
  --okd-color-neonlime-60: #3d5c00;
  --okd-color-neonmint-5: #cbffe0;
  --okd-color-neonmint-10: #7dffb1;
  --okd-color-neonmint-20: #24ff7b;
  --okd-color-neonmint-30: #12e366;
  --okd-color-neonmint-40: #00bc4b;
  --okd-color-neonmint-50: #008535;
  --okd-color-neonmint-60: #005c25;
  --okd-color-bluebell-5: #e6eaff;
  --okd-color-bluebell-10: #b8bfff;
  --okd-color-bluebell-20: #8a91ff;
  --okd-color-bluebell-30: #5f62ff;
  --okd-color-bluebell-40: #5043ff;
  --okd-color-bluebell-50: #4c2fff;
  --okd-color-bluebell-60: #1d00d4;
  --okd-color-lavender-5: #f2e8ff;
  --okd-color-lavender-10: #dbbfff;
  --okd-color-lavender-20: #c496ff;
  --okd-color-lavender-30: #ac6cff;
  --okd-color-lavender-40: #9543ff;
  --okd-color-lavender-50: #7e1aff;
  --okd-color-lavender-60: #5600c5;
  --okd-color-orchid-5: #fee7ea;
  --okd-color-orchid-10: #ffc1c9;
  --okd-color-orchid-20: #ffa8b3;
  --okd-color-orchid-30: #ff7888;
  --okd-color-orchid-40: #f5384f;
  --okd-color-orchid-50: #cd2438;
  --okd-color-orchid-60: #9a1b2a;
  --okd-color-semantic-positive-1: #31bd65;
  --okd-color-semantic-negative-1: #eb4b6d;
  --okd-color-transparent-base-black: transparent;
  --okd-color-transparent-base-white: transparent;
  --okd-color-alert-base-info: #f7f7f7;
  --okd-color-alert-base-success: #eaf8f0;
  --okd-color-alert-base-warning: #fef9f6;
  --okd-color-alert-base-error: #fdedf0;
  --okd-color-basil-5: #e9f4d1;
  --okd-color-basil-10: #d2e8a4;
  --okd-color-basil-20: #81be00;
  --okd-color-basil-30: #49a92d;
  --okd-color-basil-40: #2b6d17;
  --okd-color-basil-50: #1a410e;
  --okd-color-basil-60: #1a2600;
  --okd-color-rose-5: #ffdfe9;
  --okd-color-rose-10: #ffc0d3;
  --okd-color-rose-20: #ff5eb6;
  --okd-color-rose-30: #fc46ab;
  --okd-color-rose-40: #a54162;
  --okd-color-rose-50: #532131;
  --okd-color-rose-60: #2a111f;
  --okd-color-neutral-15: #f6f6f6;
  --okd-color-neutral-185: #121212;
  --okd-color-background-base-primary: #fff;
  --okd-color-background-base-secondary: #fafafa;
  --okd-color-background-surface-primary: #f3f3f3;
  --okd-color-background-surface-secondary: #f6f6f6;
  --okd-color-background-surface-pressed: #d9d9d9;
  --okd-color-background-surface-disable: #fafafa;
  --okd-color-background-scrim: rgba(0, 0, 0, 0.43);
  --okd-color-container-primary: #fff;
  --okd-color-container-secondary: #fafafa;
  --okd-color-container-tertiary: #fff;
  --okd-color-container-contrast: #414141;
  --okd-color-container-inverse: #0e0e0e;
  --okd-color-content-primary: #000;
  --okd-color-content-secondary: #383838;
  --okd-color-content-tertiary: #5b5b5b;
  --okd-color-content-contrast: #909090;
  --okd-color-content-disabled: #b3b3b3;
  --okd-color-content-inverse: #fff;
  --okd-color-border-primary: #e6e6e6;
  --okd-color-border-secondary: #b3b3b3;
  --okd-color-border-contrast: #fafafa;
  --okd-color-border-selected: #000;
  --okd-color-semantic-neutral: #000;
  --okd-color-semantic-notice: #ffb117;
  --okd-color-semantic-positive: #31bd65;
  --okd-color-semantic-negative: #eb4b6d;
  --okd-color-semantic-informative: #8a91ff;
  --okd-color-semantic-highlight: #bcff2f;
  --okd-color-dvp-neutral: rgba(0, 0, 0, 0.57);
  --okd-color-dvp-profit: #00bc4b;
  --okd-color-dvp-loss: #f5384f;
  --okd-color-categorical-01: #8a91ff;
  --okd-color-categorical-02: #ffb117;
  --okd-color-categorical-03: #bcff2f;
  --okd-color-categorical-04: #12e366;
  --okd-color-categorical-05: #ff7888;
  --okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --okd-color-transparent-black: transparent;
  --okd-color-transparent-white: transparent;
  --okd-color-alert-info: #f7f7f7;
  --okd-color-alert-success: #eaf8f0;
  --okd-color-alert-warning: #fef9f6;
  --okd-color-alert-error: #fdedf0;
  --okd-color-common-background-2: #f3f3f3;
  --okd-color-data-visualization-category-01: #8a91ff;
  --okd-color-data-visualization-category-02: #ffb117;
  --okd-color-data-visualization-category-03: #bcff2f;
  --okd-color-data-visualization-category-04: #12e366;
  --okd-color-data-visualization-category-05: #ff7888;
  --okd-color-preference-loss: #f5384f;
  --okd-color-preference-profit: #00bc4b;
  --okd-color-preference-neutral: rgba(0, 0, 0, 0.57);
  --okd-color-border-focus: #000;
  --okd-color-background-base-primary_alternative: #fff;
  --okd-color-link-content: #4c2fff;
  --okd-color-link-accent-content-primary: #2b6d17;
  --okd-color-background-surface-contrast: #fff;
  --okd-color-background-surface-brand: #000;
  --okd-color-border-tertiary: #f3f3f3;
  --okd-color-content-brand: #000;
  --okd-color-modal-primary: #fff;
  --okd-color-modal-secondary: #fff;
  --okd-color-modal-tertiary: #fff;
  --okd-color-modal-contrast: #4d4d4d;
  --okd-color-card-primary: #f6f6f6;
  --okd-color-card-secondary: #f6f6f6;
  --okd-color-brand-primary: #2b6d17;
  --okd-color-brand-primary-alternative: #2b6d17;
  --okd-color-brand-secondary: #8ec51d;
  --okd-color-brand-tertiary: #bcff2f;
  --okd-color-brand-content: #e6ffb0;
  --okd-color-brand-content-contrast: #e6ffb0;
  --okd-font-size-base: 16px;
  --okd-font-size-md: 14px;
  --okd-font-size-xs: 12px;
  --okd-line-height-base: 20px;
  --okd-line-height-md: 20px;
  --okd-line-height-xs: 16px;
  --okd-shadow-none: 0 0 0 0 transparent;
  --okd-shadow-xs: 0 0 0 1px #0000000d;
  --okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --okd-border-radius-none: 0;
  --okd-border-radius-sm: 2px;
  --okd-border-radius-md: 4px;
  --okd-border-radius-lg: 6px;
  --okd-border-radius-xl: 8px;
  --okd-border-radius-xxl: 10px;
  --okd-border-radius-xxxl: 12px;
  --okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial,
    Helvetica Neue, Helvetica, sans-serif;
  --okd-text-display-lg-font-size: 56px;
  --okd-text-display-lg-font-weight: 500;
  --okd-text-display-lg-line-height: 1.32;
  --okd-text-display-md-font-size: 40px;
  --okd-text-display-md-font-weight: 500;
  --okd-text-display-md-line-height: 52px;
  --okd-text-display-sm-font-size: 40px;
  --okd-text-display-sm-font-weight: 500;
  --okd-text-display-sm-line-height: 52px;
  --okd-text-heading-lg-font-size: 30px;
  --okd-text-heading-lg-font-weight: 500;
  --okd-text-heading-lg-line-height: 40px;
  --okd-text-heading-md-font-size: 24px;
  --okd-text-heading-md-font-weight: 500;
  --okd-text-heading-md-line-height: 30px;
  --okd-text-heading-sm-font-size: 18px;
  --okd-text-heading-sm-font-weight: 500;
  --okd-text-heading-sm-line-height: 24px;
  --okd-text-heading-xl-font-size: 36px;
  --okd-text-heading-xl-line-height: 1.32;
  --okd-text-heading-xl-font-weight: 600;
  --okd-text-heading-xxl-font-size: 40px;
  --okd-text-heading-xxl-line-height: 1.32;
  --okd-text-heading-xxl-font-weight: 600;
  --okd-text-heading-overline-font-size: 12px;
  --okd-text-heading-overline-line-height: 15px;
  --okd-text-heading-overline-font-weight: 500;
  --okd-text-body-sm-regular-font-size: 14px;
  --okd-text-body-sm-regular-font-weight: 400;
  --okd-text-body-sm-regular-line-height: 21px;
  --okd-text-body-sm-bold-font-size: 14px;
  --okd-text-body-sm-bold-font-weight: 500;
  --okd-text-body-sm-bold-line-height: 21px;
  --okd-text-body-md-regular-font-size: 16px;
  --okd-text-body-md-regular-font-weight: 400;
  --okd-text-body-md-regular-line-height: 24px;
  --okd-text-body-md-bold-font-size: 16px;
  --okd-text-body-md-bold-font-weight: 500;
  --okd-text-body-md-bold-line-height: 24px;
  --okd-text-body-xs-regular-font-size: 12px;
  --okd-text-body-xs-regular-font-weight: 400;
  --okd-text-body-xs-regular-line-height: 18px;
  --okd-text-body-xs-bold-font-size: 12px;
  --okd-text-body-xs-bold-font-weight: 500;
  --okd-text-body-xs-bold-line-height: 18px;
  --okd-font-weight-400: 400;
  --okd-font-weight-500: 500;
  --okd-font-weight-600: 600;
  --okd-font-weight-700: 700;
  --okd-font-weight-800: 800;
  --okd-font-weight-900: 900;
  --okd-font-weight-regular: 400;
  --okd-font-weight-medium: 500;
  --okd-font-weight-bold: 700;
}
.theme-dark {
  --okd-color-gray-050: #000;
  --okd-color-gray-100: #2e2e2e;
  --okd-color-gray-200: #404040;
  --okd-color-gray-300: #6c6c6c;
  --okd-color-gray-400: #909090;
  --okd-color-gray-500: #b0b0b0;
  --okd-color-gray-600: #ccc;
  --okd-color-gray-700: #e3e3e3;
  --okd-color-gray-800: #f0f0f0;
  --okd-color-gray-900: #fafafa;
  --okd-color-blue-050: #051738;
  --okd-color-blue-100: #082356;
  --okd-color-blue-200: #0c3178;
  --okd-color-blue-300: #0f3c94;
  --okd-color-blue-400: #1148b0;
  --okd-color-blue-500: #1453cc;
  --okd-color-blue-600: #175fe8;
  --okd-color-blue-700: #1e6bff;
  --okd-color-blue-800: #3077ff;
  --okd-color-blue-900: #4283ff;
  --okd-color-green-050: #002b1f;
  --okd-color-green-100: #062b12;
  --okd-color-green-200: #0c5625;
  --okd-color-green-300: #138037;
  --okd-color-green-400: #19ab4a;
  --okd-color-green-500: #25a750;
  --okd-color-green-600: #4cde7d;
  --okd-color-green-700: #79e69d;
  --okd-color-green-800: #a5efbe;
  --okd-color-green-900: #d2f7de;
  --okd-color-red-050: #270b12;
  --okd-color-red-100: #300e17;
  --okd-color-red-200: #601d2e;
  --okd-color-red-300: #902b44;
  --okd-color-red-400: #c03a5b;
  --okd-color-red-500: #f04872;
  --okd-color-red-600: #f76489;
  --okd-color-red-700: #f994ae;
  --okd-color-red-800: #f9b6c7;
  --okd-color-red-900: #fff8f9;
  --okd-color-orange-050: #361604;
  --okd-color-orange-100: #532206;
  --okd-color-orange-200: #743008;
  --okd-color-orange-300: #8f3b0a;
  --okd-color-orange-400: #aa460c;
  --okd-color-orange-500: #c5510e;
  --okd-color-orange-600: #e15c0f;
  --okd-color-orange-700: #f76816;
  --okd-color-orange-800: #f87428;
  --okd-color-orange-900: #fa8c4d;
  --okd-color-yellow-050: #2d2104;
  --okd-color-yellow-100: #493603;
  --okd-color-yellow-200: #674b04;
  --okd-color-yellow-300: #7f5d05;
  --okd-color-yellow-400: #966e06;
  --okd-color-yellow-500: #ae8007;
  --okd-color-yellow-600: #c69208;
  --okd-color-yellow-700: #dba20e;
  --okd-color-yellow-800: #dea921;
  --okd-color-yellow-900: #e0b134;
  --okd-color-text-white: #fff;
  --okd-color-text-black: #1f2933;
  --okd-color-background-1: #121212;
  --okd-color-background-2: #1a1a1a;
  --okd-color-transparent: transparent;
  --okd-color-white: #fff;
  --okd-color-black: #000;
  --okd-color-line-muted: #2e2e2e;
  --okd-color-line-amplifed: #6c6c6c;
  --okd-color-line-secondary: #404040;
  --okd-color-text-lighter: #6c6c6c;
  --okd-color-text-light: #909090;
  --okd-color-text-secondary: #e3e3e3;
  --okd-color-text-amplifed: #fafafa;
  --okd-color-background-3: #242424;
  --okd-color-fq-blue-lv1: #3077ff;
  --okd-color-fq-blue-lv2: #1e6bff;
  --okd-color-fq-green-lv1: #1fd65c;
  --okd-color-fq-red-lv1: #f04872;
  --okd-color-fq-orange-lv1: #f76816;
  --okd-color-prefer-red-chart: #f04872;
  --okd-color-prefer-red-bg: #ca3f64;
  --okd-color-prefer-green-chart: #1fd65c;
  --okd-color-prefer-green-bg: #25a750;
  --okd-color-prefer-red-text: #ca3f64;
  --okd-color-prefer-green-text: #25a750;
  --okd-color-branded-primary: #bcff2f;
  --okd-color-fq-critical: #f04872;
  --okd-color-fq-positive: #25a750;
  --okd-color-fq-warning: #f76816;
  --okd-color-fq-accent: #1e6bff;
  --okd-color-fq-neutral: #fafafa;
  --okd-color-prefer-neutral-bg: #909090;
  --okd-color-prefer-neutral-text: #909090;
  --okd-color-white-opacity-5: #fff;
  --okd-color-white-opacity-10: hsla(0, 0%, 100%, 0.94);
  --okd-color-white-opacity-20: hsla(0, 0%, 100%, 0.88);
  --okd-color-white-opacity-30: hsla(0, 0%, 100%, 0.78);
  --okd-color-white-opacity-40: hsla(0, 0%, 100%, 0.76);
  --okd-color-white-opacity-50: hsla(0, 0%, 100%, 0.54);
  --okd-color-white-opacity-60: hsla(0, 0%, 100%, 0.36);
  --okd-color-white-opacity-70: hsla(0, 0%, 100%, 0.19);
  --okd-color-white-opacity-80: hsla(0, 0%, 100%, 0.12);
  --okd-color-white-opacity-90: hsla(0, 0%, 100%, 0.06);
  --okd-color-black-opacity-5: #000;
  --okd-color-black-opacity-10: rgba(0, 0, 0, 0.9);
  --okd-color-black-opacity-20: rgba(0, 0, 0, 0.76);
  --okd-color-black-opacity-30: rgba(0, 0, 0, 0.68);
  --okd-color-black-opacity-40: rgba(0, 0, 0, 0.57);
  --okd-color-black-opacity-50: rgba(0, 0, 0, 0.43);
  --okd-color-black-opacity-60: rgba(0, 0, 0, 0.26);
  --okd-color-black-opacity-70: rgba(0, 0, 0, 0.14);
  --okd-color-black-opacity-80: rgba(0, 9, 3, 0.08);
  --okd-color-black-opacity-90: rgba(0, 0, 0, 0.04);
  --okd-color-neutral-5: #fff;
  --okd-color-neutral-10: #fafafa;
  --okd-color-neutral-20: #f3f3f3;
  --okd-color-neutral-30: #e6e6e6;
  --okd-color-neutral-40: #d9d9d9;
  --okd-color-neutral-50: #c7c7c7;
  --okd-color-neutral-60: #b3b3b3;
  --okd-color-neutral-70: #a7a7a7;
  --okd-color-neutral-80: #999;
  --okd-color-neutral-90: #909090;
  --okd-color-neutral-100: grey;
  --okd-color-neutral-110: #757575;
  --okd-color-neutral-120: #666;
  --okd-color-neutral-130: #5b5b5b;
  --okd-color-neutral-140: #4d4d4d;
  --okd-color-neutral-150: #414141;
  --okd-color-neutral-160: #383838;
  --okd-color-neutral-170: #272727;
  --okd-color-neutral-180: #1d1d1d;
  --okd-color-neutral-190: #0e0e0e;
  --okd-color-neutral-200: #000;
  --okd-color-tangerine-5: #ffedcb;
  --okd-color-tangerine-10: #ffd37d;
  --okd-color-tangerine-30: #ffb117;
  --okd-color-tangerine-40: #db8f00;
  --okd-color-tangerine-50: #a06900;
  --okd-color-tangerine-60: #664300;
  --okd-color-lemon-5: #ffdc4;
  --okd-color-lemon-10: #fffa7a;
  --okd-color-lemon-20: #fff500;
  --okd-color-lemon-30: #e5dd00;
  --okd-color-lemon-40: #b2ab00;
  --okd-color-lemon-50: #797400;
  --okd-color-lemon-60: #5c5800;
  --okd-color-tangerine-20: #ffc452;
  --okd-color-neonlime-5: #e6ffb0;
  --okd-color-neonlime-10: #d5ff7d;
  --okd-color-neonlime-20: #bcff2f;
  --okd-color-neonlime-30: #9fe212;
  --okd-color-neonlime-40: #8ec51d;
  --okd-color-neonlime-50: #568000;
  --okd-color-neonlime-60: #3d5c00;
  --okd-color-neonmint-5: #cbffe0;
  --okd-color-neonmint-10: #7dffb1;
  --okd-color-neonmint-20: #24ff7b;
  --okd-color-neonmint-30: #12e366;
  --okd-color-neonmint-40: #00bc4b;
  --okd-color-neonmint-50: #008535;
  --okd-color-neonmint-60: #005c25;
  --okd-color-bluebell-5: #e6eaff;
  --okd-color-bluebell-10: #b8bfff;
  --okd-color-bluebell-20: #8a91ff;
  --okd-color-bluebell-30: #5f62ff;
  --okd-color-bluebell-40: #5043ff;
  --okd-color-bluebell-50: #4c2fff;
  --okd-color-bluebell-60: #1d00d4;
  --okd-color-lavender-5: #f2e8ff;
  --okd-color-lavender-10: #dbbfff;
  --okd-color-lavender-20: #c496ff;
  --okd-color-lavender-30: #ac6cff;
  --okd-color-lavender-40: #9543ff;
  --okd-color-lavender-50: #7e1aff;
  --okd-color-lavender-60: #5600c5;
  --okd-color-orchid-5: #fee7ea;
  --okd-color-orchid-10: #ffc1c9;
  --okd-color-orchid-20: #ffa8b3;
  --okd-color-orchid-30: #ff7888;
  --okd-color-orchid-40: #f5384f;
  --okd-color-orchid-50: #cd2438;
  --okd-color-orchid-60: #9a1b2a;
  --okd-color-semantic-positive-1: #25a750;
  --okd-color-semantic-negative-1: #ca3f64;
  --okd-color-background-lv1: #121212;
  --okd-color-background-lv2: #1a1a1a;
  --okd-color-transparent-base-black: transparent;
  --okd-color-transparent-base-white: transparent;
  --okd-color-alert-base-info: #2e2e2e;
  --okd-color-alert-base-success: #002b1f;
  --okd-color-alert-base-warning: #361604;
  --okd-color-alert-base-error: #270b12;
  --okd-color-basil-5: #e9f4d1;
  --okd-color-basil-10: #d2e8a4;
  --okd-color-basil-20: #81be00;
  --okd-color-basil-30: #49a92d;
  --okd-color-basil-40: #2b6d17;
  --okd-color-basil-50: #1a410e;
  --okd-color-basil-60: #1a2600;
  --okd-color-rose-5: #ffdfe9;
  --okd-color-rose-10: #ffc0d3;
  --okd-color-rose-20: #ff5eb6;
  --okd-color-rose-30: #fc46ab;
  --okd-color-rose-40: #a54162;
  --okd-color-rose-50: #532131;
  --okd-color-rose-60: #2a111f;
  --okd-color-neutral-15: #f6f6f6;
  --okd-color-neutral-185: #121212;
  --okd-color-background-base-primary: #000;
  --okd-color-background-base-secondary: #121212;
  --okd-color-background-surface-primary: #1d1d1d;
  --okd-color-background-surface-secondary: #121212;
  --okd-color-background-surface-pressed: #383838;
  --okd-color-background-surface-disable: #0e0e0e;
  --okd-color-background-scrim: rgba(0, 0, 0, 0.68);
  --okd-color-container-primary: #272727;
  --okd-color-container-secondary: #272727;
  --okd-color-container-tertiary: #383838;
  --okd-color-container-contrast: #414141;
  --okd-color-container-inverse: #fafafa;
  --okd-color-content-primary: #fff;
  --okd-color-content-secondary: #e6e6e6;
  --okd-color-content-tertiary: #b3b3b3;
  --okd-color-content-contrast: #909090;
  --okd-color-content-disabled: #5b5b5b;
  --okd-color-content-inverse: #000;
  --okd-color-border-primary: #383838;
  --okd-color-border-secondary: #4d4d4d;
  --okd-color-border-contrast: #000;
  --okd-color-border-selected: #fff;
  --okd-color-semantic-neutral: #fff;
  --okd-color-semantic-notice: #ffb117;
  --okd-color-semantic-positive: #25a750;
  --okd-color-semantic-negative: #ca3f64;
  --okd-color-semantic-informative: #8a91ff;
  --okd-color-semantic-highlight: #bcff2f;
  --okd-color-dvp-neutral: hsla(0, 0%, 100%, 0.76);
  --okd-color-dvp-profit: #25a750;
  --okd-color-dvp-loss: #ca3f64;
  --okd-color-categorical-01: #5f62ff;
  --okd-color-categorical-02: #ffb117;
  --okd-color-categorical-03: #bcff2f;
  --okd-color-categorical-04: #00bc4b;
  --okd-color-categorical-05: #f5384f;
  --okd-color-transparent-white: transparent;
  --okd-color-transparent-black: hsla(0, 0%, 100%, 0.02);
  --okd-color-common-transparent: hsla(0, 0%, 100%, 0);
  --okd-color-container-lv2: #1a1a1a;
  --okd-color-alert-info: #2e2e2e;
  --okd-color-alert-success: #002b1f;
  --okd-color-alert-warning: #361604;
  --okd-color-alert-error: #270b12;
  --okd-color-common-background-2: #383838;
  --okd-color-data-visualization-category-01: #5f62ff;
  --okd-color-data-visualization-category-02: #ffb117;
  --okd-color-data-visualization-category-03: #bcff2f;
  --okd-color-data-visualization-category-04: #00bc4b;
  --okd-color-data-visualization-category-05: #f5384f;
  --okd-color-preference-loss: #ca3f64;
  --okd-color-preference-profit: #25a750;
  --okd-color-preference-neutral: hsla(0, 0%, 100%, 0.76);
  --okd-color-border-focus: #fff;
  --okd-color-background-base-primary_alternative: #000;
  --okd-color-link-content: #8a91ff;
  --okd-color-link-accent-content-primary: #bcff2f;
  --okd-color-background-surface-contrast: #272727;
  --okd-color-background-surface-brand: #bcff2f;
  --okd-color-border-tertiary: #0e0e0e;
  --okd-color-content-brand: #bcff2f;
  --okd-color-modal-primary: #0e0e0e;
  --okd-color-modal-secondary: #272727;
  --okd-color-modal-tertiary: #383838;
  --okd-color-modal-contrast: #4d4d4d;
  --okd-color-card-primary: #0e0e0e;
  --okd-color-card-secondary: #121212;
  --okd-color-brand-primary: #121212;
  --okd-color-brand-primary-alternative: #bcff2f;
  --okd-color-brand-secondary: #272727;
  --okd-color-brand-tertiary: #383838;
  --okd-color-brand-content: #e6ffb0;
  --okd-color-brand-content-contrast: #000;
  --okd-font-size-base: 16px;
  --okd-font-size-md: 14px;
  --okd-font-size-xs: 12px;
  --okd-line-height-base: 20px;
  --okd-line-height-md: 20px;
  --okd-line-height-xs: 16px;
  --okd-shadow-none: 0 0 0 0 transparent;
  --okd-shadow-xs: 0 0 0 1px #0000000d;
  --okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --okd-border-radius-none: 0;
  --okd-border-radius-sm: 2px;
  --okd-border-radius-md: 4px;
  --okd-border-radius-lg: 6px;
  --okd-border-radius-xl: 8px;
  --okd-border-radius-xxl: 10px;
  --okd-border-radius-xxxl: 12px;
  --okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial,
    Helvetica Neue, Helvetica, sans-serif;
  --okd-text-display-lg-font-size: 56px;
  --okd-text-display-lg-font-weight: 500;
  --okd-text-display-lg-line-height: 1.32;
  --okd-text-display-md-font-size: 40px;
  --okd-text-display-md-font-weight: 500;
  --okd-text-display-md-line-height: 52px;
  --okd-text-display-sm-font-size: 40px;
  --okd-text-display-sm-font-weight: 500;
  --okd-text-display-sm-line-height: 52px;
  --okd-text-heading-lg-font-size: 30px;
  --okd-text-heading-lg-font-weight: 500;
  --okd-text-heading-lg-line-height: 40px;
  --okd-text-heading-md-font-size: 24px;
  --okd-text-heading-md-font-weight: 500;
  --okd-text-heading-md-line-height: 30px;
  --okd-text-heading-sm-font-size: 18px;
  --okd-text-heading-sm-font-weight: 500;
  --okd-text-heading-sm-line-height: 24px;
  --okd-text-heading-xl-font-size: 36px;
  --okd-text-heading-xl-line-height: 1.32;
  --okd-text-heading-xl-font-weight: 600;
  --okd-text-heading-xxl-font-size: 40px;
  --okd-text-heading-xxl-line-height: 1.32;
  --okd-text-heading-xxl-font-weight: 600;
  --okd-text-heading-overline-font-size: 12px;
  --okd-text-heading-overline-line-height: 15px;
  --okd-text-heading-overline-font-weight: 500;
  --okd-text-body-sm-regular-font-size: 14px;
  --okd-text-body-sm-regular-font-weight: 400;
  --okd-text-body-sm-regular-line-height: 21px;
  --okd-text-body-sm-bold-font-size: 14px;
  --okd-text-body-sm-bold-font-weight: 500;
  --okd-text-body-sm-bold-line-height: 21px;
  --okd-text-body-md-regular-font-size: 16px;
  --okd-text-body-md-regular-font-weight: 400;
  --okd-text-body-md-regular-line-height: 24px;
  --okd-text-body-md-bold-font-size: 16px;
  --okd-text-body-md-bold-font-weight: 500;
  --okd-text-body-md-bold-line-height: 24px;
  --okd-text-body-xs-regular-font-size: 12px;
  --okd-text-body-xs-regular-font-weight: 400;
  --okd-text-body-xs-regular-line-height: 18px;
  --okd-text-body-xs-bold-font-size: 12px;
  --okd-text-body-xs-bold-font-weight: 500;
  --okd-text-body-xs-bold-line-height: 18px;
  --okd-font-weight-400: 400;
  --okd-font-weight-500: 500;
  --okd-font-weight-600: 600;
  --okd-font-weight-700: 700;
  --okd-font-weight-800: 800;
  --okd-font-weight-900: 900;
  --okd-font-weight-regular: 400;
  --okd-font-weight-medium: 500;
  --okd-font-weight-bold: 700;
}
:root {
  --okd-button-primary-normal-default-background: var(--okd-color-blue-700);
  --okd-button-primary-normal-hover-background: var(--okd-color-blue-500);
  --okd-button-primary-normal-active-background: var(--okd-color-blue-800);
  --okd-button-primary-normal-focus-background: var(--okd-color-blue-700);
  --okd-button-primary-normal-disabled-background: var(--okd-color-gray-100);
  --okd-button-primary-normal-default-border-color: var(--okd-color-blue-700);
  --okd-button-primary-normal-hover-border-color: var(--okd-color-blue-500);
  --okd-button-primary-normal-active-border-color: var(--okd-color-blue-800);
  --okd-button-primary-normal-focus-border-color: var(--okd-color-blue-700);
  --okd-button-primary-normal-disabled-border-color: var(--okd-color-gray-100);
  --okd-button-primary-normal-default-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-hover-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-active-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-focus-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-disabled-font-color: var(--okd-color-gray-300);
  --okd-button-primary-normal-default-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-hover-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-active-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-focus-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-primary-normal-default-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-hover-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-active-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-focus-shadow: var(--okd-shadow-sm),
    0px 0px 0px 3px rgba(175, 207, 255, 0.45);
  --okd-button-primary-normal-disabled-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-loader-track-color: var(--okd-color-blue-500);
  --okd-button-primary-normal-loader-mark-color: var(--okd-color-white);
  --okd-button-primary-red-default-background: var(--okd-color-red-700);
  --okd-button-primary-red-hover-background: var(--okd-color-red-500);
  --okd-button-primary-red-active-background: var(--okd-color-red-800);
  --okd-button-primary-red-focus-background: var(--okd-color-red-700);
  --okd-button-primary-red-disabled-background: var(--okd-color-gray-100);
  --okd-button-primary-red-default-border-color: var(--okd-color-red-700);
  --okd-button-primary-red-hover-border-color: var(--okd-color-red-500);
  --okd-button-primary-red-active-border-color: var(--okd-color-red-800);
  --okd-button-primary-red-focus-border-color: var(--okd-color-red-800);
  --okd-button-primary-red-disabled-border-color: var(--okd-color-gray-100);
  --okd-button-primary-red-default-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-hover-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-active-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-focus-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-disabled-font-color: var(--okd-color-gray-300);
  --okd-button-primary-red-default-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-hover-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-active-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-focus-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-primary-red-default-shadow: var(--okd-shadow-sm);
  --okd-button-primary-red-hover-shadow: var(--okd-shadow-none);
  --okd-button-primary-red-active-shadow: var(--okd-shadow-none);
  --okd-button-primary-red-focus-shadow: var(--okd-shadow-sm),
    0px 0px 0px 3px rgba(247, 150, 176, 0.45);
  --okd-button-primary-red-disabled-shadow: var(--okd-shadow-none);
  --okd-button-primary-red-loader-track-color: var(--okd-color-red-500);
  --okd-button-primary-red-loader-mark-color: var(--okd-color-white);
  --okd-button-primary-green-default-background: var(--okd-color-green-700);
  --okd-button-primary-green-hover-background: var(--okd-color-green-500);
  --okd-button-primary-green-active-background: var(--okd-color-green-800);
  --okd-button-primary-green-focus-background: var(--okd-color-green-700);
  --okd-button-primary-green-disabled-background: var(--okd-color-gray-100);
  --okd-button-primary-green-default-border-color: var(--okd-color-green-700);
  --okd-button-primary-green-hover-border-color: var(--okd-color-green-500);
  --okd-button-primary-green-active-border-color: var(--okd-color-green-800);
  --okd-button-primary-green-focus-border-color: var(--okd-color-green-700);
  --okd-button-primary-green-disabled-border-color: var(--okd-color-gray-100);
  --okd-button-primary-green-default-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-hover-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-active-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-focus-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-disabled-font-color: var(--okd-color-gray-300);
  --okd-button-primary-green-default-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-hover-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-active-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-focus-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-primary-green-default-shadow: var(--okd-shadow-sm);
  --okd-button-primary-green-hover-shadow: var(--okd-shadow-none);
  --okd-button-primary-green-active-shadow: var(--okd-shadow-none);
  --okd-button-primary-green-focus-shadow: var(--okd-shadow-sm),
    0px 0px 0px 3px rgba(120, 222, 157, 0.45);
  --okd-button-primary-green-disabled-shadow: var(--okd-shadow-none);
  --okd-button-primary-green-loader-track-color: var(--okd-color-green-500);
  --okd-button-primary-green-loader-mark-color: var(--okd-color-white);
  --okd-button-secondary-normal-default-background: var(--okd-color-blue-100);
  --okd-button-secondary-normal-hover-background: var(--okd-color-blue-050);
  --okd-button-secondary-normal-active-background: var(--okd-color-blue-200);
  --okd-button-secondary-normal-focus-background: var(--okd-color-blue-100);
  --okd-button-secondary-normal-disabled-background: var(--okd-color-gray-100);
  --okd-button-secondary-normal-default-border-color: var(--okd-color-blue-100);
  --okd-button-secondary-normal-hover-border-color: var(--okd-color-blue-050);
  --okd-button-secondary-normal-active-border-color: var(--okd-color-blue-200);
  --okd-button-secondary-normal-focus-border-color: var(--okd-color-blue-100);
  --okd-button-secondary-normal-disabled-border-color: var(
    --okd-color-gray-100
  );
  --okd-button-secondary-normal-default-font-color: var(--okd-color-blue-800);
  --okd-button-secondary-normal-hover-font-color: var(--okd-color-blue-800);
  --okd-button-secondary-normal-active-font-color: var(--okd-color-blue-800);
  --okd-button-secondary-normal-focus-font-color: var(--okd-color-blue-800);
  --okd-button-secondary-normal-disabled-font-color: var(--okd-color-gray-300);
  --okd-button-secondary-normal-default-icon-color: var(--okd-color-blue-700);
  --okd-button-secondary-normal-hover-icon-color: var(--okd-color-blue-700);
  --okd-button-secondary-normal-active-icon-color: var(--okd-color-blue-700);
  --okd-button-secondary-normal-focus-icon-color: var(--okd-color-blue-700);
  --okd-button-secondary-normal-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-secondary-normal-default-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-hover-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-active-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px
    rgba(175, 207, 255, 0.45);
  --okd-button-secondary-normal-disabled-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-loader-track-color: var(--okd-color-blue-050);
  --okd-button-secondary-normal-loader-mark-color: var(--okd-color-blue-700);
  --okd-button-secondary-grey-default-background: var(--okd-color-gray-100);
  --okd-button-secondary-grey-hover-background: var(--okd-color-gray-050);
  --okd-button-secondary-grey-active-background: var(--okd-color-gray-200);
  --okd-button-secondary-grey-focus-background: var(--okd-color-gray-100);
  --okd-button-secondary-grey-disabled-background: var(--okd-color-gray-050);
  --okd-button-secondary-grey-default-border-color: var(--okd-color-gray-100);
  --okd-button-secondary-grey-hover-border-color: var(--okd-color-gray-050);
  --okd-button-secondary-grey-active-border-color: var(--okd-color-gray-200);
  --okd-button-secondary-grey-focus-border-color: var(--okd-color-gray-100);
  --okd-button-secondary-grey-disabled-border-color: var(--okd-color-gray-050);
  --okd-button-secondary-grey-default-font-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-hover-font-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-active-font-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-focus-font-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-disabled-font-color: var(--okd-color-gray-300);
  --okd-button-secondary-grey-default-icon-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-hover-icon-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-active-icon-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-focus-icon-color: var(--okd-color-gray-700);
  --okd-button-secondary-grey-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-secondary-grey-default-shadow: var(--okd-shadow-sm);
  --okd-button-secondary-grey-hover-shadow: var(--okd-shadow-none);
  --okd-button-secondary-grey-active-shadow: var(--okd-shadow-none);
  --okd-button-secondary-grey-focus-shadow: var(--okd-shadow-sm),
    0px 0px 0px 3px var(--okd-color-gray-200);
  --okd-button-secondary-grey-disabled-shadow: var(--okd-shadow-none);
  --okd-button-secondary-grey-loader-track-color: var(--okd-color-gray-200);
  --okd-button-secondary-grey-loader-mark-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-default-background: #fff;
  --okd-button-basic-normal-hover-background: #fff;
  --okd-button-basic-normal-active-background: var(--okd-color-gray-050);
  --okd-button-basic-normal-focus-background: #fff;
  --okd-button-basic-normal-disabled-background: #fff;
  --okd-button-basic-normal-default-border-color: var(--okd-color-gray-200);
  --okd-button-basic-normal-hover-border-color: var(--okd-color-gray-200);
  --okd-button-basic-normal-active-border-color: var(--okd-color-gray-200);
  --okd-button-basic-normal-focus-border-color: var(--okd-color-blue-300);
  --okd-button-basic-normal-disabled-border-color: var(--okd-color-gray-200);
  --okd-button-basic-normal-default-font-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-hover-font-color: var(--okd-color-gray-400);
  --okd-button-basic-normal-active-font-color: var(--okd-color-gray-900);
  --okd-button-basic-normal-focus-font-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-disabled-font-color: var(--okd-color-gray-300);
  --okd-button-basic-normal-default-icon-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-hover-icon-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-active-icon-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-focus-icon-color: var(--okd-color-gray-700);
  --okd-button-basic-normal-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-basic-normal-default-shadow: var(--okd-shadow-sm);
  --okd-button-basic-normal-hover-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-active-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px
    rgba(175, 207, 255, 0.45);
  --okd-button-basic-normal-disabled-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-loader-track-color: var(--okd-color-blue-100);
  --okd-button-basic-normal-loader-mark-color: var(--okd-color-blue-700);
  --okd-button-plain-normal-default-background: var(--okd-color-transparent);
  --okd-button-plain-normal-hover-background: var(--okd-color-blue-050);
  --okd-button-plain-normal-active-background: var(--okd-color-blue-050);
  --okd-button-plain-normal-focus-background: var(--okd-color-blue-050);
  --okd-button-plain-normal-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-normal-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-default-font-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-hover-font-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-active-font-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-focus-font-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-disabled-font-color: rgba(0, 94, 234, 0.45);
  --okd-button-plain-normal-default-icon-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-hover-icon-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-active-icon-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-focus-icon-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-disabled-icon-color: rgba(0, 94, 234, 0.45);
  --okd-button-plain-normal-default-shadow: none;
  --okd-button-plain-normal-hover-shadow: none;
  --okd-button-plain-normal-active-shadow: none;
  --okd-button-plain-normal-focus-shadow: none;
  --okd-button-plain-normal-disabled-shadow: none;
  --okd-button-plain-red-default-background: var(--okd-color-transparent);
  --okd-button-plain-red-hover-background: var(--okd-color-red-050);
  --okd-button-plain-red-active-background: var(--okd-color-red-050);
  --okd-button-plain-red-focus-background: var(--okd-color-red-050);
  --okd-button-plain-red-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-red-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-default-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-hover-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-active-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-focus-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-disabled-font-color: rgba(96, 32, 49, 0.45);
  --okd-button-plain-red-default-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-hover-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-active-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-focus-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-disabled-icon-color: rgba(96, 32, 49, 0.45);
  --okd-button-plain-red-default-shadow: none;
  --okd-button-plain-red-hover-shadow: none;
  --okd-button-plain-red-active-shadow: none;
  --okd-button-plain-red-focus-shadow: none;
  --okd-button-plain-red-disabled-shadow: none;
  --okd-button-plain-green-default-background: var(--okd-color-transparent);
  --okd-button-plain-green-hover-background: var(--okd-color-green-050);
  --okd-button-plain-green-active-background: var(--okd-color-green-050);
  --okd-button-plain-green-focus-background: var(--okd-color-green-050);
  --okd-button-plain-green-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-green-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-default-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-hover-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-active-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-focus-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-disabled-font-color: rgba(12, 80, 37, 0.45);
  --okd-button-plain-green-default-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-hover-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-active-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-focus-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-disabled-icon-color: rgba(12, 80, 37, 0.45);
  --okd-button-plain-green-default-shadow: none;
  --okd-button-plain-green-hover-shadow: none;
  --okd-button-plain-green-active-shadow: none;
  --okd-button-plain-green-focus-shadow: none;
  --okd-button-plain-green-disabled-shadow: none;
  --okd-button-plain-orange-default-background: var(--okd-color-transparent);
  --okd-button-plain-orange-hover-background: var(--okd-color-orange-050);
  --okd-button-plain-orange-active-background: var(--okd-color-orange-050);
  --okd-button-plain-orange-focus-background: var(--okd-color-orange-050);
  --okd-button-plain-orange-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-orange-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-default-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-hover-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-active-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-focus-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-disabled-font-color: rgba(233, 96, 16, 0.45);
  --okd-button-plain-orange-default-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-hover-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-active-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-focus-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-disabled-icon-color: rgba(233, 96, 16, 0.45);
  --okd-button-plain-orange-default-shadow: none;
  --okd-button-plain-orange-hover-shadow: none;
  --okd-button-plain-orange-active-shadow: none;
  --okd-button-plain-orange-focus-shadow: none;
  --okd-button-plain-orange-disabled-shadow: none;
  --okd-button-plain-yellow-default-background: var(--okd-color-transparent);
  --okd-button-plain-yellow-hover-background: var(--okd-color-yellow-050);
  --okd-button-plain-yellow-active-background: var(--okd-color-yellow-050);
  --okd-button-plain-yellow-focus-background: var(--okd-color-yellow-050);
  --okd-button-plain-yellow-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-yellow-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-default-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-hover-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-active-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-focus-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-disabled-font-color: rgba(234, 169, 0, 0.45);
  --okd-button-plain-yellow-default-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-hover-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-active-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-focus-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-disabled-icon-color: rgba(234, 169, 0, 0.45);
  --okd-button-plain-yellow-default-shadow: none;
  --okd-button-plain-yellow-hover-shadow: none;
  --okd-button-plain-yellow-active-shadow: none;
  --okd-button-plain-yellow-focus-shadow: none;
  --okd-button-plain-yellow-disabled-shadow: none;
  --okd-button-xxs-font-size: var(--okd-font-size-xs);
  --okd-button-xs-font-size: var(--okd-font-size-xs);
  --okd-button-sm-font-size: var(--okd-font-size-md);
  --okd-button-md-font-size: var(--okd-font-size-md);
  --okd-button-lg-font-size: var(--okd-font-size-base);
  --okd-button-xl-font-size: 18px;
  --okd-button-xxs-icon-size: 14px;
  --okd-button-xs-icon-size: 14px;
  --okd-button-sm-icon-size: 18px;
  --okd-button-md-icon-size: 18px;
  --okd-button-lg-icon-size: 18px;
  --okd-button-xl-icon-size: 18px;
  --okd-button-xxs-icon-margin: 6px;
  --okd-button-xs-icon-margin: 6px;
  --okd-button-sm-icon-margin: 6px;
  --okd-button-md-icon-margin: 6px;
  --okd-button-lg-icon-margin: 8px;
  --okd-button-xl-icon-margin: 8px;
  --okd-button-xxs-line-height: var(--okd-line-height-xs);
  --okd-button-xs-line-height: var(--okd-line-height-xs);
  --okd-button-sm-line-height: var(--okd-line-height-md);
  --okd-button-md-line-height: var(--okd-line-height-md);
  --okd-button-lg-line-height: var(--okd-line-height-base);
  --okd-button-xl-line-height: var(--okd-line-height-base);
  --okd-button-xxs-padding-horizontal: 8px;
  --okd-button-xxs-padding-vertical: 3px;
  --okd-button-xs-padding-horizontal: 8px;
  --okd-button-xs-padding-vertical: 5px;
  --okd-button-sm-padding-horizontal: 12px;
  --okd-button-sm-padding-vertical: 7px;
  --okd-button-md-padding-horizontal: 16px;
  --okd-button-md-padding-vertical: 9px;
  --okd-button-lg-padding-horizontal: 24px;
  --okd-button-lg-padding-vertical: 13px;
  --okd-button-xl-padding-horizontal: 24px;
  --okd-button-xl-padding-vertical: 17px;
  --okd-button-xxs-min-width: 63px;
  --okd-button-xs-min-width: 63px;
  --okd-button-sm-min-width: 81px;
  --okd-button-md-min-width: 90px;
  --okd-button-lg-min-width: 108px;
  --okd-button-xl-min-width: 126px;
  --okd-button-xxs-border-radius: 60px;
  --okd-button-xs-border-radius: 60px;
  --okd-button-sm-border-radius: 60px;
  --okd-button-md-border-radius: 60px;
  --okd-button-lg-border-radius: 60px;
  --okd-button-xl-border-radius: 60px;
  --okd-button-xxs-border-size: 1px;
  --okd-button-xs-border-size: 1px;
  --okd-button-sm-border-size: 1px;
  --okd-button-md-border-size: 1px;
  --okd-button-lg-border-size: 1px;
  --okd-button-xl-border-size: 1px;
  --okd-button-xl-loader-size: 18px;
  --okd-button-lg-loader-size: 14px;
  --okd-button-md-loader-size: 14px;
  --okd-button-sm-loader-size: 14px;
  --okd-button-xs-loader-size: 14px;
  --okd-button-xxs-loader-size: 14px;
  --okd-button-xl-loader-text-margin-left: 8px;
  --okd-button-lg-loader-text-margin-left: 8px;
  --okd-button-md-loader-text-margin-left: 6px;
  --okd-button-sm-loader-text-margin-left: 6px;
  --okd-button-xs-loader-text-margin-left: 6px;
  --okd-button-xxs-loader-text-margin-left: 6px;
  --okd-button-s-font-size: 14px;
  --okd-button-s-icon-size: 18px;
  --okd-button-s-icon-margin: 6px;
  --okd-button-s-line-height: 16px;
  --okd-button-s-padding-horizontal: 12px;
  --okd-button-s-padding-vertical: 7px;
  --okd-button-s-min-width: 72px;
  --okd-button-s-border-radius: 60px;
  --okd-button-s-loader-size: 14px;
  --okd-button-s-loader-text-margin-left: 6px;
  --okd-button-xl-font-weight: 600;
  --okd-button-lg-font-weight: 500;
  --okd-button-md-font-weight: 500;
  --okd-button-sm-font-weight: 500;
  --okd-button-rect-xxs-border-radius: 4px;
  --okd-button-rect-xs-border-radius: 4px;
  --okd-button-rect-sm-border-radius: 4px;
  --okd-button-rect-s-border-radius: 4px;
  --okd-button-rect-md-border-radius: 4px;
  --okd-button-rect-lg-border-radius: 8px;
  --okd-button-rect-xl-border-radius: 8px;
  --okd-button-fill-highlight-default-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-highlight-hover-background: var(
    --okd-color-container-contrast
  );
  --okd-button-fill-highlight-active-background: var(
    --okd-color-container-contrast
  );
  --okd-button-fill-highlight-focus-background: var(--okd-color-gray-900);
  --okd-button-fill-highlight-disabled-background: var(--okd-color-neutral-20);
  --okd-button-fill-highlight-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-focus-border-color: var(--okd-color-gray-900);
  --okd-button-fill-highlight-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-default-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-hover-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-active-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-highlight-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-highlight-default-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-hover-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-active-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-highlight-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-highlight-default-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #fff,
    0px 0px 0px 3.5px #1d202359;
  --okd-button-fill-highlight-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-loader-track-color: hsla(0, 0%, 98%, 0.26);
  --okd-button-fill-highlight-loader-mark-color: var(
    --okd-color-border-contrast
  );
  --okd-button-fill-highlight-border-size: 0px;
  --okd-button-fill-primary-default-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-hover-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-active-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-focus-background: var(--okd-color-blue-900);
  --okd-button-fill-primary-disabled-background: var(--okd-color-neutral-20);
  --okd-button-fill-primary-default-border-color: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-primary-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-primary-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-primary-disabled-border-color: var(
    --okd-color-background-surface-primary
  );
  --okd-button-fill-primary-default-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-primary-hover-font-color: hsla(0, 0%, 100%, 0.6);
  --okd-button-fill-primary-active-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-primary-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-primary-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-primary-default-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-primary-hover-icon-color: hsla(0, 0%, 100%, 0.6);
  --okd-button-fill-primary-active-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-primary-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-primary-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-primary-default-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #fff,
    0px 0px 0px 3.5px #2d60e040;
  --okd-button-fill-primary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-loader-track-color: hsla(0, 0%, 98%, 0.26);
  --okd-button-fill-primary-loader-mark-color: var(--okd-color-border-contrast);
  --okd-button-fill-primary-border-size: 0px;
  --okd-button-fill-secondary-default-background: var(--okd-color-blue-050);
  --okd-button-fill-secondary-hover-background: var(--okd-color-blue-100);
  --okd-button-fill-secondary-active-background: var(--okd-color-blue-200);
  --okd-button-fill-secondary-focus-background: var(--okd-color-blue-100);
  --okd-button-fill-secondary-disabled-background: var(--okd-color-blue-050);
  --okd-button-fill-secondary-default-border-color: var(--okd-color-blue-050);
  --okd-button-fill-secondary-hover-border-color: var(--okd-color-blue-100);
  --okd-button-fill-secondary-active-border-color: var(--okd-color-blue-200);
  --okd-button-fill-secondary-focus-border-color: var(--okd-color-blue-100);
  --okd-button-fill-secondary-disabled-border-color: var(--okd-color-blue-050);
  --okd-button-fill-secondary-default-font-color: var(--okd-color-blue-800);
  --okd-button-fill-secondary-hover-font-color: var(--okd-color-blue-800);
  --okd-button-fill-secondary-active-font-color: var(--okd-color-blue-800);
  --okd-button-fill-secondary-focus-font-color: var(--okd-color-blue-800);
  --okd-button-fill-secondary-disabled-font-color: var(--okd-color-blue-300);
  --okd-button-fill-secondary-default-icon-color: var(--okd-color-blue-700);
  --okd-button-fill-secondary-hover-icon-color: var(--okd-color-blue-700);
  --okd-button-fill-secondary-active-icon-color: var(--okd-color-blue-700);
  --okd-button-fill-secondary-focus-icon-color: var(--okd-color-blue-700);
  --okd-button-fill-secondary-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-fill-secondary-default-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #fff,
    0px 0px 0px 3.5px #2d60e040;
  --okd-button-fill-secondary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-loader-track-color: var(--okd-color-blue-050);
  --okd-button-fill-secondary-loader-mark-color: var(--okd-color-blue-700);
  --okd-button-fill-secondary-border-size: 0px;
  --okd-button-fill-tertiary-border-size: 0px;
  --okd-button-fill-tertiary-default-background: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-hover-background: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-focus-background: hsla(0, 0%, 100%, 0.8);
  --okd-button-fill-tertiary-active-background: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-disabled-background: hsla(0, 0%, 100%, 0.06);
  --okd-button-fill-tertiary-disabled-font-color: hsla(0, 0%, 100%, 0.36);
  --okd-button-fill-tertiary-disabled-border-color: hsla(0, 0%, 100%, 0.06);
  --okd-button-fill-tertiary-default-border-color: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-hover-border-color: hsla(0, 0%, 100%, 0);
  --okd-button-fill-tertiary-focus-border-color: rgba(48, 16, 25, 0);
  --okd-button-fill-tertiary-active-border-color: hsla(0, 0%, 100%, 0);
  --okd-button-fill-tertiary-loader-track-color: var(
    --okd-color-border-primary
  );
  --okd-button-fill-tertiary-loader-mark-color: var(
    --okd-color-border-selected
  );
  --okd-button-fill-tertiary-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-fill-tertiary-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-fill-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-hover-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-hover-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-focus-font-color: var(--okd-color-text-amplifed);
  --okd-button-fill-tertiary-focus-icon-color: var(--okd-color-text-amplifed);
  --okd-button-fill-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-active-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-active-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-disabled-icon-color: hsla(0, 0%, 100%, 0.36);
  --okd-button-fill-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-border-size: 0px;
  --okd-button-fill-quaternary-default-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-quaternary-default-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-default-border-color: transparent;
  --okd-button-fill-quaternary-hover-background: hsla(0, 0%, 100%, 0.25);
  --okd-button-fill-quaternary-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-quaternary-hover-font-color: hsla(0, 0%, 100%, 0.25);
  --okd-button-fill-quaternary-focus-background: hsla(0, 0%, 100%, 0.25);
  --okd-button-fill-quaternary-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-quaternary-focus-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-active-background: hsla(0, 0%, 100%, 0.25);
  --okd-button-fill-quaternary-active-border-color: transparent;
  --okd-button-fill-quaternary-active-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-disabled-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-quaternary-disabled-font-color: hsla(0, 0%, 100%, 0.25);
  --okd-button-fill-quaternary-disabled-border-color: var(
    --okd-color-transparent
  );
  --okd-button-fill-quaternary-loader-track-color: hsla(0, 0%, 100%, 0.25);
  --okd-button-fill-quaternary-loader-mark-color: var(--okd-color-white);
  --okd-button-fill-quaternary-default-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-hover-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-focus-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-active-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-disabled-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-red-default-background: var(--okd-color-semantic-negative);
  --okd-button-fill-red-hover-background: rgba(235, 75, 109, 0.8);
  --okd-button-fill-red-active-background: rgba(235, 75, 109, 0.8);
  --okd-button-fill-red-focus-background: var(--okd-color-red-800);
  --okd-button-fill-red-disabled-background: var(--okd-color-neutral-20);
  --okd-button-fill-red-default-border-color: var(
    --okd-color-semantic-negative
  );
  --okd-button-fill-red-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-red-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-red-focus-border-color: var(--okd-color-red-800);
  --okd-button-fill-red-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-red-default-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-red-hover-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-red-active-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-red-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-red-disabled-font-color: var(--okd-color-content-disabled);
  --okd-button-fill-red-default-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-red-hover-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-red-active-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-red-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-red-disabled-icon-color: var(--okd-color-content-disabled);
  --okd-button-fill-red-default-shadow: 0 0 0 0 transparent;
  --okd-button-fill-red-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-red-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #fff,
    0px 0px 0px 3.5px #e35e5e66;
  --okd-button-fill-red-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-red-loader-track-color: hsla(0, 0%, 98%, 0.26);
  --okd-button-fill-red-loader-mark-color: var(--okd-color-border-contrast);
  --okd-button-fill-red-border-size: 0px;
  --okd-button-fill-green-default-background: var(
    --okd-color-semantic-positive
  );
  --okd-button-fill-green-hover-background: rgba(49, 189, 101, 0.8);
  --okd-button-fill-green-active-background: rgba(49, 189, 101, 0.8);
  --okd-button-fill-green-focus-background: var(--okd-color-green-900);
  --okd-button-fill-green-disabled-background: var(--okd-color-neutral-20);
  --okd-button-fill-green-default-border-color: var(
    --okd-color-semantic-positive
  );
  --okd-button-fill-green-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-green-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-green-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-green-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-green-default-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-green-hover-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-green-active-font-color: var(--okd-color-content-inverse);
  --okd-button-fill-green-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-green-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-green-default-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-green-hover-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-green-active-icon-color: var(--okd-color-content-inverse);
  --okd-button-fill-green-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-green-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-green-default-shadow: 0 0 0 0 transparent;
  --okd-button-fill-green-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-green-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-green-focus-shadow: 0px 0px 0px 1px #fff,
    0px 0px 0px 3.5px #2ead6573;
  --okd-button-fill-green-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-green-loader-track-color: hsla(0, 0%, 98%, 0.26);
  --okd-button-fill-green-loader-mark-color: var(--okd-color-border-contrast);
  --okd-button-fill-green-border-size: 0px;
  --okd-button-fill-grey-default-background: var(
    --okd-color-background-surface-primary
  );
  --okd-button-fill-grey-hover-background: var(--okd-color-neutral-30);
  --okd-button-fill-grey-active-background: var(--okd-color-neutral-20);
  --okd-button-fill-grey-focus-background: hsla(0, 0%, 86%, 0.5);
  --okd-button-fill-grey-disabled-background: var(--okd-color-neutral-20);
  --okd-button-fill-grey-default-border-color: var(
    --okd-color-background-surface-primary
  );
  --okd-button-fill-grey-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-grey-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-grey-focus-border-color: var(--okd-color-gray-200);
  --okd-button-fill-grey-disabled-border-color: var(
    --okd-color-background-surface-disable
  );
  --okd-button-fill-grey-default-font-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-hover-font-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-active-font-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-focus-font-color: var(--okd-color-gray-700);
  --okd-button-fill-grey-disabled-font-color: var(--okd-color-content-disabled);
  --okd-button-fill-grey-default-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-hover-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-active-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-focus-icon-color: var(--okd-color-gray-700);
  --okd-button-fill-grey-disabled-icon-color: var(--okd-color-content-disabled);
  --okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
  --okd-button-fill-grey-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-grey-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-grey-focus-shadow: 0px 0px 0px 0px #00000000,
    0px 0px 0px 3.5px #d8dce673;
  --okd-button-fill-grey-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-grey-loader-track-color: var(--okd-color-border-primary);
  --okd-button-fill-grey-loader-mark-color: var(--okd-color-border-selected);
  --okd-button-fill-grey-border-size: 0px;
  --okd-button-outline-highlight-border-size: 1.5px;
  --okd-button-outline-highlight-hover-background: var(
    --okd-color-container-inverse
  );
  --okd-button-outline-highlight-hover-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-focus-background: var(--okd-color-gray-900);
  --okd-button-outline-highlight-focus-border-color: var(--okd-color-gray-900);
  --okd-button-outline-highlight-focus-font-color: var(--okd-color-white);
  --okd-button-outline-highlight-active-background: var(
    --okd-color-container-inverse
  );
  --okd-button-outline-highlight-active-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-highlight-disabled-border-color: var(
    --okd-color-border-primary
  );
  --okd-button-outline-highlight-hover-border-color: var(
    --okd-color-border-selected
  );
  --okd-button-outline-highlight-active-border-color: var(
    --okd-color-border-selected
  );
  --okd-button-outline-highlight-loader-track-color: var(--okd-color-gray-200);
  --okd-button-outline-highlight-loader-mark-color: var(--okd-color-gray-900);
  --okd-button-outline-highlight-default-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-highlight-default-border-color: var(
    --okd-color-border-selected
  );
  --okd-button-outline-highlight-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-highlight-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-highlight-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-hover-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-focus-icon-color: var(--okd-color-white);
  --okd-button-outline-highlight-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-active-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-disabled-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-highlight-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-highlight-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-primary-default-background: hsla(0, 0%, 100%, 0);
  --okd-button-outline-primary-hover-background: var(--okd-color-neutral-20);
  --okd-button-outline-primary-active-background: var(--okd-color-neutral-20);
  --okd-button-outline-primary-focus-background: var(--okd-color-background-2);
  --okd-button-outline-primary-disabled-background: var(--okd-color-neutral-20);
  --okd-button-outline-primary-default-border-color: var(
    --okd-color-border-secondary
  );
  --okd-button-outline-primary-hover-border-color: var(
    --okd-color-border-secondary
  );
  --okd-button-outline-primary-active-border-color: var(
    --okd-color-border-secondary
  );
  --okd-button-outline-primary-focus-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-primary-disabled-border-color: var(
    --okd-color-border-primary
  );
  --okd-button-outline-primary-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-hover-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-active-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-focus-font-color: var(--okd-color-text-amplifed);
  --okd-button-outline-primary-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-primary-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-hover-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-active-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-focus-icon-color: var(--okd-color-text-amplifed);
  --okd-button-outline-primary-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-primary-default-shadow: 0 0 0 0 transparent;
  --okd-button-outline-primary-hover-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-active-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-focus-shadow: 0px 0px 0px 3px #00000014;
  --okd-button-outline-primary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-loader-track-color: var(--okd-color-gray-200);
  --okd-button-outline-primary-loader-mark-color: var(--okd-color-gray-900);
  --okd-button-outline-primary-border-size: 1px;
  --okd-button-outline-secondary-default-background: var(--okd-color-white);
  --okd-button-outline-secondary-hover-background: var(
    --okd-color-background-2
  );
  --okd-button-outline-secondary-active-background: var(--okd-color-gray-050);
  --okd-button-outline-secondary-focus-background: var(
    --okd-color-background-2
  );
  --okd-button-outline-secondary-disabled-background: var(--okd-color-white);
  --okd-button-outline-secondary-default-border-color: var(
    --okd-color-gray-200
  );
  --okd-button-outline-secondary-hover-border-color: var(--okd-color-gray-200);
  --okd-button-outline-secondary-active-border-color: var(--okd-color-gray-200);
  --okd-button-outline-secondary-focus-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-secondary-disabled-border-color: #ebebeb;
  --okd-button-outline-secondary-default-font-color: var(--okd-color-gray-900);
  --okd-button-outline-secondary-hover-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-active-font-color: var(--okd-color-gray-900);
  --okd-button-outline-secondary-focus-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-disabled-font-color: #bdbdbd;
  --okd-button-outline-secondary-default-icon-color: var(--okd-color-gray-900);
  --okd-button-outline-secondary-hover-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-active-icon-color: var(--okd-color-gray-900);
  --okd-button-outline-secondary-focus-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-disabled-icon-color: var(--okd-color-gray-300);
  --okd-button-outline-secondary-default-shadow: 0 0 0 0 transparent;
  --okd-button-outline-secondary-hover-shadow: var(--okd-shadow-none);
  --okd-button-outline-secondary-active-shadow: var(--okd-shadow-none);
  --okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3px #00000014;
  --okd-button-outline-secondary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-outline-secondary-loader-track-color: rgba(0, 0, 0, 0.25);
  --okd-button-outline-secondary-loader-mark-color: var(--okd-color-black);
  --okd-button-outline-secondary-border-size: 1px;
  --okd-button-text-primary-default-background: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-hover-background: var(--okd-color-neutral-20);
  --okd-button-text-primary-active-background: var(--okd-color-neutral-20);
  --okd-button-text-primary-focus-background: var(--okd-color-blue-050);
  --okd-button-text-primary-disabled-background: undefined;
  --okd-button-text-primary-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-primary-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-text-primary-hover-font-color: var(--okd-color-content-primary);
  --okd-button-text-primary-active-font-color: var(--okd-color-content-primary);
  --okd-button-text-primary-focus-font-color: var(--okd-color-blue-800);
  --okd-button-text-primary-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-text-primary-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-text-primary-hover-icon-color: var(--okd-color-content-primary);
  --okd-button-text-primary-active-icon-color: var(--okd-color-content-primary);
  --okd-button-text-primary-focus-icon-color: var(--okd-color-blue-800);
  --okd-button-text-primary-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-text-primary-default-shadow: none;
  --okd-button-text-primary-hover-shadow: none;
  --okd-button-text-primary-active-shadow: none;
  --okd-button-text-primary-focus-shadow: none;
  --okd-button-text-primary-disabled-shadow: none;
  --okd-button-text-primary-border-size: 1px;
  --okd-button-outline-tertiary-border-size: 1.5px;
  --okd-button-outline-tertiary-default-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-tertiary-default-border-color: var(
    --okd-color-border-contrast
  );
  --okd-button-outline-tertiary-default-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-tertiary-default-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-hover-background: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-hover-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-hover-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-hover-border-color: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-focus-icon-color: var(--okd-color-black);
  --okd-button-outline-tertiary-focus-font-color: var(--okd-color-black);
  --okd-button-outline-tertiary-focus-border-color: var(--okd-color-white);
  --okd-button-outline-tertiary-focus-background: var(--okd-color-white);
  --okd-button-outline-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-active-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-active-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-active-border-color: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-active-background: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-disabled-icon-color: hsla(0, 0%, 100%, 0.36);
  --okd-button-outline-tertiary-disabled-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-tertiary-disabled-border-color: hsla(0, 0%, 98%, 0.12);
  --okd-button-outline-tertiary-disabled-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-tertiary-loader-mark-color: var(
    --okd-color-border-contrast
  );
  --okd-button-outline-tertiary-loader-track-color: hsla(0, 0%, 98%, 0.3);
  --okd-button-text-secondary-default-background: var(--okd-color-transparent);
  --okd-button-text-secondary-hover-background: var(--okd-color-blue-050);
  --okd-button-text-secondary-active-background: var(--okd-color-blue-050);
  --okd-button-text-secondary-focus-background: var(--okd-color-blue-050);
  --okd-button-text-secondary-disabled-background: var(--okd-color-gray-050);
  --okd-button-text-secondary-default-border-color: var(
    --okd-color-transparent
  );
  --okd-button-text-secondary-hover-border-color: var(--okd-color-transparent);
  --okd-button-text-secondary-active-border-color: var(--okd-color-transparent);
  --okd-button-text-secondary-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-secondary-disabled-border-color: var(
    --okd-color-transparent
  );
  --okd-button-text-secondary-default-font-color: var(--okd-color-fq-blue-lv1);
  --okd-button-text-secondary-hover-font-color: var(--okd-color-blue-800);
  --okd-button-text-secondary-active-font-color: var(--okd-color-blue-800);
  --okd-button-text-secondary-focus-font-color: var(--okd-color-blue-800);
  --okd-button-text-secondary-disabled-font-color: rgba(0, 94, 234, 0.45);
  --okd-button-text-secondary-default-icon-color: var(--okd-color-fq-blue-lv1);
  --okd-button-text-secondary-hover-icon-color: var(--okd-color-blue-800);
  --okd-button-text-secondary-active-icon-color: var(--okd-color-blue-800);
  --okd-button-text-secondary-focus-icon-color: var(--okd-color-blue-800);
  --okd-button-text-secondary-disabled-icon-color: rgba(0, 94, 234, 0.45);
  --okd-button-text-secondary-default-shadow: none;
  --okd-button-text-secondary-hover-shadow: none;
  --okd-button-text-secondary-active-shadow: none;
  --okd-button-text-secondary-focus-shadow: none;
  --okd-button-text-secondary-disabled-shadow: none;
  --okd-button-text-secondary-border-size: 1px;
  --okd-button-text-red-default-background: var(--okd-color-common-transparent);
  --okd-button-text-red-hover-background: rgba(235, 75, 109, 0.05);
  --okd-button-text-red-active-background: rgba(235, 75, 109, 0.05);
  --okd-button-text-red-focus-background: var(--okd-color-red-050);
  --okd-button-text-red-disabled-background: hsla(0, 0%, 98%, 0);
  --okd-button-text-red-default-border-color: var(--okd-color-transparent);
  --okd-button-text-red-hover-border-color: var(--okd-color-common-transparent);
  --okd-button-text-red-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-red-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-red-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-red-default-font-color: var(--okd-color-prefer-red-text);
  --okd-button-text-red-hover-font-color: var(--okd-color-semantic-negative);
  --okd-button-text-red-active-font-color: var(--okd-color-semantic-negative);
  --okd-button-text-red-focus-font-color: var(--okd-color-red-800);
  --okd-button-text-red-disabled-font-color: rgba(235, 75, 109, 0.45);
  --okd-button-text-red-default-icon-color: var(--okd-color-red-800);
  --okd-button-text-red-hover-icon-color: var(--okd-color-prefer-red-text);
  --okd-button-text-red-active-icon-color: var(--okd-color-semantic-negative);
  --okd-button-text-red-focus-icon-color: var(--okd-color-red-800);
  --okd-button-text-red-disabled-icon-color: rgba(235, 75, 109, 0.45);
  --okd-button-text-red-default-shadow: none;
  --okd-button-text-red-hover-shadow: none;
  --okd-button-text-red-active-shadow: none;
  --okd-button-text-red-focus-shadow: none;
  --okd-button-text-red-disabled-shadow: none;
  --okd-button-text-red-border-size: 1px;
  --okd-button-text-green-default-background: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-hover-background: rgba(49, 189, 101, 0.05);
  --okd-button-text-green-active-background: rgba(49, 189, 101, 0.05);
  --okd-button-text-green-focus-background: var(--okd-color-green-050);
  --okd-button-text-green-disabled-background: hsla(0, 0%, 98%, 0);
  --okd-button-text-green-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-green-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-default-font-color: var(
    --okd-color-semantic-positive
  );
  --okd-button-text-green-hover-font-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-active-font-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-focus-font-color: var(--okd-color-green-800);
  --okd-button-text-green-disabled-font-color: rgba(49, 189, 101, 0.45);
  --okd-button-text-green-default-icon-color: var(
    --okd-color-semantic-positive
  );
  --okd-button-text-green-hover-icon-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-active-icon-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-focus-icon-color: var(--okd-color-green-800);
  --okd-button-text-green-disabled-icon-color: rgba(49, 189, 101, 0.45);
  --okd-button-text-green-default-shadow: none;
  --okd-button-text-green-hover-shadow: none;
  --okd-button-text-green-active-shadow: none;
  --okd-button-text-green-focus-shadow: none;
  --okd-button-text-green-disabled-shadow: none;
  --okd-button-text-green-border-size: 1px;
  --okd-button-text-yellow-default-background: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-hover-background: rgba(255, 177, 23, 0.05);
  --okd-button-text-yellow-active-background: rgba(255, 177, 23, 0.05);
  --okd-button-text-yellow-focus-background: var(--okd-color-yellow-050);
  --okd-button-text-yellow-disabled-background: hsla(0, 0%, 98%, 0);
  --okd-button-text-yellow-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-yellow-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-default-font-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-hover-font-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-active-font-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-focus-font-color: var(--okd-color-yellow-800);
  --okd-button-text-yellow-disabled-font-color: rgba(255, 177, 23, 0.45);
  --okd-button-text-yellow-default-icon-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-hover-icon-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-active-icon-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-focus-icon-color: var(--okd-color-yellow-800);
  --okd-button-text-yellow-disabled-icon-color: rgba(255, 177, 23, 0.45);
  --okd-button-text-yellow-default-shadow: none;
  --okd-button-text-yellow-hover-shadow: none;
  --okd-button-text-yellow-active-shadow: none;
  --okd-button-text-yellow-focus-shadow: none;
  --okd-button-text-yellow-disabled-shadow: none;
  --okd-button-text-yellow-border-size: 1px;
  --okd-button-text-orange-default-background: var(--okd-color-transparent);
  --okd-button-text-orange-hover-background: var(--okd-color-orange-050);
  --okd-button-text-orange-active-background: var(--okd-color-orange-050);
  --okd-button-text-orange-focus-background: var(--okd-color-orange-050);
  --okd-button-text-orange-disabled-background: var(--okd-color-gray-050);
  --okd-button-text-orange-default-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-hover-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-active-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-disabled-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-default-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-hover-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-active-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-focus-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-disabled-font-color: rgba(233, 96, 16, 0.45);
  --okd-button-text-orange-default-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-hover-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-active-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-focus-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-disabled-icon-color: rgba(233, 96, 16, 0.45);
  --okd-button-text-orange-default-shadow: none;
  --okd-button-text-orange-hover-shadow: none;
  --okd-button-text-orange-active-shadow: none;
  --okd-button-text-orange-focus-shadow: none;
  --okd-button-text-orange-disabled-shadow: none;
  --okd-button-text-orange-border-size: 1px;
}
.theme-dark {
  --okd-button-primary-normal-default-background: var(--okd-color-blue-900);
  --okd-button-primary-normal-hover-background: var(--okd-color-blue-700);
  --okd-button-primary-normal-active-background: var(--okd-color-blue-300);
  --okd-button-primary-normal-focus-background: var(--okd-color-blue-900);
  --okd-button-primary-normal-disabled-background: var(--okd-color-gray-400);
  --okd-button-primary-normal-default-border-color: var(--okd-color-blue-900);
  --okd-button-primary-normal-hover-border-color: var(--okd-color-blue-700);
  --okd-button-primary-normal-active-border-color: var(--okd-color-blue-300);
  --okd-button-primary-normal-focus-border-color: var(--okd-color-blue-900);
  --okd-button-primary-normal-disabled-border-color: var(--okd-color-gray-400);
  --okd-button-primary-normal-default-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-hover-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-active-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-focus-font-color: var(--okd-color-text-white);
  --okd-button-primary-normal-disabled-font-color: var(--okd-color-gray-500);
  --okd-button-primary-normal-default-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-hover-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-active-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-focus-icon-color: var(--okd-color-text-white);
  --okd-button-primary-normal-disabled-icon-color: var(--okd-color-gray-500);
  --okd-button-primary-normal-default-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-hover-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-active-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-focus-shadow: 0px 0px 0px 3px
    var(--okd-color-blue-200);
  --okd-button-primary-normal-disabled-shadow: var(--okd-shadow-none);
  --okd-button-primary-normal-loader-track-color: hsla(0, 0%, 100%, 0.24);
  --okd-button-primary-normal-loader-mark-color: var(--okd-color-white);
  --okd-button-primary-red-default-background: var(--okd-color-red-900);
  --okd-button-primary-red-hover-background: var(--okd-color-red-700);
  --okd-button-primary-red-active-background: var(--okd-color-red-300);
  --okd-button-primary-red-focus-background: var(--okd-color-red-900);
  --okd-button-primary-red-disabled-background: var(--okd-color-gray-400);
  --okd-button-primary-red-default-border-color: var(--okd-color-red-900);
  --okd-button-primary-red-hover-border-color: var(--okd-color-red-700);
  --okd-button-primary-red-active-border-color: var(--okd-color-red-300);
  --okd-button-primary-red-focus-border-color: var(--okd-color-red-900);
  --okd-button-primary-red-disabled-border-color: var(--okd-color-gray-400);
  --okd-button-primary-red-default-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-hover-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-active-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-focus-font-color: var(--okd-color-text-white);
  --okd-button-primary-red-disabled-font-color: var(--okd-color-gray-500);
  --okd-button-primary-red-default-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-hover-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-active-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-focus-icon-color: var(--okd-color-text-white);
  --okd-button-primary-red-disabled-icon-color: var(--okd-color-gray-500);
  --okd-button-primary-red-default-shadow: var(--okd-shadow-sm);
  --okd-button-primary-red-hover-shadow: var(--okd-shadow-none);
  --okd-button-primary-red-active-shadow: var(--okd-shadow-none);
  --okd-button-primary-red-focus-shadow: 0px 0px 0px 3px
    var(--okd-color-red-200);
  --okd-button-primary-red-disabled-shadow: var(--okd-shadow-none);
  --okd-button-primary-red-loader-track-color: hsla(0, 0%, 100%, 0.24);
  --okd-button-primary-red-loader-mark-color: var(--okd-color-white);
  --okd-button-primary-green-default-background: var(--okd-color-green-900);
  --okd-button-primary-green-hover-background: var(--okd-color-green-700);
  --okd-button-primary-green-active-background: var(--okd-color-green-300);
  --okd-button-primary-green-focus-background: var(--okd-color-green-900);
  --okd-button-primary-green-disabled-background: var(--okd-color-gray-400);
  --okd-button-primary-green-default-border-color: var(--okd-color-green-900);
  --okd-button-primary-green-hover-border-color: var(--okd-color-green-700);
  --okd-button-primary-green-active-border-color: var(--okd-color-green-300);
  --okd-button-primary-green-focus-border-color: var(--okd-color-green-900);
  --okd-button-primary-green-disabled-border-color: var(--okd-color-gray-400);
  --okd-button-primary-green-default-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-hover-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-active-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-focus-font-color: var(--okd-color-text-white);
  --okd-button-primary-green-disabled-font-color: var(--okd-color-gray-500);
  --okd-button-primary-green-default-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-hover-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-active-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-focus-icon-color: var(--okd-color-text-white);
  --okd-button-primary-green-disabled-icon-color: var(--okd-color-gray-500);
  --okd-button-primary-green-default-shadow: var(--okd-shadow-sm);
  --okd-button-primary-green-hover-shadow: var(--okd-shadow-none);
  --okd-button-primary-green-active-shadow: var(--okd-shadow-none);
  --okd-button-primary-green-focus-shadow: 0px 0px 0px 3px
    var(--okd-color-green-200);
  --okd-button-primary-green-disabled-shadow: var(--okd-shadow-none);
  --okd-button-primary-green-loader-track-color: hsla(0, 0%, 100%, 0.24);
  --okd-button-primary-green-loader-mark-color: var(--okd-color-white);
  --okd-button-secondary-normal-default-background: var(--okd-color-gray-400);
  --okd-button-secondary-normal-hover-background: var(--okd-color-gray-500);
  --okd-button-secondary-normal-active-background: var(--okd-color-gray-300);
  --okd-button-secondary-normal-focus-background: var(--okd-color-gray-400);
  --okd-button-secondary-normal-disabled-background: var(--okd-color-gray-400);
  --okd-button-secondary-normal-default-border-color: var(--okd-color-gray-400);
  --okd-button-secondary-normal-hover-border-color: var(--okd-color-gray-500);
  --okd-button-secondary-normal-active-border-color: var(--okd-color-gray-300);
  --okd-button-secondary-normal-focus-border-color: var(--okd-color-gray-400);
  --okd-button-secondary-normal-disabled-border-color: var(
    --okd-color-gray-400
  );
  --okd-button-secondary-normal-default-font-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-hover-font-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-active-font-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-focus-font-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-disabled-font-color: var(--okd-color-gray-500);
  --okd-button-secondary-normal-default-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-hover-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-active-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-focus-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-normal-disabled-icon-color: var(--okd-color-gray-500);
  --okd-button-secondary-normal-default-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-hover-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-active-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px
    var(--okd-color-gray-200);
  --okd-button-secondary-normal-disabled-shadow: var(--okd-shadow-none);
  --okd-button-secondary-normal-loader-track-color: var(--okd-color-gray-600);
  --okd-button-secondary-normal-loader-mark-color: var(--okd-color-white);
  --okd-button-secondary-grey-default-background: var(--okd-color-gray-400);
  --okd-button-secondary-grey-hover-background: var(--okd-color-gray-500);
  --okd-button-secondary-grey-active-background: var(--okd-color-gray-300);
  --okd-button-secondary-grey-focus-background: var(--okd-color-gray-400);
  --okd-button-secondary-grey-disabled-background: var(--okd-color-gray-200);
  --okd-button-secondary-grey-default-border-color: var(--okd-color-gray-400);
  --okd-button-secondary-grey-hover-border-color: var(--okd-color-gray-500);
  --okd-button-secondary-grey-active-border-color: var(--okd-color-gray-300);
  --okd-button-secondary-grey-focus-border-color: var(--okd-color-gray-400);
  --okd-button-secondary-grey-disabled-border-color: var(--okd-color-gray-200);
  --okd-button-secondary-grey-default-font-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-hover-font-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-active-font-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-focus-font-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-disabled-font-color: var(--okd-color-gray-600);
  --okd-button-secondary-grey-default-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-hover-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-active-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-focus-icon-color: var(--okd-color-text-white);
  --okd-button-secondary-grey-disabled-icon-color: var(--okd-color-gray-600);
  --okd-button-secondary-grey-default-shadow: var(--okd-shadow-sm);
  --okd-button-secondary-grey-hover-shadow: var(--okd-shadow-none);
  --okd-button-secondary-grey-active-shadow: var(--okd-shadow-none);
  --okd-button-secondary-grey-focus-shadow: 0px 0px 0px 3px
    var(--okd-color-gray-200);
  --okd-button-secondary-grey-disabled-shadow: var(--okd-shadow-none);
  --okd-button-secondary-grey-loader-track-color: var(--okd-color-gray-600);
  --okd-button-secondary-grey-loader-mark-color: var(--okd-color-gray-900);
  --okd-button-basic-normal-default-background: var(--okd-color-transparent);
  --okd-button-basic-normal-hover-background: var(--okd-color-gray-200);
  --okd-button-basic-normal-active-background: var(--okd-color-gray-300);
  --okd-button-basic-normal-focus-background: var(--okd-color-transparent);
  --okd-button-basic-normal-disabled-background: var(--okd-color-transparent);
  --okd-button-basic-normal-default-border-color: var(--okd-color-gray-500);
  --okd-button-basic-normal-hover-border-color: var(--okd-color-gray-500);
  --okd-button-basic-normal-active-border-color: var(--okd-color-gray-500);
  --okd-button-basic-normal-focus-border-color: var(--okd-color-gray-500);
  --okd-button-basic-normal-disabled-border-color: var(--okd-color-gray-400);
  --okd-button-basic-normal-default-font-color: var(--okd-color-text-white);
  --okd-button-basic-normal-hover-font-color: var(--okd-color-text-white);
  --okd-button-basic-normal-active-font-color: var(--okd-color-text-white);
  --okd-button-basic-normal-focus-font-color: var(--okd-color-text-white);
  --okd-button-basic-normal-disabled-font-color: var(--okd-color-gray-500);
  --okd-button-basic-normal-default-icon-color: var(--okd-color-text-white);
  --okd-button-basic-normal-hover-icon-color: var(--okd-color-text-white);
  --okd-button-basic-normal-active-icon-color: var(--okd-color-text-white);
  --okd-button-basic-normal-focus-icon-color: var(--okd-color-text-white);
  --okd-button-basic-normal-disabled-icon-color: var(--okd-color-gray-500);
  --okd-button-basic-normal-default-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-hover-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-active-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px
    var(--okd-color-gray-300);
  --okd-button-basic-normal-disabled-shadow: var(--okd-shadow-none);
  --okd-button-basic-normal-loader-track-color: var(--okd-color-gray-400);
  --okd-button-basic-normal-loader-mark-color: #fff;
  --okd-button-plain-normal-default-background: var(--okd-color-transparent);
  --okd-button-plain-normal-hover-background: var(--okd-color-blue-050);
  --okd-button-plain-normal-active-background: var(--okd-color-blue-050);
  --okd-button-plain-normal-focus-background: var(--okd-color-blue-050);
  --okd-button-plain-normal-disabled-background: var(--okd-color-transparent);
  --okd-button-plain-normal-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-normal-default-font-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-hover-font-color: var(--okd-color-blue-900);
  --okd-button-plain-normal-active-font-color: var(--okd-color-blue-900);
  --okd-button-plain-normal-focus-font-color: var(--okd-color-blue-900);
  --okd-button-plain-normal-disabled-font-color: var(--okd-color-gray-600);
  --okd-button-plain-normal-default-icon-color: var(--okd-color-blue-800);
  --okd-button-plain-normal-hover-icon-color: var(--okd-color-blue-900);
  --okd-button-plain-normal-active-icon-color: var(--okd-color-blue-900);
  --okd-button-plain-normal-focus-icon-color: var(--okd-color-blue-900);
  --okd-button-plain-normal-disabled-icon-color: var(--okd-color-gray-600);
  --okd-button-plain-normal-default-shadow: none;
  --okd-button-plain-normal-hover-shadow: none;
  --okd-button-plain-normal-active-shadow: none;
  --okd-button-plain-normal-focus-shadow: none;
  --okd-button-plain-normal-disabled-shadow: none;
  --okd-button-plain-red-default-background: var(--okd-color-transparent);
  --okd-button-plain-red-hover-background: var(--okd-color-red-050);
  --okd-button-plain-red-active-background: var(--okd-color-red-050);
  --okd-button-plain-red-focus-background: var(--okd-color-red-050);
  --okd-button-plain-red-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-red-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-red-default-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-hover-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-active-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-focus-font-color: var(--okd-color-red-800);
  --okd-button-plain-red-disabled-font-color: rgba(249, 182, 199, 0.45);
  --okd-button-plain-red-default-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-hover-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-active-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-focus-icon-color: var(--okd-color-red-800);
  --okd-button-plain-red-disabled-icon-color: rgba(249, 182, 199, 0.45);
  --okd-button-plain-red-default-shadow: none;
  --okd-button-plain-red-hover-shadow: none;
  --okd-button-plain-red-active-shadow: none;
  --okd-button-plain-red-focus-shadow: none;
  --okd-button-plain-red-disabled-shadow: none;
  --okd-button-plain-green-default-background: var(--okd-color-transparent);
  --okd-button-plain-green-hover-background: var(--okd-color-green-050);
  --okd-button-plain-green-active-background: var(--okd-color-green-050);
  --okd-button-plain-green-focus-background: var(--okd-color-green-050);
  --okd-button-plain-green-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-green-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-green-default-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-hover-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-active-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-focus-font-color: var(--okd-color-green-800);
  --okd-button-plain-green-disabled-font-color: rgba(165, 239, 190, 0.45);
  --okd-button-plain-green-default-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-hover-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-active-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-focus-icon-color: var(--okd-color-green-800);
  --okd-button-plain-green-disabled-icon-color: rgba(165, 239, 190, 0.45);
  --okd-button-plain-green-default-shadow: none;
  --okd-button-plain-green-hover-shadow: none;
  --okd-button-plain-green-active-shadow: none;
  --okd-button-plain-green-focus-shadow: none;
  --okd-button-plain-green-disabled-shadow: none;
  --okd-button-plain-orange-default-background: var(--okd-color-transparent);
  --okd-button-plain-orange-hover-background: var(--okd-color-orange-050);
  --okd-button-plain-orange-active-background: var(--okd-color-orange-050);
  --okd-button-plain-orange-focus-background: var(--okd-color-orange-050);
  --okd-button-plain-orange-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-orange-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-orange-default-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-hover-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-active-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-focus-font-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-disabled-font-color: rgba(248, 116, 40, 0.45);
  --okd-button-plain-orange-default-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-hover-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-active-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-focus-icon-color: var(--okd-color-orange-800);
  --okd-button-plain-orange-disabled-icon-color: rgba(248, 116, 40, 0.45);
  --okd-button-plain-orange-default-shadow: none;
  --okd-button-plain-orange-hover-shadow: none;
  --okd-button-plain-orange-active-shadow: none;
  --okd-button-plain-orange-focus-shadow: none;
  --okd-button-plain-orange-disabled-shadow: none;
  --okd-button-plain-yellow-default-background: var(--okd-color-transparent);
  --okd-button-plain-yellow-hover-background: var(--okd-color-yellow-050);
  --okd-button-plain-yellow-active-background: var(--okd-color-yellow-050);
  --okd-button-plain-yellow-focus-background: var(--okd-color-yellow-050);
  --okd-button-plain-yellow-disabled-background: var(--okd-color-gray-050);
  --okd-button-plain-yellow-default-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-hover-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-active-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-focus-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-disabled-border-color: var(--okd-color-transparent);
  --okd-button-plain-yellow-default-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-hover-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-active-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-focus-font-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-disabled-font-color: rgba(222, 169, 33, 0.45);
  --okd-button-plain-yellow-default-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-hover-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-active-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-focus-icon-color: var(--okd-color-yellow-800);
  --okd-button-plain-yellow-disabled-icon-color: rgba(222, 169, 33, 0.45);
  --okd-button-plain-yellow-default-shadow: none;
  --okd-button-plain-yellow-hover-shadow: none;
  --okd-button-plain-yellow-active-shadow: none;
  --okd-button-plain-yellow-focus-shadow: none;
  --okd-button-plain-yellow-disabled-shadow: none;
  --okd-button-xxs-font-size: var(--okd-font-size-xs);
  --okd-button-xs-font-size: var(--okd-font-size-xs);
  --okd-button-sm-font-size: var(--okd-font-size-md);
  --okd-button-md-font-size: var(--okd-font-size-md);
  --okd-button-lg-font-size: var(--okd-font-size-base);
  --okd-button-xl-font-size: 18px;
  --okd-button-xxs-icon-size: 14px;
  --okd-button-xs-icon-size: 14px;
  --okd-button-sm-icon-size: 18px;
  --okd-button-md-icon-size: 18px;
  --okd-button-lg-icon-size: 18px;
  --okd-button-xl-icon-size: 18px;
  --okd-button-xxs-icon-margin: 6px;
  --okd-button-xs-icon-margin: 6px;
  --okd-button-sm-icon-margin: 6px;
  --okd-button-md-icon-margin: 6px;
  --okd-button-lg-icon-margin: 8px;
  --okd-button-xl-icon-margin: 8px;
  --okd-button-xxs-line-height: var(--okd-line-height-xs);
  --okd-button-xs-line-height: var(--okd-line-height-xs);
  --okd-button-sm-line-height: var(--okd-line-height-md);
  --okd-button-md-line-height: var(--okd-line-height-md);
  --okd-button-lg-line-height: var(--okd-line-height-base);
  --okd-button-xl-line-height: var(--okd-line-height-base);
  --okd-button-xxs-padding-horizontal: 8px;
  --okd-button-xxs-padding-vertical: 3px;
  --okd-button-xs-padding-horizontal: 8px;
  --okd-button-xs-padding-vertical: 5px;
  --okd-button-sm-padding-horizontal: 12px;
  --okd-button-sm-padding-vertical: 7px;
  --okd-button-md-padding-horizontal: 16px;
  --okd-button-md-padding-vertical: 9px;
  --okd-button-lg-padding-horizontal: 24px;
  --okd-button-lg-padding-vertical: 13px;
  --okd-button-xl-padding-horizontal: 24px;
  --okd-button-xl-padding-vertical: 17px;
  --okd-button-xxs-min-width: 63px;
  --okd-button-xs-min-width: 63px;
  --okd-button-sm-min-width: 81px;
  --okd-button-md-min-width: 90px;
  --okd-button-lg-min-width: 108px;
  --okd-button-xl-min-width: 126px;
  --okd-button-xxs-border-radius: 60px;
  --okd-button-xs-border-radius: 60px;
  --okd-button-sm-border-radius: 60px;
  --okd-button-md-border-radius: 60px;
  --okd-button-lg-border-radius: 60px;
  --okd-button-xl-border-radius: 60px;
  --okd-button-xxs-border-size: 1px;
  --okd-button-xs-border-size: 1px;
  --okd-button-sm-border-size: 1px;
  --okd-button-md-border-size: 1px;
  --okd-button-lg-border-size: 1px;
  --okd-button-xl-border-size: 1px;
  --okd-button-xl-loader-size: 18px;
  --okd-button-lg-loader-size: 14px;
  --okd-button-md-loader-size: 14px;
  --okd-button-sm-loader-size: 14px;
  --okd-button-xs-loader-size: 14px;
  --okd-button-xxs-loader-size: 14px;
  --okd-button-xl-loader-text-margin-left: 8px;
  --okd-button-lg-loader-text-margin-left: 8px;
  --okd-button-md-loader-text-margin-left: 6px;
  --okd-button-sm-loader-text-margin-left: 6px;
  --okd-button-xs-loader-text-margin-left: 6px;
  --okd-button-xxs-loader-text-margin-left: 6px;
  --okd-button-s-font-size: 14px;
  --okd-button-s-icon-size: 18px;
  --okd-button-s-icon-margin: 6px;
  --okd-button-s-line-height: 16px;
  --okd-button-s-padding-horizontal: 12px;
  --okd-button-s-padding-vertical: 7px;
  --okd-button-s-min-width: 72px;
  --okd-button-s-border-radius: 60px;
  --okd-button-s-loader-size: 14px;
  --okd-button-s-loader-text-margin-left: 6px;
  --okd-button-rect-xxs-border-radius: 4px;
  --okd-button-rect-xs-border-radius: 4px;
  --okd-button-rect-sm-border-radius: 4px;
  --okd-button-rect-s-border-radius: 4px;
  --okd-button-rect-md-border-radius: 4px;
  --okd-button-rect-lg-border-radius: 8px;
  --okd-button-rect-xl-border-radius: 8px;
  --okd-button-fill-highlight-default-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-highlight-hover-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-highlight-active-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-highlight-focus-background: var(--okd-color-text-amplifed);
  --okd-button-fill-highlight-disabled-background: var(--okd-color-neutral-180);
  --okd-button-fill-highlight-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-focus-border-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-fill-highlight-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-highlight-default-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-hover-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-highlight-active-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-highlight-focus-font-color: var(--okd-color-gray-050);
  --okd-button-fill-highlight-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-highlight-default-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-highlight-hover-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-highlight-active-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-highlight-focus-icon-color: var(--okd-color-gray-050);
  --okd-button-fill-highlight-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-highlight-default-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #000,
    0px 0px 0px 4px #fafafa40;
  --okd-button-fill-highlight-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-highlight-loader-track-color: rgba(0, 0, 0, 0.26);
  --okd-button-fill-highlight-loader-mark-color: var(
    --okd-color-border-contrast
  );
  --okd-button-fill-highlight-border-size: 0px;
  --okd-button-fill-primary-default-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-hover-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-active-background: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-focus-background: var(--okd-color-blue-500);
  --okd-button-fill-primary-disabled-background: var(--okd-color-neutral-180);
  --okd-button-fill-primary-default-border-color: var(
    --okd-color-container-inverse
  );
  --okd-button-fill-primary-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-primary-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-primary-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-primary-disabled-border-color: var(
    --okd-color-background-surface-primary
  );
  --okd-button-fill-primary-default-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-primary-hover-font-color: var(--okd-color-content-contrast);
  --okd-button-fill-primary-active-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-primary-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-primary-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-primary-default-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-fill-primary-hover-icon-color: rgba(0, 0, 0, 0.6);
  --okd-button-fill-primary-active-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-primary-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-primary-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-primary-default-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #121212,
    0px 0px 0px 4px #2676ff8c;
  --okd-button-fill-primary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-primary-loader-track-color: rgba(0, 0, 0, 0.26);
  --okd-button-fill-primary-loader-mark-color: var(--okd-color-border-contrast);
  --okd-button-fill-primary-border-size: 0px;
  --okd-button-fill-secondary-default-background: hsla(0, 0%, 98%, 0.06);
  --okd-button-fill-secondary-hover-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-secondary-active-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-secondary-focus-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-secondary-disabled-background: hsla(0, 0%, 100%, 0.06);
  --okd-button-fill-secondary-default-border-color: var(
    --okd-color-transparent
  );
  --okd-button-fill-secondary-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-secondary-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-secondary-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-secondary-disabled-border-color: var(
    --okd-color-background-3
  );
  --okd-button-fill-secondary-default-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-fill-secondary-hover-font-color: var(--okd-color-white);
  --okd-button-fill-secondary-active-font-color: var(--okd-color-text-white);
  --okd-button-fill-secondary-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-secondary-disabled-font-color: var(
    --okd-color-text-lighter
  );
  --okd-button-fill-secondary-default-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-fill-secondary-hover-icon-color: var(--okd-color-text-amplifed);
  --okd-button-fill-secondary-active-icon-color: var(--okd-color-text-white);
  --okd-button-fill-secondary-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-secondary-disabled-icon-color: var(
    --okd-color-text-lighter
  );
  --okd-button-fill-secondary-default-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #121212,
    0px 0px 0px 4px #ffffff1a;
  --okd-button-fill-secondary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-secondary-loader-track-color: var(--okd-color-gray-300);
  --okd-button-fill-secondary-loader-mark-color: var(--okd-color-white);
  --okd-button-fill-secondary-border-size: 0px;
  --okd-button-fill-tertiary-border-size: 0px;
  --okd-button-fill-tertiary-default-background: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-hover-background: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-focus-background: hsla(0, 0%, 100%, 0.8);
  --okd-button-fill-tertiary-active-background: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-disabled-background: rgba(39, 39, 39, 0.06);
  --okd-button-fill-tertiary-default-border-color: var(
    --okd-color-container-primary
  );
  --okd-button-fill-tertiary-hover-border-color: rgba(39, 39, 39, 0);
  --okd-button-fill-tertiary-focus-border-color: hsla(0, 0%, 100%, 0);
  --okd-button-fill-tertiary-active-border-color: rgba(39, 39, 39, 0);
  --okd-button-fill-tertiary-disabled-border-color: rgba(39, 39, 39, 0.06);
  --okd-button-fill-tertiary-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-fill-tertiary-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-fill-tertiary-hover-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-hover-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-focus-font-color: var(--okd-color-black);
  --okd-button-fill-tertiary-focus-icon-color: var(--okd-color-black);
  --okd-button-fill-tertiary-active-icon-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-active-font-color: var(
    --okd-color-content-contrast
  );
  --okd-button-fill-tertiary-disabled-icon-color: rgba(0, 0, 0, 0.36);
  --okd-button-fill-tertiary-disabled-font-color: rgba(0, 0, 0, 0.36);
  --okd-button-fill-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-tertiary-loader-track-color: var(
    --okd-color-border-primary
  );
  --okd-button-fill-tertiary-loader-mark-color: var(
    --okd-color-border-selected
  );
  --okd-button-fill-quaternary-border-size: 0px;
  --okd-button-fill-quaternary-default-background: hsla(0, 0%, 100%, 0.06);
  --okd-button-fill-quaternary-default-border-color: var(
    --okd-color-transparent
  );
  --okd-button-fill-quaternary-default-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-default-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-hover-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-hover-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-quaternary-hover-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-quaternary-focus-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-focus-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-quaternary-focus-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-quaternary-active-icon-color: var(--okd-color-white);
  --okd-button-fill-quaternary-active-font-color: var(--okd-color-white);
  --okd-button-fill-quaternary-active-border-color: var(
    --okd-color-transparent
  );
  --okd-button-fill-quaternary-active-background: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-quaternary-disabled-icon-color: hsla(0, 0%, 100%, 0.3);
  --okd-button-fill-quaternary-disabled-font-color: hsla(0, 0%, 100%, 0.3);
  --okd-button-fill-quaternary-disabled-border-color: var(
    --okd-color-transparent
  );
  --okd-button-fill-quaternary-disabled-background: hsla(0, 0%, 100%, 0.06);
  --okd-button-fill-quaternary-loader-mark-color: var(--okd-color-white);
  --okd-button-fill-quaternary-loader-track-color: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-quaternary-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-quaternary-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-fill-red-default-background: var(--okd-color-semantic-negative);
  --okd-button-fill-red-hover-background: rgba(202, 63, 100, 0.8);
  --okd-button-fill-red-active-background: rgba(202, 63, 100, 0.8);
  --okd-button-fill-red-focus-background: var(--okd-color-red-500);
  --okd-button-fill-red-disabled-background: var(--okd-color-neutral-180);
  --okd-button-fill-red-default-border-color: var(
    --okd-color-semantic-negative
  );
  --okd-button-fill-red-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-red-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-red-focus-border-color: var(--okd-color-transparent);
  --okd-button-fill-red-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-red-default-font-color: var(--okd-color-content-primary);
  --okd-button-fill-red-hover-font-color: var(--okd-color-content-primary);
  --okd-button-fill-red-active-font-color: var(--okd-color-content-primary);
  --okd-button-fill-red-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-red-disabled-font-color: var(--okd-color-content-disabled);
  --okd-button-fill-red-default-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-red-hover-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-red-active-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-red-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-red-disabled-icon-color: var(--okd-color-content-disabled);
  --okd-button-fill-red-default-shadow: var(--okd-shadow-sm);
  --okd-button-fill-red-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-red-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #121212,
    0px 0px 0px 4px #bf474780;
  --okd-button-fill-red-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-red-loader-track-color: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-red-loader-mark-color: var(--okd-color-border-selected);
  --okd-button-fill-red-border-size: 0px;
  --okd-button-fill-green-default-background: var(
    --okd-color-semantic-positive
  );
  --okd-button-fill-green-hover-background: rgba(37, 167, 80, 0.8);
  --okd-button-fill-green-active-background: rgba(37, 167, 80, 0.8);
  --okd-button-fill-green-focus-background: var(--okd-color-green-500);
  --okd-button-fill-green-disabled-background: var(--okd-color-neutral-180);
  --okd-button-fill-green-default-border-color: var(
    --okd-color-semantic-positive
  );
  --okd-button-fill-green-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-green-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-green-focus-border-color: var(--okd-color-green-500);
  --okd-button-fill-green-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-fill-green-default-font-color: var(--okd-color-content-primary);
  --okd-button-fill-green-hover-font-color: var(--okd-color-content-primary);
  --okd-button-fill-green-active-font-color: var(--okd-color-content-primary);
  --okd-button-fill-green-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-green-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-green-default-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-green-hover-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-green-active-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-green-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-green-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-fill-green-default-shadow: var(--okd-shadow-sm);
  --okd-button-fill-green-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-green-active-shadow: var(--okd-shadow-none);
  --okd-button-fill-green-focus-shadow: 0px 0px 0px 1.5px #121212,
    0px 0px 0px 4px #33b06a8c;
  --okd-button-fill-green-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-green-loader-track-color: hsla(0, 0%, 100%, 0.15);
  --okd-button-fill-green-loader-mark-color: var(--okd-color-border-selected);
  --okd-button-fill-green-border-size: 0px;
  --okd-button-fill-grey-default-background: var(--okd-color-neutral-180);
  --okd-button-fill-grey-hover-background: var(--okd-color-neutral-170);
  --okd-button-fill-grey-active-background: var(--okd-color-neutral-180);
  --okd-button-fill-grey-focus-background: rgba(64, 64, 64, 0.6);
  --okd-button-fill-grey-disabled-background: var(--okd-color-neutral-180);
  --okd-button-fill-grey-default-border-color: var(
    --okd-color-background-surface-primary
  );
  --okd-button-fill-grey-hover-border-color: var(--okd-color-transparent);
  --okd-button-fill-grey-active-border-color: var(--okd-color-transparent);
  --okd-button-fill-grey-focus-border-color: var(--okd-color-gray-200);
  --okd-button-fill-grey-disabled-border-color: var(
    --okd-color-background-surface-disable
  );
  --okd-button-fill-grey-default-font-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-hover-font-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-active-font-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-focus-font-color: var(--okd-color-text-white);
  --okd-button-fill-grey-disabled-font-color: var(--okd-color-content-disabled);
  --okd-button-fill-grey-default-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-hover-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-active-icon-color: var(--okd-color-content-primary);
  --okd-button-fill-grey-focus-icon-color: var(--okd-color-text-white);
  --okd-button-fill-grey-disabled-icon-color: var(--okd-color-content-disabled);
  --okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
  --okd-button-fill-grey-hover-shadow: var(--okd-shadow-none);
  --okd-button-fill-grey-active-shadow: 0 0 0 0 transparent;
  --okd-button-fill-grey-focus-shadow: 0px 0px 0px 1.5px #121212,
    0px 0px 0px 4px #ffffff1a;
  --okd-button-fill-grey-disabled-shadow: var(--okd-shadow-none);
  --okd-button-fill-grey-loader-track-color: var(--okd-color-border-primary);
  --okd-button-fill-grey-loader-mark-color: var(--okd-color-border-selected);
  --okd-button-fill-grey-border-size: 0px;
  --okd-button-outline-highlight-border-size: 1px;
  --okd-button-outline-highlight-default-background: var(
    --okd-color-transparent-base-black
  );
  --okd-button-outline-highlight-default-border-color: var(
    --okd-color-border-selected
  );
  --okd-button-outline-highlight-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-highlight-hover-background: var(
    --okd-color-container-inverse
  );
  --okd-button-outline-highlight-hover-border-color: var(
    --okd-color-border-selected
  );
  --okd-button-outline-highlight-hover-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-hover-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-focus-background: var(--okd-color-white);
  --okd-button-outline-highlight-focus-border-color: var(--okd-color-white);
  --okd-button-outline-highlight-focus-font-color: var(--okd-color-black);
  --okd-button-outline-highlight-focus-icon-color: var(--okd-color-black);
  --okd-button-outline-highlight-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-highlight-active-background: var(
    --okd-color-container-inverse
  );
  --okd-button-outline-highlight-active-border-color: var(
    --okd-color-border-selected
  );
  --okd-button-outline-highlight-active-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-active-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-highlight-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-highlight-disabled-background: var(
    --okd-color-transparent-base-black
  );
  --okd-button-outline-highlight-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-highlight-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-highlight-disabled-border-color: var(
    --okd-color-border-primary
  );
  --okd-button-outline-highlight-loader-track-color: hsla(0, 0%, 100%, 0.25);
  --okd-button-outline-highlight-loader-mark-color: var(--okd-color-white);
  --okd-button-outline-highlight-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-primary-default-background: var(
    --okd-color-transparent-base-black
  );
  --okd-button-outline-primary-hover-background: var(--okd-color-neutral-180);
  --okd-button-outline-primary-active-background: var(--okd-color-neutral-180);
  --okd-button-outline-primary-focus-background: var(--okd-color-background-3);
  --okd-button-outline-primary-disabled-background: var(
    --okd-color-neutral-180
  );
  --okd-button-outline-primary-default-border-color: var(
    --okd-color-border-secondary
  );
  --okd-button-outline-primary-hover-border-color: var(
    --okd-color-border-secondary
  );
  --okd-button-outline-primary-active-border-color: var(
    --okd-color-border-secondary
  );
  --okd-button-outline-primary-focus-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-primary-disabled-border-color: var(
    --okd-color-border-primary
  );
  --okd-button-outline-primary-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-hover-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-active-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-focus-font-color: var(--okd-color-text-white);
  --okd-button-outline-primary-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-primary-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-hover-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-active-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-primary-focus-icon-color: var(--okd-color-text-white);
  --okd-button-outline-primary-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-outline-primary-default-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-hover-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-active-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-focus-shadow: 0px 0px 0px 3.5px #ffffff1a;
  --okd-button-outline-primary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-outline-primary-loader-track-color: hsla(0, 0%, 56%, 0.25);
  --okd-button-outline-primary-loader-mark-color: #fff;
  --okd-button-outline-primary-border-size: 1px;
  --okd-button-outline-secondary-default-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-secondary-hover-background: var(
    --okd-color-background-3
  );
  --okd-button-outline-secondary-active-background: var(
    --okd-color-background-3
  );
  --okd-button-outline-secondary-focus-background: var(
    --okd-color-background-3
  );
  --okd-button-outline-secondary-disabled-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-secondary-default-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-secondary-hover-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-secondary-active-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-secondary-focus-border-color: var(
    --okd-color-line-secondary
  );
  --okd-button-outline-secondary-disabled-border-color: var(
    --okd-color-line-muted
  );
  --okd-button-outline-secondary-default-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-hover-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-active-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-focus-font-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-disabled-font-color: var(
    --okd-color-text-lighter
  );
  --okd-button-outline-secondary-default-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-hover-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-active-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-focus-icon-color: var(
    --okd-color-text-amplifed
  );
  --okd-button-outline-secondary-disabled-icon-color: var(
    --okd-color-text-lighter
  );
  --okd-button-outline-secondary-default-shadow: var(--okd-shadow-none);
  --okd-button-outline-secondary-hover-shadow: var(--okd-shadow-none);
  --okd-button-outline-secondary-active-shadow: 0 0 0 0 transparent;
  --okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3.5px #ffffff1a;
  --okd-button-outline-secondary-disabled-shadow: var(--okd-shadow-none);
  --okd-button-outline-secondary-loader-track-color: hsla(0, 0%, 100%, 0.25);
  --okd-button-outline-secondary-loader-mark-color: var(--okd-color-white);
  --okd-button-outline-secondary-border-size: 1px;
  --okd-button-outline-tertiary-border-size: 1.5px;
  --okd-button-outline-tertiary-default-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-default-icon-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-tertiary-default-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-tertiary-default-border-color: var(
    --okd-color-border-contrast
  );
  --okd-button-outline-tertiary-default-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-tertiary-hover-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-hover-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-hover-border-color: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-hover-background: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-focus-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-focus-icon-color: var(--okd-color-black);
  --okd-button-outline-tertiary-focus-font-color: var(--okd-color-black);
  --okd-button-outline-tertiary-focus-border-color: var(--okd-color-white);
  --okd-button-outline-tertiary-focus-background: var(--okd-color-white);
  --okd-button-outline-tertiary-active-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-active-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-active-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-outline-tertiary-active-border-color: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-active-background: var(
    --okd-color-container-primary
  );
  --okd-button-outline-tertiary-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-button-outline-tertiary-disabled-icon-color: rgba(0, 0, 0, 0.36);
  --okd-button-outline-tertiary-disabled-font-color: var(
    --okd-color-content-inverse
  );
  --okd-button-outline-tertiary-disabled-border-color: rgba(0, 0, 0, 0.12);
  --okd-button-outline-tertiary-disabled-background: var(
    --okd-color-transparent
  );
  --okd-button-outline-tertiary-loader-mark-color: var(
    --okd-color-border-contrast
  );
  --okd-button-outline-tertiary-loader-track-color: rgba(0, 0, 0, 0.3);
  --okd-button-text-primary-default-background: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-hover-background: var(--okd-color-neutral-180);
  --okd-button-text-primary-active-background: var(--okd-color-neutral-180);
  --okd-button-text-primary-focus-background: var(--okd-color-blue-050);
  --okd-button-text-primary-disabled-background: undefined;
  --okd-button-text-primary-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-primary-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-primary-default-font-color: var(
    --okd-color-content-primary
  );
  --okd-button-text-primary-hover-font-color: var(--okd-color-content-primary);
  --okd-button-text-primary-active-font-color: var(--okd-color-content-primary);
  --okd-button-text-primary-focus-font-color: var(--okd-color-blue-900);
  --okd-button-text-primary-disabled-font-color: var(
    --okd-color-content-disabled
  );
  --okd-button-text-primary-default-icon-color: var(
    --okd-color-content-primary
  );
  --okd-button-text-primary-hover-icon-color: var(--okd-color-content-primary);
  --okd-button-text-primary-active-icon-color: var(--okd-color-content-primary);
  --okd-button-text-primary-focus-icon-color: var(--okd-color-blue-900);
  --okd-button-text-primary-disabled-icon-color: var(
    --okd-color-content-disabled
  );
  --okd-button-text-primary-default-shadow: none;
  --okd-button-text-primary-hover-shadow: none;
  --okd-button-text-primary-active-shadow: none;
  --okd-button-text-primary-focus-shadow: none;
  --okd-button-text-primary-disabled-shadow: none;
  --okd-button-text-primary-border-size: 1px;
  --okd-button-text-secondary-default-background: var(--okd-color-transparent);
  --okd-button-text-secondary-hover-background: var(--okd-color-blue-050);
  --okd-button-text-secondary-active-background: var(--okd-color-blue-050);
  --okd-button-text-secondary-focus-background: var(--okd-color-blue-050);
  --okd-button-text-secondary-disabled-background: var(--okd-color-transparent);
  --okd-button-text-secondary-default-border-color: var(
    --okd-color-transparent
  );
  --okd-button-text-secondary-hover-border-color: var(--okd-color-transparent);
  --okd-button-text-secondary-active-border-color: var(--okd-color-transparent);
  --okd-button-text-secondary-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-secondary-disabled-border-color: var(
    --okd-color-transparent
  );
  --okd-button-text-secondary-default-font-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-hover-font-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-active-font-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-focus-font-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-disabled-font-color: var(
    --okd-color-text-lighter
  );
  --okd-button-text-secondary-default-icon-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-hover-icon-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-active-icon-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-focus-icon-color: var(--okd-color-blue-900);
  --okd-button-text-secondary-disabled-icon-color: var(
    --okd-color-text-lighter
  );
  --okd-button-text-secondary-default-shadow: none;
  --okd-button-text-secondary-hover-shadow: none;
  --okd-button-text-secondary-active-shadow: none;
  --okd-button-text-secondary-focus-shadow: none;
  --okd-button-text-secondary-disabled-shadow: none;
  --okd-button-text-secondary-border-size: 1px;
  --okd-button-text-red-default-background: var(--okd-color-common-transparent);
  --okd-button-text-red-hover-background: rgba(202, 63, 100, 0.05);
  --okd-button-text-red-active-background: rgba(202, 63, 100, 0.05);
  --okd-button-text-red-focus-background: var(--okd-color-red-050);
  --okd-button-text-red-disabled-background: hsla(0, 0%, 5%, 0);
  --okd-button-text-red-default-border-color: var(--okd-color-transparent);
  --okd-button-text-red-hover-border-color: var(--okd-color-common-transparent);
  --okd-button-text-red-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-red-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-red-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-red-default-font-color: var(--okd-color-prefer-red-text);
  --okd-button-text-red-hover-font-color: var(--okd-color-semantic-negative);
  --okd-button-text-red-active-font-color: var(--okd-color-semantic-negative);
  --okd-button-text-red-focus-font-color: var(--okd-color-red-800);
  --okd-button-text-red-disabled-font-color: rgba(202, 63, 100, 0.45);
  --okd-button-text-red-default-icon-color: var(--okd-color-prefer-red-text);
  --okd-button-text-red-hover-icon-color: rgba(202, 63, 100, 0.1);
  --okd-button-text-red-active-icon-color: var(--okd-color-semantic-negative);
  --okd-button-text-red-focus-icon-color: var(--okd-color-red-800);
  --okd-button-text-red-disabled-icon-color: rgba(202, 63, 100, 0.45);
  --okd-button-text-red-default-shadow: none;
  --okd-button-text-red-hover-shadow: none;
  --okd-button-text-red-active-shadow: none;
  --okd-button-text-red-focus-shadow: none;
  --okd-button-text-red-disabled-shadow: none;
  --okd-button-text-red-border-size: 1px;
  --okd-button-text-green-default-background: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-hover-background: rgba(37, 167, 80, 0.05);
  --okd-button-text-green-active-background: rgba(37, 167, 80, 0.05);
  --okd-button-text-green-focus-background: var(--okd-color-green-050);
  --okd-button-text-green-disabled-background: hsla(0, 0%, 5%, 0);
  --okd-button-text-green-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-green-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-green-default-font-color: var(
    --okd-color-semantic-positive
  );
  --okd-button-text-green-hover-font-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-active-font-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-focus-font-color: var(--okd-color-green-800);
  --okd-button-text-green-disabled-font-color: rgba(37, 167, 80, 0.45);
  --okd-button-text-green-default-icon-color: var(
    --okd-color-semantic-positive
  );
  --okd-button-text-green-hover-icon-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-active-icon-color: var(--okd-color-semantic-positive);
  --okd-button-text-green-focus-icon-color: var(--okd-color-green-800);
  --okd-button-text-green-disabled-icon-color: rgba(37, 167, 80, 0.45);
  --okd-button-text-green-default-shadow: none;
  --okd-button-text-green-hover-shadow: none;
  --okd-button-text-green-active-shadow: none;
  --okd-button-text-green-focus-shadow: none;
  --okd-button-text-green-disabled-shadow: none;
  --okd-button-text-green-border-size: 1px;
  --okd-button-text-yellow-default-background: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-hover-background: rgba(255, 177, 23, 0.05);
  --okd-button-text-yellow-active-background: rgba(255, 177, 23, 0.05);
  --okd-button-text-yellow-focus-background: var(--okd-color-yellow-050);
  --okd-button-text-yellow-disabled-background: hsla(0, 0%, 5%, 0);
  --okd-button-text-yellow-default-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-hover-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-active-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-yellow-disabled-border-color: var(
    --okd-color-common-transparent
  );
  --okd-button-text-yellow-default-font-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-hover-font-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-active-font-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-focus-font-color: var(--okd-color-yellow-800);
  --okd-button-text-yellow-disabled-font-color: rgba(255, 177, 23, 0.45);
  --okd-button-text-yellow-default-icon-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-hover-icon-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-active-icon-color: var(--okd-color-semantic-notice);
  --okd-button-text-yellow-focus-icon-color: var(--okd-color-yellow-800);
  --okd-button-text-yellow-disabled-icon-color: rgba(255, 177, 23, 0.45);
  --okd-button-text-yellow-default-shadow: none;
  --okd-button-text-yellow-hover-shadow: none;
  --okd-button-text-yellow-active-shadow: none;
  --okd-button-text-yellow-focus-shadow: none;
  --okd-button-text-yellow-disabled-shadow: none;
  --okd-button-text-yellow-border-size: 1px;
}
:root {
  --okd-input-default-text-color: var(--okd-color-content-primary);
  --okd-input-default-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-default-border-color: var(--okd-color-transparent-base-white);
  --okd-input-default-caret-color: var(--okd-color-content-primary);
  --okd-input-default-shadow: 0px 0px 0px 0px transparent;
  --okd-input-default-background: var(--okd-color-neutral-20);
  --okd-input-hover-text-color: var(--okd-color-content-primary);
  --okd-input-hover-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-hover-border-color: var(--okd-color-transparent-base-white);
  --okd-input-hover-caret-color: var(--okd-color-content-primary);
  --okd-input-hover-shadow: 0 0 0 0 transparent;
  --okd-input-hover-background: var(--okd-color-neutral-20);
  --okd-input-focus-text-color: var(--okd-color-content-primary);
  --okd-input-focus-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-focus-border-color: var(--okd-color-border-selected);
  --okd-input-focus-caret-color: var(--okd-color-content-brand);
  --okd-input-focus-shadow: 0px 0px 0px 0px #00000000;
  --okd-input-focus-background: var(--okd-color-neutral-20);
  --okd-input-disabled-text-color: var(--okd-color-content-disabled);
  --okd-input-disabled-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-disabled-border-color: var(--okd-color-border-primary);
  --okd-input-disabled-caret-color: var(--okd-color-content-disabled);
  --okd-input-disabled-shadow: 0 0 0 0 transparent;
  --okd-input-disabled-background: var(--okd-color-neutral-20);
  --okd-input-error-text-color: var(--okd-color-content-primary);
  --okd-input-error-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-error-border-color: var(--okd-color-semantic-negative);
  --okd-input-error-caret-color: var(--okd-color-content-brand);
  --okd-input-error-shadow: var(--okd-shadow-sm);
  --okd-input-error-background: var(--okd-color-neutral-20);
  --okd-input-error-tips-color: var(--okd-color-semantic-negative);
  --okd-input-tips-text-color: var(--okd-color-content-contrast);
  --okd-input-icon-color: var(--okd-color-content-contrast);
  --okd-input-label-color: var(--okd-color-content-primary);
  --okd-input-action-color: var(--okd-color-content-primary);
  --okd-input-md-label-font-size: var(--okd-font-size-md);
  --okd-input-sm-label-font-size: var(--okd-font-size-xs);
  --okd-input-xs-label-font-size: var(--okd-font-size-xs);
  --okd-input-md-label-line-height: var(--okd-line-height-md);
  --okd-input-sm-label-line-height: var(--okd-line-height-xs);
  --okd-input-xs-label-line-height: var(--okd-line-height-xs);
  --okd-input-md-action-font-size: var(--okd-font-size-md);
  --okd-input-sm-action-font-size: var(--okd-font-size-xs);
  --okd-input-xs-action-font-size: var(--okd-font-size-xs);
  --okd-input-md-action-line-height: var(--okd-line-height-md);
  --okd-input-sm-action-line-height: var(--okd-line-height-xs);
  --okd-input-xs-action-line-height: var(--okd-line-height-xs);
  --okd-input-md-height: 40px;
  --okd-input-md-text-font-size: var(--okd-font-size-md);
  --okd-input-md-border-radius: 8px;
  --okd-input-md-error-font-size: 14px;
  --okd-input-md-error-line-height: 16px;
  --okd-input-md-tip-font-size: 14px;
  --okd-input-md-tip-line-height: 16px;
  --okd-input-md-icon-size: 20px;
  --okd-input-md-icon-margin: 6px;
  --okd-input-sm-height: 32px;
  --okd-input-sm-text-font-size: 12px;
  --okd-input-sm-border-radius: 8px;
  --okd-input-sm-error-font-size: var(--okd-font-size-xs);
  --okd-input-sm-error-line-height: var(--okd-line-height-xs);
  --okd-input-sm-tip-font-size: var(--okd-font-size-xs);
  --okd-input-sm-tip-line-height: var(--okd-line-height-xs);
  --okd-input-sm-icon-size: 16px;
  --okd-input-sm-icon-margin: 4px;
  --okd-input-xs-height: 28px;
  --okd-input-xs-text-font-size: var(--okd-font-size-xs);
  --okd-input-xs-border-radius: 8px;
  --okd-input-xs-error-font-size: var(--okd-font-size-xs);
  --okd-input-xs-error-line-height: var(--okd-line-height-xs);
  --okd-input-xs-tip-font-size: var(--okd-font-size-xs);
  --okd-input-xs-tip-line-height: var(--okd-line-height-xs);
  --okd-input-xs-icon-size: 16px;
  --okd-input-xs-icon-margin: 4px;
  --okd-input-number-default-add-icon-color: var(--okd-color-content-disabled);
  --okd-input-number-default-add-icon-background: var(
    --okd-color-transparent-base-white
  );
  --okd-input-number-hover-add-icon-color: var(--okd-color-content-primary);
  --okd-input-number-hover-add-icon-background: var(
    --okd-color-background-surface-pressed
  );
  --okd-input-number-active-add-icon-color: var(--okd-color-gray-300);
  --okd-input-number-active-add-icon-background: var(--okd-color-gray-100);
  --okd-input-number-disabled-add-icon-color: var(--okd-color-content-disabled);
  --okd-input-number-disabled-add-icon-background: var(
    --okd-color-content-disabled
  );
  --okd-input-code-common-btn-color: var(--okd-color-blue-700);
  --okd-input-code-common-btn-disabled-color: var(--okd-color-gray-300);
  --okd-input-code-common-count-color: var(--okd-color-content-disabled);
  --okd-input-code-md-btn-font-size: var(--okd-font-size-md);
  --okd-input-code-md-btn-line-height: var(--okd-line-height-md);
  --okd-input-code-md-count-font-size: var(--okd-font-size-md);
  --okd-input-code-md-count-line-height: var(--okd-line-height-md);
  --okd-input-code-sm-btn-font-size: var(--okd-font-size-xs);
  --okd-input-code-sm-btn-line-height: var(--okd-line-height-xs);
  --okd-input-code-sm-count-font-size: var(--okd-font-size-xs);
  --okd-input-code-sm-count-line-height: var(--okd-line-height-xs);
  --okd-input-code-xs-btn-font-size: var(--okd-font-size-xs);
  --okd-input-code-xs-btn-line-height: var(--okd-line-height-xs);
  --okd-input-code-xs-count-font-size: var(--okd-font-size-xs);
  --okd-input-code-xs-count-line-height: var(--okd-line-height-xs);
  --okd-input-search-default-text-color: var(--okd-color-content-primary);
  --okd-input-search-default-placeholder-color: var(
    --okd-color-content-disabled
  );
  --okd-input-search-default-border-color: var(--okd-color-transparent);
  --okd-input-search-default-caret-color: var(--okd-color-content-primary);
  --okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
  --okd-input-search-default-background: var(--okd-color-neutral-20);
  --okd-input-search-hover-text-color: var(--okd-color-content-primary);
  --okd-input-search-hover-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-search-hover-border-color: var(
    --okd-color-transparent-base-white
  );
  --okd-input-search-hover-caret-color: var(--okd-color-content-primary);
  --okd-input-search-hover-shadow: 0px 0px 0px 0px #0000001a;
  --okd-input-search-hover-background: var(--okd-color-neutral-20);
  --okd-input-search-focus-text-color: var(--okd-color-content-primary);
  --okd-input-search-focus-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-search-focus-border-color: var(--okd-color-border-selected);
  --okd-input-search-focus-caret-color: var(--okd-color-content-brand);
  --okd-input-search-focus-shadow: 0px 0px 0px 0px #00000000;
  --okd-input-search-focus-background: var(--okd-color-neutral-20);
  --okd-input-search-error-text-color: var(--okd-color-content-primary);
  --okd-input-search-error-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-search-error-border-color: var(--okd-color-semantic-negative);
  --okd-input-search-error-caret-color: var(--okd-color-content-primary);
  --okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
  --okd-input-search-error-background: var(--okd-color-neutral-20);
  --okd-input-search-disabled-text-color: var(--okd-color-content-disabled);
  --okd-input-search-disabled-placeholder-color: var(
    --okd-color-content-disabled
  );
  --okd-input-search-disabled-border-color: var(--okd-color-transparent);
  --okd-input-search-disabled-caret-color: var(--okd-color-content-disabled);
  --okd-input-search-disabled-shadow: 0px 0px 0px 0px transparent;
  --okd-input-search-disabled-background: var(--okd-color-neutral-20);
  --okd-input-search-prefix-icon-color: var(--okd-color-content-contrast);
  --okd-input-search-prefix-icon-size: 16px;
  --okd-input-search-suffix-icon-color: var(--okd-color-content-contrast);
  --okd-input-search-suffix-icon-size: 13px;
  --okd-input-search-error-tips-color: var(--okd-color-semantic-negative);
  --okd-input-verify-md-width: 40px;
  --okd-input-verify-md-height: 44px;
  --okd-input-lg-height: 44px;
  --okd-input-lg-border-radius: 8px;
  --okd-input-lg-label-font-size: 14px;
  --okd-input-lg-label-line-height: 20px;
  --okd-input-lg-label-margin: 6px;
  --okd-input-lg-action-font-size: 14px;
  --okd-input-lg-action-line-height: 20px;
  --okd-input-lg-text-font-size: 14px;
  --okd-input-lg-error-font-size: 14px;
  --okd-input-lg-error-line-height: 16px;
  --okd-input-lg-tip-margin: 4px;
  --okd-input-lg-tip-font-size: 14px;
  --okd-input-lg-tip-line-height: 16px;
  --okd-input-md-label-margin: 4px;
  --okd-input-md-tip-margin: 4px;
  --okd-input-sm-label-margin: 4px;
  --okd-input-sm-tip-margin: 4px;
  --okd-input-xs-label-margin: 4px;
  --okd-input-xs-tip-margin: 4px;
  --okd-input-xl-height: 48px;
  --okd-input-xl-text-font-size: 14px;
  --okd-input-xl-border-radius: 8px;
  --okd-input-lg-icon-size: 20px;
  --okd-input-lg-icon-margin: 8px;
  --okd-input-xl-label-line-height: 20px;
  --okd-input-xl-icon-size: 20px;
  --okd-input-xl-icon-margin: 12px;
  --okd-input-xl-error-font-size: 14px;
  --okd-input-xl-error-line-height: 16px;
  --okd-input-xl-action-font-size: 14px;
  --okd-input-xl-action-line-height: 20px;
  --okd-input-xl-label-margin: 6px;
  --okd-input-xl-label-font-size: 14px;
  --okd-input-xl-tip-font-size: 14px;
  --okd-input-xl-tip-margin: 6px;
  --okd-input-xl-tip-line-height: 16px;
  --okd-input-verify-xl-height: px;
  --okd-input-verify-xl-width: px;
  --okd-input-xs-padding-horizontal: 8px;
  --okd-input-sm-padding-horizontal: 8px;
  --okd-input-md-padding-horizontal: 8px;
  --okd-input-lg-padding-horizontal: 12px;
  --okd-input-xl-padding-horizontal: 12px;
  --okd-input-reversed-default-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-default-placeholder-color: hsla(0, 0%, 100%, 0.36);
  --okd-input-reversed-default-border-color: var(
    --okd-color-transparent-base-black
  );
  --okd-input-reversed-default-caret-color: var(--okd-color-content-inverse);
  --okd-input-reversed-default-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-default-background: var(--okd-color-neutral-180);
  --okd-input-reversed-hover-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-hover-placeholder-color: hsla(0, 0%, 100%, 0.36);
  --okd-input-reversed-hover-border-color: var(--okd-color-transparent-black);
  --okd-input-reversed-hover-caret-color: var(--okd-color-content-contrast);
  --okd-input-reversed-hover-shadow: 0px 0px 0px 0px transparent;
  --okd-input-reversed-hover-background: var(--okd-color-neutral-180);
  --okd-input-reversed-focus-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-focus-placeholder-color: hsla(0, 0%, 100%, 0.36);
  --okd-input-reversed-focus-border-color: var(--okd-color-neutral-5);
  --okd-input-reversed-focus-caret-color: var(--okd-color-semantic-highlight);
  --okd-input-reversed-focus-shadow: 0px 0px 0px 0px #ffffff00;
  --okd-input-reversed-focus-background: var(--okd-color-neutral-180);
  --okd-input-reversed-disabled-text-color: var(--okd-color-gray-600);
  --okd-input-reversed-disabled-placeholder-color: var(--okd-color-gray-600);
  --okd-input-reversed-disabled-border-color: var(--okd-color-neutral-160);
  --okd-input-reversed-disabled-caret-color: var(--okd-color-fq-accent);
  --okd-input-reversed-disabled-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-disabled-background: var(--okd-color-neutral-180);
  --okd-input-reversed-error-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-error-placeholder-color: hsla(0, 0%, 100%, 0.36);
  --okd-input-reversed-error-border-color: var(--okd-color-semantic-negative);
  --okd-input-reversed-error-caret-color: var(--okd-color-content-contrast);
  --okd-input-reversed-error-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-error-background: var(--okd-color-neutral-180);
  --okd-input-reversed-error-tips-color: var(--okd-color-semantic-negative);
  --okd-input-reversed-tips-text-color: var(--okd-color-content-contrast);
  --okd-input-reversed-icon-color: var(--okd-color-gray-400);
  --okd-input-reversed-label-color: var(--okd-color-gray-200);
  --okd-input-reversed-action-color: var(--okd-color-content-inverse);
  --okd-input-number-reversed-default-add-icon-color: var(--okd-color-gray-500);
  --okd-input-number-reversed-default-add-icon-background: var(
    --okd-color-transparent
  );
  --okd-input-number-reversed-hover-add-icon-color: var(--okd-color-neutral-5);
  --okd-input-number-reversed-hover-add-icon-background: var(
    --okd-color-neutral-170
  );
  --okd-input-number-reversed-active-add-icon-color: var(--okd-color-gray-500);
  --okd-input-number-reversed-active-add-icon-background: var(
    --okd-color-transparent
  );
  --okd-input-number-reversed-disabled-add-icon-color: var(
    --okd-color-gray-500
  );
  --okd-input-number-reversed-disabled-add-icon-background: var(
    --okd-color-transparent
  );
  --okd-input-code-reversed-common-btn-color: var(--okd-color-content-inverse);
  --okd-input-code-reversed-common-btn-disabled-color: var(
    --okd-color-gray-600
  );
  --okd-input-code-reversed-common-count-color: var(--okd-color-gray-600);
  --okd-input-search-reversed-default-text-color: var(--okd-color-white);
  --okd-input-search-reversed-default-placeholder-color: var(
    --okd-color-neutral-120
  );
  --okd-input-search-reversed-default-border-color: var(
    --okd-color-transparent
  );
  --okd-input-search-reversed-default-caret-color: var(--okd-color-white);
  --okd-input-search-reversed-default-shadow: 0px 0px 0px 0px #f9f9f91a;
  --okd-input-search-reversed-default-background: var(--okd-color-neutral-180);
  --okd-input-search-reversed-hover-text-color: var(--okd-color-white);
  --okd-input-search-reversed-hover-placeholder-color: var(
    --okd-color-gray-700
  );
  --okd-input-search-reversed-hover-border-color: var(
    --okd-color-transparent-base-black
  );
  --okd-input-search-reversed-hover-caret-color: var(--okd-color-white);
  --okd-input-search-reversed-hover-shadow: 0px 0px 0px 2px #f9f9f91a;
  --okd-input-search-reversed-hover-background: var(--okd-color-neutral-180);
  --okd-input-search-reversed-focus-text-color: var(--okd-color-white);
  --okd-input-search-reversed-focus-placeholder-color: var(
    --okd-color-gray-700
  );
  --okd-input-search-reversed-focus-border-color: var(--okd-color-white);
  --okd-input-search-reversed-focus-caret-color: var(
    --okd-color-semantic-highlight
  );
  --okd-input-search-reversed-focus-shadow: 0 0 0 0 transparent;
  --okd-input-search-reversed-focus-background: var(--okd-color-neutral-180);
  --okd-input-search-reversed-error-text-color: var(--okd-color-white);
  --okd-input-search-reversed-error-placeholder-color: var(
    --okd-color-gray-700
  );
  --okd-input-search-reversed-error-border-color: var(--okd-color-fq-critical);
  --okd-input-search-reversed-error-caret-color: var(
    --okd-color-semantic-highlight
  );
  --okd-input-search-reversed-error-shadow: 0 0 0 0 transparent;
  --okd-input-search-reversed-error-background: var(--okd-color-black);
  --okd-input-search-reversed-disabled-text-color: var(--okd-color-gray-500);
  --okd-input-search-reversed-disabled-placeholder-color: var(
    --okd-color-gray-700
  );
  --okd-input-search-reversed-disabled-border-color: var(
    --okd-color-transparent
  );
  --okd-input-search-reversed-disabled-caret-color: var(
    --okd-color-transparent
  );
  --okd-input-search-reversed-disabled-shadow: 0 0 0 0 transparent;
  --okd-input-search-reversed-disabled-background: var(--okd-color-gray-800);
  --okd-input-search-reversed-prefix-icon-color: var(--okd-color-gray-300);
  --okd-input-search-reversed-error-tips-color: var(--okd-color-fq-critical);
  --okd-input-search-suffix-icon-hover-color: #000;
  --okd-input-verify-xl-border-radius: 8pxpx;
  --okd-input-code-xl-btn-font-size: 12px;
  --okd-input-number-suffix-border-color: var(--okd-color-border-primary);
  --okd-input-verify-md-border-radius: 6px;
  --okd-input-verify-md-text-font-size: 26px;
  --okd-input-verify-md-margin: 8px;
  --okd-input-readonly-text-color: var(--okd-color-content-primary);
  --okd-input-readonly-placeholder-color: var(
    --okd-input-default-placeholder-color
  );
  --okd-input-readonly-border-color: var(--okd-color-border-primary);
  --okd-input-readonly-caret-color: var(--okd-input-default-caret-color);
  --okd-input-readonly-shadow: var(--okd-input-default-shadow);
  --okd-input-readonly-background: var(--okd-color-transparent-white);
  --okd-loader-line-active-color: var(--okd-color-border-selected);
  --okd-loader-line-inactive-color: var(--okd-color-border-primary);
  --okd-loader-primary-active-color: var(--okd-color-black);
  --okd-loader-primary-inactive-color: var(--okd-color-gray-200);
  --okd-loader-neutral-active-color: var(--okd-color-gray-700);
  --okd-loader-neutral-inactive-color: var(--okd-color-gray-200);
  --okd-loader-mask-bg-color: hsla(0, 0%, 100%, 0.85);
  --okd-loader-circle-xl-size: 38px;
  --okd-loader-circle-lg-size: 30px;
  --okd-loader-circle-md-size: 22px;
  --okd-loader-circle-sm-size: 14px;
  --okd-loader-circle-xl-track-width: 2px;
  --okd-loader-circle-lg-track-width: 2px;
  --okd-loader-circle-md-track-width: 1.82px;
  --okd-loader-circle-sm-track-width: 1.5px;
  --okd-loader-line-size: 4px;
  --okd-loader-circle-cover-background: var(--okd-color-background-1);
  --okd-loader-mask-text-font-size: 14px;
  --okd-loader-mask-text-line-height: 16px;
  --okd-loader-mask-text-font-weight: 400;
  --okd-loader-mask-text-color: var(--okd-color-gray-900);
  --okd-loader-mask-text-margin-top: 10px;
}
.theme-dark {
  --okd-button-text-orange-default-background: var(--okd-color-transparent);
  --okd-button-text-orange-hover-background: var(--okd-color-orange-050);
  --okd-button-text-orange-active-background: var(--okd-color-orange-050);
  --okd-button-text-orange-focus-background: var(--okd-color-orange-050);
  --okd-button-text-orange-disabled-background: var(--okd-color-gray-050);
  --okd-button-text-orange-default-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-hover-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-active-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-focus-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-disabled-border-color: var(--okd-color-transparent);
  --okd-button-text-orange-default-font-color: var(--okd-color-orange-900);
  --okd-button-text-orange-hover-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-active-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-focus-font-color: var(--okd-color-orange-800);
  --okd-button-text-orange-disabled-font-color: rgba(248, 116, 40, 0.45);
  --okd-button-text-orange-default-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-hover-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-active-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-focus-icon-color: var(--okd-color-orange-800);
  --okd-button-text-orange-disabled-icon-color: rgba(248, 116, 40, 0.45);
  --okd-button-text-orange-default-shadow: none;
  --okd-button-text-orange-hover-shadow: none;
  --okd-button-text-orange-active-shadow: none;
  --okd-button-text-orange-focus-shadow: none;
  --okd-button-text-orange-disabled-shadow: none;
  --okd-button-text-orange-border-size: 1px;
  --okd-loader-line-active-color: var(--okd-color-border-selected);
  --okd-loader-line-inactive-color: var(--okd-color-border-primary);
  --okd-loader-primary-active-color: var(--okd-color-gray-900);
  --okd-loader-primary-inactive-color: var(--okd-color-gray-200);
  --okd-loader-neutral-active-color: #fff;
  --okd-loader-neutral-inactive-color: #ffffff40;
  --okd-loader-mask-bg-color: #00000040;
  --okd-loader-circle-xl-size: 38px;
  --okd-loader-circle-lg-size: 30px;
  --okd-loader-circle-md-size: 22px;
  --okd-loader-circle-sm-size: 14px;
  --okd-loader-circle-xl-track-width: 2px;
  --okd-loader-circle-lg-track-width: 2px;
  --okd-loader-circle-md-track-width: 1.82px;
  --okd-loader-circle-sm-track-width: 1.5px;
  --okd-loader-line-size: 4px;
  --okd-loader-circle-cover-background: var(--okd-color-background-2);
  --okd-loader-mask-text-font-size: 14px;
  --okd-loader-mask-text-line-height: 16px;
  --okd-loader-mask-text-font-weight: 400;
  --okd-loader-mask-text-color: var(--okd-color-gray-900);
  --okd-loader-mask-text-margin-top: 10px;
  --okd-input-default-text-color: var(--okd-color-content-primary);
  --okd-input-default-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-default-border-color: var(--okd-color-transparent-base-white);
  --okd-input-default-caret-color: var(--okd-color-content-primary);
  --okd-input-default-shadow: 0px 0px 0px 0px transparent;
  --okd-input-default-background: var(--okd-color-neutral-180);
  --okd-input-hover-text-color: var(--okd-color-content-primary);
  --okd-input-hover-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-hover-border-color: var(--okd-color-transparent-base-white);
  --okd-input-hover-caret-color: var(--okd-color-content-primary);
  --okd-input-hover-shadow: 0px 0px 0px 0px #fafafa33;
  --okd-input-hover-background: var(--okd-color-neutral-180);
  --okd-input-focus-text-color: var(--okd-color-content-primary);
  --okd-input-focus-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-focus-border-color: var(--okd-color-border-selected);
  --okd-input-focus-caret-color: var(--okd-color-content-brand);
  --okd-input-focus-shadow: 0px 0px 0px 0px #00000000;
  --okd-input-focus-background: var(--okd-color-neutral-180);
  --okd-input-disabled-text-color: var(--okd-color-content-disabled);
  --okd-input-disabled-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-disabled-border-color: var(--okd-color-border-primary);
  --okd-input-disabled-caret-color: var(--okd-color-content-disabled);
  --okd-input-disabled-shadow: var(--okd-shadow-sm);
  --okd-input-disabled-background: var(--okd-color-neutral-180);
  --okd-input-error-text-color: var(--okd-color-content-primary);
  --okd-input-error-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-error-border-color: var(--okd-color-semantic-negative);
  --okd-input-error-caret-color: var(--okd-color-content-brand);
  --okd-input-error-shadow: var(--okd-shadow-sm);
  --okd-input-error-background: var(--okd-color-neutral-180);
  --okd-input-error-tips-color: var(--okd-color-semantic-negative);
  --okd-input-tips-text-color: var(--okd-color-content-contrast);
  --okd-input-icon-color: var(--okd-color-content-contrast);
  --okd-input-label-color: var(--okd-color-content-primary);
  --okd-input-action-color: var(--okd-color-content-primary);
  --okd-input-md-label-font-size: var(--okd-font-size-md);
  --okd-input-sm-label-font-size: var(--okd-font-size-xs);
  --okd-input-xs-label-font-size: var(--okd-font-size-xs);
  --okd-input-md-label-line-height: 20px;
  --okd-input-sm-label-line-height: var(--okd-line-height-xs);
  --okd-input-xs-label-line-height: var(--okd-line-height-xs);
  --okd-input-md-action-font-size: var(--okd-font-size-md);
  --okd-input-sm-action-font-size: var(--okd-font-size-xs);
  --okd-input-xs-action-font-size: var(--okd-font-size-xs);
  --okd-input-md-action-line-height: 20px;
  --okd-input-sm-action-line-height: var(--okd-line-height-xs);
  --okd-input-xs-action-line-height: var(--okd-line-height-xs);
  --okd-input-md-height: 40px;
  --okd-input-md-text-font-size: var(--okd-font-size-md);
  --okd-input-md-border-radius: 8px;
  --okd-input-md-error-font-size: 14px;
  --okd-input-md-error-line-height: 16px;
  --okd-input-md-tip-font-size: 14px;
  --okd-input-md-tip-line-height: 16px;
  --okd-input-md-icon-size: 20px;
  --okd-input-md-icon-margin: 6px;
  --okd-input-sm-height: 32px;
  --okd-input-sm-text-font-size: var(--okd-font-size-xs);
  --okd-input-sm-border-radius: 8px;
  --okd-input-sm-error-font-size: var(--okd-font-size-xs);
  --okd-input-sm-error-line-height: var(--okd-line-height-xs);
  --okd-input-sm-tip-font-size: var(--okd-font-size-xs);
  --okd-input-sm-tip-line-height: var(--okd-line-height-xs);
  --okd-input-sm-icon-size: 16px;
  --okd-input-sm-icon-margin: 4px;
  --okd-input-xs-height: 28px;
  --okd-input-xs-text-font-size: var(--okd-font-size-xs);
  --okd-input-xs-border-radius: 8px;
  --okd-input-xs-error-font-size: var(--okd-font-size-xs);
  --okd-input-xs-error-line-height: var(--okd-line-height-xs);
  --okd-input-xs-tip-font-size: var(--okd-font-size-xs);
  --okd-input-xs-tip-line-height: var(--okd-line-height-xs);
  --okd-input-xs-icon-size: 16px;
  --okd-input-xs-icon-margin: 4px;
  --okd-input-number-default-add-icon-color: var(--okd-color-content-disabled);
  --okd-input-number-default-add-icon-background: var(
    --okd-color-transparent-base-white
  );
  --okd-input-number-hover-add-icon-color: var(--okd-color-content-primary);
  --okd-input-number-hover-add-icon-background: var(
    --okd-color-background-surface-pressed
  );
  --okd-input-number-active-add-icon-color: var(--okd-color-gray-700);
  --okd-input-number-active-add-icon-background: var(--okd-color-gray-200);
  --okd-input-number-disabled-add-icon-color: var(--okd-color-content-disabled);
  --okd-input-number-disabled-add-icon-background: var(
    --okd-color-content-disabled
  );
  --okd-input-code-common-btn-color: var(--okd-color-blue-900);
  --okd-input-code-common-btn-disabled-color: var(--okd-color-gray-300);
  --okd-input-code-common-count-color: var(--okd-color-content-disabled);
  --okd-input-code-md-btn-font-size: var(--okd-font-size-md);
  --okd-input-code-md-btn-line-height: var(--okd-line-height-md);
  --okd-input-code-md-count-font-size: var(--okd-font-size-md);
  --okd-input-code-md-count-line-height: var(--okd-line-height-md);
  --okd-input-code-sm-btn-font-size: var(--okd-font-size-xs);
  --okd-input-code-sm-btn-line-height: var(--okd-line-height-xs);
  --okd-input-code-sm-count-font-size: var(--okd-font-size-xs);
  --okd-input-code-sm-count-line-height: var(--okd-line-height-xs);
  --okd-input-code-xs-btn-font-size: var(--okd-font-size-xs);
  --okd-input-code-xs-btn-line-height: var(--okd-line-height-xs);
  --okd-input-code-xs-count-font-size: var(--okd-font-size-xs);
  --okd-input-code-xs-count-line-height: var(--okd-line-height-xs);
  --okd-input-search-default-text-color: var(--okd-color-content-primary);
  --okd-input-search-default-placeholder-color: var(
    --okd-color-content-disabled
  );
  --okd-input-search-default-border-color: var(--okd-color-transparent);
  --okd-input-search-default-caret-color: var(--okd-color-content-primary);
  --okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
  --okd-input-search-default-background: var(--okd-color-neutral-180);
  --okd-input-search-hover-text-color: var(--okd-color-content-primary);
  --okd-input-search-hover-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-search-hover-border-color: var(
    --okd-color-transparent-base-white
  );
  --okd-input-search-hover-caret-color: var(--okd-color-content-primary);
  --okd-input-search-hover-shadow: 0px 0px 0px 0px #0000001a;
  --okd-input-search-hover-background: var(--okd-color-neutral-180);
  --okd-input-search-focus-text-color: var(--okd-color-content-primary);
  --okd-input-search-focus-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-search-focus-border-color: var(--okd-color-border-selected);
  --okd-input-search-focus-caret-color: var(--okd-color-content-brand);
  --okd-input-search-focus-shadow: 0px 0px 0px 0px #00000000;
  --okd-input-search-focus-background: var(--okd-color-neutral-180);
  --okd-input-search-error-text-color: var(--okd-color-content-primary);
  --okd-input-search-error-placeholder-color: var(--okd-color-content-disabled);
  --okd-input-search-error-border-color: var(--okd-color-semantic-negative);
  --okd-input-search-error-caret-color: var(--okd-color-semantic-highlight);
  --okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
  --okd-input-search-error-background: var(--okd-color-neutral-180);
  --okd-input-search-disabled-text-color: var(--okd-color-content-disabled);
  --okd-input-search-disabled-placeholder-color: var(
    --okd-color-content-disabled
  );
  --okd-input-search-disabled-border-color: var(
    --okd-color-transparent-base-black
  );
  --okd-input-search-disabled-caret-color: var(--okd-color-content-disabled);
  --okd-input-search-disabled-shadow: 0px 0px 0px 0px #0000000d;
  --okd-input-search-disabled-background: var(--okd-color-neutral-180);
  --okd-input-search-error-tips-color: var(--okd-color-semantic-negative);
  --okd-input-search-suffix-icon-size: 13px;
  --okd-input-search-suffix-icon-color: var(--okd-color-content-contrast);
  --okd-input-search-prefix-icon-color: var(--okd-color-content-contrast);
  --okd-input-search-prefix-icon-size: 20px;
  --okd-input-verify-md-width: 40px;
  --okd-input-verify-md-height: 44px;
  --okd-input-lg-label-font-size: 14px;
  --okd-input-lg-label-line-height: 20px;
  --okd-input-lg-label-margin: 6px;
  --okd-input-lg-action-font-size: 14px;
  --okd-input-lg-action-line-height: 20px;
  --okd-input-lg-tip-font-size: 14px;
  --okd-input-lg-tip-line-height: 16px;
  --okd-input-lg-tip-margin: 6px;
  --okd-input-lg-error-font-size: 14px;
  --okd-input-lg-error-line-height: 16px;
  --okd-input-lg-height: 44px;
  --okd-input-lg-text-font-size: 14px;
  --okd-input-lg-border-radius: 8px;
  --okd-input-md-label-margin: 4px;
  --okd-input-md-tip-margin: 4px;
  --okd-input-sm-label-margin: 4px;
  --okd-input-sm-tip-margin: 4px;
  --okd-input-xs-label-margin: 4px;
  --okd-input-xs-tip-margin: 4px;
  --okd-input-lg-icon-size: 20px;
  --okd-input-lg-icon-margin: 8px;
  --okd-input-xl-label-line-height: 20px;
  --okd-input-xl-label-font-size: 14px;
  --okd-input-xl-label-margin: 6px;
  --okd-input-xl-action-line-height: 20px;
  --okd-input-xl-action-font-size: 14px;
  --okd-input-xl-tip-font-size: 14px;
  --okd-input-xl-tip-line-height: 16px;
  --okd-input-xl-tip-margin: 6px;
  --okd-input-xl-error-font-size: 14px;
  --okd-input-xl-error-line-height: 16px;
  --okd-input-xl-icon-size: 20px;
  --okd-input-xl-icon-margin: 8px;
  --okd-input-xl-height: 48px;
  --okd-input-xl-text-font-size: 14px;
  --okd-input-xl-border-radius: 8px;
  --okd-input-verify-xl-height: px;
  --okd-input-verify-xl-width: px;
  --okd-input-xs-padding-horizontal: 8px;
  --okd-input-sm-padding-horizontal: 8px;
  --okd-input-md-padding-horizontal: 8px;
  --okd-input-lg-padding-horizontal: 12px;
  --okd-input-xl-padding-horizontal: 12px;
  --okd-input-reversed-default-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-default-placeholder-color: rgba(0, 0, 0, 0.36);
  --okd-input-reversed-default-border-color: var(
    --okd-color-transparent-base-black
  );
  --okd-input-reversed-default-caret-color: var(--okd-color-content-inverse);
  --okd-input-reversed-default-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-default-background: var(--okd-color-neutral-20);
  --okd-input-reversed-hover-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-hover-placeholder-color: rgba(0, 0, 0, 0.36);
  --okd-input-reversed-hover-border-color: var(--okd-color-transparent-black);
  --okd-input-reversed-hover-caret-color: var(--okd-color-content-contrast);
  --okd-input-reversed-hover-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-hover-background: var(--okd-color-neutral-20);
  --okd-input-reversed-focus-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-focus-placeholder-color: rgba(0, 0, 0, 0.36);
  --okd-input-reversed-focus-border-color: var(--okd-color-neutral-200);
  --okd-input-reversed-focus-caret-color: var(--okd-color-content-inverse);
  --okd-input-reversed-focus-shadow: 0px 0px 0px 0px #ffffff00;
  --okd-input-reversed-focus-background: var(--okd-color-neutral-20);
  --okd-input-reversed-disabled-text-color: var(--okd-color-gray-600);
  --okd-input-reversed-disabled-placeholder-color: var(--okd-color-gray-600);
  --okd-input-reversed-disabled-border-color: var(--okd-color-neutral-30);
  --okd-input-reversed-disabled-caret-color: var(--okd-color-black);
  --okd-input-reversed-disabled-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-disabled-background: var(--okd-color-neutral-15);
  --okd-input-reversed-error-text-color: var(--okd-color-content-inverse);
  --okd-input-reversed-error-placeholder-color: rgba(0, 0, 0, 0.36);
  --okd-input-reversed-error-border-color: var(--okd-color-semantic-negative);
  --okd-input-reversed-error-caret-color: var(--okd-color-content-inverse);
  --okd-input-reversed-error-shadow: 0 0 0 0 transparent;
  --okd-input-reversed-error-background: var(--okd-color-neutral-20);
  --okd-input-reversed-error-tips-color: var(--okd-color-semantic-negative);
  --okd-input-reversed-tips-text-color: var(--okd-color-content-contrast);
  --okd-input-reversed-icon-color: var(--okd-color-gray-300);
  --okd-input-reversed-label-color: var(--okd-color-gray-050);
  --okd-input-reversed-action-color: var(--okd-color-content-inverse);
  --okd-input-number-reversed-default-add-icon-color: var(--okd-color-gray-400);
  --okd-input-number-reversed-default-add-icon-background: var(
    --okd-color-transparent
  );
  --okd-input-number-reversed-hover-add-icon-color: var(
    --okd-color-neutral-200
  );
  --okd-input-number-reversed-hover-add-icon-background: var(
    --okd-color-neutral-170
  );
  --okd-input-number-reversed-active-add-icon-color: var(--okd-color-gray-400);
  --okd-input-number-reversed-active-add-icon-background: var(
    --okd-color-transparent
  );
  --okd-input-number-reversed-disabled-add-icon-color: var(
    --okd-color-gray-500
  );
  --okd-input-number-reversed-disabled-add-icon-background: var(
    --okd-color-transparent
  );
  --okd-input-code-reversed-common-btn-color: var(--okd-color-content-inverse);
  --okd-input-code-reversed-common-btn-disabled-color: var(
    --okd-color-gray-300
  );
  --okd-input-code-reversed-common-count-color: var(
    --okd-color-content-tertiary
  );
  --okd-input-search-reversed-default-text-color: var(--okd-color-gray-050);
  --okd-input-search-reversed-default-placeholder-color: var(
    --okd-color-neutral-120
  );
  --okd-input-search-reversed-default-border-color: var(
    --okd-color-transparent
  );
  --okd-input-search-reversed-default-caret-color: var(--okd-color-gray-050);
  --okd-input-search-reversed-default-shadow: 0 0 0 0 transparent;
  --okd-input-search-reversed-default-background: var(--okd-color-neutral-20);
  --okd-input-search-reversed-hover-text-color: var(--okd-color-gray-050);
  --okd-input-search-reversed-hover-placeholder-color: var(
    --okd-color-gray-600
  );
  --okd-input-search-reversed-hover-border-color: var(
    --okd-color-transparent-white
  );
  --okd-input-search-reversed-hover-caret-color: var(--okd-color-black);
  --okd-input-search-reversed-hover-shadow: 0px 0px 0px 0px #1212121a;
  --okd-input-search-reversed-hover-background: var(--okd-color-neutral-20);
  --okd-input-search-reversed-focus-text-color: var(--okd-color-gray-050);
  --okd-input-search-reversed-focus-placeholder-color: var(
    --okd-color-gray-600
  );
  --okd-input-search-reversed-focus-border-color: var(
    --okd-color-transparent-base-black
  );
  --okd-input-search-reversed-focus-caret-color: var(
    --okd-color-content-inverse
  );
  --okd-input-search-reversed-focus-shadow: 0px 0px 0px 0px #1212121a;
  --okd-input-search-reversed-focus-background: var(--okd-color-neutral-20);
  --okd-input-search-reversed-error-text-color: var(--okd-color-gray-050);
  --okd-input-search-reversed-error-placeholder-color: var(
    --okd-color-gray-600
  );
  --okd-input-search-reversed-error-border-color: var(--okd-color-fq-critical);
  --okd-input-search-reversed-error-caret-color: var(
    --okd-color-content-inverse
  );
  --okd-input-search-reversed-error-shadow: 0 0 0 0 transparent;
  --okd-input-search-reversed-error-background: var(--okd-color-transparent);
  --okd-input-search-reversed-disabled-text-color: var(--okd-color-gray-050);
  --okd-input-search-reversed-disabled-placeholder-color: var(
    --okd-color-gray-600
  );
  --okd-input-search-reversed-disabled-border-color: var(
    --okd-color-transparent
  );
  --okd-input-search-reversed-disabled-caret-color: var(
    --okd-color-transparent
  );
  --okd-input-search-reversed-disabled-shadow: 0 0 0 0 transparent;
  --okd-input-search-reversed-disabled-background: var(--okd-color-gray-800);
  --okd-input-search-reversed-prefix-icon-color: var(--okd-color-gray-300);
  --okd-input-search-reversed-error-tips-color: var(--okd-color-fq-critical);
  --okd-input-search-suffix-icon-hover-color: var(--okd-color-content-contrast);
  --okd-input-verify-xl-border-radius: 8px;
  --okd-input-code-xl-btn-font-size: 12px;
  --okd-input-number-suffix-border-color: var(--okd-color-border-primary);
  --okd-input-verify-md-border-radius: 6px;
  --okd-input-verify-md-text-font-size: 26px;
  --okd-input-verify-md-margin: 8px;
  --okd-input-readonly-text-color: var(--okd-color-content-primary);
  --okd-input-readonly-placeholder-color: var(
    --okd-input-default-placeholder-color
  );
  --okd-input-readonly-border-color: var(--okd-color-border-primary);
  --okd-input-readonly-caret-color: var(--okd-input-default-caret-color);
  --okd-input-readonly-shadow: var(--okd-input-default-shadow);
  --okd-input-readonly-background: var(--okd-color-transparent-white);
}