@include ccs-exports("ccs/component/footer") {
  $ccs-footer-background: govuk-functional-colour(template-background);
  $ccs-footer-border: govuk-colour("black", $variant: "tint-25");
  $ccs-footer-text: govuk-colour("black");

  $ccs-footer-columns-to-rows-point: 501px;

  .ccs-footer {
    @include govuk-font($size: 16);
    @include govuk-responsive-padding(7, "top");
    @include govuk-responsive-padding(5, "bottom");

    border-top: govuk-spacing(1) solid $ccs-brand-colour;
    color: $ccs-footer-text;
    background: $ccs-footer-background;
  }

  .ccs-footer__link {
    @include govuk-link-common;

    &:link,
    &:visited,
    &:hover {
      color: $ccs-footer-text;
    }

    &:active,
    &:focus {
      color: govuk-functional-colour(focus-text);
    }

    &:link:focus {
      color: govuk-functional-colour(text);
    }
  }

  .ccs-footer__section-break {
    margin: 0; // Reset `<hr>` default margins
    @include govuk-responsive-margin(8, "bottom");
    border: 0; // Reset `<hr>` default borders
    border-bottom: 1px solid $ccs-footer-border;
  }

  .ccs-footer__meta {
    display: flex; // Support: Flexbox
    margin-right: -$govuk-gutter-half;
    margin-left: -$govuk-gutter-half;
    flex-wrap: wrap; // Support: Flexbox
    align-items: flex-end; // Support: Flexbox
    justify-content: center; // Support: Flexbox
    text-align: left;
  }

  .ccs-footer__meta-item {
    margin-right: $govuk-gutter-half;
    margin-bottom: govuk-spacing(5);
    margin-left: $govuk-gutter-half;
  }

  .ccs-footer__meta-item--grow {
    flex: 1; // Support: Flexbox

    @media #{govuk-until-breakpoint(tablet)} {
      flex-basis: 320px; // Support: Flexbox
    }

    @media #{govuk-until-breakpoint($until: $ccs-footer-columns-to-rows-point)} {
      text-align: left;
    }
  }

  .ccs-footer__inline-list {
    margin-top: 0;
    margin-bottom: govuk-spacing(3);
    padding: 0;

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

  .ccs-footer__meta-custom {
    a {
      color: $ccs-footer-text;
    }
  }

  .ccs-footer__inline-list-item {
    display: inline-block;
    margin-right: govuk-spacing(3);
    margin-bottom: govuk-spacing(1);

    @media #{govuk-until-breakpoint(tablet)} {
      margin-right: govuk-spacing(3);
      margin-left: 0;
    }
  }

  .ccs-footer__inline-list--bottom > .ccs-footer__inline-list-item {
    margin-bottom: 0;
  }

  .ccs-footer__heading {
    margin-bottom: govuk-spacing(6);
    padding-bottom: govuk-spacing(4);

    @media #{govuk-until-breakpoint(tablet)} {
      padding-bottom: govuk-spacing(2);
    }
    border-bottom: 1px solid $ccs-footer-border;
    color: $ccs-footer-text;
  }

  .ccs-footer__navigation {
    @include govuk-clearfix;
    margin-right: -$govuk-gutter-half;
    margin-left: -$govuk-gutter-half;
  }

  .ccs-footer__section {
    display: inline-block;
    margin-bottom: $govuk-gutter;
    vertical-align: top;
  }

  .ccs-footer__list {
    margin: 0;
    padding: 0;
    list-style: none;
    -moz-column-gap: $govuk-gutter;
         column-gap: $govuk-gutter; // Support: Columns

    // Disable thicker underlines on hover because of a bug in Chromium
    // affecting links within columns
    // https://bugs.chromium.org/p/chromium/issues/detail?id=1190987
    .ccs-footer__link:hover {
      text-decoration-thickness: auto;
    }
  }

  @media #{govuk-from-breakpoint(desktop)} {
    .ccs-footer__list--columns-2 {
      -moz-column-count: 2;
           column-count: 2; // Support: Columns
    }

    .ccs-footer__list--columns-3 {
      -moz-column-count: 3;
           column-count: 3; // Support: Columns
    }
  }

  .ccs-footer__list-item {
    @include govuk-responsive-margin(4, "bottom");
  }

  .ccs-footer__list-item:last-child {
    margin-bottom: 0;
  }

  .ccs-footer__logo {
    @include govuk-responsive-margin(5, "bottom");
    box-sizing: border-box;
    padding-left: govuk-spacing(3);

    @media #{govuk-from-breakpoint(tablet)} {
      width: 100%;
      padding-right: $govuk-gutter-half;
      float: left;
      vertical-align: top;
    }
  }

  .ccs-footer__copyright {
    margin-left: 0;
    text-align: center;
  }
}

/*# sourceMappingURL=_index.scss.map */