@use "helper-functions";
@use "colors_definitions";
@use "sass:color";
@use "sass:map";

@function contrast-checker($color, $primary) {
    $r: (max(color.channel($color, "red", $space: rgb), color.channel($primary, "red", $space: rgb))) -
        (min(color.channel($color, "red", $space: rgb), color.channel($primary, "red", $space: rgb)));
    $g: (max(color.channel($color, "green", $space: rgb), color.channel($primary, "green", $space: rgb))) -
        (min(color.channel($color, "green", $space: rgb), color.channel($primary, "green", $space: rgb)));
    $b: (max(color.channel($color, "blue", $space: rgb), color.channel($primary, "blue", $space: rgb))) -
        (min(color.channel($color, "blue", $space: rgb), color.channel($primary, "blue", $space: rgb)));
    $sum-rgb: $r + $g + $b;

    @if $sum-rgb < 300 {
        @return "false";
    } @else {
        @return "true";
    }
}

// Create the custom block for theme (no mixing)
@each $tone in ("light", "dark") {
    .fas-custom-#{$tone} {
        @if $tone == "light" {
            --custom-color-base-00: #{colors_definitions.$default-primary-light};
            --custom-color-base-100: #{colors_definitions.$default-text-light};
            --custom-color-space: srgb-linear;
        } @else {
            --custom-color-base-00: #{colors_definitions.$default-text-dark};
            --custom-color-base-100: #{colors_definitions.$default-primary-dark};
            --custom-color-space: srgb-linear;
        }

        --color-base-05: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 05%);
        --color-base-10: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 10%);
        --color-base-20: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 15%);
        --color-base-25: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 25%);
        --color-base-30: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 20%);
        --color-base-35: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 35%);
        --color-base-40: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 40%);
        --color-base-50: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 50%);
        --color-base-60: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 60%);
        --color-base-70: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 70%);
        --color-base-80: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 80%);
        --color-base-90: color-mix(in var(--color-space), var(--color-base-00), var(--color-base-100) 90%);
    }

    .is-mobile.theme-#{$tone}.fas-custom-#{$tone},
    .theme-#{$tone}.fas-custom-#{$tone} {
        --color-base-00: var(--custom-color-base-00);
        --color-base-100: var(--custom-color-base-100);
        --color-space: var(--custom-color-space);
    }

    @media print {
        .fas-theme-#{$tone}-print.fas-custom-#{$tone} {
            --color-base-00: var(--custom-color-base-00);
            --color-base-100: var(--custom-color-base-100);
            --color-space: var(--custom-color-space);
        }
    }
}

@mixin predefinedPalette($tone, $theme, $primary, $text, $space, $mix-with) {
    // Set the base variables for the gradient
    --color-space: #{$space};
    --color-base-00: #{$primary};
    --color-base-100: #{$text};

    --color-base-05: #{color.mix($text, $primary, $weight: 5%, $method: #{$space})};
    --color-base-10: #{color.mix($text, $primary, $weight: 10%, $method: #{$space})};
    --color-base-20: #{color.mix($text, $primary, $weight: 15%, $method: #{$space})};
    --color-base-25: #{color.mix($text, $primary, $weight: 25%, $method: #{$space})};
    --color-base-30: #{color.mix($text, $primary, $weight: 30%, $method: #{$space})};
    --color-base-35: #{color.mix($text, $primary, $weight: 35%, $method: #{$space})};
    --color-base-40: #{color.mix($text, $primary, $weight: 40%, $method: #{$space})};
    --color-base-50: #{color.mix($text, $primary, $weight: 50%, $method: #{$space})};
    --color-base-60: #{color.mix($text, $primary, $weight: 60%, $method: #{$space})};
    --color-base-70: #{color.mix($text, $primary, $weight: 70%, $method: #{$space})};
    --color-base-80: #{color.mix($text, $primary, $weight: 80%, $method: #{$space})};
    --color-base-90: #{color.mix($text, $primary, $weight: 90%, $method: #{$space})};

    // Compute the middle color (for headings)
    $tone-modif: (
        "dark": 10,
        "light": -10
    );
    @if color.channel($primary, "saturation", $space: hsl) < 1 and color.channel($text, "saturation", $space: hsl) < 1 {
        --middle-color: #{$text};
        --middle-color-complement: #{$text};
    } @else {
        $middle-color: hsl(
            color.channel(color.mix($primary, $text, 50%), "hue", $space: hsl),
            70%,
            50% + helper-functions.map-deep-get($tone-modif, $tone)
        );
        --middle-color: #{$middle-color};
        --middle-color-complement: #{color.complement($middle-color)};
    }

    // For each extended color
    @each $color in map.keys(map.get(colors_definitions.$extended-colors, $tone)) {
        $c: helper-functions.map-deep-get(colors_definitions.$extended-colors, $tone, $color);
        $is_gray: color.channel($c, "saturation", $space: hsl) == 0%;
        $c: color.mix($c, $mix-with, colors_definitions.$keep); // Keep n% of the color
        @if $is_gray {
            $c: color.change($c, $saturation: 0%);
        }

        @if $tone == "light" {
            $c: helper-functions.darken-till-contrast($c, $primary);
            --color-#{$color}: #{$c};

            $c:
                color.channel($c, "red", $space: rgb), color.channel($c, "green", $space: rgb),
                color.channel($c, "blue", $space: rgb);
            --color-#{$color}-rgb: #{$c};
        } @else {
            $c: helper-functions.lighten-till-contrast($c, $primary);
            --color-#{$color}: #{$c};

            $c:
                color.channel($c, "red", $space: rgb), color.channel($c, "green", $space: rgb),
                color.channel($c, "blue", $space: rgb);
            --color-#{$color}-rgb: #{$c};
        }
    }
}

@each $tone, $theme, $primary, $text, $space in colors_definitions.$themes {
    // Compute middle color between primary and text, used to mix the palette
    $hue-primary: color.channel($primary, "hue", $space: hsl);
    $hue-text: color.channel($text, "hue", $space: hsl);
    $mix-with: hsl(color.channel(color.mix($primary, $text), "hue", $space: hsl), 100%, 50%);
    @if color.channel($primary, "saturation", $space: hsl) < 1 and color.channel($text, "saturation", $space: hsl) < 1 {
        $mix-with: hsl(
            0,
            0%,
            calc(
                (color.channel($primary, "lightness", $space: hsl) + color.channel($text, "lightness", $space: hsl)) / 2
            )
        );
    }

    // Create the class CSS block
    .is-mobile.theme-#{$tone}.fas-#{$tone},
    .theme-#{$tone}.fas-#{$theme} {
        @include predefinedPalette($tone, $theme, $primary, $text, $space, $mix-with);
    }

    @media print {
        .fas-theme-#{$tone}-print.fas-#{$theme} {
            @include predefinedPalette($tone, $theme, $primary, $text, $space, $mix-with);
        }
    }
}
