@use "colors" as *;
@use "typography" as *;

:root {
    // @Font-Family Declaration
    @each $ff, $shades in $font-family {
        @each $shade, $value in $shades {
            --ed-#{$ff}-#{$shade}: #{$value};
        }
    }

    // @Font-weight Declaration
    @each $fw, $shades in $font-scale {
        @each $shade, $value in $shades {
            --ed-#{$fw}-#{$shade}: #{$value};
        }
    }

    // @Font-Size Declaration
    @each $fs, $shades in $font-size {
        @each $shade, $value in $shades {
            --ed-#{$fs}-#{$shade}: #{$value}px;
        }
    }

    // @Color Declaration
    @each $color, $shades in $colors {
        @each $shade, $value in $shades {
            --ed-color-#{$color}-#{$shade}: #{$value};
        }
    }
}