@use 'sass:map';
@use '../02-tokens/dimensions-semantic' as dimensions-semantic;
@use '../02-tokens/maps' as maps;

:root {
    --eds-base-line-height: 1.5rem;

    // SPACING - eds-sp
    // ---------------

    @each $spacing, $value in dimensions-semantic.$spacing-semantic-map {
        --eds-sp-#{$spacing}: #{$value};
    }
    @each $sizing, $value in dimensions-semantic.$sizing-semantic-map {
        --eds-si-#{$sizing}: #{$value};
    }

    
    // BORDER RADIUS - eds-br
    // ----------------------

    @each $br, $value in maps.$border-radius-map {
        --eds-br-#{$br}: #{$value};
    }


    // BREAKPOINTS - eds-bp
    // ---------------------------

    @each $bp, $value in maps.$breakpoint-size-map {
        --eds-bp-#{$bp}: #{$value};
    }


    // BORDER WIDTH - eds-bw
    // ---------------------

    @each $br, $value in maps.$border-width-map {
        --eds-bw-#{$br}: #{$value};
    }


    // BOX-SHADOWS - eds-sh
    // --------------------

    --eds-sh-none: none;
    @each $sh, $shDef in maps.$shadow-map {
        --eds-sh-#{$sh}: #{map.get($shDef, 'offset-x') map.get($shDef, 'offset-y') map.get($shDef, 'blur') map.get($shDef, 'spread') map.get($shDef, 'color')};
    }


    // ICON-SIZES - eds-is
    // -------------------

    @each $icon-size, $value in dimensions-semantic.$icon-sizing-semantic-map {
        --eds-is-#{$icon-size}: #{$value};
    }


    // OPACITY - eds-op
    // ----------------

    @each $idx, $value in maps.$opacity-map {
        --eds-op-#{$idx}: #{$value};
    }
}