#root {
  --foundation-colors-neutral-white: #ffffff;
  --foundation-colors-neutral-black: #000000;
  --foundation-colors-neutral-grey-500: #333333;
  --foundation-colors-neutral-grey-400: #595959;
  --foundation-colors-neutral-grey-300: #8c8c8c;
  --foundation-colors-neutral-grey-200: #bfbfbf;
  --foundation-colors-neutral-grey-100: #e6e6e6;
  --foundation-colors-neutral-lightGrey: #f4f4f4;
  --foundation-colors-primary-1: #3769ff;
  --foundation-colors-primary-2: #00bfb3;
  --foundation-colors-primary-3: #6730e3;
  --foundation-colors-primary-4: #e24100;
  --foundation-colors-primary-5: #c042ea;
  --foundation-colors-primary-6: #ff0f52;
  --foundation-colors-secondary-1-100: #ddeaff;
  --foundation-colors-secondary-1-200: #91b9ff;
  --foundation-colors-secondary-1-300: #5291fe;
  --foundation-colors-secondary-1-400: #1446e1;
  --foundation-colors-secondary-2-100: #d3fbf7;
  --foundation-colors-secondary-2-200: #72dbd5;
  --foundation-colors-secondary-2-300: #00a096;
  --foundation-colors-secondary-2-400: #00847d;
  --foundation-colors-secondary-3-100: #e7dffe;
  --foundation-colors-secondary-3-200: #b39af5;
  --foundation-colors-secondary-3-300: #8760ef;
  --foundation-colors-secondary-3-400: #4b00b6;
  --foundation-colors-secondary-4-100: #ffe0d2;
  --foundation-colors-secondary-4-200: #ff9665;
  --foundation-colors-secondary-4-300: #ff6035;
  --foundation-colors-secondary-4-400: #be3200;
  --foundation-colors-secondary-5-100: #fae4fd;
  --foundation-colors-secondary-5-200: #f0b4f9;
  --foundation-colors-secondary-5-300: #cb6eee;
  --foundation-colors-secondary-5-400: #a525d0;
  --foundation-colors-secondary-6-100: #ffdde6;
  --foundation-colors-secondary-6-200: #f589a2;
  --foundation-colors-secondary-6-300: #f04f74;
  --foundation-colors-secondary-6-400: #dc0546;

  --semantic-colors-text-primary: var(--foundation-colors-neutral-black);
  --semantic-colors-text-secondary: var(--foundation-colors-neutral-grey-400);
  --semantic-colors-text-tertiary: var(--foundation-colors-neutral-white);
  --semantic-colors-icon-primary: var(--foundation-colors-primary-1);
  --semantic-colors-icon-secondary: var(--foundation-colors-neutral-grey-400);
  --semantic-colors-icon-tertiary: var(--foundation-colors-neutral-white);
  --semantic-colors-fill-primary: var(--foundation-colors-neutral-white);
  --semantic-colors-fill-secondary: var(--foundation-colors-neutral-lightGrey);
  --semantic-colors-fill-brand-primary: var(--foundation-colors-primary-1);
  --semantic-colors-fill-brand-secondary: var(
    --foundation-colors-secondary-1-100
  );
  --semantic-colors-fill-brand-tertiary: rgba(145, 185, 255, 0.5);
  --semantic-colors-fill-tertiary: var(--foundation-colors-neutral-grey-100);
  --semantic-colors-stroke-primary: var(--foundation-colors-neutral-grey-300);
  --semantic-colors-stroke-brand: var(--foundation-colors-primary-1);
  --semantic-colors-stroke-secondary: var(--foundation-colors-neutral-grey-200);
  --semantic-colors-link-active: var(--foundation-colors-primary-1);
  --semantic-colors-link-hover: var(--foundation-colors-secondary-1-200);
  --semantic-colors-link-focused: var(--foundation-colors-secondary-1-300);
  --semantic-colors-link-pressed: var(--foundation-colors-secondary-1-400);
  --semantic-colors-disabled-1: var(--foundation-colors-neutral-lightGrey);
  --semantic-colors-disabled-2: var(--foundation-colors-neutral-grey-200);
  --semantic-colors-disabled-3: var(--foundation-colors-neutral-grey-300);
  --semantic-colors-feedback-success: var(--foundation-colors-secondary-2-400);
  --semantic-colors-feedback-error: var(--foundation-colors-secondary-6-400);
  --semantic-colors-feedback-neutral: var(--foundation-colors-neutral-black);
  --semantic-colors-feedback-warning: var(--foundation-colors-secondary-4-300);
  --semantic-colors-feedback-information: var(
    --foundation-colors-secondary-1-300
  );
  --semantic-colors-interaction-success: var(
    --foundation-colors-secondary-2-300
  );
  --semantic-colors-interaction-error: var(--foundation-colors-secondary-6-300);
  --semantic-colors-interaction-neutral: var(--foundation-colors-neutral-black);
  --semantic-colors-interaction-warning: var(
    --foundation-colors-secondary-4-200
  );
  --semantic-colors-interaction-information: var(
    --foundation-colors-secondary-1-200
  );

  --spacing-zero: 1px;
  --spacing-nano: 4px;
  --spacing-xxxs: 8px;
  --spacing-xxs: 16px;
  --spacing-xs: 24px;
  --spacing-sm: 32px;
  --spacing-md: 40px;
  --spacing-lg: 48px;
  --spacing-xl: 56px;
  --spacing-xxl: 64px;
  --spacing-xxxl: 80px;
  --spacing-huge: 120px;
  --spacing-giant: 160px;

  --border-radius-xs: 4px;
  --border-radius-sm: 8px;
  --border-radius-md: 16px;
  --border-radius-lg: 32px;
  --border-radius-full: 360px;

  --alpha-semi-opaque: 0.72;
  --alpha-intense: 0.64;
  --alpha-medium: 0.32;
  --alpha-light: 0.16;
  --alpha-semi-transparent: 0.08;

  --shadows-down-small: 0px 1px 2px 0px rgba(0, 0, 0, 0.32px);
}

body,
#root {
  max-width: 100vw !important;
  padding: unset !important;
  margin: unset !important;
}

.text-screen-body-200-regular {
  font-family: "TT Commons Pro";
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 1%;
}

.text-screen-body-200-demibold {
  font-family: "TT Commons Pro";
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0%;
}

.text-screen-body-200-medium-condensed {
  color: var(--colors-text-primary, #000);

  /* Screen/Body/200/3 - 200 Medium Condensed */
  font-family: "TT Commons Pro Condensed";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
}

.text-screen-title-200-regular {
  font-family: "TT Commons Pro";
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 1%;
}

.primary-color {
  color: #1446e1;
}

.secondary-color {
  color: #ff0f52;
}

/* EfficientFrontierCard styles */
.efficient-frontier-card {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.efficient-frontier-card-container {
  background-color: #3769ff;
  width: 192px;
  height: 132px;
  border-radius: 10px;
  padding: 10px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.efficient-frontier-card-title {
  font-size: 14px;
  font-weight: bold;
}

.efficient-frontier-card-content {
  font-size: 14px;
}

.efficient-frontier-card-row {
  display: flex;
  justify-content: space-between;
}

.efficient-frontier-card-value {
  font-size: 16px;
}

.efficient-frontier-card-button {
  background-color: #3769ff;
  width: 192px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border: 0px;
  pointer-events: auto;
  color: white;
  font-size: 14px;
  font-weight: bold;
}

.efficient-frontier-card-spacer {
  height: 5px;
}

.custom-x-axis-button {
  border: none;
  cursor: pointer;
  padding: 10px 12px;
  margin-top: var(--spacing-xxs);
  border-radius: var(--border-radius-xs);
}

.custom-x-axis-button-selected {
  color: var(--semantic-colors-text-tertiary);
  background-color: var(--semantic-colors-link-active);
}

.custom-x-axis-button-unselected {
  color: var(--semantic-colors-link-active);
  background-color: transparent;
}

/** CME distribution styles */
.cme-distribution-axis-label {
  color: var(--semantic-colors-text-primary);
}

.cme-distribution-axis-tick-text {
  color: var(--semantic-colors-text-primary);
  font-family: "TT Commons Pro Condensed";
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 2%;
}

/** Exposure chart styles */
.exposure-chart-tooltip {
  box-shadow: 0px 0px 8px 0px #0000003d;
  background: #ffffff;
  width: 124;
  border-radius: 8px;
  padding-top: 8px;
  padding-right: 16px;
  padding-bottom: 8px;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}

.exposure-chart-tooltip .title {
   overflow-wrap: break-word;
   white-space: normal;
}
.exposure-chart-tooltip-row {
  display: flex;
  justify-content: space-between;
  column-gap: 32px;
}

.exposure-chart-tooltip-row p {
  margin: 0;
}

.dist-of-exposure-chart .highcharts-scrolling, .current-exposure-chart .highcharts-scrolling {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}
.dist-of-exposure-chart .highcharts-scrolling::-webkit-scrollbar, .current-exposure-chart .highcharts-scrolling::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}

.mfd-chart-comp .temp-hide{
  visibility: hidden;
}

.contribution-to-risk-chart .category-Alpha .MuiButtonBase-root,
.contribution-to-risk-chart .category-Total_Risk .MuiButtonBase-root,
.contribution-to-risk-chart .category-Total_Risk .count,
.contribution-to-risk-chart .category-Alpha .count{
    display: none;
}

.contribution-to-risk-chart .category span.sum {position: absolute;right: 15px;}

.contribution-to-risk-chart .sub-category .MuiDataGrid-cell.MuiDataGrid-cell--textLeft {padding-left: 25px;}