:root {
    /* Базовые цвета, от которых выстраивается вся палитра */
    --color-base-dark-base: #fff; /* Базовый цвет содержимого, от которого выстраиваются цвета текста, иконок */
    --color-base-dark-essential: #2c2c2e; /* Базовый цвет поверхностей */
    --color-base-dark-project: #cccdca; /* Проектный цвет, от которого выстраивают акцентные состояния */
    --color-base-dark-phantom: #9b7a96; /* Тонирующий цвет, от которого выстраиватся бордеры, оверлей под модальными окнами */
    --color-base-dark-path: #ff9f0a; /* Цвет ссылок и контролов, от которого выстраиваются все их состояния */
    --color-base-dark-system: #4b5963; /* Цвет системнный */

    --color-base-dark-success: #22c38e; /* Цвет успеха */
    --color-base-dark-alert: #f54d4d; /* Цвет ошибки */
    --color-base-dark-warning: #f38b00; /* Цвет предупреждения */
    --color-base-dark-caution: #f2c94c; /* Цвет осторожности */
    --color-base-dark-normal: #0aa5ff; /* Цвет нейтральный */
    --color-base-dark-critical: #33000f;
}

/* stylelint-disable */
.Theme_color_themeDark {
    /* Цвета фонов */
    --color-bg-default: color-mod(var(--color-base-dark-essential) a(100%)); /* Цвет дефолта */
    --color-bg-secondary: color-mod(
        var(--color-base-dark-essential) l(-5%)
    ); /* Дополнительный цвет фона */
    --color-bg-brand: color-mod(
        var(--color-base-dark-project) a(100%)
    ); /* Цвет фона брендированный */
    --color-bg-link: color-mod(var(--color-base-dark-path) a(100%)); /* Цвет фона ссылки */
    --color-bg-border: color-mod(var(--color-base-dark-phantom) a(20%) l(+10%)); /* Цвет границ */
    --color-bg-stripe: #2e3337; /* Цвет зебры (например, при окрашивании фона строк таблицы через одну) */
    --color-bg-stripe-active: color-mod(#2e3337 l(+2%));

    --color-bg-ghost: color-mod(var(--color-base-dark-phantom) a(10%)); /* Цвет затенения */
    --color-bg-tone: color-mod(var(--color-base-dark-phantom) l(-92%) a(85%)); /* Цвет паранджи */
    --color-bg-soft: color-mod(var(--color-base-dark-essential) l(+100%) a(90%)); /* Цвет молока */
    --color-bg-system: color-mod(var(--color-base-dark-system) a(100%)); /* Цвет фона системнный */
    --color-bg-normal: color-mod(var(--color-base-dark-normal) a(100%)); /* Цвет фона нейтральный */
    --color-bg-success: color-mod(var(--color-base-dark-success) a(100%)); /* Цвет фона успеха */
    --color-bg-caution: color-mod(
        var(--color-base-dark-caution) a(100%)
    ); /* Цвет фона осторожности */
    --color-bg-warning: color-mod(
        var(--color-base-dark-warning) a(100%)
    ); /* Цвет фона предупреждения */
    --color-bg-alert: color-mod(var(--color-base-dark-alert) s(+10%)); /* Цвет фона ошибки */
    --color-bg-critical: color-mod(
        var(--color-base-dark-critical) a(100%)
    ); /* Цвет фона системнный */
    --color-bg-selection: color-mod(var(--color-base-dark-phantom) a(20%)); /* Цвет выделения */

    /* Цвета текста */
    --color-typo-primary: color-mod(var(--color-base-dark-base) l(-2%)); /* Цвет основного текста */
    --color-typo-secondary: color-mod(
        var(--color-base-dark-base) a(60%)
    ); /* Цвет второстепенного текста */
    --color-typo-ghost: color-mod(
        var(--color-base-dark-base) a(30%)
    ); /* Цвет дополнительного текста */
    --color-typo-brand: color-mod(
        var(--color-base-dark-project) a(100%)
    ); /* Цвет брендового текста */
    --color-typo-system: color-mod(
        var(--color-base-dark-system) s(+6%) l(+12%)
    ); /* Цвет фона системнный */
    --color-typo-normal: color-mod(
        var(--color-base-dark-normal) s(+14%) l(-4%)
    ); /* Цвет фона нейтральный */
    --color-typo-success: color-mod(
        var(--color-base-dark-success) s(+14%) l(-8%)
    ); /* Цвет текста успеха */
    --color-typo-caution: color-mod(
        var(--color-base-dark-caution) s(+7%) l(-3%)
    ); /* Цвет текста осторожности */
    --color-typo-warning: color-mod(
        var(--color-base-dark-warning) s(+7%) l(-3%)
    ); /* Цвет текста предупреждения */
    --color-typo-alert: color-mod(
        var(--color-base-dark-alert) s(+3%) l(-3%)
    ); /* Цвет текста ошибки */
    --color-typo-critical: color-mod(
        var(--color-base-dark-critical) l(+9%)
    ); /* Цвет фона системнный */
    --color-typo-link: color-mod(
        var(--color-base-dark-path) h(-2) l(+12%) a(100%)
    ); /* Цвет основной ссылки */
    --color-typo-link-minor: color-mod(
        var(--color-base-dark-path) h(-2) s(-55%) l(+20%)
    ); /* Цвет второстепенной ссылки */

    --color-typo-link-hover: color-mod(
        var(--color-base-dark-path) h(-2) l(+26%) a(100%)
    ); /* Цвет ховера ссылки */
    --color-nums-shadow: 0, 0, 0; /* Значения RGB для указания теней в конструкции rgba(R,G,B, alpha) */

    /* Цвета скроллбара */
    --color-scroll-bg: color-mod(var(--color-base-dark-phantom) a(6%));
    --color-scroll-thumb: color-mod(var(--color-base-dark-phantom) a(24%));
    --color-scroll-thumb-hover: color-mod(var(--color-base-dark-phantom) a(32%));

    /* Цвета контролов */
    /* Default */
    --color-control-bg-default: color-mod(
        var(--color-base-dark-essential)
    ); /* Цвет фона контрола */
    --color-control-typo-default: color-mod(
        var(--color-base-dark-base) a(80%)
    ); /* Цвет основного текста контрола */
    --color-control-typo-placeholder: color-mod(
        var(--color-base-dark-base) a(35%)
    ); /* Цвет плейсхолдера контрола */
    --color-control-bg-border-default: color-mod(
        var(--color-base-dark-phantom) a(28%)
    ); /* Цвет фона бордеров котрола */

    --color-control-bg-border-default-hover: color-mod(
        var(--color-base-dark-phantom) a(52%)
    ); /* Цвет фона бордеров контрола по ховеру */

    --color-control-bg-border-focus: color-mod(
        var(--color-base-dark-path) l(+10%)
    ); /* Цвет аутлайна контролов при фокусе */
    --color-control-bg-focus: color-mod(
        var(--color-base-dark-path) a(40%)
    ); /* Цвет тени в состонии фокуса */
    --color-control-bg-active: color-mod(
        var(--color-base-dark-path) a(70%)
    ); /* Цвет тени в состонии нажатия  */

    /* Primary */
    --color-control-bg-primary: color-mod(
        var(--color-base-dark-path) a(100%)
    ); /* Цвет фона активного контрола */
    --color-control-bg-primary-hover: color-mod(
        var(--color-base-dark-path) l(+9%)
    ); /* Цвет фона активного контрола по ховеру */

    --color-control-typo-primary: color-mod(
        var(--color-base-dark-base) l(+100%)
    ); /* Цвет акцентного текста */
    --color-control-typo-primary-hover: color-mod(
        var(--color-base-dark-base) l(+100%)
    ); /* Цвет акцентного текста */

    /* Secondary */
    --color-control-bg-secondary: color-mod(
        var(--color-base-dark-essential) a(0%)
    ); /* Цвет фона бордеров котрола */
    --color-control-bg-border-secondary: color-mod(
        var(--color-base-dark-path) a(100%)
    ); /* Цвет фона бордеров котрола */

    --color-control-bg-border-secondary-hover: color-mod(
        var(--color-base-dark-path) l(+9%)
    ); /* Цвет фона бордеров контрола по ховеру */

    --color-control-typo-secondary: color-mod(
        var(--color-base-dark-path) h(-2) l(+12%) a(100%)
    ); /* Цвет второстепеного текста контрола */

    --color-control-typo-secondary-hover: color-mod(
        var(--color-base-dark-path) h(-2) l(+26%) a(100%)
    ); /* Цвет акцентного текста */

    /* Ghost */
    --color-control-bg-ghost: color-mod(
        var(--color-base-dark-phantom) s(-100%) a(16%)
    ); /* Цвет фона дополнительного контрола */

    --color-control-bg-ghost-hover: color-mod(
        var(--color-base-dark-phantom) s(-100%) a(23%)
    ); /* Цвет фона дополнительного контрола по ховеру */

    --color-control-typo-ghost: color-mod(
        var(--color-base-dark-base) a(75%)
    ); /* Цвет дополнительного текста контрола */

    --color-control-typo-ghost-hover: color-mod(
        var(--color-base-dark-base) a(90%)
    ); /* Цвет акцентного текста */

    /* Clear */
    --color-control-bg-clear: color-mod(
        var(--color-base-dark-phantom) s(-100%) a(0%)
    ); /* Цвет фона чистого контрола */

    --color-control-bg-clear-hover: color-mod(
        var(--color-base-dark-phantom) s(-100%) a(23%)
    ); /* Цвет фона чистого контрола по ховеру */

    --color-control-typo-clear: color-mod(
        var(--color-base-dark-base) a(75%)
    ); /* Цвет акцентного текста */
    --color-control-typo-clear-hover: color-mod(
        var(--color-base-dark-base) a(90%)
    ); /* Цвет акцентного текста */

    /* Disable */
    --color-control-bg-disable: color-mod(
        var(--color-base-dark-phantom) s(-100%) a(16%)
    ); /* Цвет фона неактивного контрола */

    --color-control-bg-border-disable: color-mod(
        var(--color-base-dark-phantom) s(-100%) a(0%)
    ); /* Цвет фона бордеров неактивного контрола */

    --color-control-typo-disable: color-mod(
        var(--color-base-dark-base) a(24%)
    ); /* Цвет основного текста неактивного контрола */
}
/* stylelint-enable */
