:root {
    /* Colors */
    --white: rgba(255, 255, 255, 1); /* #FFFFFF */
    --base-white: rgba(252, 253, 254, 1); /* #FCFDFE */
    --black: rgba(0, 0, 0, 1); /* #000000 */
    --neutrals-50: rgba(249, 250, 251, 1); /* #F9FAFB */
    --neutrals-100: rgba(242, 244, 246, 1); /* #F2F4F6 */
    --neutrals-200: rgba(229, 232, 235, 1); /* #E5E8EB */
    --neutrals-300: rgba(209, 213, 218, 1); /* #D1D5DA */
    --neutrals-400: rgba(174, 180, 188, 1); /* #AEB4BC */
    --neutrals-500: rgba(139, 146, 156, 1); /* #8B929C */
    --neutrals-600: rgba(95, 103, 115, 1); /* #5F6773 */
    --neutrals-700: rgba(59, 64, 72, 1); /* #3B4048 */
    --primary-50: rgba(237, 246, 253, 1); /* #EDF6FD */
    --primary-100: rgba(203, 229, 249, 1); /* #CBE5F9 */
    --primary-200: rgba(169, 213, 245, 1); /* #A9D5F5 */
    --primary-300: rgba(116, 186, 236, 1); /* #74BAEC */
    --primary-400: rgba(58, 140, 222, 1); /* #3A8CDE */
    --primary-500: rgba(47, 111, 179, 1); /* #2F6FB3 */
    --primary-600: rgba(35, 84, 136, 1); /* #235488 */
    --primary-700: rgba(25, 57, 93, 1); /* #19395D */
    --success-light: rgba(231, 250, 242, 1); /* #E7FAF2 */
    --success-default: rgba(60, 177, 121, 1); /* #3CB179 */
    --success-dark: rgba(36, 122, 84, 1); /* #247A54 */
    --success-50: rgba(236, 253, 243, 1); /* #ECFDF3 */
    --success-100: #DCFAE6;
    --success-200: rgba(171, 239, 198, 1); /* #ABEFC6 */
    --success-600: rgba(7, 148, 85, 1); /* #079455 */
    --success-700: rgba(6, 118, 71, 1); /*# 067647 */

    --warning-50: rgba(255, 250, 235, 1); /* #FFFAEB */
    --warning-100: rgba(254, 239, 199, 1); /* #FEF0C7 */
    --warning-600: rgba(220, 104, 3, 1); /* #DC6803 */

    --warning-light: rgba(255, 247, 230, 1); /* #FFF7E6 */
    --warning-default: rgba(245, 166, 35, 1); /* #F5A623 */
    --warning-dark: rgba(173, 111, 0, 1); /* #AD6F00 */
    --error-light: rgba(252, 235, 236, 1); /* #FCEBEC */
    --error-default: rgba(229, 72, 77, 1); /* #E5484D */
    --error-dark: rgba(159, 31, 38, 1); /* #9F1F26 */
    --error-dark: rgba(159, 31, 38, 1); /* #9F1F26 */
    --error-50: rgba(254, 243, 242, 1); /* #FEF3F2 */
    --error-100: rgba(254, 228, 226); /* #FEE4E2 */
    --error-600: rgba(217, 45, 32, 1); /* #d92d20 */
    /* Box shadows, #0A0D120A */
    --shadow-xs-skeuomorphic: 0px 1px 2px 0px rgba(10, 13, 18, 0.05), 0px -2px 0px 0px rgba(10, 13, 18, 0.05) inset, 0px 0px 0px 1px rgba(10, 13, 18, 0.18) inset;
    --shadow-xs: 0px 1px 2px 0px rgba(10, 13, 18, 0.05);
    --shadow-sm: 0px 1px 2px -1px rgba(10, 13, 18, 0.1), 0px 1px 3px 0px rgba(10, 13, 18, 0.1);
    --shadow-md: 0px 2px 4px -2px rgba(10, 13, 18, 0.06), 0px 4px 6px -1px rgba(10, 13, 18, 0.1);
    --shadow-l: 0px 12px 16px -4px rgba(10, 13, 18, 0.08), 0px 4px 6px -2px rgba(10, 13, 18, 0.03);
    --shadow-lg: 0px 2px 2px -1px rgba(10, 13, 18, 0.04), 0px 4px 6px -2px rgba(10, 13, 18, 0.03), 0px 12px 16px -4px rgba(10, 13, 18, 0.08);
    --shadow-xl: 0px 3px 3px -1.5px rgba(10, 13, 18, 0.04), 0px 8px 8px -4px rgba(10, 13, 18, 0.03), 0px 20px 24px -4px rgba(10, 13, 18, 0.08);
    --shadow-2xl: 0px 4px 4px -2px rgba(10, 13, 18, 0.04), 0px 24px 48px -12px rgba(10, 13, 18, 0.18);
    --shadow-3xl: 0px 5px 5px -2.5px rgba(10, 13, 18, 0.04), 0px 32px 64px -12px rgba(10, 13, 18, 0.14);
    /* Transitions */
    --ease-in-out-300: ease-in-out 300ms;
    /*Font*/
    --fontWeight-small: 400;
    --fontWeight-medium: 500;
    --fontWeight-bold: 600;
    --fontSize-12: 12px;
    --fontSize-14: 14px;
    --fontSize-16: 16px;
    --fontFamily-Roboto: Roboto;
    /* Typography */
    --font-primary: 'Roboto', sans-serif;
    --font-heading: 'Roboto Condensed', sans-serif;
    /* Font Sizes */
    --font-size-12: 12px;
    --font-size-14: 14px;
    --font-size-16: 16px;
    --font-size-20: 20px;
    --font-size-60: 60px;
    /* Font Weights // Prefer usage of typography weight classes */
    --font-weight-regular: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-medium: 500;
    /* Line Heights */
    --line-height-12: 12px;
    --line-height-18: 18px;
    --line-height-20: 20px;
    --line-height-24: 24px;
    --line-height-28: 28px;
    --line-height-30: 30px;
    --line-height-72: 72px;
    /* Max Heights*/
    --max-height-100: 100vh;
    /* Colors - Success (RegistrationType specific) */
    --success-50-reg: #ECFDF3;
    --success-100-reg: #D1FADF;
    --success-700-reg: #027A48;
    /* Colors - Gray (RegistrationType specific) */
    --gray-900-reg: #181D27;
    /* Spacing */
    --spacing-2: 2px;
    --spacing-4: 4px;
    --spacing-6: 6px;
    --spacing-8: 8px;
    --spacing-12: 12px;
    --spacing-14: 14px;
    --spacing-16: 16px;
    --spacing-20: 20px;
    --spacing-24: 24px;
    --spacing-40: 40px;
    /* Border Radius */
    --radius-6: 6px;
    --radius-8: 8px;
    --radius-12: 12px;
    --radius-16: 16px;
    --radius-24: 24px;
    --radius-28: 28px;
}