// Hydrogen / Properties / Headings

@mixin h2-prop-headings($mediaQueryMap, $headingMap, $heading-1-border-color, $heading-1-border-style, $heading-1-border-width, $heading-1-font-color, $heading-1-font-family, $heading-1-font-size, $heading-1-font-weight, $heading-2-border-color, $heading-2-border-style, $heading-2-border-width, $heading-2-font-color, $heading-2-font-family, $heading-2-font-size, $heading-2-font-weight, $heading-3-border-color, $heading-3-border-style, $heading-3-border-width, $heading-3-font-color, $heading-3-font-family, $heading-3-font-size, $heading-3-font-weight, $heading-4-border-color, $heading-4-border-style, $heading-4-border-width, $heading-4-font-color, $heading-4-font-family, $heading-4-font-size, $heading-4-font-weight, $heading-5-border-color, $heading-5-border-style, $heading-5-border-width, $heading-5-font-color, $heading-5-font-family, $heading-5-font-size, $heading-5-font-weight, $heading-6-border-color, $heading-6-border-style, $heading-6-border-width, $heading-6-font-color, $heading-6-font-family, $heading-6-font-size, $heading-6-font-weight) {

  @each $mediaKey, $mediaValue in $mediaQueryMap {
    @media #{$mediaValue} {
      @each $heading in $headingMap {

        [data-h2-heading*="#{$mediaKey}(#{$heading})"] {
          @if $heading == "h1" {
            border-color: $heading-1-border-color;
            border-style: $heading-1-border-style;
            border-width: $heading-1-border-width;
            color: $heading-1-font-color;
            font-family: $heading-1-font-family;
            font-size: $heading-1-font-size;
            font-weight: $heading-1-font-weight;
          } @else if $heading == "h2" {
            border-color: $heading-2-border-color;
            border-style: $heading-2-border-style;
            border-width: $heading-2-border-width;
            color: $heading-2-font-color;
            font-family: $heading-2-font-family;
            font-size: $heading-2-font-size;
            font-weight: $heading-2-font-weight;
          } @else if $heading == "h3" {
            border-color: $heading-3-border-color;
            border-style: $heading-3-border-style;
            border-width: $heading-3-border-width;
            color: $heading-3-font-color;
            font-family: $heading-3-font-family;
            font-size: $heading-3-font-size;
            font-weight: $heading-3-font-weight;
          } @else if $heading == "h4" {
            border-color: $heading-4-border-color;
            border-style: $heading-4-border-style;
            border-width: $heading-4-border-width;
            color: $heading-4-font-color;
            font-family: $heading-4-font-family;
            font-size: $heading-4-font-size;
            font-weight: $heading-4-font-weight;
          } @else if $heading == "h5" {
            border-color: $heading-5-border-color;
            border-style: $heading-5-border-style;
            border-width: $heading-5-border-width;
            color: $heading-5-font-color;
            font-family: $heading-5-font-family;
            font-size: $heading-5-font-size;
            font-weight: $heading-5-font-weight;
          } @else if $heading == "h6" {
            border-color: $heading-6-border-color;
            border-style: $heading-6-border-style;
            border-width: $heading-6-border-width;
            color: $heading-6-font-color;
            font-family: $heading-6-font-family;
            font-size: $heading-6-font-size;
            font-weight: $heading-6-font-weight;
          }
        }

        @each $headingValue in $headingMap {
          #{$headingValue}[data-h2-heading*="#{$mediaKey}(#{$heading})"] {
            @if $heading == "h1" {
              border-color: $heading-1-border-color;
              border-style: $heading-1-border-style;
              border-width: $heading-1-border-width;
              color: $heading-1-font-color;
              font-family: $heading-1-font-family;
              font-size: $heading-1-font-size;
              font-weight: $heading-1-font-weight;
            } @else if $heading == "h2" {
              border-color: $heading-2-border-color;
              border-style: $heading-2-border-style;
              border-width: $heading-2-border-width;
              color: $heading-2-font-color;
              font-family: $heading-2-font-family;
              font-size: $heading-2-font-size;
              font-weight: $heading-2-font-weight;
            } @else if $heading == "h3" {
              border-color: $heading-3-border-color;
              border-style: $heading-3-border-style;
              border-width: $heading-3-border-width;
              color: $heading-3-font-color;
              font-family: $heading-3-font-family;
              font-size: $heading-3-font-size;
              font-weight: $heading-3-font-weight;
            } @else if $heading == "h4" {
              border-color: $heading-4-border-color;
              border-style: $heading-4-border-style;
              border-width: $heading-4-border-width;
              color: $heading-4-font-color;
              font-family: $heading-4-font-family;
              font-size: $heading-4-font-size;
              font-weight: $heading-4-font-weight;
            } @else if $heading == "h5" {
              border-color: $heading-5-border-color;
              border-style: $heading-5-border-style;
              border-width: $heading-5-border-width;
              color: $heading-5-font-color;
              font-family: $heading-5-font-family;
              font-size: $heading-5-font-size;
              font-weight: $heading-5-font-weight;
            } @else if $heading == "h6" {
              border-color: $heading-6-border-color;
              border-style: $heading-6-border-style;
              border-width: $heading-6-border-width;
              color: $heading-6-font-color;
              font-family: $heading-6-font-family;
              font-size: $heading-6-font-size;
              font-weight: $heading-6-font-weight;
            }
          }
        }

        p[data-h2-heading*="#{$mediaKey}(#{$heading})"] {
          @if $heading == "h1" {
            border-color: $heading-1-border-color;
            border-style: $heading-1-border-style;
            border-width: $heading-1-border-width;
            color: $heading-1-font-color;
            font-family: $heading-1-font-family;
            font-size: $heading-1-font-size;
            font-weight: $heading-1-font-weight;
          } @else if $heading == "h2" {
            border-color: $heading-2-border-color;
            border-style: $heading-2-border-style;
            border-width: $heading-2-border-width;
            color: $heading-2-font-color;
            font-family: $heading-2-font-family;
            font-size: $heading-2-font-size;
            font-weight: $heading-2-font-weight;
          } @else if $heading == "h3" {
            border-color: $heading-3-border-color;
            border-style: $heading-3-border-style;
            border-width: $heading-3-border-width;
            color: $heading-3-font-color;
            font-family: $heading-3-font-family;
            font-size: $heading-3-font-size;
            font-weight: $heading-3-font-weight;
          } @else if $heading == "h4" {
            border-color: $heading-4-border-color;
            border-style: $heading-4-border-style;
            border-width: $heading-4-border-width;
            color: $heading-4-font-color;
            font-family: $heading-4-font-family;
            font-size: $heading-4-font-size;
            font-weight: $heading-4-font-weight;
          } @else if $heading == "h5" {
            border-color: $heading-5-border-color;
            border-style: $heading-5-border-style;
            border-width: $heading-5-border-width;
            color: $heading-5-font-color;
            font-family: $heading-5-font-family;
            font-size: $heading-5-font-size;
            font-weight: $heading-5-font-weight;
          } @else if $heading == "h6" {
            border-color: $heading-6-border-color;
            border-style: $heading-6-border-style;
            border-width: $heading-6-border-width;
            color: $heading-6-font-color;
            font-family: $heading-6-font-family;
            font-size: $heading-6-font-size;
            font-weight: $heading-6-font-weight;
          }
        }
        
      }
    }
  }

}