стиль sass не применяется при переопределении

Question

структура моей папки

 bootstrap 
    all the scss n bootstrap file
 scss 
    _variable.scss
     styles.scss
     styles.css

мои переопределенные стили в styles.css

 /* this part works

 $body-bg: #f5f5f5;
 $theme-colors: (
        "primary": #ffffff,
        "success": #000000
   );
  $link-color:                #ffffff;
  $link-hover-color:          darken($link-color, 15%) ;

 /* this overridden styles dont work */
 .container-fluid{
      .row{
        background-color: #000000;}}                   
  .dropdown{
   &:hover{
 .dropdown-menu{
     visibility: visible;
     opacity: 1;
     overflow: visible;
  }} }      
.dropdown-menu{
  visibility: hidden;
 opacity: 0;
 overflow: hidden;}

/ * эти переопределенные стили не работают * /

the Переменная $ работает и применяется, но тогда .container-liquid не может быть применен к моему html

     <div id="app"  class="container-fluid">
        <div class="row">
            <nav class="navbar justify-content-start navbar-dark bg-dark ">
                <a class="navbar " href="#">

Может кто-нибудь, пожалуйста, дайте мне знать, где я иду не так, серьезно глядяза помощью

Answer 1

добавить !important к CSS, который вы хотите применить

.container-fluid{
    .row{
        background-color: #000000 !important;
    }
}