:root {
    --font-body-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial,
        sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    --font-mono-family: Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console',
        'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono',
        'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;
    --main-bg-color: #e6e4e3;

    --font-color: #333;
    --font-inv-color: #f3f3f3;
    --brand-color: #13131f;

    --app-logo-color-first: #242729;
    --app-logo-color-second: #ed1c24;

    --menu-accent: #ed1c24;

    --body: #ececec;
    --paper: #f5f5f5;
    --ink: #383838;
    --action-color: #197bfe;
    --warning-color: #ed1c24;
    --light-green-color: #69c688;

    --app-background: var(--body);
    --app-font-color: var(--ink);
    --stage-background: var(--paper);

    /* UI lib styles*/
    --btn-background: transparent;
    --btn-border: #ccc;
    --btn-color: var(--ink);

    --btn-primary-background: var(--action-color);
    --btn-primary-border: var(--action-color);
    --btn-primary-color: var(--paper);

    --btn-warning-border: var(--warning-color);
    --btn-warning-background: var(--warning-color);
    --btn-warning-color: var(--paper);

    --btn-light-green-border: var(--light-green-color);
    --btn-light-green-background: none;
    --btn-light-green-color: var(--light-green-color);

    /* specific styles*/

    --icon-color: var(--ink);
    --icon-top: 0;

    --layout-max-width: 75rem;

    --modal-backdrop-background: rgba(51, 52, 72, 0.96);
    --modal-color: var(--font-inv-color);
    --modal-background: #3c3d52;
    --modal-border: 1px solid #696977;
    --modal-dashed-border: 1px dashed #696977;
    --modal-border-radius: 0.375rem;

    --otp-label-color: #76768a;
    --otp-label-font-size: 0.875rem;
    --otp-value-background: #1f1b202b;

    --otp-value-font-size: 0.875rem;

    --pass-border-color: var(--btn-border);
    --pass-background-color: #f2f2f2;

    --control-animation-time: 200ms;
    --control-font-size: 13px;
    --control-label-color: #333;
    --control-label-weight: 700;
    --control-value-color: #333;
    --control-hint-color: #333;
    --control-background: #fcfcfc;
    --control-border-color: #b3b3b3;
    --control-border-width: 1px;
    --control-border-radius: 6px;
    --control-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07);
    --control-margin-bottom: 16px;

    --control-border-color--hover: #c4c4c4;
    --control-shadow--hover: 0 2px 6px 0 rgba(0, 0, 0, 0.12);

    --control-background--focus: #faffe1;
    --control-border-color--focus: #d7dcbe;

    --control-background--checked: transparent;

    --control-label-color--disabled: #979797;
    --control-value-color--disabled: #979797;

    --switcher-bg-color-selected: var(--action-color);
    --fui-selectbox-search-input_default-normal--background: var(--ink, #e7e7ec);
}