:root {
    /* Colors */

    --color-secondary: 255, 255, 255;

    --color-gray500: 102, 112, 133;
    --color-gray300: 208, 213, 221;
    --color-gray400: 152, 162, 179;
    --color-gray200: 234, 236, 240;
    --color-gray100: 242, 244, 247;
    --color-gray700: 52, 64, 84;
    --color-gray50: 249, 250, 251;

    --color-default-text: 16, 24, 40;

    --color-primary: 87, 72, 226;
    --bs-primary-rgb: var(--color-primary) !important;
    --color-primary700: 66, 61, 179;
    --color-primary800: 43, 48, 125;
    --color-primary25: 246, 246, 254;
    --color-primary50: 240, 239, 253;
    --color-primary300: 203, 199, 246;
    --color-primary25: 246, 246, 254;
    --color-primary400: 133, 123, 234;
    --color-primary200: 220, 217, 249;
    --color-primary100: 230, 228, 251;
    --color-primary900: 34, 42, 104;

    --color-primarylight: 226, 173, 242;

    --color-white: 255, 255, 255;
    --color-gray50: 249, 250, 251;

    --color-success-bg: 77, 214, 177;
    --color-warning-bg: 255, 160, 0;
    --color-danger-bg: 241, 90, 100;

    --color-success700: 2, 122, 72;
    --color-success500: 18, 183, 106;
    --color-success50: 236, 253, 243;
    --color-success200: 166, 244, 197;

    --color-error50: 254, 243, 242;
    --color-error500: 240, 68, 56;
    --color-error700: 180, 35, 24;
    --color-error200: 254, 205, 202;

    --color-warning300: 254, 200, 75;
    --color-warning50: 255, 250, 235;
    --color-warning500: 247, 144, 9;
    --color-warning700: 181, 71, 8;
    --color-warning200: 254, 223, 137;

    /* Fonts Weights */
    --w-light: 400;
    --w-regular: 500;
    --w-medium: 600;
    --w-semi-bold: 600;
    --w-bold: 700;

    /* Sizes */
    --size-xxsmall: 0.65rem;
    --size-xsmall: 0.75rem;
    --size-small: 0.875rem;
    --size-regular: 1rem;
    --size-medium: 1.125rem;
    --size-large: 1.25rem;
    --size-xlarge: 1.5rem;
    --size-xxlarge: 1.75rem;
    --size-h2: 2.25rem;
    --size-hero: 3.12rem;
    --size-h1: 3.75rem;
}



.text-xxsmall {
    font-size: var(--size-xxsmall) !important;
}

.text-xsmall {
    font-size: var(--size-xsmall) !important;
}

.text-small {
    font-size: var(--size-small) !important;
}

.text-regular {
    font-size: var(--size-regular) !important;
}

.text-medium {
    font-size: var(--size-medium) !important;
}

.text-large {
    font-size: var(--size-large) !important;
}

.text-xlarge {
    font-size: var(--size-xlarge) !important;
}

.text-xxlarge {
    font-size: var(--size-xxlarge) !important;
}

.text-h2 {
    font-size: var(--size-h2) !important;
}


.w-regular {
    font-weight: var(--w-regular) !important;
}

.w-medium {
    font-weight: var(--w-medium) !important;
}

.w-semibold,
.w-semi-bold {
    font-weight: var(--w-semi-bold) !important;
}

.w-bold {
    font-weight: var(--w-bold) !important;
}

.text-white{
    color: rgb(var(--color-white)) !important;
}

.align-middle{
	vertical-align:middle !important;
}