Why doesn't VS CODE accept nesting in a sass file?

Question

Sass

Hello! Can you please tell me why VS CODE can not accept nesting in a sass file?
The file format is correct - sass, the code itself is written correctly, but it is not applied to the site page. If you rewrite the code in the usual css syntax, without nesting, everything works. I write the code in a sass file, then I compile it into a css file connected to html using the Live Sass Compiler plugin. If you check the compiled file, then this section is not there at all or there is only a part.

<footer>
        <div class="footer_divider"></div>
        <div class="footer_wrapper">
            <div>
                <div class="footer_social">
                    <a href="#" class="footer_social_item">
                        <i class="fab fa-facebook-f"></i>
                    </a>
                    <a href="#" class="footer_social_item">
                        <i class="fab fa-twitter"></i>
                    </a>
                    <a href="#" class="footer_social_item">
                        <i class="fab fa-linkedin"></i>
                    </a>
                    <a href="#" class="footer_social_item">
                        <i class="fab fa-instagram"></i>
                    </a>
                </div>
            </div>
            <div>
                <div class="footer_links">
                    <div class="footer_links_main">
                        <a href="#">на главную</a>
                        <a href="#">города</a>
                        <a href="#">для водителей</a>
                    </div>
                    <div class="footer_links_sub">
                        <a href="#">центр поддержки</a>
                        <a href="#">вакансии</a>
                        <a href="#">разработчики</a>
                        <a href="#">блог</a>
                        <a href="#">о нас</a>
                    </div>
                    <a href="#" class="footer_links_lang">Русский</a>
                </div>
            </div>
            <div>
                <div class="footer_mobile">
                    <a href="#">
                        <img src="img/link-1.png" alt="App Store">
                    </a>
                    <a href="#">
                        <img src="img/link-2.png" alt="Google play">
                    </a>
                    <a href="#">
                        <img src="img/link-3.png" alt="Windows store">
                    </a>
                </div>
            </div>
        </div>
    </footer>

.footer
  &_divider
    width: 299px
    height: 4px
    margin: 0 auto
    background-color: #1fbad6
  &_wrapper
    display: flex 
    justify-content: space-between
    align-items: flex-start
    padding-top: 32px
  &_wrapper > div 
    width: 33%
    &:nth-child(3)
      display: flex 
      justify-content: flex-end
    &_social
      width: 160px
      display: flex
      justify-content: space-between
    &_item
      display: flex 
      justify-content: center
      align-items: center
        width: 32px
        height: 32px
        margin: 0 4px
        background-color: #070716
        border-radius: 100%
      i
        color: #fff

Answer 1

when you write

.footer {
    &_divider {}
}

you are not creating nesting. this entry generates code like .footer_dividerthis is how sass works. there is no error.
If you want nesting, then specify it explicitly. for example:

.footer {
    .footer_divider {}
}

Answer 2

I know that the comment is not to the point, but why do you need such a powerful tool as Sass if the foundation of all the basics is lame for you - is the quality of the markup? Yes, it's semantics. Apart from that, I see that you are trying in BEM, but breaking the naming rules. All in all, like Sass, BEM is probably an overkill for this project, based on the context of the code and your skill.
I sincerely advise you to master some layout courses, a la HTML Academy Professional site layout and Preprocessors and automation.
PS You shouldn't have chosen the .sass format. The best option would be .scss, because it is similar to CSS in syntax. As in CSS, .scss nesting occurs through {} and not indentation. Yes, yes, this means that if you suddenly need to urgently insert virgin CSS, then .scss will process it, and .sass will say "goodbye"