:root {
    /* COLORS */

    --gl-theme-color-grey-6: #2f2d43;
    --gl-theme-color-grey-5: #5f5e6e;
    --gl-theme-color-grey-4: #9a98ae;
    --gl-theme-color-grey-3: #c7c6d2;
    --gl-theme-color-grey-2: #eceff3;
    --gl-theme-color-grey-1: #fafcfe;

    --gl-theme-color-primary-100: #31249f;
    --gl-theme-color-primary-60: #4a3cc3;
    --gl-theme-color-primary-30: #cbc8e5;
    --gl-theme-color-primary-15: #ebeaf6;
    --gl-theme-color-primary-hover: #231970; /*hsl(246, 63, 33);*/
    --gl-theme-color-primary-pressed: #1a1353;

    --gl-theme-color-secondary-100: #bae8be;
    --gl-theme-color-secondary-60: #c9edcc;
    --gl-theme-color-secondary-30: #dbf5dd;
    --gl-theme-color-secondary-15: #effaf0;
    --gl-theme-color-secondary-hover: #96bb99; /*hsl(125, 21, 66);*/
    --gl-theme-color-secondary-pressed: #6f8b71; /*hsl(124, 11, 49);*/

    --gl-theme-color-tertiary-100: #fdba87;
    --gl-theme-color-tertiary-60: #f9ccaa;
    --gl-theme-color-tertiary-30: #fbddc6;
    --gl-theme-color-tertiary-15: #feeee1;
    --gl-theme-color-tertiary-hover: #ca956d; /*hsl(26, 47, 61);*/
    --gl-theme-color-tertiary-pressed: #987152; /*hsl(26, 30, 46);*/

    --gl-theme-color-success-100: #5ae5c5;
    --gl-theme-color-success-60: #84ecd4;
    --gl-theme-color-success-30: #abf2e2;
    --gl-theme-color-success-15: #dcf9f3;

    --gl-theme-color-info-100: #075987;
    --gl-theme-color-info-60: #4483a7;
    --gl-theme-color-info-30: #82acc4;
    --gl-theme-color-info-15: #cbdde7;

    --gl-theme-color-caution-100: #f5f500;
    --gl-theme-color-caution-60: #f8f863;
    --gl-theme-color-caution-30: #fcfcbb;
    --gl-theme-color-caution-15: #fefee2;

    --gl-theme-color-error-100: #A91E43;
    --gl-theme-color-error-60: #d95481;
    --gl-theme-color-error-30: #e48baa;
    --gl-theme-color-error-15: #f4d2de;

    --gl-theme-color-brand-pink: #e22566;
    --gl-theme-color-brand-grey: #bdbcbc;
    --gl-theme-color-brand-blue: #009fe3;

    /* SURFACES */

    --gl-theme-surfaces-drop-shadow-s: 0px 2px 4px rgba(0, 0, 0, 0.05);
    --gl-theme-surfaces-drop-shadow-m: 0px 0px 8px rgba(0, 0, 0, 0.1);
    --gl-theme-surfaces-drop-shadow-l: 0px 0px 20px rgba(0, 0, 0, 0.1);
    --gl-theme-surfaces-drop-shadow-status-active: 0px 0px 0px 2px rgba(49, 36, 159, 0.25);
    --gl-theme-surfaces-drop-shadow-status-error: 0px 0px 0px 2px rgba(202, 27, 87, 0.2);
    --gl-theme-surfaces-inner-shadow-s: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
    --gl-theme-surfaces-inner-shadow-m: inset 0px 2px 4px rgba(0, 0, 0, 0.15);
    --gl-theme-surfaces-inner-shadow-l: inset 0px 3px 6px rgba(0, 0, 0, 0.15);
    --gl-theme-surfaces-border-radius-s: 4px;
    --gl-theme-surfaces-border-radius-m: 8px;
    --gl-theme-surfaces-border-radius-l: 16px;
    --gl-theme-surfaces-border-radius-xl: 32px;
    --gl-theme-surfaces-border-width-s: 1px;
    --gl-theme-surfaces-border-width-m: 2px;
    --gl-theme-surfaces-border-width-l: 3px;

    /* TYPOGRAPHY */

    /* heading */
    --gl-theme-typography-h1-font: normal bold 45px/56px Syne;
    --gl-theme-typography-h2-font: normal bold 31px/48px DM Sans;
    --gl-theme-typography-h3-font: normal bold 26px/48px DM Sans;
    --gl-theme-typography-h4-font: normal bold 22px/32px DM Sans;
    --gl-theme-typography-h1-letter-spacing: -0.02em;
    --gl-theme-typography-h2-letter-spacing: -0.02em;
    --gl-theme-typography-h3-letter-spacing: -0.02em;
    --gl-theme-typography-h4-letter-spacing: -0.02em;
    /* body */

    --gl-theme-typography-body-l-font: normal normal 18px/24px DM Sans;
    --gl-theme-typography-body-font: normal normal 16px/24px DM Sans;
    --gl-theme-typography-body-m-font: normal 500 16px/24px DM Sans;
    --gl-theme-typography-body-s-font: normal normal 14px/20px DM Sans;
    --gl-theme-typography-body-xs-font: normal normal 12px/20px DM Sans;
    /* link */
    --gl-theme-typography-link-font: normal bold 12px/24px DM Sans;
    /* emphasis */
    --gl-theme-typography-emphasis-font: normal 500 16px/24px DM Sans;
    --gl-theme-typography-emphasis-letter-spacing: 0.02em;
    --gl-theme-typography-emphasis-text-transform: uppercase;
    /* button */
    --gl-theme-typography-button-font: normal 500 14px/24px DM Sans;
    --gl-theme-typography-button-letter-spacing: -0.02em;
    --gl-theme-typography-button-s-font: normal 500 12px/16px DM Sans;
    --gl-theme-typography-button-s-letter-spacing: -0.02em;
    /* navigation */
    --gl-theme-typography-navigation-font: normal normal 14px/16px DM Sans;
    /* card details */
    --gl-theme-typography-card-details-font: normal normal 14px/20px DM Sans;
    /* overline */
    --gl-theme-typography-overline-font: normal normal 14px/16px DM Sans;
    --gl-theme-typography-overline-s-font: normal normal 12px/16px DM Sans;
    --gl-theme-typography-overline-text-transform: uppercase;
    /* label */
    --gl-theme-typography-label-font: normal normal 12px/16px DM Sans;
    /* product */
    --gl-theme-typography-product-font: normal bold 12px/16px Syne;
    --gl-theme-typography-product-letter-spacing: 0.04em;
    --gl-theme-typography-product-text-transform: uppercase;
    /* tag */
    --gl-theme-typography-tag-l-font: normal 500 14px/16px DM Sans;
    --gl-theme-typography-tag-font: normal normal 12px/16px DM Sans;
    --gl-theme-typography-tag-s-font: normal 500 10px/12px DM Sans;
    --gl-theme-typography-tag-s-letter-spacing: 0.02em;
    --gl-theme-typography-tag-s-text-transform: uppercase;
    /* numbers */
    --gl-theme-typography-numbers-l-font: normal 500 45px/56px DM Mono;
    --gl-theme-typography-numbers-l-letter-spacing: 0.02em;
    --gl-theme-typography-numbers-font: normal 500 22px/32px DM Mono;
    --gl-theme-typography-numbers-letter-spacing: 0.02em;
    --gl-theme-typography-numbers-s-font: normal 500 14px/20px DM Mono;
    --gl-theme-typography-numbers-s-letter-spacing: 0.02em;
    /* documentation */
    --gl-theme-typography-documentation-bold-font: normal 500 16px/24px DM Mono;
    --gl-theme-typography-documentation-font: normal normal 16px/24px DM Mono;
    /* dialogs */
    --gl-theme-typography-dialog-title-font: normal 700 18px/24px DM Sans;
}