:root {
    --page-max-width: 960px;
    --card-bg: #fff;
    --scale: 2;

    --z-index-sticky-left-col: 1;
    --z-index-sticky-diagram: 1;

    --z-index-scroll-button: 100;
    --z-index-error-msg: 300;
    --z-index-spinner: 300;
    --z-index-fullscreen-ui-blocker: 400;
    --z-index-card-full-screen: 500;
    --z-index-card-dropdown: 530;
    --z-index-undo-toast: 600;
    --z-index-ui-blocker: 900;
    --z-index-dialog: 1000;
    --z-index-copy-toast: 9000;

    --borderRadiusNone: 0;
    --borderRadiusSmall: 2px;
    --borderRadiusMedium: 4px;
    --borderRadiusLarge: 6px;
    --borderRadiusXLarge: 8px;
    --borderRadiusCircular: 10000px;

    --colorNeutralForeground1: #242424;
    --colorNeutralForeground1Hover: #242424;
    --colorNeutralForeground1Pressed: #242424;
    --colorNeutralForeground1Selected: #242424; 
    --colorNeutralForeground2: #424242;
    --colorNeutralForeground2Hover: #242424;
    --colorNeutralForeground2Pressed: #242424;
    --colorNeutralForeground2Selected: #242424; 
    --colorNeutralForeground2BrandHover: #0f6cbd;
    --colorNeutralForeground2BrandPressed: #115ea3;
    --colorNeutralForeground2BrandSelected: #0f6cbd; 
    --colorNeutralForeground3: #616161;
    --colorNeutralForegroundDisabled: #bdbdbd;
    --colorBrandForegroundLink: #115ea3;
    --colorBrandForegroundLinkHover: #0f548c;
    --colorBrandForegroundLinkPressed: #0c3b5e;
    --colorBrandForegroundLinkSelected: #115ea3; 
    --colorNeutralForegroundOnBrand: #ffffff;
    --colorBrandForegroundOnLight: #0f6cbd; 
    --colorBrandForegroundOnLightHover: #115ea3; 
    --colorBrandForegroundOnLightPressed: #0e4775; 
    --colorBrandForegroundOnLightSelected: #0f548c; 
    --colorNeutralBackground1: #ffffff;
    --colorNeutralBackground1Hover: #f5f5f5;
    --colorNeutralBackground1Pressed: #e0e0e0;
    --colorNeutralBackground1Selected: #ebebeb;
    --colorNeutralBackground2: #fafafa;
    --colorNeutralBackground2Hover: #f0f0f0;
    --colorNeutralBackground2Pressed: #dbdbdb; 
    --colorNeutralBackground2Selected: #e6e6e6; 
    --colorNeutralBackground3: #f5f5f5;
    --colorNeutralBackgroundStatic: #333333;
    --colorNeutralBackgroundDisabled: #f0f0f0;
    --colorNeutralStroke1: #d1d1d1;
    --colorNeutralStroke1Hover: #c7c7c7;
    --colorNeutralStroke1Pressed: #b3b3b3;
    --colorNeutralStroke1Selected: #bdbdbd;
    --colorNeutralStroke2: #e0e0e0;
    --colorSubtleBackground: transparent;
    --colorSubtleBackgroundHover: #f5f5f5;
    --colorSubtleBackgroundPressed: #e0e0e0;
    --colorSubtleBackgroundSelected: #ebebeb; 
    --colorSubtleBackgroundLightAlphaHover: rgba(255, 255, 255, 0.7); 
    --colorSubtleBackgroundLightAlphaPressed: rgba(255, 255, 255, 0.5); 
    --colorSubtleBackgroundLightAlphaSelected: transparent; 
    --colorBackgroundOverlay: rgba(0, 0, 0, 0.4);
    --colorBrandBackground: #0f6cbd;
    --colorBrandBackgroundHover: #115ea3;
    --colorBrandBackgroundPressed: #0c3b5e;
    --colorPaletteRedForeground1: #bc2f32;
    --colorPaletteRedBorder2: #d13438;
    --colorPaletteGreenBackground1: #f1faf1;
    --colorPaletteGreenForeground1: #0e700e;
    --colorPaletteGreenBorder1: #9fd89f;
    --colorPaletteYellowBackground2: #fef7b2;
    --colorPaletteYellowBorder2: #fde300;
    --colorStrokeFocus2: #000000;
    --colorNeutralStrokeAccessible: #616161;
    --colorNeutralStrokeAccessibleHover: #575757;
    --colorNeutralStrokeAccessiblePressed: #4d4d4d;
    --colorBrandStroke1: #0f6cbd;
    --colorBrandStroke2: #b4d6fa;
    --colorCompoundBrandStroke: #0f6cbd;
    --colorCompoundBrandStrokeHover: #115ea3;
    --colorCompoundBrandStrokePressed: #0f548c;
    --colorNeutralStrokeDisabled: #e0e0e0;
    --colorTransparentStroke: transparent;

    --shadow2: 0 0 2px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.14);
    --shadow4: 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.14);
    --shadow8: 0 0 2px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.14); 
    --shadow16: 0 0 2px rgba(0, 0, 0, 0.12), 0 8px 16px rgba(0, 0, 0, 0.14); 
    --shadow28: 0 0 8px rgba(0, 0, 0, 0.12), 0 14px 28px rgba(0, 0, 0, 0.14); 
    --shadow64: 0 0 8px rgba(0, 0, 0, 0.12), 0 32px 64px rgba(0, 0, 0, 0.14);
    --fontSizeBase100: 10px;
    --fontSizeBase200: 12px;
    --fontSizeBase300: 14px;
    --fontSizeBase400: 16px;
    --fontSizeBase500: 20px;
    --lineHeightBase100: 14px;
    --lineHeightBase200: 16px;
    --lineHeightBase300: 20px;
    --lineHeightBase400: 22px;
    --lineHeightBase500: 28px;
    --fontFamilyBase: 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif;
    --fontFamilyMonospace: Consolas, 'Courier New', Courier, monospace; 
    --fontFamilyNumeric: Bahnschrift, 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif; 
    --fontWeightRegular: 400;
    --fontWeightMedium: 500;
    --fontWeightSemibold: 600;
    --fontWeightBold: 700;
    --control-corner-radius: 4px;
    --strokeWidthThin: 1px;
    --strokeWidthThick: 2px;
    --spacingHorizontalXXS: 2px;
    --spacingHorizontalXS: 4px;
    --spacingHorizontalSNudge: 6px;
    --spacingHorizontalS: 8px;
    --spacingHorizontalMNudge: 10px;
    --spacingHorizontalM: 12px;
    --spacingHorizontalL: 16px;
    --spacingVerticalXXS: 2px;
    --spacingVerticalXS: 4px; 
    --spacingVerticalSNudge: 6px; 
    --spacingVerticalS: 8px;
    --spacingVerticalMNudge: 10px; 
    --spacingVerticalM: 12px; 
    --spacingVerticalL: 16px; 
    --durationUltraFast: 50ms;
    --durationFaster: 100ms;
    --durationFast: 150ms;
    --durationNormal: 200ms;
    --durationGentle: 250ms;
    --curveAccelerateMax: cubic-bezier(0.9, 0.1, 1, 0.2);
    --curveAccelerateMid: cubic-bezier(1, 0, 1, 1);
    --curveAccelerateMin: cubic-bezier(0.8, 0, 0.78, 1);
    --curveDecelerateMax: cubic-bezier(0.1, 0.9, 0.2, 1);
    --curveDecelerateMid: cubic-bezier(0, 0, 0, 1);
    --curveDecelerateMin: cubic-bezier(0.33, 0, 0.1, 1); 
    --curveEasyEaseMax: cubic-bezier(0.8, 0, 0.2, 1); 
    --curveEasyEase: cubic-bezier(0.33, 0, 0.67, 1);
    --curveLinear: cubic-bezier(0, 0, 1, 1);

    --ui-color-alert-red-tint: #f9ded3;
    --ui-color-alert-green-tint: #f2f7eb;
    --ui-color-alert-yellow-tint: #fff3d5;
    --ui-color-alert-blue-tint: #e8eff9;
    --ui-color-surface-error: var(--ui-color-alert-red-tint);
    --ui-color-surface-warning: var(--ui-color-alert-yellow-tint);
    --ui-color-surface-information: var(--ui-color-alert-blue-tint);
    --ui-color-message-text-primary-on-light: #512b2b;

    --disabled-opacity: 0.3;
    --neutral-stroke-control-rest: linear-gradient(#efefef 90%, #d6d6d6 100%);
    --neutral-stroke-control-rest2: linear-gradient(#eaeaea 90%, #cecece 100%);
    --neutral-stroke-control-hover: linear-gradient(#e5e5e5 90%, #cecece 100%);
    --neutral-stroke-control-hover2: linear-gradient(#eaeaea 90%, #d1d1d1 100%);
    --neutral-stroke-control-active: #e5e5e5;
    --neutral-stroke-control-focus: linear-gradient(#e5e5e5 90%, #cecece 100%);
    --neutral-fill-rest: #ffffff;
    --neutral-fill-hover: #f7f7f7;
    --neutral-fill-hover2: #f9f9f9;
    --neutral-fill-active: #fbfbfb;
    --neutral-fill-focus: #fbfbfb;
    --neutral-fill-input-rest: #ffffff;
    --neutral-fill-input-hover: #f7f7f7;
    --neutral-fill-input-active: #fbfbfb;
    --neutral-fill-input-focus: #ffffff;
    --neutral-stroke-input-rest: linear-gradient(#efefef calc(100% - 1px), #929292 calc(100% - 1px), #929292);
    --neutral-stroke-input-hover: linear-gradient(#e5e5e5 calc(100% - 1px), #8a8a8a calc(100% - 1px), #8a8a8a);
    --neutral-stroke-input-active: #e5e5e5; 
    --neutral-stroke-input-focus: linear-gradient(#e5e5e5 calc(100% - 1px), #8a8a8a calc(100% - 1px), #8a8a8a); 
    --focus-stroke-outer: #000000;
    --focus-stroke-inner: #ffffff;
    --accent-fill-rest: #036ac4;
    --accent-fill-hover: #0473ce;
    --accent-fill-active: #0481e0;
    --accent-fill-focus: #036ac4;
    --foreground-on-accent-rest: #ffffff;
    --foreground-on-accent-hover: #ffffff;
    --foreground-on-accent-active: #ffffff;
    --foreground-on-accent-focus: #ffffff; 
    --accent-foreground-rest: #023b8f;
    --accent-foreground-hover: #012e7f;
    --accent-foreground-active: #0360b9;
    --accent-foreground-focus: #023b8f; 
    --accent-stroke-control-rest: linear-gradient(#1c79ca 90%, #024885 100%);
    --accent-stroke-control-hover: linear-gradient(#1b80d2 90%, #035292 100%);
    --accent-stroke-control-active: #1b8ce3;
    --accent-stroke-control-focus: linear-gradient(#1c79ca 90%, #024885 100%); 
    --stroke-width: 1; 
    --focus-stroke-width: 2;
    --theme-visited: #624991;

    --cr-shadow-color: #000;
    --cr-card-background-color: white;
    --cr-shadow-key-color_: color-mix(in srgb, var(--cr-shadow-color) 30%, transparent);
    --cr-shadow-ambient-color_: color-mix(in srgb, var(--cr-shadow-color) 15%, transparent);
    --cr-elevation-1: var(--cr-shadow-key-color_) 0 1px 2px 0, var(--cr-shadow-ambient-color_) 0 1px 3px 1px;
    --cr-card-shadow: var(--cr-elevation-1);

    --bs-body-color: #212529;
    --bs-link-color: #0d6efd;
    --bs-link-hover-color: #0a58ca;
    --bs-border-width: 1px;
    --bs-border-radius: .375rem;
    --bs-border-radius-lg: .5rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-box-shadow-inset: inset 0 1px 2px #00000013;

    --neutral-fill-stealth-rest: #fbfbfb;
    --neutral-fill-stealth-hover: #efefef;
    --neutral-fill-stealth-active: #f3f3f3;
    --neutral-foreground-rest: #1a1a1a;
    --neutral-stroke-rest: #d6d6d6;
    --neutral-stroke-hover: #c6c6c6;
    --neutral-stroke-active: #e0e0e0;
    --elevation-shadow-flyout: 0 0 2px rgba(0, 0, 0, 0.2), 0 calc(32 * 0.5px) calc((32 * 1px)) rgba(0, 0, 0, 0.24);

    --_bu-br: 6px;
    --_bu-fc: 1b75d0; 
    --_bu-fs: 13px; 
    --_bu-bc-active: transparent; 
    --_bu-bg-active: #92c2f2;
    --_bu-fc-active: #155ca2;
    --_bu-bg-hover: #d6e8fa;
    --_bu-fc-hover: #155ca2;
    --_bu-filled-bc: transparent;
    --_bu-filled-bg: #1b75d0;
    --_bu-filled-fc: white;
    --_bu-filled-bc-active: var(--_bu-filled-bc);
    --_bu-filled-bg-active: #0c3b6a;
    --_bu-filled-fc-active: var(--_bu-filled-fc);
    --_bu-filled-bc-hover: var(--_bu-filled-bc);
    --_bu-filled-bg-hover: #155ca2;
    --_bu-filled-fc-hover: var(--_bu-filled-fc);
    --_bu-outlined-bc: #1b75d0;
    --_bu-outlined-bg: #fff;
    --_bg-outlined-fc: #1b75d0;

    --fluent-ui-wc2-accent-base-color: #036ac4;
    --fluent-ui-wc3-accent-base-color: #0f6cbd;
    --fluent-ui-react8-accent-base-color: #0078d4;
    --fluent-ui-react9-accent-base-color: #0f6cbd;
    --fluent-ui-blazor-accent-base-color: #036ac4;
    --mso365-accent-base-color: #185abd;
    --win11-accent-base-color: #0067C0;
    --win11-accent-foreground-color: #003e92;
}

.hidden {
    display: none !important;
}

.no-scroll {
    overflow: hidden;
}

.flex-row {
    display: flex;
    flex-direction: row;
}

.flex-row .flex-stretch-item {
    flex: 1;
}

.justify-content-end {
    justify-content: end !important;
}

.justify-content-center {
    justify-content: center !important;
}

.justify-content-space-between {
    justify-content: space-between !important;
}

.align-items-start {
    align-items: flex-start !important;
}

.align-items-center {
    align-items: center !important;
}

.flex-fill {
    flex: 1 1 auto !important;
}

.flex-column {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.flex-column .flex-stretch-item {
    flex: 1;
}

.p-0 {
    padding: 0 !important;
}

.p-1 {
    padding: 4px !important;
}

.p-2 {
    padding: 8px !important;
}

.p-3 {
    padding: 16px !important;
}

.px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.px-1 {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.px-2 {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.px-3 {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.py-1 {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

.py-2 {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.py-3 {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.pt-1 {
    padding-top: 4px !important;
}

.pt-2 {
    padding-top: 8px !important;
}

.pt-3 {
    padding-top: 16px !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.pb-1 {
    padding-bottom: 4px !important;
}

.pb-2 {
    padding-bottom: 8px !important;
}

.pb-3 {
    padding-bottom: 16px !important;
}

.ml-auto {
    margin-left: auto!important
}

.mr-auto {
    margin-right: auto!important;
}

.m-0 {
    margin: 0 !important;
}

.m-1 {
    margin: 4px !important;
}

.m-2 {
    margin: 8px !important;
}

.m-3 {
    margin: 16px !important;
}

.mt-0 {
    margin-top: 0 !important;
}

.mt-1 {
    margin-top: 4px !important;
}

.mt-2 {
    margin-top: 8px !important;
}

.mt-3 {
    margin-top: 16px !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mb-1 {
    margin-bottom: 4px !important;
}

.mb-2 {
    margin-bottom: 8px !important;
}

.mb-3 {
    margin-bottom: 16px !important;
}

.ml-0 {
    margin-left: 0 !important;
}

.ml-1 {
    margin-left: 4px !important;
}

.ml-2 {
    margin-left: 8px !important;
}

.ml-3 {
    margin-left: 16px !important;
}

.mr-0 {
    margin-right: 0 !important;
}

.mr-1 {
    margin-right: 4px !important;
}

.mr-2 {
    margin-right: 8px !important;
}

.mr-3 {
    margin-right: 16px !important;
}

.mx-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.mx-1 {
    margin-left: 4px !important;
    margin-right: 4px !important;
}

.mx-2 {
    margin-left: 8px !important;
    margin-right: 8px !important;
}

.mx-3 {
    margin-left: 16px !important;
    margin-right: 16px !important;
}

.nowrap {
    white-space: nowrap;
    overflow: hidden;
}

.jc-space-between {
    justify-content: space-between
}

.full-width {
    width: 100%;
    box-sizing: border-box;
}

.border-0 {
    border: 0 !important;
}

.border {
    border: 1px solid var(--colorNeutralStroke1) !important;
}

.border-b {
    border-bottom: 1px solid var(--colorNeutralStroke1) !important;
}

.border-t {
    border-top: 2px solid var(--colorNeutralStroke1) !important;
}

.gap-3 {
    gap: 16px !important
}

.gap-2 {
    gap: 8px !important
}

.gap-1 {
    gap: 4px !important
}

.gap-0 {
    gap: 0 !important
}

.rounded {
    border-radius: var(--borderRadiusMedium) !important
}

.rounded-0 {
    border-radius: 0 !important
}

.rounded-1 {
    border-radius: var(--borderRadiusSmall) !important
}

.rounded-2 {
    border-radius: var(--borderRadiusMedium) !important
}

.rounded-3 {
    border-radius: var(--borderRadiusLarge) !important
}

.rounded-4 {
    border-radius: var(--borderRadiusXLarge) !important
}

.rounded-circle {
    border-radius: 50% !important
}

.rounded-pill {
    border-radius: var(--borderRadiusCircular) !important
}

.rounded-start-0 {
    border-bottom-left-radius: 0!important;
    border-top-left-radius: 0!important
}

.rounded-start-1 {
    border-bottom-left-radius: var(--borderRadiusSmall)!important;
    border-top-left-radius: var(--borderRadiusSmall)!important
}

.rounded-start-2 {
    border-bottom-left-radius: var(--borderRadiusMedium)!important;
    border-top-left-radius: var(--borderRadiusMedium)!important
}

.rounded-start-3 {
    border-bottom-left-radius: var(--borderRadiusLarge)!important;
    border-top-left-radius: var(--borderRadiusLarge)!important
}

.rounded-start-4 {
    border-bottom-left-radius: var(--borderRadiusXLarge)!important;
    border-top-left-radius: var(--borderRadiusXLarge)!important
}

.rounded-start-circle {
    border-bottom-left-radius: 50%!important;
    border-top-left-radius: 50%!important
}

.rounded-start-pill {
    border-bottom-left-radius: var(--borderRadiusCircular)!important;
    border-top-left-radius: var(--borderRadiusCircular)!important
}

.rounded-end {
    border-top-right-radius: var(--borderRadiusMedium)!important;
    border-bottom-right-radius: var(--borderRadiusMedium)!important
}

.rounded-end-0 {
    border-top-right-radius: 0!important;
    border-bottom-right-radius: 0!important
}

.rounded-end-1 {
    border-top-right-radius: var(--borderRadiusSmall)!important;
    border-bottom-right-radius: var(--borderRadiusSmall)!important
}

.rounded-end-2 {
    border-top-right-radius: var(--borderRadiusMedium)!important;
    border-bottom-right-radius: var(--borderRadiusMedium)!important
}

.rounded-end-3 {
    border-top-right-radius: var(--borderRadiusLarge)!important;
    border-bottom-right-radius: var(--borderRadiusLarge)!important
}

.rounded-end-4 {
    border-top-right-radius: var(--borderRadiusXLarge)!important;
    border-bottom-right-radius: var(--borderRadiusXLarge)!important
}

.rounded-end-circle {
    border-top-right-radius: 50%!important;
    border-bottom-right-radius: 50%!important
}

.rounded-end-pill {
    border-top-right-radius: var(--borderRadiusCircular)!important;
    border-bottom-right-radius: var(--borderRadiusCircular)!important
}

.height-36 {
    height: 36px !important;
}

.fw-normal {
    font-weight: 400 !important;
}

.fw-medium {
    font-weight: 500 !important;
}

.fw-semibold {
    font-weight: 600 !important;
}

.fw-bold {
    font-weight: 700 !important;
}

.unselectable {
    -webkit-user-select: none; /* Safari */
    user-select: none;
}

.text-align-center {
    text-align: center;
}