@use "../../../config/_responsive" as *;
@use "../../kernel-functions/_break-point" as *;
@use "../functions/responsive" as *;
@use "../../../config/paths" as *;
@use "../../../config/_typography" as *;
@use "../../../../themes/niva/config/typography" as *;
@use 'sass:list';
@use 'sass:map';
@use 'sass:string';

$font-family-prefix:"font-";
$font-size-prefix: $conf-font-prefix + "-size";
$values-text-align:(center,end,start,left,right,justify);
$values-text-transform:(lowercase,none,uppercase,capitalize);
$values-text-decoration-line:(line-through,none,overline,underline,wavy);
$values-text-decoration-style:(dashed,dotted,double,solid);
$values-font-style:(italic,);
$values-white-space:(unset, pre, pre-wrap, pre-line, wrap, nowrap);
$values-text-wrap:(unset, balance, nowrap, wrap);
$values-list-style-type:(disc, circle, square, decimal, georgian, trad-chinese-informal, kannada);
$values-list-style-position:(inside, outside);

.font-weight-black{
    font-weight: 900;
}
.font-weight-extra-bold{
    font-weight: 800;
}
.font-weight-bold{
    font-weight: 700;
}
.font-weight-semi-bold{
    font-weight: 600;
}
.font-weight-medium{
    font-weight: 500;
}
.font-weight-regular{
    font-weight: 400;
}
.font-weight-light{
    font-weight: 300;
}
.font-weight-extra-light{
    font-weight: 200;
}
.font-weight-thin{
    font-weight: 100;
}

@function font-weight-connection($weight-string){
    $weight-number : 0;
    @if ($weight-string == "black"){$weight-number: 900;}
    @else if ($weight-string == "extra-bold"){$weight-number: 800;}
    @else if ($weight-string == "bold"){$weight-number: 700;}
    @else if ($weight-string == "semi-bold"){$weight-number: 600;}
    @else if ($weight-string == "medium"){$weight-number: 500;}
    @else if ($weight-string == "regular"){$weight-number: 400;}
    @else if ($weight-string == "light"){$weight-number: 300;}
    @else if ($weight-string == "extra-light"){$weight-number: 200;}
    @else if ($weight-string == "thin"){$weight-number: 100;}

    @return $weight-number;
}

@mixin make-font-face{
    @each $font-name , $font-details in $conf-fonts {
        $font-folder: map.get($font-details, "folder");
        $font-default: map.get($font-details, "defaults");
        @each $font-type, $font-files in map.get($font-details, "font-types") {
        $font-weight : font-weight-connection($font-type);
            @font-face {
            $file-src : '';
            font-family: $font-name;
            font-weight: $font-weight;
            @each $font-file in $font-files {
                $file-name: list.nth($font-file, 1);
                $file-format: string.slice($file-name, string.index($file-name, ".") + 1);
                $file-path: $font-folder + "/" + $file-name;
                $file-src :$file-src + #{url("#{$fonts-path + $file-path}")} + ",";
            }
            src: string.unquote($file-src);
            }
        }
        .#{$font-family-prefix}#{$font-name}{
            font-family: string.unquote("var(--font-#{$font-name})") , string.unquote($font-default);
        }
    }
}

@function generate-text-style($property , $value , $class){
    $list : ();
    $base : ();
    @each $name in $value{
        $base:generate-classes-on-value(($conf-font-prefix + "-" + $class) , $name);
        $map:(
            className: $base,
            propertyKeys:'#{$property}',
            propertyValues:$name
        );
        $list:list.append($list , $map);
    }
    @return $list;
}

@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-font-size-responsive(){
    @if (map.get($conf-font-size, "responsive")){
        $break-point-values:map.values($break-points);
        @for $i from 1 through list.length($conf-font-size-responsive){
            $break-point-value:list.nth($break-point-values,$i);
            $font-value:list.nth($conf-font-size-responsive,$i);
            @if get-greatest-break-point() == $break-point-value{
                html{
                    --html-font-size: #{$font-value};
                    font-size:var(--html-font-size);
                }
            }

            @else{
                @media screen and (max-width:$break-point-value){
                    html{
                        --html-font-size: #{$font-value};
                    }
                }
            }
        }
    }
}

@include make-font-face();
@include generate-font-size-responsive();
$font-size : generate-typography-size-classes($conf-font-size, $font-size-prefix);
$text-align : generate-text-style(text-align , $values-text-align , align);
$text-transform : generate-text-style(text-transform , $values-text-transform , transform);
$text-decoration-line : generate-text-style(text-decoration-line , $values-text-decoration-line , decoration);
$text-decoration-style : generate-text-style(text-decoration-style , $values-text-decoration-style , decoration-style);
$font-style : generate-text-style(font-style , $values-font-style , style);
$white-space : generate-text-style(white-space , $values-white-space , white-space);
$text-wrap : generate-text-style(text-wrap , $values-text-wrap , wrap);
$list-style-type : generate-text-style(list-style-type , $values-list-style-type , list-type);
$list-style-position : generate-text-style(list-style-position , $values-list-style-position , list-position);