Не удалось @import bootstrap.css. Не удалось открыть ресурс bootstrap.css, недоступный

Я новичок в веб-дизайне и учусь использовать Flask. Я уже создал структуру своего веб-приложения и теперь хочу его стилизовать.

Я загрузил скомпилированный CSS и JS bootstrap, и я хочу @импортировать его в свой настроенный файл scss, чтобы затем я мог @расширить некоторые его функции. Мой тестовый код:

@import 'C:/Users/lili_/Desktop/bootstrap-4.3.1-dist/css/bootstrap.css';
$navbar_color: red;
.my_navbar {
    @extend .navbar;
    background-color: $navbar_color;
}

Проблема в том, что когда я пытаюсь запустить sass и преобразовать его в файл css, появляется это сообщение об ошибке:

Селектор .navbar не найден.

Он показывает ту же ошибку с любым .class или #id, который я пытался @extend. Кроме того, когда я открываю файл bootstrap.css, выполнив поиск в его папке, он выглядит просто отлично, но когда я пытаюсь перейти по ссылке @import (которую я скопировал и вставил в свой test.scss) из Visual Studio Редактор кода, выскакивает окно с сообщением об ошибке:

Не удалось открыть ресурс 'bootstrap.css'
недоступен