/*============================================================================
  # Footer
==============================================================================*/
.shopify-section--footer {
  border-top: 1px solid $border-color-secondary;
}

.Footer {
  padding: 0 15px 15px;
  background: $color-white;
  color: $color-navy-blue;

  max-width: 1440px;
  margin: auto;

  @include av-mq('lap-and-up') {
    padding: 35px 44px 50px;
  }
}

.Footer__Inner {
  display: flex;
  flex-direction: column;

  @include av-mq('lap-and-up') {
    flex-direction: row;
    justify-content: space-between;
  }
}

.Footer__Newsletter {
  flex: 1 1 0%;
  margin-left: -15px;
  margin-right: -15px;
  margin-bottom: 10px;
  padding: 20px 15px;
  background-color: $color-navy-blue;

  @include av-mq('lap-and-up') {
    flex: 0 1 auto;
    padding: 0 100px 0 0;
    margin: 0;
    background-color: $color-white;
  }

  .Footer__Title {
    color: $color-white;
    font-family: $font-stack-header;

    @include av-mq('lap-and-up') {
      color: $color-navy-blue;
      margin-bottom: 16px;
    }
  }

  .Newsletter__Form {
    display: flex;
    width: 100%;
    flex-direction: row;
    border: none;
    border-bottom: 2px solid $color-white;

    @include av-mq('lap-and-up') {
      max-width: 296px;
      border-bottom: 1px solid $color-navy-blue;
      color: $color-navy-blue;
    }

    input#FooterNewsletterInput {
      background: transparent;
      flex: 1 1 0%;
      border: none;
      padding: 3px 0;
      color: $color-white;

      @include av-mq('lap-and-up') {
        color: $color-navy-blue;
      }

      &::placeholder {
        /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: $color-white;
        text-transform: uppercase;
        opacity: 1; /* Firefox */

        @include av-mq('lap-and-up') {
          color: $color-navy-blue;
        }
      }

      &:-ms-input-placeholder {
        /* Internet Explorer 10-11 */
        color: $color-white;
        text-transform: uppercase;

        @include av-mq('lap-and-up') {
          color: $color-navy-blue;
        }
      }

      &::-ms-input-placeholder {
        /* Microsoft Edge */
        color: $color-white;
        text-transform: uppercase;

        @include av-mq('lap-and-up') {
          color: $color-navy-blue;
        }
      }
    }

    .Form__Submit {
      flex: 0 1 0%;
      margin-top: 0;
      background-color: transparent;
      padding: 0;

      .Icon {
        height: auto;

        &.Icon--long-arrow-right {
          width: 29px;
        }

        &.Icon--thick-arrow-right {
          width: 20px;
        }
      }
    }
  }
}

.Footer__Social {
  margin-top: 23px;
  color: $color-white;

  @include av-mq('lap-and-up') {
    margin-bottom: 25px;
    color: $color-navy-blue;
  }

  .HorizontalList,
  .HorizontalList__Item {
    margin: 0;
  }

  .HorizontalList__Item + .HorizontalList__Item {
    margin-left: 34px;
  }
}

.Footer__NavWrap {
  display: flex;
  flex-direction: column;

  @include av-mq('lap-and-up') {
    flex-direction: row;
    flex: 1 1 0%;
    justify-content: space-between;
  }
}

.Footer__Block {
  @include av-mq('lap-and-up') {
    // flex: 1 1 50%;
    // padding-left: 40px;
    // padding-right: 40px;
  }

  &:last-child {
    margin-right: 26px;
  }

  .Linklist__Item {
    margin-bottom: 10px;
  }
}

.Footer__Title {
  margin-bottom: 18px;
  white-space: nowrap;
  color: $color-navy-blue;

  .Footer__Block--Nav & {
    margin-bottom: 0px;
    text-transform: uppercase;

    @include av-mq('lap-and-up') {
      margin-bottom: 15px;
    }
  }
}

.Footer__Block--Nav .Collapsible {
  border-top: none;
  border-bottom: none;

  a.Collapsible__Button {
    padding: 5px 0;
  }

  button.Collapsible__Button {
    padding: 10px 0;
    text-transform: uppercase;
  }

  .Collapsible__Plus {
    height: 12px;
    width: 12px;
  }

  .Footer__Title {
    margin-bottom: 0;
  }
}

.Footer .Heading,
.Footer .Link--primary:hover {
  color: $color-navy-blue;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::-webkit-input-placeholder {
  color: $color-navy-blue;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::-moz-placeholder {
  color: $color-navy-blue;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input:-ms-input-placeholder {
  color: $color-navy-blue;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::-ms-input-placeholder {
  color: $color-navy-blue;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::placeholder {
  color: $color-navy-blue;
}

.Footer__Copyright {
  color: $color-navy-blue;

  .Link {
    font-family: $font-stack-body;
    font-size: 10px;
    line-height: 13px;
    letter-spacing: 0px;
  }
}