//
// Title
// --------------------------------------------------

$base-styles: () !default;

// Get Styles merged with header styles
@function build_base-styles_with_header-styles($base-styles, $header-styles) {

  @each $size, $headers in $header-styles {

    $-base-styles: ();

    @if map-has-key($base-styles, $size) {
      $-base-styles: map-get($base-styles, $size);
    }

    @each $header, $header_style in $headers {
      $base-style: map-get($-base-styles, $header);

      @if type-of($base-style) == "map" {
        $-style: null;
        @if map-has-key($base-style, "style") {
          $-style: map-get($base-style, "style");
        }

        @if type-of($-style) != "map" {
          $-style: ();
        }

        $-style: map-merge($-style, $header_style);

        $base-style: map-merge($base-style, ("style": $-style));
      }
      @else {
        $base-style: ("selectors": ("#{$header}", ".#{$header}"), "style": $header_style, "proto": false);
      }

      $-base-styles: map-merge($-base-styles, ($header: $base-style));
    }

    $base-styles: map-merge($base-styles, ($size: $-base-styles));
  }
  @return $base-styles;
}

$base-styles: build_base-styles_with_header-styles($base-styles, $header-styles);

// Get base style by key and property
@function get-style-prop($key: "p", $prop: "font-size", $default: false, $size: small) {

  $-base-styles: -zf-get-bp-val($base-styles, $size);

  @if map-has-key($-base-styles, $key) {
    $-base-style: map_get($-base-styles, $key);

    @if map-has-key($-base-style, "style") {
      $-style: map_get($-base-style, "style");

      @if map-has-key($-style, $prop) {
        $-prop-val: map_get($-style, $prop);

        @if $prop == "font-size" and type-of($-prop-val) == "number" {
          @if unit($-prop-val) != "px" or unit($-prop-val) != "%" {
            $-prop-val: rem-calc($-prop-val);
          }
        }

        @return $-prop-val;
      }
    }
  }

  @return $default;
}

/** Get base style font weight */
@function get-style-font-weight($type: "regular", $family: null) {

  @if $family == null and map-has-key($base-font, family) {

    $family: map-get($base-font, family);
  }

  @if $family {

    @each $key, $-base-font in $base-font-stack {

      @if type-of($-base-font) == "map" and map-has-key($-base-font, family) and map-has-key($-base-font, type) {

        @if $type == map-get($-base-font, type) {

          @return map-get($-base-font, font-weight);
        }
      }
    }
  }

  @return null;
}

/** Mixin style property */
@mixin style-prop($key: "p", $prop: "font-size", $default: false, $size: null, $auto-insert-breakpoints: true) {

  @if map-has-key($breakpoints, $size) {
    $-val: get-style-prop($key, $prop, $default, $size);

    @if $-val {
      @if $auto-insert-breakpoints {
        @include breakpoint($size) {
          #{$prop}: $-val;
        }
      }
      @else {
        #{$prop}: $-val;
      }
    }
  }
  @else {
    @include -zf-each-breakpoint(true, $auto-insert-breakpoints) {

      $-val: get-style-prop($key, $prop, $default, $-zf-size);

      @if $-val {
        #{$prop}: $-val;
      }
    }
  }
}

/** Mixin style properties */
@mixin style-props($key: "p", $size: null, $auto-insert-breakpoints: true) {

  $sizes: ();

  @if map-has-key($breakpoints, $size) {
    $sizes: ($size);
  }
  @else {
    $sizes: map-merge($sizes, $breakpoints);
  }

  @each $-size, $-size-val in $sizes {
    @if map-has-key($base-styles, $-size) {
      $-base-styles: map-get($base-styles, $-size);
      $-base-style: map-get($-base-styles, $key);

      @if type-of($-base-style) == "map" {
        $-style-props: map-get($-base-style, "style");

        @if type-of($-style-props) == "map" {
          @each $-prop, $-prop-val in $-style-props {
            @include style-prop($key, $-prop, false, $-size, $auto-insert-breakpoints);
          }
        }
      }
    }
  }
}

/** Mixin style font weight */
@mixin style-font-weight($type: "regular", $family: null, $important: false) {

  $-weight: get-style-font-weight($type, $family);

  @if $-weight {
    @if $important == true {
      font-weight: $-weight !important;
    }
    @else {
      font-weight: $-weight;
    }
  }
}

@mixin style-classes($selector: "h3", $prefix-selector: ".text", $style-keys: null, $select-class: false) {

  @if type-of($style-keys) != "list" {
    $style-keys: ("h1", "h2", "h3", "h4", "h5", "h6");
  }

  @include -zf-each-breakpoint() {
    $-base-styles: -zf-get-bp-val($base-styles, $-zf-size);

    @include breakpoint($-zf-size) {
      @each $key, $-base-style in $-base-styles {

        @if index($style-keys, $key)!= null {
          $-style-props: map-get($-base-style, "style");

          @if type-of($-style-props) == "map" {
            $-master-selector: "&#{$prefix-selector}-#{$key}";

            @if $select-class == true {
              $-master-selector: #{$prefix-selector}-#{$key}--#{$selector};
            }

            #{$-master-selector} {
              #{$selector} {
                @each $-prop, $-prop-val in $-style-props {
                  @include style-prop($key, $-prop, false, $-zf-size, false);
                }
              }
            }
          }
        }
      }
    }
  }
}

/** Mixin style classes */
@mixin base-style-classes($select-class: false) {

  @include -zf-each-breakpoint() {
    $-base-styles: -zf-get-bp-val($base-styles, $-zf-size);

    @include breakpoint($-zf-size) {
      @each $key, $-base-style in $-base-styles {

        @if map-has-key($-base-style, "proto") {
          $-proto: map-get($-base-style, "proto");

          $-selectors: null;

          @if map-has-key($-base-style, "selectors") {
            $-selectors: map-get($-base-style, "selectors");
          }

          @if type-of($-selectors) != "map" and type-of($-selectors) != "string" {
            $-selectors: ("#{$key}", ".#{$key}");
          }

          @if $-proto == true and $select-class == true {
            #{$-selectors} {
              &.text-body {
                font-family: $body-font-family !important;
              }

              &.text-header {
                font-family: $header-font-family !important;
              }

              &.text-title {
                font-family: $title-font-family !important;
              }

              @each $prop_val in (uppercase, inherit, none, capitalize, lowercase) {
                &.text-#{$prop_val} {
                  text-transform: #{$prop_val} !important;
                }
              }
            }
          }

          @if $-proto == true {

            $-body-selector: "&.text-body";

            @if $select-class == true {
              $-body-selector: ".text-body--#{$key}";
            }

            #{$-body-selector} {
              #{$-selectors} {
                @if $select-class == true {
                  font-family: $body-font-family !important;
                }
                @else {
                  font-family: $body-font-family;
                }
              }
            }

            $-title-selector: "&.text-title";

            @if $select-class == true {
              $-title-selector: ".text-title--#{$key}";
            }

            #{$-title-selector} {
              #{$-selectors} {
                @if $select-class == true {
                  font-family: $title-font-family !important;
                }
                @else {
                  font-family: $title-font-family;
                }
              }
            }

            $-underline-selector: "&.text-underline";
            $-underline-center-selector: "&.text-underline-center";

            @if $select-class == true {
              $-underline-selector: ".text-underline--#{$key}";
              $-underline-center-selector: "&.text-underline-center--#{$key}";
            }

            #{$-underline-selector} {
              #{$-selectors} {
                @include style-underline;
              }

              #{$-underline-center-selector} {
                #{$-selectors} {
                  @include style-underline-center;
                }
              }

              @each $-color-name, $-color in $foundation-palette {
                $-color-selector: "&.text-underline-#{$-color-name}";

                @if $select-class == true {
                  $-color-selector: "&.text-underline-#{$-color-name}--#{$key}";
                }

                #{$-color-selector} {
                  #{$-selectors} {
                    @include style-underline-color($-color);
                  }
                }
              }

              @each $-size-name, $-size-value in map-remove($underline-sizes, default) {
                $-size-selector: "&.text-underline-#{$-size-name}";

                @if $select-class == true {
                  $-size-selector: "&.text-underline-#{$-size-name}--#{$key}";
                }

                #{$-size-selector} {
                  #{$-selectors} {
                    @include style-underline-size($-size-value);
                  }
                }
              }
            }

            $-fit-center-selector: "&.text-fit-center";

            @if $select-class == true {
              $-fit-center-selector: ".text-fit-center--#{$key}";
            }

            #{$-fit-center-selector} {
              #{$-selectors} {
                @include style-fit-center;
              }
            }

            $-hr-selector: "&.text-hr";

            @if $select-class == true {
              $-hr-selector: ".text-hr--#{$key}";
            }

            #{$-hr-selector} {
              #{$-selectors} {
                @include style-hr;
              }
            }

            $-hr-margin-selector: "&.text-hr-margin";

            @if $select-class == true {
              $-hr-margin-selector: ".text-hr-margin--#{$key}";
            }

            #{$-hr-margin-selector} {
              #{$-selectors} {
                @include style-hr-margin;
              }

              @for $i from 2 through 4 {
                &.text-hr-margin-#{$i}x--#{$key} {
                  #{$-selectors} {
                    @include style-hr-margin($i);
                  }
                }
              }
            }

            $-hr-padding-selector: "&.text-hr-padding";

            @if $select-class == true {
              $-hr-padding-selector: ".text-hr-padding--#{$key}";
            }

            #{$-hr-padding-selector} {
              #{$-selectors} {
                @include style-hr-padding;
              }

              @for $i from 2 through 4 {
                &.text-hr-padding-#{$i}x--#{$key} {
                  #{$-selectors} {
                    @include style-hr-padding($i);
                  }
                }
              }
            }

            @each $prop_val in (uppercase, inherit, none, capitalize, lowercase) {
              $-master-selector: "&.text-#{$prop_val}";

              @if $select-class == true {
                $-master-selector: ".text-#{$prop_val}--#{$key}";
              }

              #{$-master-selector} {
                #{$-selectors} {
                  @if $select-class == true {
                    text-transform: #{$prop_val} !important;
                  }
                  @else {
                    text-transform: #{$prop_val};
                  }
                }
              }
            }

            $-fonts: ();

            @if map-has-key($base-font, type) and map-has-key($base-font, family) {
              $-fonts: map-merge($-fonts, ("body": $base-font));
            }

            @if map-has-key($base-font-title, type) and map-has-key($base-font-title, family) {
              $-fonts: map-merge($-fonts, ("title": $base-font-title));
            }

            @each $key-base-font, $-base-font in $base-font-stack {

              @if map-has-key($-base-font, type) and map-has-key($-base-font, family) {
                $-family: map-get($-base-font, family);
                $-type: map-get($-base-font, type);

                @each $-key-font, $-font in $-fonts {
                  @if $-family == map-get($-font, family) {
                    $-for: map-get($-font, for);

                    $-master-selector: "&.text-#{$-key-font}-#{$-type}";

                    @if $select-class == true {
                      $-master-selector: ".text-#{$-key-font}-#{$-type}--#{$key}";
                    }

                    #{$-master-selector} {
                      #{$-selectors} {
                        @if $select-class == true {
                          font-family: map-get($-font, font-family) !important;
                          @include style-font-weight($-type, $-family, true);
                        }
                        @else {
                          font-family: map-get($-font, font-family);
                          @include style-font-weight($-type, $-family);
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}

@mixin base-style-font-class() {
  @each $key-base-font, $-base-font in $base-font-stack {

    @if map-has-key($-base-font, type) and map-has-key($-base-font, family) {
      $-family: map-get($-base-font, family);
      $-type: map-get($-base-font, type);

      $-fonts: ();

      @if map-has-key($base-font, type) and map-has-key($base-font, family) {
        $-fonts: map-merge($-fonts, ("body": $base-font));
      }

      @if map-has-key($base-font-title, type) and map-has-key($base-font-title, family) {
        $-fonts: map-merge($-fonts, ("title": $base-font-title));
      }

      @each $-key-font, $-font in $-fonts {
        @if $-family == map-get($-font, family) {
          $-for: map-get($-font, for);

          .text-#{$-key-font}-#{$-type} {
            font-family: map-get($-font, font-family);
            @include style-font-weight($-type, $-family, false);
          }
        }
      }
    }
  }

  @if (map-has-key($base-font, family)) {
    $-base-font-familly: map-get($base-font, family);

    @each $key-base-font, $-base-font in $base-font-stack {

      @if map-has-key($-base-font, type) and map-has-key($-base-font, family) {
        $-family: map-get($-base-font, family);
        $-type: map-get($-base-font, type);

        @if ($-family == $-base-font-familly) {
          .text-weight-#{$-type} {
            @include style-font-weight($-type, $-family, true);
          }
        }
      }
    }
  }
}