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

@include govuk-exports("govuk/component/sdn-feedbackbar") {
  $sdn-feedbackbar-left-background: #ffffff;
  $sdn-feedbackbar-right-background: #f4f4f4;
  $sdn-feedbackbar-text-color: #333333;
  $sdn-feedbackbar-link: #333333;
  $sdn-feedbackbar-link-hover: #333333;

  .sdn-feedbackbar {
    .govuk-width-container {
      margin: 0 auto;
    }
  }

  .sdn-feedbackbar__link {
    &:link,
    &:visited {
      color: $sdn-feedbackbar-link;
    }

    &:hover,
    &:active {
      color: $sdn-feedbackbar-link-hover;
    }

    &:focus {
      @include govuk-focused-text;
      color: $govuk-focus-text-colour;
    }
  }

  .sdn-feedbackbar__useful,
  .sdn-feedbackbar__foundbug {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    @include govuk-media-query($until: tablet) {
      -ms-flex-direction: column;
          flex-direction: column;
    }
  }

  .sdn-feedbackbar__foundbug {
    @include govuk-media-query($until: tablet) {
      margin-top: govuk-spacing(2);
    }
  }

  .sdn-feedbackbar__useful-question {
    margin-right: govuk-spacing(3);
  }

  .sdn-feedbackbar__yes,
  .sdn-feedbackbar__no {
    @include govuk-font($size: 18, $line-height: 1.2);
    font-weight: bold;
    text-transform: uppercase;

    a {
      border-bottom: 2px solid;
      text-decoration: none;
    }
  }

  .sdn-feedbackbar__no {
    margin-left: govuk-spacing(3);
  }

  .sdn-feedbackbar__container {
    @include govuk-responsive-padding(5, "top");
    @include govuk-responsive-padding(6, "left");
    @include govuk-responsive-padding(5, "bottom");
    @include govuk-responsive-padding(6, "right");

    @include govuk-font($size: 16, $line-height: 1.5);

    display: -ms-flexbox;

    display: flex;
    color: $sdn-feedbackbar-text-color;
    background: $sdn-feedbackbar-right-background;
    -ms-flex-pack: justify;
        justify-content: space-between;

    @include govuk-media-query($until: desktop) {
      -ms-flex-direction: column;
          flex-direction: column;
    }

    @include govuk-media-query($from: desktop) {
      position: relative;
    }
  }

  .sdn-feedbackbar__close {
    position: absolute;
    right: 1em;
  }

  .sdn-feedbackbar__form {
    // margin-right: 3em;
    // background: $sdn-feedbackbar-left-background;
    position: relative;
    border-top: $sdn-feedbackbar-right-background .5em solid;
    border-bottom: $sdn-feedbackbar-right-background .5em solid;
    background: $sdn-feedbackbar-left-background;
  }
}