@mixin footer-list-item {
  @include font-sans;

  font-size: 18px;

  @include large {
    font-size: 16px;
  }
}

@mixin footer-list-header {
  @include font-sans-bold;

  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

@mixin unstyled-lists {
  ul,
  ol,
  li {
    list-style: none;
    margin: 0;
    padding: 0;
  }
}

@mixin fine-print {
  font-size: 13px;
  line-height: 1.77;
}

.main-footer {
  @include unstyled-lists;

  padding-bottom: 50px;

  @include medium {
    padding-bottom: 150px;
    padding-left: 20px;
    padding-right: 20px;
  }

  @include large {
    padding-left: 80px;
    padding-right: 80px;
  }
}

.footer-upper-block,
.footer-lower-block {
  @include clearfix();

  padding-bottom: 75px;
  padding-top: 75px;
}

.footer-content {
  @include clearfix();

  color: $color-white;
  padding-left: 20px;
  padding-right: 20px;
}

.footer-divider {
  border: 1px solid #a39b95;
  height: 1px;
  opacity: 0.5;
}

.footer-list-wrapper {
  margin-bottom: 50px;

  @include medium {
    float: left;
    margin-bottom: 0;
    width: 20%;

    &.footer-list-wrapper-contact {
      margin-bottom: inherit;
      width: 25%;
    }

    &.footer-list-wrapper-contact-address {
      width: 35%;
    }
  }

  &.footer-list-wrapper-contact {
    margin-bottom: -25px;
  }

  &:last-child {
    margin-bottom: 0;
  }
}

.footer-copyright {
  @include fine-print;

  margin-top: 70px;
  opacity: 0.5;

  a {
    color: $color-white;
  }
}

ul.footer-list {
  text-align: left;
  vertical-align: top;

  li {
    @include footer-list-item();

    margin-bottom: 12px;

    &:first-child {
      @include footer-list-header();

      margin-bottom: 20px;
    }

    &.footer-social-icon {
      display: inline-block;
      font-size: 30px;
      margin-right: 5px;
    }

    &.footer-list-item-faded {
      opacity: 0.6;
    }
  }
}

.footer-app-badge-wrapper {
  $app-badge-width: 150px;
  $app-badge-height: 49px;

  display: inline-block;
  width: $app-badge-width;

  @include medium {
    display: block;
  }

  .app-badge {
    background-size: $app-badge-width $app-badge-height;
    display: inline-block;
    height: $app-badge-height;
    opacity: 0.8;
    transition: opacity 60ms linear;
    width: $app-badge-width;

    &:hover {
      opacity: 1;
    }
  }

  .ios-badge {
    background-image: url($image-ios-badge-uri);
  }

  .google-play-badge {
    background-image: url($image-google-play-badge-uri);
  }
}

.footer-link {
  color: $color-white;
  opacity: 0.5;
  text-decoration: none;
  transition: opacity 60ms linear;

  &:hover {
    color: $color-white;
    opacity: 0.6;
  }
}

.footer-language-toggle {
  .inactive {
    cursor: pointer;
  }
}

.no-footer .main-footer {
  display: none;
}
