&__navigation-items,
&__search-items {
  @extend .govuk-grid-row;
  margin-bottom: 0;

  @include govuk-media-query($until: desktop) {
    margin: 0 -30px;
  }

  @include govuk-media-query($until: tablet) {
    margin: 0 -15px;
  }

  @include govuk-media-query($from: desktop) {
    margin: 0;
  }

  &[hidden] {
    display: none;
  }

  @include govuk-media-query($until: desktop) {
    @include govuk-responsive-padding(6, "left");
    background: $menu-bg-colour;
  }

  @include govuk-media-query($until: tablet) {
    @include govuk-responsive-padding(4, "left");
  }

  @at-root #{selector-append(".js-module-initialised", &)} {
    @include govuk-media-query($until: desktop) {
      padding: 0;
      @include govuk-responsive-padding(6, "top");
      @include govuk-responsive-padding(6, "bottom");
    }
  }
}

&__navigation-items {
  @include govuk-media-query($from: desktop) {
    display: inline-block;
  }

  @at-root #{selector-append(".js-module-initialised", &)} {
    @include govuk-media-query($until: desktop) {
      padding: 0;
      @include govuk-responsive-padding(4, "top");
      @include govuk-responsive-padding(4, "bottom");
    }
  }
}

&__navigation-item,
&__search-item {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;

  @at-root #{selector-append(".js-module-initialised", &)} {
    @include govuk-media-query($until: desktop) {
      padding: 0 30px;
    }
    @include govuk-media-query($until: tablet) {
      padding: 0 15px;
    }
  }

  @include govuk-media-query($from: desktop) {
    display: block;
    position: static;
    margin: 0;
    padding: 0;
    float: left;
    font-size: 1rem;
  }
}

&__navigation-item {
  @include govuk-media-query($from: desktop) {
    padding: 0;
    border-bottom: 0;

    &:first-child {
      .lbcamden-header__navigation-item-link-inner,
      .lbcamden-header__navigation-second-toggle-button-inner {
        border: none;
      }
    }
  }
}

&__navigation-item-link,
&__search-item-link {
  @include govuk-link-style-no-underline;
  @include govuk-typography-weight-bold;
  @include govuk-font(16, bold);

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

  &:focus {
    color: lbcamden-colour("black");
  }

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

    &:link,
    &:visited {
      color: $header-text-colour;
    }
  }
}

@mixin navigation-toggles {
  &__navigation-item-link,
  &__navigation-second-toggle-button {
    @include govuk-media-query($from: desktop) {
      @content;
    }
  }

  &__navigation-top-toggle-button,
  &__search-toggle-button {
    @content;
  }
}

@include navigation-toggles {
  @include govuk-font(16, 600);

  &:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: none;
  }

  &:hover:not(:focus) {
    &:not(.lbcamden-header__open-button) {
      color: $header-text-colour-hover;

      &:after {
        content: "";
        position: absolute;
        top: auto;
        right: 15px;
        bottom: 0;
        left: 15px;
        width: auto;
        height: 3px;
        background: $header-target-indicator-colour;
      }

      &.lbcamden-header__search-toggle-button {
        &:after {
          right: 10%;
          left: 10%;
        }
      }
    }
  }

  &:focus:focus-visible,
  &:focus:not(.lbcamden-header__open-button) {
    outline: 3px solid transparent;
    color: #0b0c0c;
    background-color: lbcamden-colour("govuk-focus-colour");
    box-shadow: none;
    text-decoration: none;

    &:after {
      content: "";
      position: absolute;
      top: auto;
      right: 15px;
      bottom: 0;
      left: 15px;
      width: auto;
      height: 3px;
      background: lbcamden-colour("black");
    }

    &.lbcamden-header__search-toggle-button {
      &:after {
        right: 10%;
        left: 10%;
      }
    }
  }

  &.lbcamden-header__open-button {
    background-color: $menu-bg-colour;
  }
}

&__navigation-second-toggle-button {
  @include govuk-media-query($until: desktop) {
    &:hover {
      @include govuk-link-decoration;
      @include govuk-link-hover-decoration;
    }

    &:focus:not(.lbcamden-header__open-button),
    &:focus-visible {
      @include govuk-focused-text;
    }
  }
}

&__navigation-item-link,
&__search-item-link,
&__navigation-second-toggle-button {
  display: inline-block;
  margin: 15px 0;
  color: $header-text-colour;

  @include govuk-media-query($until: desktop) {
    width: 100%;
    text-align: left;
  }

  @include govuk-media-query($from: desktop) {
    display: block;
    position: relative;
    height: 20px;
    margin: 0;
    @include govuk-responsive-padding(3, "top");
    @include govuk-responsive-padding(3, "bottom");
    float: left;
    text-decoration: none;
  }

  &[hidden] {
    display: none;
  }
}

&__navigation-item-link {
  @include govuk-media-query($until: desktop) {
    //@include govuk-responsive-padding(2, "left");
  }

  @include govuk-media-query($from: desktop) {
    &-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");
    }

    line-height: normal;
  }
}

&__navigation-second-items {
  padding-left: 0;
  font-size: inherit;
  list-style: none;

  @include govuk-media-query($from: desktop) {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    @include govuk-responsive-padding(6, "top");

    li {
      flex: 0 0 50%;
    }
  }

  &__dropdown-list-item {
    p {
      font-size: inherit;
    }
  }

  &.lbcamden-header__navigation-second-items--full {
    li {
      flex: 0 0 33%;
    }
  }
}

&__navigation-item-link-icon[data-icon="user"] {
    inline-size: 20px;
    block-size: 20px;
    margin-right: 8px;
    display: flex;
    align-self: inherit;
    background-color: $header-text-colour;
    -webkit-mask: svg-url("<svg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'><circle cx='10' cy='10' r='9.1' stroke='#000' stroke-width='1.8' fill='none'/><mask id='user-cutout' fill='#fff'><path d='M10.0036 11C14.5649 11.0002 15.7782 14.3784 16.5007 17C16.7839 18.0278 13.5035 19.9998 10.0036 20H9.99678C6.50346 20 3.19338 18.0643 3.49971 17C4.24589 14.4075 5.50183 11 10.0036 11Z'/></mask><path d='M10.0036 11L10.0037 9.2H10.0036V11ZM16.5007 17L18.236 16.5218V16.5218L16.5007 17ZM10.0036 20V21.8H10.0037L10.0036 20ZM3.49971 17L1.76994 16.5021L1.76993 16.5021L3.49971 17ZM10.0036 11L10.0035 12.8C11.7584 12.8001 12.6873 13.4133 13.3013 14.1601C14.0014 15.0116 14.4071 16.1783 14.7654 17.4782L16.5007 17L18.236 16.5218C17.8718 15.2001 17.3097 13.3669 16.0821 11.8739C14.7685 10.2761 12.8101 9.20013 10.0037 9.2L10.0036 11ZM16.5007 17L14.7654 17.4782C14.6563 17.0823 14.761 16.7817 14.8086 16.6773C14.8536 16.5785 14.882 16.5706 14.8108 16.6433C14.67 16.7871 14.3592 17.0245 13.8549 17.2809C12.8578 17.7879 11.4404 18.1999 10.0035 18.2L10.0036 20L10.0037 21.8C12.0667 21.7999 14.0395 21.2258 15.4867 20.4898C16.2046 20.1247 16.8796 19.6763 17.3836 19.1613C17.6348 18.9047 17.9003 18.574 18.0842 18.1707C18.2706 17.7617 18.4159 17.1747 18.236 16.5218L16.5007 17ZM10.0036 20V18.2H9.99678V20V21.8H10.0036V20ZM9.99678 20V18.2C8.5566 18.2 7.1312 17.7938 6.13257 17.2913C5.62679 17.0367 5.32046 16.8024 5.18521 16.6633C4.94176 16.4128 5.44153 16.7612 5.22949 17.4979L3.49971 17L1.76993 16.5021C1.40473 17.771 2.20338 18.7605 2.60358 19.1723C3.11198 19.6954 3.79407 20.1446 4.51418 20.507C5.96734 21.2383 7.94364 21.8 9.99678 21.8V20ZM3.49971 17L5.22949 17.4979C5.59925 16.2132 6.01965 15.0367 6.73188 14.1732C7.36084 13.4107 8.29153 12.8 10.0036 12.8V11V9.2C7.21392 9.2 5.26574 10.2931 3.95474 11.8825C2.72701 13.3709 2.14635 15.1943 1.76994 16.5021L3.49971 17Z' fill='#000' mask='url(#user-cutout)'/><circle cx='10.0032' cy='8.80005' r='3.1' stroke='#000' stroke-width='1.8' fill='none'/></svg>") no-repeat center / contain;
    mask: svg-url("<svg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'><circle cx='10' cy='10' r='9.1' stroke='#000' stroke-width='1.8' fill='none'/><mask id='user-cutout' fill='#fff'><path d='M10.0036 11C14.5649 11.0002 15.7782 14.3784 16.5007 17C16.7839 18.0278 13.5035 19.9998 10.0036 20H9.99678C6.50346 20 3.19338 18.0643 3.49971 17C4.24589 14.4075 5.50183 11 10.0036 11Z'/></mask><path d='M10.0036 11L10.0037 9.2H10.0036V11ZM16.5007 17L18.236 16.5218V16.5218L16.5007 17ZM10.0036 20V21.8H10.0037L10.0036 20ZM3.49971 17L1.76994 16.5021L1.76993 16.5021L3.49971 17ZM10.0036 11L10.0035 12.8C11.7584 12.8001 12.6873 13.4133 13.3013 14.1601C14.0014 15.0116 14.4071 16.1783 14.7654 17.4782L16.5007 17L18.236 16.5218C17.8718 15.2001 17.3097 13.3669 16.0821 11.8739C14.7685 10.2761 12.8101 9.20013 10.0037 9.2L10.0036 11ZM16.5007 17L14.7654 17.4782C14.6563 17.0823 14.761 16.7817 14.8086 16.6773C14.8536 16.5785 14.882 16.5706 14.8108 16.6433C14.67 16.7871 14.3592 17.0245 13.8549 17.2809C12.8578 17.7879 11.4404 18.1999 10.0035 18.2L10.0036 20L10.0037 21.8C12.0667 21.7999 14.0395 21.2258 15.4867 20.4898C16.2046 20.1247 16.8796 19.6763 17.3836 19.1613C17.6348 18.9047 17.9003 18.574 18.0842 18.1707C18.2706 17.7617 18.4159 17.1747 18.236 16.5218L16.5007 17ZM10.0036 20V18.2H9.99678V20V21.8H10.0036V20ZM9.99678 20V18.2C8.5566 18.2 7.1312 17.7938 6.13257 17.2913C5.62679 17.0367 5.32046 16.8024 5.18521 16.6633C4.94176 16.4128 5.44153 16.7612 5.22949 17.4979L3.49971 17L1.76993 16.5021C1.40473 17.771 2.20338 18.7605 2.60358 19.1723C3.11198 19.6954 3.79407 20.1446 4.51418 20.507C5.96734 21.2383 7.94364 21.8 9.99678 21.8V20ZM3.49971 17L5.22949 17.4979C5.59925 16.2132 6.01965 15.0367 6.73188 14.1732C7.36084 13.4107 8.29153 12.8 10.0036 12.8V11V9.2C7.21392 9.2 5.26574 10.2931 3.95474 11.8825C2.72701 13.3709 2.14635 15.1943 1.76994 16.5021L3.49971 17Z' fill='#000' mask='url(#user-cutout)'/><circle cx='10.0032' cy='8.80005' r='3.1' stroke='#000' stroke-width='1.8' fill='none'/></svg>") no-repeat center / contain;
    @include govuk-media-query($until: desktop) {
      margin-right: 6px;
      background-color: lbcamden-colour("govuk-link-colour");
    }
  }

&__navigation-item-link:focus .lbcamden-header__navigation-item-link-icon[data-icon="user"],
  &__navigation-item-link:focus-visible .lbcamden-header__navigation-item-link-icon[data-icon="user"],
  &__navigation-second-toggle-button:focus .lbcamden-header__navigation-item-link-icon[data-icon="user"],
  &__navigation-second-toggle-button:focus-visible .lbcamden-header__navigation-item-link-icon[data-icon="user"] {
    background-color: lbcamden-colour("black");
  }

&__navigation-item-link:not([hidden]):has(.lbcamden-header__navigation-item-link-icon),
&__navigation-item-link-inner:has(.lbcamden-header__navigation-item-link-icon) {
  display: flex;
  align-items: center;
}

&__navigation-second-item {
  &-description {
    @include govuk-font(16);
    margin: 0;
  }
}