Как ссылаться на родительский селектор класса на несколько уровней, чтобы добавить вариант?

Question

Как добавить вариант класса .navbar-dark в .navbar из дочернего класса .dropdown-toggle с помощью SASS?

Я пытаюсь добиться этого:

.nav-wrapper. navbar.navbar-dark .nav-item> .nav-link.dropdown-toggle

.nav-wrapper{
  .navbar {
    $navbar: #{&};

    .nav-item{
      > .nav-link{

        &.dropdown-toggle{

          @at-root #{$navbar}.navbar-dark & {
            background-color: red;
          }
        }
      }
    }
  }
}

Дает:

.nav-wrapper .navbar.navbar-dark .nav-wrapper .navbar .nav-item > .nav-link.dropdown-toggle {
  background-color: red;
}

И

.nav-wrapper{
  .navbar {
    $navbar: #{&};

    .nav-item{
      > .nav-link{

        &.dropdown-toggle{

          @at-root #{$navbar}.navbar-dark {
            background-color: red;
          }
        }
      }
    }
  }
}

Дает:

.nav-wrapper .navbar.navbar-dark {
  background-color: red;
}