/* Mobile Offcanvas menu */
.wp-block-navigation .wp-block-navigation__responsive-container-open svg {
  width: 30px;
  height: 30px;
}
.wp-block-navigation__responsive-close {
  height: 100%;
}
.wp-block-navigation__responsive-dialog {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.wp-block-navigation__responsive-container-content {
  flex: 1;
}

/* Mobile parent menu */
.wp-block-navigation__responsive-container.is-menu-open {
  padding: var(--wp--preset--spacing--60) !important;
  background: var(--wp--preset--color--lilac) !important;
  & .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container {
    width: 100%;
    justify-content: center;
    gap: 0;
    > li.wp-block-navigation-item {
      align-items: flex-start;
      justify-content: center;
      border-top: 1px solid var(--wp--preset--color--lilac);
      padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--40) !important;
      margin-inline: calc(var(--wp--preset--spacing--60) * -1);
      box-sizing: border-box;
      &.has-small-font-size {
        opacity: 0.7;
      }
    }
    & a {
      display: block;
      width: 100%;
    }  
    /* second level menu */
    & ul.wp-block-navigation-submenu {
      gap: 20px !important;
      padding-inline: 0 !important;
      width: 100% !important;
      & a {
        font-weight: 300;
        opacity: 0.7;
      }   
    }
  }
}

/* logo */
.wp-block-site-logo {  
  & img {
    max-width: 100%;
  }
}
@media (max-width: 1200px) {
  .wp-block-site-logo {
    max-width: 300px;
  }
}  
@media (max-width: 600px) {
  .wp-block-site-logo {
    max-width: 140px;
/*    width: 50px;
    height: 50px;
    overflow: hidden;  
    & img {
      width: 120px;
      max-width: unset;      
    }*/  
  }
}

/* search */
.wp-block-navigation .wp-block-navigation-item.search .wp-block-navigation-item__content.wp-block-navigation-item__content {
  background-color: white;
  border-radius: 100px;
  border: 1px solid var(--wp--preset--color--beige);
  color: var(--wp--preset--color--grey-2);
  width: 40px;
  height: 40px;
  overflow: hidden;
  background: white no-repeat center/50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='search-icon' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M13 5c-3.3 0-6 2.7-6 6 0 1.4.5 2.7 1.3 3.7l-3.8 3.8 1.1 1.1 3.8-3.8c1 .8 2.3 1.3 3.7 1.3 3.3 0 6-2.7 6-6S16.3 5 13 5zm0 10.5c-2.5 0-4.5-2-4.5-4.5s2-4.5 4.5-4.5 4.5 2 4.5 4.5-2 4.5-4.5 4.5z'%3E%3C/path%3E%3C/svg%3E");
}
.wp-block-navigation .wp-block-navigation-item.search .wp-block-navigation-item__label {
  clip: rect(1px,1px,1px,1px);
  word-wrap: normal!important;
  border: 0;
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;    
}

.mobile-search {
  margin-left: auto !important;
  & .wp-block-button__link {
    width: 45px;
    height: 45px;
    overflow: hidden;
    font-size: 1px !important;
    color: transparent !important;
    background: var(--wp--preset--color--lilac) !important;
    text-indent: -99999px;
    position: relative;
    &:after {
      content: "";
      background: no-repeat center/15px url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13.989" height="14.469" viewBox="0 0 13.989 14.469"><path id="Union_1" data-name="Union 1" d="M.011,12.959l3.84-3.887A5.7,5.7,0,0,1,8.372,0a5.689,5.689,0,0,1,0,11.377,5.55,5.55,0,0,1-2.965-.856l-3.9,3.948ZM4.723,5.688a3.649,3.649,0,1,0,3.649-3.7A3.678,3.678,0,0,0,4.723,5.688Z" transform="translate(-0.011)"/></svg>');
      position: absolute;
      top: 50%;
      left: 50%;
      translate: -50% -50%;
      display: block;
      width: 26px;
      height: 26px;
    }
  }
}

/* hide mobile menu on desktop */
@media (min-width: 600px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) { 
    display: flex;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    bottom: 0;
    display: none;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
  }
}
@media (min-width: 786px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) { 
    display: none;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: block;
    position: relative;
    width: 100%;
    z-index: auto;    
  }
}

/* adjust nav colours color for pages with dark banners */
.has-white-color .wp-block-site-logo svg, .has-white-color .wp-block-site-logo svg * {
  fill: white;
}
.has-white-color .wp-block-navigation .wp-block-navigation-item.search .wp-block-navigation-item__content.wp-block-navigation-item__content {
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='search-icon' viewBox='0 0 24 24' fill='%23fff' width='24' height='24'%3E%3Cpath d='M13 5c-3.3 0-6 2.7-6 6 0 1.4.5 2.7 1.3 3.7l-3.8 3.8 1.1 1.1 3.8-3.8c1 .8 2.3 1.3 3.7 1.3 3.3 0 6-2.7 6-6S16.3 5 13 5zm0 10.5c-2.5 0-4.5-2-4.5-4.5s2-4.5 4.5-4.5 4.5 2 4.5 4.5-2 4.5-4.5 4.5z'%3E%3C/path%3E%3C/svg%3E");
}
:is(.single-post, .page-id-173) .wp-block-navigation-item__content[href*="/insights"],
:is(.post-type-archive-person, .single-person) .wp-block-navigation-item__content[href*="/team"],
.current-menu-item .wp-block-navigation-item__content {
  color: var(--wp--preset--color--gold) !important;
}
.wp-block-cover.has-white-color .current-menu-item .wp-block-navigation-item__content,
.wp-block-cover.has-white-color .wp-block-navigation-item__content.current-menu-ancestor {
  color: white !important;
}

header.wp-block-template-part {
  position: relative;
  z-index: 999;
}

/* desktop dropdowns */
@media (min-width: 786px) {
  .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
    width: 240px !important;
    padding: 0 !important;
    border-radius: 8px;
  }
  nav[aria-label="Utility"]  .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
    min-width: unset !important;
    width: 140px !important;
  }
  .wp-block-navigation .has-child .wp-block-navigation__submenu-container,
  nav[aria-label="Primary"] .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
    margin-top: 15px;
    border-color: var(--wp--preset--color--black);
    box-shadow: 0 0 25px #00000050;
    &:before {
      width: 100%;
      height: 15px;
      content: "";
      display: block;
      opacity: 0;
      position: absolute;
      top: -15px;
      left: 0;
    }
    &:after {
      position: absolute;
      top: -9px;
      left: 8px;
      content: "";
      display: block;
      width: 0;
      height: 0;
      border-left: 9px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 8px solid var(--wp--preset--color--black);
    }

    & .wp-block-navigation-link {
      font-size: 1rem !important;
      background-color: transparent !important;

      &:first-child .wp-block-navigation-item__content {
        padding-top: 16px;
        border-radius: 8px 8px 0 0;
      }
      &:last-child .wp-block-navigation-item__content {
        padding-bottom: 16px;
        border-radius: 0 0 8px 8px;
      }
      .wp-block-navigation-item__content {        
        transition: 0.4s ease-in;        
        &:hover {
          text-decoration: none;
          transition: 0.1s ease;
          color: white;
          background-color: var(--wp--preset--color--hot-pink);
        }
      }
    }
  } 
}
.wp-block-navigation .wp-block-navigation__submenu-icon {
  margin-block: 0;
}