@import "../../../settings/all";
@import "../../../tools/all";
@import "../../../helpers/all";

@include govuk-exports("govuk/component/sdn-headline") {
  $sdn-headline-background: #fafafa;
  $sdn-headline-text-color: #333333;

  .sdn-headline {
    background: $sdn-headline-background;
  }

  .sdn-headline__container {
    @include govuk-responsive-padding(5, "top");
    color: $sdn-headline-text-color;

    @include mq ($from: tablet) {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: center;
          align-items: center;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
    }
  }

  .sdn-headline__part {
    @include govuk-responsive-padding(5, "bottom");
    max-width: 100%;
    -ms-flex-negative: 0;
        flex-shrink: 0;

    &--right {
      @include mq ($from: tablet) {
        margin: -7px 0;
      }
    }
  }

  .sdn-headline__headline {
    @include govuk-font($size: 28);
  }

  .sdn-headline__subheadline {
    @include govuk-font($size: 24);
  }

  .sdn-headline__button {
    margin-bottom: 0;
  }
}