:root{
    --sui-text-xs: theme('fontSize.xs');
    --sui-text-sm: theme('fontSize.sm');
    --sui-text-base: theme('fontSize.base');
    --sui-text-lg: theme('fontSize.lg');
    --sui-text-xl: theme('fontSize.xl');
    --sui-text-2xl: theme('fontSize.2xl');
    --sui-text-3xl: theme('fontSize.3xl');
    --sui-text-4xl: theme('fontSize.4xl');
    --sui-text-5xl: theme('fontSize.5xl');
    --sui-text-6xl: theme('fontSize.6xl');
    --sui-text-7xl: theme('fontSize.7xl');
    --sui-text-8xl: theme('fontSize.8xl');
    --sui-text-9xl: theme('fontSize.9xl');
}

.Sui-Text{
    --sui-text-mb: theme('fontSize.body1.1.margin-bottom');
    --sui-text-fw: theme('fontSize.body1.1.font-weight');
    @apply text-body1;
    &--body1{
        /*--sui-text-mb: theme('fontSize.body1.1.margin-bottom');*/
        @apply text-body1;
    }
    &--body2{
        /*--sui-text-mb: theme('fontSize.body2.1.margin-bottom');*/
        @apply text-body2;
    }
    &--h1{
        --sui-text-mb: theme('fontSize.h1.1.margin-bottom');
        --sui-text-fw: theme('fontSize.h1.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-h1 mb-[var(--sui-text-mb)];
    }
    &--h2{
        --sui-text-mb: theme('fontSize.h2.1.margin-bottom');
        --sui-text-fw: theme('fontSize.h2.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-h2 mb-[var(--sui-text-mb)];
    }
    &--h3{
        --sui-text-mb: theme('fontSize.h3.1.margin-bottom');
        --sui-text-fw: theme('fontSize.h3.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-h3 mb-[var(--sui-text-mb)];
    }
    &--h4{
        --sui-text-mb: theme('fontSize.h4.1.margin-bottom');
        --sui-text-fw: theme('fontSize.h4.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-h4 mb-[var(--sui-text-mb)];
    }
    &--h5{
        --sui-text-mb: theme('fontSize.h5.1.margin-bottom');
        --sui-text-fw: theme('fontSize.h5.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-h5 mb-[var(--sui-text-mb)];
    }
    &--h6{
        --sui-text-mb: theme('fontSize.h6.1.margin-bottom');
        --sui-text-fw: theme('fontSize.h6.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-h6 mb-[var(--sui-text-mb)];
    }
    &--display1{
        --sui-text-mb: theme('fontSize.display1.1.margin-bottom');
        --sui-text-fw: theme('fontSize.display1.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-display1 font-display;
    }
    &--display2{
        --sui-text-mb: theme('fontSize.display2.1.margin-bottom');
        --sui-text-fw: theme('fontSize.display2.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-display2 font-display;
    }
    &--label{
        --sui-text-mb: theme('fontSize.label.1.margin-bottom');
        --sui-text-fw: theme('fontSize.label.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-label;
    }
    &--caption{
        --sui-text-mb: theme('fontSize.caption.1.margin-bottom');
        --sui-text-fw: theme('fontSize.caption.1.font-weight');
        font-weight: var(--sui-text-fw);
        @apply text-caption;
    }


    &--noWrap{
        @apply overflow-hidden whitespace-nowrap text-ellipsis max-w-full;
    }


    &--color-inherit{
        @apply text-inherit;
    }
    &--color-muted{
        @apply text-basic-500;/* dark:text-light-300;*/
    }
    &--color-light{
        @apply text-light-500;
    }
}