/* stylelint-disable color-no-hex */

section.light,
.light,
:root,
:host {
    --ring-unit: 8px;

    /* Element */
    --ring-line-components: 223, 225, 229;
    --ring-line-color: rgb(var(--ring-line-components)); /* #DFE1E5 */
    --ring-borders-components: 211, 213, 219;
    --ring-borders-color: rgb(var(--ring-borders-components)); /* #D3D5DB */
    --ring-icon-components: 108, 112, 126;
    --ring-icon-color: rgb(var(--ring-icon-components)); /* #6C707E */
    --ring-icon-white-components: 255, 255, 255;
    --ring-icon-white-color: rgb(var(--ring-icon-white-components)); /* #FFFFFF */
    --ring-secondary-components: 157, 160, 168;
    --ring-icon-secondary-color: rgb(var(--ring-icon-secondary-components)); /* #6C707E */
    --ring-border-disabled-components: 235, 236, 240;
    --ring-border-disabled-color: rgb(var(--ring-border-disabled-components)); /* #ebecf0 */
    --ring-border-selected-disabled-components: 201, 204, 214;
    --ring-border-selected-disabled-color: rgb(var(--ring-border-selected-disabled-components)); /* #c9ccd6 */
    --ring-border-disabled-active-components: var(--ring-border-hover-components);
    --ring-border-disabled-active-color: var(--ring-border-hover-color); /* TODO: remove in 8.0 in favor of --ring-border-hover-color */
    --ring-icon-disabled-components: 168, 173, 189;
    --ring-icon-disabled-color: rgb(var(--ring-icon-disabled-components)); /* #A8ADBD */
    --ring-border-hover-components: 160, 189, 248;
    --ring-border-hover-color: rgb(var(--ring-border-hover-components)); /* #A0BDF8 */
    --ring-border-hover-success-components: 197, 229, 204;
    --ring-border-hover-success-color: rgb(var(--ring-border-hover-success-components)); /* #C5E5CC */
    --ring-border-hover-error-components: 250, 212, 216;
    --ring-border-hover-error-color: rgb(var(--ring-border-hover-error-components)); /* #FAD4D8 */
    --ring-border-accent-components: 112, 156, 245;
    --ring-border-accent-color: rgb(var(--ring-border-accent-components)); /* #709CF5 */
    --ring-icon-hover-components: 90, 93, 107;
    --ring-icon-hover-color: rgb(var(--ring-icon-hover-components)); /* #5a5d6b */
    --ring-main-components: 51, 105, 214;
    --ring-main-color: rgb(var(--ring-main-components)); /* #3369D6 */
    --ring-action-link-components: 46, 85, 163;
    --ring-action-link-color: rgb(var(--ring-action-link-components)); /* #2E55A3 */ /* TODO: remove in 8.0 in favor of --ring-link-color */
    --ring-main-hover-components: 49, 95, 189;
    --ring-main-hover-color: rgb(var(--ring-main-hover-components)); /* #315FBD */
    --ring-main-success-components: 31, 128, 57;
    --ring-main-success-color: rgb(var(--ring-main-success-components)); /* #1F8039 */
    --ring-main-success-hover-components: 31, 117, 54;
    --ring-main-success-hover-color: rgb(var(--ring-main-success-hover-components)); /* #1F7536 */
    --ring-main-error-components: 204, 54, 69;
    --ring-main-error-color: rgb(var(--ring-main-error-components)); /* #CC3645 */
    --ring-main-error-hover-components: 188, 48, 62;
    --ring-main-error-hover-color: rgb(var(--ring-main-error-hover-components)); /* #BC303E */
    --ring-main-warning-components: 229, 109, 23;
    --ring-main-warning-color: rgb(var(--ring-main-warning-components)); /* #E56D17 */
    --ring-main-warning-hover-components: 206, 97, 23;
    --ring-main-warning-hover-color: rgb(var(--ring-main-warning-hover-components)); /* #CE6117 */
    --ring-main-purple-components: 131, 77, 240;
    --ring-main-purple-color: rgb(var(--ring-main-purple-components)); /* #834DF0 */
    --ring-main-purple-hover-components: 116, 68, 212;
    --ring-main-purple-hover-color: rgb(var(--ring-main-purple-hover-components)); /* #7444D4 */
    --ring-icon-error-components: 204, 54, 69;
    --ring-icon-error-color: rgb(var(--ring-icon-error-components)); /* #CC3645 */
    --ring-icon-warning-components: 229, 109, 23;
    --ring-icon-warning-color: rgb(var(--ring-icon-warning-components)); /* #E56D17 */
    --ring-icon-success-components: 32, 138, 60;
    --ring-icon-success-color: rgb(var(--ring-icon-success-components)); /* #208A3C */
    --ring-icon-highlight-components: 255, 175, 15;
    --ring-icon-highlight-color: rgb(var(--ring-icon-highlight-components)); /* #FFAF0F */
    --ring-icon-highlight-hover-components: 223, 147, 3;
    --ring-icon-highlight-hover-color: rgb(var(--ring-icon-highlight-hover-components)); /* #DF9303 */
    --ring-success-border-components: 137, 195, 152;
    --ring-success-border-color: rgb(var(--ring-success-border-components)); /* #89C398 */
    --ring-success-border-hover-components: 85, 167, 106;
    --ring-success-border-hover-color: rgb(var(--ring-success-border-hover-components)); /* #55A76A */
    --ring-error-border-components: 242, 182, 187;
    --ring-error-border-color: rgb(var(--ring-error-border-components)); /* #F2B6BB */
    --ring-error-border-hover-components: 228, 106, 118;
    --ring-error-border-hover-color: rgb(var(--ring-error-border-hover-components)); /* #E46A76 */
    --ring-warning-border-components: 242, 177, 129;
    --ring-warning-border-color: rgb(var(--ring-warning-border-components)); /* #F2B181 */
    --ring-warning-border-hover-components: 236, 143, 76;
    --ring-warning-border-hover-color: rgb(var(--ring-warning-border-hover-components)); /* #EC8F4C */
    --ring-highlight-border-components: 254, 210, 119;
    --ring-highlight-border-color: rgb(var(--ring-highlight-border-components)); /* #FED277 */
    --ring-highlight-border-hover-components: 253, 189, 61;
    --ring-highlight-border-hover-color: rgb(var(--ring-highlight-border-hover-components)); /* #FDBD3D */
    --ring-purple-border-components: 191, 161, 248;
    --ring-purple-border-color: rgb(var(--ring-purple-border-components)); /* #BFA1F8 */
    --ring-purple-border-hover-components: 161, 119, 244;
    --ring-purple-border-hover-color: rgb(var(--ring-purple-border-hover-components)); /* #A177F4 */
    --ring-pale-control-components: 194, 214, 252;
    --ring-pale-control-color: rgb(var(--ring-pale-control-components)); /* #C2D6FC */
    --ring-popup-border-components: 0, 28, 54;
    --ring-popup-border-color: var(--ring-line-color);
    --ring-popup-shadow-components: rgba(var(--ring-popup-border-components, 0, 28, 54), 0.1);
    --ring-popup-shadow-color: rgba(var(--ring-popup-border-components), 0.1);
    --ring-popup-secondary-shadow-color: rgba(var(--ring-popup-border-components), 0.04);
    --ring-message-shadow-color: rgba(var(--ring-popup-border-components), 0.3);
    --ring-pinned-shadow-components: 108, 112, 126;
    --ring-pinned-shadow-color: rgb(var(--ring-pinned-shadow-components)); /* #6C707E */ /* TODO remove in 8.0 */
    --ring-button-danger-hover-components: 219, 59, 75;
    --ring-button-danger-hover-color: rgb(var(--ring-button-danger-hover-components)); /* #DB3B4B */
    --ring-button-primary-border-components: 46, 85, 163;
    --ring-button-primary-border-color: rgb(var(--ring-button-primary-border-components)); /* #2E55A3 */
    --ring-dialog-overlay-components: 0, 0, 0;
    --ring-dialog-overlay-opacity: 0.4;
    --ring-popup-shadow: 0 2px 8px var(--ring-popup-shadow-color), 0 1px 2px var(--ring-popup-secondary-shadow-color);
    --ring-dialog-shadow: 0 4px 24px var(--ring-popup-shadow-color), 0 2px 6px var(--ring-popup-secondary-shadow-color);

    /* Text */
    --ring-search-components: 112, 156, 245;
    --ring-search-color: rgb(var(--ring-search-components)); /* #709CF5 */
    --ring-hint-components: 46, 85, 163;
    --ring-hint-color: rgb(var(--ring-hint-components)); /* #2E55A3 */ /* TODO: remove in 8.0 */
    --ring-link-components: 49, 95, 189;
    --ring-link-color: rgb(var(--ring-link-components)); /* #315FBD */
    --ring-link-hover-components: 46, 85, 163;
    --ring-link-hover-color: rgb(var(--ring-link-hover-components)); /* #2E55A3 */
    --ring-error-components: 204, 54, 69;
    --ring-error-color: rgb(var(--ring-error-components)); /* #CC3645 */
    --ring-warning-components: 182, 84, 22;
    --ring-warning-color: rgb(var(--ring-warning-components)); /* #B65416 */ /* Prefer using warning icon + regular text color */
    --ring-success-components: 31, 117, 54;
    --ring-success-color: rgb(var(--ring-success-components)); /* #1F7536 */ /* Prefer using success icon + regular text color */
    --ring-purple-text-components: 131, 77, 240;
    --ring-purple-text-color: rgb(var(--ring-purple-text-components)); /* #834DF0 */
    --ring-text-components: 39, 40, 46;
    --ring-text-color: rgb(var(--ring-text-components)); /* #27282E */
    --ring-active-text-color: var(--ring-text-color);
    --ring-white-text-components: 255, 255, 255;
    --ring-white-text-color: rgb(var(--ring-white-text-components)); /* #FFFFFF */
    --ring-heading-color: var(--ring-text-color);
    --ring-secondary-components: 108, 112, 126;
    --ring-secondary-color: rgb(var(--ring-secondary-components)); /* #6C707E */
    --ring-disabled-components: 168, 173, 189;
    --ring-disabled-color: rgb(var(--ring-disabled-components)); /* #A8ADBD */

    /* Background */

    --ring-content-background-components: 255, 255, 255;
    --ring-content-background-color: rgb(var(--ring-content-background-components)); /* #FFFFFF */
    --ring-popup-background-components: 255, 255, 255;
    --ring-popup-background-color: rgb(var(--ring-popup-background-components)); /* #FFFFFF */
    --ring-sidebar-background-components: 247, 248, 250;
    --ring-sidebar-background-color: rgb(var(--ring-sidebar-background-components)); /* #F7F8FA */
    --ring-secondary-background-components: 247, 248, 250;
    --ring-secondary-background-color: rgb(var(--ring-secondary-background-components)); /* #F7F8FA */
    --ring-selected-background-components: 212, 226, 255;
    --ring-selected-background-color: rgb(var(--ring-selected-background-components)); /* #D4E2FF */
    --ring-hover-background-components: 237, 243, 255;
    --ring-hover-background-color: rgb(var(--ring-hover-background-components)); /* #EDF3FF */
    --ring-navigation-background-components: 255, 255, 255;
    --ring-navigation-background-color: rgb(var(--ring-navigation-background-components)); /* #FFFFFF */
    --ring-tag-background-components: 235, 236, 240;
    --ring-tag-background-color: rgb(var(--ring-tag-background-components)); /* #EBECF0 */
    --ring-tag-hover-background-components: 223, 225, 229;
    --ring-tag-hover-background-color: rgb(var(--ring-tag-hover-background-components)); /* #DFE1E5 */
    --ring-removed-background-components: 250, 212, 216;
    --ring-removed-background-color: rgb(var(--ring-removed-background-components)); /* #FAD4D8 */
    --ring-warning-background-components: 252, 230, 214;
    --ring-warning-background-color: rgb(var(--ring-warning-background-components)); /* #FCE6D6 */
    --ring-highlight-background-components: 255, 241, 209;
    --ring-highlight-background-color: rgb(var(--ring-highlight-background-components)); /* #FFF1D1 */
    --ring-added-background-components: 197, 229, 204;
    --ring-added-background-color: rgb(var(--ring-added-background-components)); /* #C5E5CC */
    --ring-purple-background-components: 239, 229, 255;
    --ring-purple-background-color: rgb(var(--ring-purple-background-components)); /* #EFE5FF */
    --ring-disabled-background-components: 247, 248, 250;
    --ring-disabled-background-color: rgb(var(--ring-disabled-background-components)); /* #F7F8FA */
    --ring-disabled-selected-background-components: 235, 236, 240;
    --ring-disabled-selected-background-color: rgb(var(--ring-disabled-selected-background-components)); /* #EBECF0 */
    --ring-button-danger-active-color: var(--ring-error-container-light-color); /* #FAD4D8 */
    --ring-button-loader-background: rgba(var(--ring-white-text-components), 0.4); /* TODO remove in 8.0 */
    --ring-button-primary-background-color: var(--ring-main-color); /* TODO remove in 8.0 */
    --ring-table-loader-background-color: rgba(var(--ring-content-background-components), 0.5); /* #FFFFFF50 */
    --ring-removed-subtle-background-components: 255, 235, 236;
    --ring-removed-subtle-background-color: rgb(var(--ring-removed-subtle-background-components)); /* #FFEBEC */
    --ring-warning-subtle-background-components: 255, 244, 235;
    --ring-warning-subtle-background-color: rgb(var(--ring-warning-subtle-background-components)); /* #FFF4EB */
    --ring-highlight-subtle-background-components: 255, 246, 222;
    --ring-highlight-subtle-background-color: rgb(var(--ring-highlight-subtle-background-components)); /* #FFF6DE */
    --ring-added-subtle-background-components: 230, 247, 233;
    --ring-added-subtle-background-color: rgb(var(--ring-added-subtle-background-components)); /* #E6F7E9 */
    --ring-purple-subtle-background-components: 250, 245, 255;
    --ring-purple-subtle-background-color: rgb(var(--ring-purple-subtle-background-components)); /* #FAF5FF */
    --ring-main-container-light-components: 245, 248, 254;
    --ring-main-container-light-color: rgb(var(--ring-main-container-light-components)); /* #F5F8FE */
    --ring-success-container-light-components: 242, 252, 243;
    --ring-success-container-light-color: rgb(var(--ring-success-container-light-components)); /* #F2FCF3 */
    --ring-error-container-light-components: 255, 242, 243;
    --ring-error-container-light-color: rgb(var(--ring-error-container-light-components)); /* #FFF2F3 */
    --ring-warning-container-light-components: 255, 248, 243;
    --ring-warning-container-light-color: rgb(var(--ring-warning-container-light-components)); /* #FFF8F3 */
    --ring-highlight-container-light-components: 255, 250, 235;
    --ring-highlight-container-light-color: rgb(var(--ring-highlight-container-light-components)); /* #FFFAEB */
    --ring-grey-container-light-components: 247, 248, 250;
    --ring-grey-container-light-color: rgb(var(--ring-grey-container-light-components)); /* #F7F8FA */
    --ring-purple-container-light-components: 251, 248, 255;
    --ring-purple-container-light-color: rgb(var(--ring-purple-container-light-components)); /* #FBF8FF */
    --ring-highlight-fill-components: 255, 175, 15;
    --ring-highlight-fill-color: rgb(var(--ring-highlight-fill-components)); /* #FFAF0F */
    --ring-grey-fill-components: 39, 40, 46;
    --ring-grey-fill-color: rgb(var(--ring-grey-fill-components)); /* #27282E */
    --ring-grey-fill-accent-components: 56, 58, 66;
    --ring-grey-fill-accent-color: rgb(var(--ring-grey-fill-accent-components)); /* #383A42 */

    /* Code */
    --ring-code-background-color: var(--ring-content-background-color);
    --ring-code-components: 0, 0, 0;
    --ring-code-color: rgb(var(--ring-code-components)); /* #000000 */
    --ring-code-comment-color: var(--ring-secondary-color);
    --ring-code-meta-components: 145, 76, 7;
    --ring-code-meta-color: rgb(var(--ring-code-meta-components)); /* #914C07 */
    --ring-code-keyword-components: 0, 51, 179;
    --ring-code-keyword-color: rgb(var(--ring-code-keyword-components)); /* #0033B3 */
    --ring-code-tag-background-components: 235, 236, 240;
    --ring-code-tag-background-color: rgb(var(--ring-code-tag-background-components)); /* #EBECF0 */
    --ring-code-tag-color: var(--ring-code-keyword-color);
    --ring-code-tag-font-weight: var(--ring-font-weight-bold);
    --ring-code-field-components: 135, 16, 148;
    --ring-code-field-color: rgb(var(--ring-code-field-components)); /* #871094 */
    --ring-code-attribute-components: 23, 80, 235;
    --ring-code-attribute-color: rgb(var(--ring-code-attribute-components)); /* #1750EB */
    --ring-code-number-color: var(--ring-code-attribute-color);
    --ring-code-string-components: 6, 125, 23;
    --ring-code-string-color: rgb(var(--ring-code-string-components)); /* #067D17 */
    --ring-code-addition-components: 197, 229, 204;
    --ring-code-addition-color: rgb(var(--ring-code-addition-components)); /* #C5E5CC */
    --ring-code-deletion-components: 223, 225, 229;
    --ring-code-deletion-color: rgb(var(--ring-code-deletion-components)); /* #DFE1E5 */

    /* Metrics */
    --ring-border-radius-large: var(--ring-unit);
    --ring-border-radius: 4px;
    --ring-border-radius-small: 2px;
    --ring-font-size-larger: 16px;
    --ring-font-size: 14px;
    --ring-font-size-smaller: 12px;
    --ring-line-height-taller: 24px;
    --ring-line-height: 20px;
    --ring-line-height-lower: 18px;
    --ring-line-height-lowest: 16px;
    --ring-ease: 0.3s ease-out;
    --ring-fast-ease: 0.15s ease-out;
    --ring-font-family: system-ui, Arial, sans-serif;
    --ring-font-family-monospace: Menlo, 'Bitstream Vera Sans Mono', 'Ubuntu Mono', Consolas, 'Courier New', Courier,
    monospace;
    --ring-font-weight-medium: 500;
    --ring-font-weight-bold: 600;
    --ring-font-variant-numeric: lining-nums tabular-nums slashed-zero;

    /* Common z-index-values */

    /* Invisible element is an absolutely positioned element which should be below */
    /* all other elements on the page */
    --ring-invisible-element-z-index: -1;

    /* z-index for position: fixed elements */
    --ring-fixed-z-index: 1;

    /* Elements that should overlay all other elements on the page */
    --ring-overlay-z-index: 5;

    /* Alerts should de displayed above overlays */
    --ring-alert-z-index: 6;




    /* Overwrites */
    /*--ring-content-background-color: #faf4ed;*/
}