@use "../functions/_responsive" as *;
@use "../../common/_inset-inline" as *;
@use "../mixins/_variables" as *;
@use "_typography" as *;
@use "_colors" as *;
@use "_icon" as *;
@use "../functions/_space" as *;
@use "../layouts/_dims" as *;
@use "../layouts/_displays" as *;
@use "../layouts/_flex" as *;
@use "../layouts/_grid" as *;
@use "../layouts/_orders" as *;
@use "_border" as *;
@use "../../../config/_responsive" as *;
@use "../../../config/_typography" as *;
@use 'sass:list';
@use 'sass:string';
@use 'sass:map';

$total-list : (
    $display-values,
    $flex-cols,
    $width-list,
    $height-list,
    $flex-type,
    $flex-orders,
    $flex-grows,
    $grid,
    $padding,
    $margin,
    $gap,
    $col-gap,
    $letter-spacing,
    $font-size,
    $text-transform,
    $text-align,
    $text-decoration-line,
    $text-decoration-style,
    $font-style,
    $icon-size,
    $white-space,
    $text-wrap,
    $top-list,
    $bottom-list,
    $left-list,
    $right-list,
    $inset-inline-start-list,
    $inset-inline-end-list,
    $line-height,
    $list-style-type,
    $list-style-position,
);

@function get-greatest-break-point(){
    $max-size:0;
    @each $key , $value in $break-points{
        @if map.get($break-points, $key) > $max-size{
            $max-size : map.get($break-points, $key);
        }
    }
    @return $max-size;
}

@mixin generate-header-horizontally(){
    @for $i from 1 through list.length($header-space-horizontally){
        $break-point-values:map.values($break-points);
        $max-width-values:list.nth($break-point-values,$i);
        $space-value:list.nth($header-space-horizontally,$i);
        @if get-greatest-break-point() == $max-width-values{
            .header{
                --padding-left: #{$space-value};
                --padding-right: #{$space-value};
                padding-left:var(--padding-left);
                padding-right:var(--padding-right);
            }
        }
        @else{
            @media screen and (max-width:$max-width-values){
                .header{
                    --padding-left: #{$space-value};
                    --padding-right: #{$space-value};
                }
            }
        }
    }
}
@mixin generate-boxed-horizontally(){
    @for $i from 1 through list.length($boxed-space-horizontally){
        $break-point-values:map.values($break-points);
        $max-width-values:list.nth($break-point-values,$i);
        $space-value:list.nth($boxed-space-horizontally,$i);
        $max-width:get-greatest-break-point();
        @if get-greatest-break-point() == $max-width-values{
            .section{
                --padding-left: #{$space-value};
                --padding-right: #{$space-value};
                padding-left:var(--padding-left);
                padding-right:var(--padding-right);
            }
        }
        @else{
            @media screen and (max-width:$max-width-values){
                .section{
                    --padding-left: #{$space-value};
                    --padding-right: #{$space-value};
                }
            }
        }
    }
}
@mixin generate-boxed-vertically(){
    @for $i from 1 through list.length($boxed-space-vertically){
        $break-point-values:map.values($break-points);
        $max-width-values:list.nth($break-point-values,$i);
        $space-value:list.nth($boxed-space-vertically,$i);
        @if get-greatest-break-point() == $max-width-values{
            .section{
                --padding-top: #{$space-value};
                --padding-bottom: #{$space-value};
                padding-top:var(--padding-top);
                padding-bottom:var(--padding-bottom);
            }
        }
        @else{
            @media screen and (max-width:$max-width-values){
                .section{
                    --padding-top: #{$space-value};
                    --padding-bottom: #{$space-value};
                }
            }
        }
    }
}
@mixin generate-header-vertically(){
    @for $i from 1 through list.length($header-space-vertically){
        $break-point-values:map.values($break-points);
        $max-width-values:list.nth($break-point-values,$i);
        $space-value:list.nth($header-space-vertically,$i);
        @if get-greatest-break-point() == $max-width-values{
            .header{
                --padding-top: #{$space-value};
                --padding-bottom: #{$space-value};
                padding-top:var(--padding-top);
                padding-bottom:var(--padding-bottom);
            }
        }
        @else{
            @media screen and (max-width:$max-width-values){
                .header{
                    --padding-top: #{$space-value};
                    --padding-bottom: #{$space-value};
                }
            }
        }
    }
}

@include generate-header-horizontally();
@include generate-header-vertically();
@include generate-boxed-horizontally();
@include generate-boxed-vertically();


.section.wide{
    padding-right:0px !important;
    padding-left: 0px !important;
}


@function check-config-count($total-list-item){
    @if list.length(list.nth($total-list,$total-list-item))!=0{
        @return true;
    }
    @return false;
}

@mixin generate-classes($value){
    @for $i from 1 through list.length($total-list){
        @for $j from 1 through list.length(list.nth($total-list,$i)){
            @include generate-style-property($i,$j,$value);
        }
    }
}

@function break-point($class-name){
    $result:();
    $i:1;
    @each $key , $value in $break-points{
        @if string.index($class-name , ("-" + $key + "-")) != null{
            $result:$value;
            @return $value;
        }
        @if ($i == 1){
            $result:$value;
        }
        $i:$i+1;
    }
    @return $result;
}
@function str-replace($string, $search, $replace: '') {
    $index: string.index($string, $search);

    @if ($index){
        @return string.slice($string, 1, $index - 1) + $replace + str-replace(string.slice($string, $index + string.length($search)), $search, $replace);
    }

    @return $string;
}

@mixin generate-style-property($total-list-item,$total-list-member-item,$break-point-value){
    $total-list-member:list.nth($total-list,$total-list-item);
    @if (check-config-count($total-list-item)){
        $class-name:map.get(list.nth($total-list-member,$total-list-member-item),className);
        $class-name-greatest : str-replace($class-name,"-#{get-greatest-break-point-key()}");

        $result : ();
        @each $item1 in $class-name{
            @each $item2 in $class-name-greatest{
                @if ($item1 != $item2){
                    $result : $item2;
                }
            }
        }

        $property-keys:map.get(list.nth($total-list-member,$total-list-member-item),propertyKeys);
        $property-break-point:break-point($class-name);
        $property-values:map.get(list.nth($total-list-member,$total-list-member-item),propertyValues);
        $property-list:($property-keys,$property-values);
        
        @if($break-point-value==$property-break-point){
            @if ($result != ()){
                #{$result}{
                    @for $k from 1 through list.length($property-keys){
                        #{list.nth(list.nth($property-list,1),$k)}: list.nth(list.nth($property-list,2),$k);
                    }
                }
            }
            
            #{$class-name}{
                @for $k from 1 through list.length($property-keys){
                    #{list.nth(list.nth($property-list,1),$k)}: list.nth(list.nth($property-list,2),$k);
                }
            }
        }
    }
}

@function get-greatest-break-point-key(){
    $max-size-key:"";
    $max-size:0;
    @each $key , $value in $break-points{
        @if map.get($break-points, $key) > $max-size{
            $max-size : map.get($break-points, $key);
            $max-size-key: $key;
        }
    }
    @return $max-size-key;
}
@mixin check-break-point(){
    @each $key , $value in $break-points{
        $max-break-point:get-greatest-break-point();
        $max-break-point-key: get-greatest-break-point-key();
        @if($value != $max-break-point){
            @media screen and (max-width : $value) {
                @include generate-classes($value);
            }
        }  
        @else{
            @include generate-classes($value);
        }
    }
}
@include check-break-point();