Html NGB下拉菜单don'；与导航栏模板颜色不匹配

我正在用ngBootstrap创建一个导航栏，并插入了一个登录表单下拉列表

我创建了一个组件来处理这个表单和导航栏上的“Perfil”链接

问题是，我无法管理表单下拉列表中的颜色，对我来说，无论我必须在下拉列表中使用“亮”或“暗”主题，但它必须只使用一个颜色模式（在这种情况下，它将两个不同的颜色模式进行网格化）

如图1所示（如下所示），链接从导航栏继承链接颜色，并保持与下拉菜单相同的颜色

我尝试使用html代码更改下拉主题（没有成功）

在component.ts上，我在

样式上插入了以下内容：

 styles: [`
  background-color: #343a40;
    a:link, a:visited {
  ;
  color: blue;
  display: inline-block;
}

在
div ngbdropdown菜单上插入以下内容：

<li class="nav-item dropdown"  ngbDropdown class="d-inline-block" ngbDropdown display="dynamic" placement="bottom-left"> 
  <a class="nav-link dark dropdown-toggle" ngbDropdownToggle id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
    Perfil
  </a>  
    <div ngbDropdownMenu aria-labelledby="dropdownForm1" class="navbar-light" style="background: #343a40; color: white">
    <form class="px-4 py-3">
      <div class="form-group">
        <label for="exampleDropdownFormEmail1">Email</label>
        <input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="email@exemplo.com" autocomplete="username">
      </div>
      <div class="form-group">
        <label for="exampleDropdownFormPassword1">Senha</label>
        <input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Senha" autocomplete="current-password">
      </div>
      <div class="form-check">
        <input type="checkbox" class="form-check-input" id="dropdownCheck">
        <label class="form-check-label" for="dropdownCheck">
          Lembrar de mim
          <p></p>
        </label>
      </div>
      <button type="submit" class="btn btn-primary">Login <i class = "fas fa-sign-in-alt"></i></button>
    </form>
    <div class="dropdown-divider"></div>
    <button ngbDropdownItem>
    <a class="nav-link" [routerLink]= "['register']" routerLinkActive = "active" >
    Novo por aqui? Registre-se</a></button>
    <button ngbDropdownItem>
    <a class="nav-link" [routerLink]= "['reset-password']" routerLinkActive = "active">
    Esqueceu a senha?</a></button>
  </div>
</li>

style=“background:343a40；

从下面可以看出，当我将鼠标悬停在按钮上时，它仍然使用灯光主题


我使用的完整代码如下：

<li class="nav-item dropdown"  ngbDropdown class="d-inline-block" ngbDropdown display="dynamic" placement="bottom-left"> 
  <a class="nav-link dark dropdown-toggle" ngbDropdownToggle id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
    Perfil
  </a>  
    <div ngbDropdownMenu aria-labelledby="dropdownForm1" class="navbar-light" style="background: #343a40; color: white">
    <form class="px-4 py-3">
      <div class="form-group">
        <label for="exampleDropdownFormEmail1">Email</label>
        <input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="email@exemplo.com" autocomplete="username">
      </div>
      <div class="form-group">
        <label for="exampleDropdownFormPassword1">Senha</label>
        <input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Senha" autocomplete="current-password">
      </div>
      <div class="form-check">
        <input type="checkbox" class="form-check-input" id="dropdownCheck">
        <label class="form-check-label" for="dropdownCheck">
          Lembrar de mim
          <p></p>
        </label>
      </div>
      <button type="submit" class="btn btn-primary">Login <i class = "fas fa-sign-in-alt"></i></button>
    </form>
    <div class="dropdown-divider"></div>
    <button ngbDropdownItem>
    <a class="nav-link" [routerLink]= "['register']" routerLinkActive = "active" >
    Novo por aqui? Registre-se</a></button>
    <button ngbDropdownItem>
    <a class="nav-link" [routerLink]= "['reset-password']" routerLinkActive = "active">
    Esqueceu a senha?</a></button>
  </div>
</li>


侧影日报
电子邮件
森哈
勒姆布拉尔酒店

登录
Novo por aqui？注册东南部
埃斯奎奥是一个仙人吗？


更新：我认为问题可能来自原始引导的ngBootstrap应用，也许我需要包括一些东西来处理这个问题