&__navigation-top-toggle-button {
  box-sizing: border-box;
  position: absolute;
  z-index: 10;
  top: 0;
  right: $header-height;
  height: $header-height;
  margin: 0;
  padding: 0;
  @include govuk-responsive-padding(3, "left");
  @include govuk-responsive-padding(3, "right");
  border: 0;
  color: $header-text-colour;
  background: transparent;
  @include govuk-font(16);
  font-weight: $mobile-menu-font-weight;
  cursor: pointer;

  &--no-search {
    right: 0;
  }

  &:hover {
    cursor: pointer;
  }

  &:before {
    content: "";
    display: inline-block;
    @include lbcamden-chevron($header-text-colour, 90);
  }

  &--no-search:after {
    display: none;
  }

  &:focus,
  &:focus-visible {
    &:before {
      @include lbcamden-chevron(lbcamden-colour("black"), 90);
    }
  }

  &:focus-visible {
    outline: 3px solid transparent;
    color: lbcamden-colour("govuk-focus-text-colour");
    background-color: lbcamden-colour("govuk-focus-colour");
    text-decoration: none;

    &__navigation-top-toggle-button-inner {
      color: lbcamden-colour("govuk-focus-text-colour");

      &:before {
        @include lbcamden-chevron(lbcamden-colour("black"), 90);
      }
    }

    &:hover:before,
    &:before {
      content: "";
      display: inline-block;
      @include lbcamden-chevron(lbcamden-colour("black"), 90);
    }
  }

  &:active {
    color: lbcamden-colour("govuk-focus-text-colour");
  }

  &:not(:hover):not(:active) {
    text-decoration: none;
  }

  /* stylelint-disable */
  &.lbcamden-header__open-button {
    color: $govuk-link-colour;
    background: $menu-bg-colour;

    &:focus-visible {
      &:before {
        @include lbcamden-chevron(lbcamden-colour("black"), -90);
      }
    }

    &:before {
      @include lbcamden-chevron($govuk-link-colour, -90);
    }

    &:hover:not(&:focus-visible) {
      &:before {
        @include lbcamden-chevron($govuk-link-colour, -90);
      }
    }

    &__navigation-top-toggle-button-inner,
    &__navigation-second-toggle-button {
      &:before {
        transform: translateY(5%) rotate(180deg) scale(1);
      }

      &:focus {
        box-shadow: none;
      }
    }
  }

  /* stylelint-enable */

  &__navigation-top-toggle-button-inner {
    display: inline-block;
    margin: 0;
    padding: 10px 20px;
    color: $govuk-brand-colour;

    &:before {
      content: "";
      display: inline-block;
      width: 8px;
      height: 8px;
      margin: 0 8px 0 2px;
      transform: translateY(-35%) rotate(45deg) scale(1);
      border-right: 2px solid $govuk-brand-colour;
      border-bottom: 2px solid $govuk-brand-colour;
      vertical-align: middle;
    }
  }
}

&__navigation-second-toggle-button {
  padding: 0;
  border: 0;
  color: $govuk-link-colour;
  background: none;
  font-weight: $govuk-font-weight-bold;
  @include govuk-font(16, bold);

  &-inner {
    @include govuk-responsive-padding(1, "top");
    @include govuk-responsive-padding(1, "bottom");
    padding-left: 0;
    //@include govuk-responsive-padding(2, "left");

    &:before {
      content: "";
      display: inline-block;
      @include govuk-responsive-margin(1, "right");
      @include lbcamden-chevron($govuk-link-colour, 90);
    }
  }

  &:focus-visible .lbcamden-header__navigation-second-toggle-button-inner {
    color: lbcamden-colour("govuk-focus-text-colour");

    &:before {
      @include lbcamden-chevron(lbcamden-colour("govuk-focus-text-colour"), 90);
    }
  }

  &:hover {
    cursor: pointer;
  }

  @include govuk-media-query($from: desktop) {
    min-height: $header-height;
    color: $header-text-colour;

    &-inner {
      @include govuk-responsive-padding(1, "all");
      @include govuk-responsive-padding(3, "left");
      @include govuk-responsive-padding(3, "right");
      border-left: 1px solid lbcamden-colour("light-grey-2");

      &:before {
        content: "";
        display: inline-block;
        @include govuk-responsive-margin(1, "right");
        @include lbcamden-chevron($header-text-colour, 90);
      }
    }
  }

  &:focus {
    .lbcamden-header__navigation-second-toggle-button-inner {
      &:before {
        @include lbcamden-chevron(lbcamden-colour("govuk-focus-text-colour"), 90);
      }
    }
  }

  &:focus-visible {
    color: lbcamden-colour("govuk-focus-text-colour");
    background: lbcamden-colour("govuk-focus-colour");
  }

  @include govuk-media-query($from: desktop) {
    &:hover {
      cursor: pointer;
    }

    &:hover:not(:focus) {
      color: $header-text-colour-hover;
    }

    .lbcamden-header__navigation-second-toggle-button-inner {
      &:before {
        @include lbcamden-chevron($header-text-colour, 90);
      }
    }
  }

  /* stylelint-disable */
  &.lbcamden-header__open-button {
    color: lbcamden-colour("govuk-link-colour");
    background: $menu-bg-colour;

    &:focus-visible {
      background: lbcamden-colour("govuk-focus-colour");
    }

    &:hover {
      color: lbcamden-colour("govuk-link-colour");
    }

    .lbcamden-header__navigation-second-toggle-button-inner {
      border-color: transparent;

      &:before {
        @include lbcamden-chevron($govuk-link-colour, -90);
      }
    }

    @include govuk-media-query($until: "desktop") {
      &:hover,
      &:focus-visible .lbcamden-header__navigation-second-toggle-button-inner {
        color: lbcamden-colour("govuk-focus-text-colour");

        &:before {
          @include lbcamden-chevron(lbcamden-colour("govuk-focus-text-colour"), -90);
        }
      }
    }
  }

  /* stylelint-enable */
}

&__search-toggle-button {
  position: absolute;
  top: 0;
  right: 0;
  width: $header-height;
  height: $header-height;
  padding: 15px;
  border: 0;
  color: $header-text-colour;
  background: transparent;
  cursor: pointer;

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

  &:hover:not(:focus) {
    color: $header-text-colour-hover;
  }

  &:focus {
    outline: 3px solid transparent;
  }

  &:focus-visible {
    color: lbcamden-colour("govuk-focus-text-colour");
    background: lbcamden-colour("govuk-focus-colour");
  }
}

&__open-button {
  color: $header-text-colour;

  background: $menu-bg-colour;

  &:focus {
    outline: 3px solid transparent;

    svg {
      fill: lbcamden-colour("govuk-focus-text-colour");
    }
  }

  &:focus-visible {
    color: lbcamden-colour("govuk-focus-text-colour");
    background: lbcamden-colour("govuk-focus-colour");
  }

  .lbcamden-header__navigation-top-toggle-close-icon {
    display: block;
    color: lbcamden-colour("black");
  }

  .lbcamden-header__search-toggle-button-link-icon {
    display: none;
  }
}

&__navigation-top-toggle-close-icon {
  display: none;
  color: lbcamden-colour("govuk-focus-text-colour");
  pointer-events: none;
  text-align: center;
}
