@use "sass:list";
@use "sass:map";
@use "sass:string";
@use "../jkl";
@use "../jkl/screens";
@use "../jkl/spacing";

@function get-class-name($spacing-combination) {
    $class-name: "jkl-spacing";

    @each $spacing in $spacing-combination {
        $class-name: "#{$class-name}-#{$spacing}";
    }

    @return $class-name;
}

@layer jokul.theme {
    // Sett CSS-variabler for alle spacing-kombinasjoner
    :root {
        @each $spacing-combination in spacing.$combinations {
            $_step: list.nth($spacing-combination, 1);
            $_value: map.get(jkl.$tokens, "spacing", $_step);

            @if not $_value {
                @error "Forsøker å lage en dynamisk spacing-variabel med en avstand som ikke finnes (#{$_step})!"
            }

            // Vi trenger ikke redefinere de vanlige spacing-variablene (de som bare har én verdi)
            @if list.length($spacing-combination) != 1 {
                --#{get-class-name($spacing-combination)}: #{$_value};
            }
        }

        @include screens.from-medium-device {
            @each $spacing-combination in spacing.$combinations {
                @if list.length($spacing-combination) > 1 {
                    $_step: list.nth($spacing-combination, 2);
                    $_value: map.get(jkl.$tokens, "spacing", $_step);

                    @if not $_value {
                        @error "Forsøker å lage en dynamisk spacing-variabel med en avstand som ikke finnes (#{$_step})!"
                    }

                    --#{get-class-name($spacing-combination)}: #{$_value};
                }
            }
        }

        @include screens.from-large-device {
            @each $spacing-combination in spacing.$combinations {
                @if list.length($spacing-combination) > 2 {
                    $_step: list.nth($spacing-combination, 3);
                    $_value: map.get(jkl.$tokens, "spacing", $_step);

                    @if not $_value {
                        @error "Forsøker å lage en dynamisk spacing-variabel med en avstand som ikke finnes (#{$_step})!"
                    }

                    --#{get-class-name($spacing-combination)}: #{$_value};
                }
            }
        }
    }
}