.navbar-mainnavigation .navbar-toggler {
  display: inline-block !important;
}
.collapse:not(.show) {
  display: none !important;
}
.navbar-mainnavigation>.container {
  flex-wrap: wrap !important;
}
.navbar-mainnavigation .navbar-brand-image>.navbar-brand-logo-normal {
  width: 314px;
  object-fit: cover;
  height: auto;
  max-height: none;
  top: 0;
  transform: none;
  transition: all .3s ease-in-out;
}
.navbar-brand-logo-scrolled {
  transition: all .3s ease-in-out;
  display: none;
  opacity: 0;
}
.scrolled .navbar-brand-logo-scrolled {
  width: unset !important;
  margin-right: 50px;
}
.bp-page-header {
  padding: 0;
  position: fixed;
  top: 0;
  z-index: 2;
  width: 100%;
  .navbar-collapse {
    height: calc(100vh - 75px) !important;
    background-color: $yellow;
    margin-top: 20px;
    align-items: flex-start;
    flex-direction: column;
    overflow-y: scroll;
    .mainnav-inner {
      max-width: 1430px;
      width: 100%;
      margin: 200px auto 0;
      position: relative;
      //margin-left: 225px;
      padding-left: 90px;
      .navbar-nav {
        flex-direction: column;
        max-width: 50%;
        .nav-item {
          padding: 20px 0;
          border-bottom: 2px solid black;
          &:first-child {
            border-top: 2px solid black;
          }
          &.nav-style-simple {
            position: static;
          }
          .dropdown-menu {
            right: 0;
            top: 0;
            left: unset;
            margin: 0;
            padding: 0;
            width: calc(50% - 120px);
            background-color: transparent;
            border: none;
            box-shadow: none;
            .nav-link {
              font-size: 1.5rem;
              line-height: 34px;
            }
          }
          .nav-link {
            font-size: 3.375rem;
            line-height: 65px;
            font-weight: 600;
            color: black;
            padding: 0;
            &:hover {
              text-decoration: none;
              color: $purple;
              transition: all 0.3s ease-out;
            }
          }
        }
      }
    }
    .extra-navi {
      max-width: 1430px;
      width: 100%;
      margin: 200px auto 0;
      padding-left: 90px;
      .navbutton-wrapper {
        display: flex;
        gap: 15px;
        .nav-link {
          background-color: $purple;
          color: white;
          padding: 15px 30px;
          border-radius: 50px;
          transition: all 0.3s ease-out;
          &:hover {
            color: $purple;
            background-color: white;
          }
        }
      }
    }
  }
  .header-left {
    background-color: $yellow;
    width: 70px;
    position: absolute;
    z-index: 1;
    padding: 30px 10px;
    border-radius: 0 0 25px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 0;
    .navbar-toggler {
      border-radius: 0;
      width: 44px;
      height: 27px;
      margin-bottom: 45px;
      &.collapsed {
        .navbar-toggler-icon {
          &:before {
            top: -11px;
          }
          &:after {
            top: 11px;
          }
        }
      }
      .navbar-toggler-icon {
        width: 30px;
        left: 0;
        transform: translateY(-50%);
        &:before, &:after {
          width: 44px;
        }
      }
    }
    .header-chat {
      margin-bottom: 34px;
    }
  }

  .container-mainnavigation {
    padding: 20px 0;
    margin: 0;
    max-width: none;
  }
  .header-center {
    display: flex;
    align-items: center;
    gap: 100px;
    max-width: 1430px;
    width: 100%;
    margin: 0 auto;
    padding-left: 90px;
    padding-right: 230px;
    //margin-left: calc((100% - 1430px) / 2);
    //margin-right: calc((100% - 1430px) / 2);
  }
  .navbar-brand-image {
    position: absolute;
    right: 0;
    z-index: 1;
  }
  .language-menu {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px;
    a {
      text-decoration: none;
      color: $light-purple;
    }
    span {
      font-weight: 600;
    }
  }
  .icon-navigation {
    display: flex;
    gap: 100px;
    align-items: center;
    .nav-link {
      font-weight: 600;
      font-size: 1rem;
      line-height: 20px;
      gap: 15px;
      img {
        height: 35px;
        width: auto;
      }
    }
  }
}

.navbar-mainnavigation {
  .show {
    & > .nav-link-indicator {
      &:before {
        background-image: url("../../Images/minus.svg");
        transform: rotate(0);
      }
    }
  }
  .nav-link-indicator {
    &:before {
      content: '';
      background-image: url("../../Images/plus.svg");
      border: none;
      height: 50px;
      width: 50px;
      background-repeat: no-repeat;
      background-size: cover;
      transform: rotate(90deg);
    }
  }
  .dropdown-nav {
    grid-template-columns: auto;
  }
  .nav-link.nav-link-main:before  {
    display: none;
  }
}
.navbar-mainnavigation .nav-link:not(.nav-link-toggle):before {
  display: none;
}

@media (max-width: 1200px) {
  .navbar-mainnavigation {
    .navbar-brand-image {
      img {
        width: 214px !important;
      }
    }
  }
}
@media (max-width: 1024px) {
  .bp-page-header {
    .icon-navigation {
      gap: 40px;
    }
    .header-center {
      gap: 60px;
    }
  }
}
@media (max-width: 900px){
  .navbar-mainnavigation {
    .navbar-brand-image {
      img {
        width: 150px !important;
      }
    }
  }
  .bp-page-header {
    .icon-navigation {
      .nav-link {
        img {
          height: 25px;
        }
      }
    }
  }
}
@media (max-width: 720px) {
  .bp-page-header {
    .icon-navigation {
      flex-wrap: wrap;
      gap: 25px;
    }
  }
}
@media (max-width: 620px) {
  .bp-page-header {
    .navbar-collapse {
      .mainnav-inner {
        .navbar-nav {
          .nav-item {
            .nav-link {
              font-size: 24px;
            }
          }
        }
      }
    }
  }
}