.hacker_theme-app-theme { /* stylelint-disable-line selector-class-pattern */
  --primary-color: #fe78c6;
  --primary-hover-color: #fe5ab9;
  --primary-selected-color: #9f4077;
  --primary-selected-hover-color: #0d2e65;
  --primary-highlighted-color: #0b2858;
  --primary-surface-color: #111111;

  --primary-text-color: #d5d8df;
  --secondary-text-color: #9699a6;
  --text-color-on-inverted: #323338;
  --disabled-text-color: rgba(238, 238, 238, var(--disabled-component-opacity));
  --inverted-color-background: #ffffff;

  --fixed-dark-color: #323338;
  --fixed-light-color: #ffffff;

  --primary-background-color: #282a36;
  --primary-background-hover-color: #4b4e69;
  --secondary-background-color: #30324e;
  --allgrey-background-color: #282a36;
  --ui-border-color: #797e93;
  --ui-background-color: #4b4e69;
  --ui-background-hover-color: #3b3b3b;
  --layout-border-color: #414458;

  --placeholder-color: #c3c6d4;
  --icon-color: #c3c6d4;
  --disabled-background-color: #3a3a3a;
  --link-color: #bd93f9;

  --brand-color: #fe78c6;
  --brand-hover-color: #fe5ab9;
  --brand-selected-color: #9f4077;
  --brand-selected-hover-color: #0d2e65;

  --positive-color: #50fa7b;
  --positive-color-hover: #007038;
  --positive-color-selected: #26503e;
  --positive-color-selected-hover: #194733;
  --negative-color: #ff5555;
  --negative-color-hover: #b63546;
  --negative-color-selected: #642830;
  --negative-color-selected-hover: #5a2027;
  --warning-color: #ffcb00;
  --warning-color-hover: #eaaa15;
  --warning-color-selected: #503e02;
  --warning-color-selected-hover: #402f00;

  --grey-background-color: #282a36;

  --box-shadow-xs: 0px 4px 6px -4px #000000;
  --box-shadow-small: 0px 4px 8px #000000;
  --box-shadow-medium: 0px 6px 20px #000000;
  --box-shadow-large: 0px 15px 50px #000000;

  --color-grass_green: #359970; /* stylelint-disable-line custom-property-pattern */
  --color-grass_green-hover: #116846; /* stylelint-disable-line custom-property-pattern */
  --color-grass_green-selected: #0a482e; /* stylelint-disable-line custom-property-pattern */
  --color-done-green: #33d391;
  --color-done-green-hover: #0f9b63;
  --color-done-green-selected: #096c43;
  --color-done-green-selected-with-opacity: rgba(9, 108, 67, 0.6);
  --color-bright-green: #b0dc51;
  --color-bright-green-hover: #7ca32b;
  --color-bright-green-selected: #56721b;
  --color-saladish: #d5c567;
  --color-saladish-hover: #9d8f3e;
  --color-saladish-selected: #6d6329;
  --color-egg_yolk: #ffd533; /* stylelint-disable-line custom-property-pattern */
  --color-egg_yolk-hover: #c29e11; /* stylelint-disable-line custom-property-pattern */
  --color-egg_yolk-selected: #886e09; /* stylelint-disable-line custom-property-pattern */
  --color-egg_yolk-rgb: 255, 213, 51; /* stylelint-disable-line custom-property-pattern */
  --color-working_orange: #fdbc64; /* stylelint-disable-line custom-property-pattern */
  --color-working_orange-hover: #c0873c; /* stylelint-disable-line custom-property-pattern */
  --color-working_orange-selected: #875e27; /* stylelint-disable-line custom-property-pattern */
  --color-dark-orange: #ff6d3b;
  --color-dark-orange-hover: #c25531;
  --color-dark-orange-selected: #883a1f;
  --color-peach: #ffbdbd;
  --color-peach-hover: #c2888a;
  --color-peach-selected: #885f5f;
  --color-sunset: #ff9191;
  --color-sunset-hover: #c26163;
  --color-sunset-selected: #884343;
  --color-sunset-selected-with-opacity: rgba(136, 67, 67, 0.6);
  --color-stuck-red: #e8697d;
  --color-stuck-red-hover: #ad3f51;
  --color-stuck-red-selected: #792a36;
  --color-dark-red: #c95c76;
  --color-dark-red-hover: #92334c;
  --color-dark-red-selected: #662232;
  --color-sofia_pink: #ff44a1; /* stylelint-disable-line custom-property-pattern */
  --color-sofia_pink-hover: #c21e71; /* stylelint-disable-line custom-property-pattern */
  --color-sofia_pink-selected: #88134d; /* stylelint-disable-line custom-property-pattern */
  --color-lipstick: #ff7bd0;
  --color-lipstick-hover: #c24e9a;
  --color-lipstick-selected: #88356a;
  --color-bubble: #fbb4f4;
  --color-bubble-hover: #be80ba;
  --color-bubble-selected: #855981;
  --color-purple: #b57de3;
  --color-purple-hover: #8050ab;
  --color-purple-selected: #593776;
  --color-dark_purple: #936fda; /* stylelint-disable-line custom-property-pattern */
  --color-dark_purple-hover: #6344a3; /* stylelint-disable-line custom-property-pattern */
  --color-dark_purple-selected: #442e71; /* stylelint-disable-line custom-property-pattern */
  --color-berry: #9862a1;
  --color-berry-hover: #673971;
  --color-berry-selected: #47264d;
  --color-dark_indigo: #6645a9; /* stylelint-disable-line custom-property-pattern */
  --color-dark_indigo-hover: #3c1f78; /* stylelint-disable-line custom-property-pattern */
  --color-dark_indigo-selected: #291452; /* stylelint-disable-line custom-property-pattern */
  --color-indigo: #777ae5;
  --color-indigo-hover: #4b4ead;
  --color-indigo-selected: #333578;
  --color-navy: #4e73a7;
  --color-navy-hover: #274776;
  --color-navy-selected: #193151;
  --color-bright-blue: #79affd;
  --color-bright-blue-hover: #4c7cc1;
  --color-bright-blue-selected: #345686;
  --color-dark-blue: #339ecd;
  --color-dark-blue-hover: #0f6d97;
  --color-dark-blue-selected: #094b69;
  --color-aquamarine: #71d6d1;
  --color-aquamarine-hover: #469e9b;
  --color-aquamarine-selected: #2f6e6b;
  --color-chili-blue: #85d6ff;
  --color-chili-blue-hover: #569ec3;
  --color-chili-blue-selected: #3b6e88;
  --color-river: #86b4ca;
  --color-river-hover: #588095;
  --color-river-selected: #3c5967;
  --color-winter: #aebdca;
  --color-winter-hover: #7b8895;
  --color-winter-selected: #555f67;
  --color-explosive: #d0d0d0;
  --color-explosive-hover: #98999a;
  --color-explosive-selected: #6a6a6a;
  --color-american_gray: #999999; /* stylelint-disable-line custom-property-pattern */
  --color-american_gray-hover: #69696a; /* stylelint-disable-line custom-property-pattern */
  --color-american_gray-selected: #494949; /* stylelint-disable-line custom-property-pattern */
  --color-blackish: #5c5c5c;
  --color-blackish-hover: #222222;
  --color-blackish-selected: #111111;
  --color-brown: #99756c;
  --color-brown-hover: #684943;
  --color-brown-selected: #48322c;
  --color-orchid: #e190c0;
  --color-orchid-hover: #b4739a;
  --color-orchid-selected: #7e516c;
  --color-tan: #bdab95;
  --color-tan-hover: #978977;
  --color-tan-selected: #6a6053;
  --color-sky: #b4e9f8;
  --color-sky-hover: #90bac6;
  --color-sky-selected: #65828b;
  --color-coffee: #ca9a8b;
  --color-coffee-hover: #a27b6f;
  --color-coffee-selected: #71564e;
  --color-royal: #5591ea;
  --color-royal-hover: #4474bb;
  --color-royal-selected: #305183;
  --color-teal: #457b82;
  --color-teal-hover: #376268;
  --color-teal-selected: #274549;
  --color-lavender: #cab9fa;
  --color-lavender-hover: #a294c8;
  --color-lavender-selected: #71688c;
  --color-steel: #bacbed;
  --color-steel-hover: #95a2be;
  --color-steel-selected: #687185;
  --color-lilac: #687185;
  --color-lilac-hover: #8e8a9f;
  --color-lilac-selected: #63616f;
  --color-pecan: #786565;
  --color-pecan-hover: #605151;
  --color-pecan-selected: #433939;
  /*

  LEGACY VALUES

  These values are not within Vibe's UI definitions and are on a deprecation path.
  Please stop using them and make efforts to replace theme with their Vibe corresponding keys.

  */
  --color-success: #50fa7b;
  --color-error: #ff5555;
  --primary-on-secondary-color: #fe78c6;
  --primary-hover-on-secondary-color: #fe5ab9;
  --primary-selected-color-rgb: 159, 64, 119;
  --primary-selected-on-secondary-color: #9f4077;
  --primary-text-on-secondary-color: #d5d8df;
  --primary-background-color-rgb: 40, 42, 54;
  --primary-background-hover-on-secondary-color: #4b4e69;
  --secondary-background-color-rgb: 48, 50, 78;
  --secondary-text-on-secondary-color: #9699a6;
  --link-on-secondary-color: #bd93f9;
  --modal-background-color: #282a36;
  --dark-background-color: #303241;
  --dark-background-on-secondary-color: #595959;
  --dialog-background-color: #30324e;
  --label-background-color: #404b69;
  --label-background-on-secondary-color: #404b69;
  --icon-on-secondary-color: #c3c6d4;
  --placeholder-color-with-opacity: rgba(195, 198, 212, 0.1);
  --placeholder-on-secondary-color: #c3c6d4;
  --ui-border-on-secondary-color: #797e93;
  --layout-border-on-secondary-color: #414458;
  --disabled-background-on-secondary-color: #3a3a3a;
  --disabled-text-on-secondary-color: rgba(238, 238, 238, var(--disabled-component-opacity));
  --box-shadow-mediun: 0px 6px 20px rgba(0, 0, 0, 0.2);
}