8 – Bootswatch Cyborg, custom styles are not applied

I wish to create a new sub-theme based on the Bootswatch Cyborg theme. I wish to edit the CSS to change the styles. Without having to compile Sass or Less.

The things I have done/tested to make it work:

  1. I used composer require drupal/bootstrap to copy the theme and I installed it in Drupal (on a localhost as well as a live host)

  2. I setup a sub-theme, as per documentation instructions, by using the starterkits/THEMENAME project; I installed the theme

  3. I followed steps 1-6 as described on https://drupal-bootstrap.org/api/bootstrap/docs!Sub-Theming.md/group/sub_theming/8.x-3.x

  4. Since I wish to use/edit the Bootswatch Cyborg theme, in Drupal’s Appearance “bootstrap_subtheme” CDN settings, I set the following:

    CDN Provider:jsDelivr, Theme:Cyborg

The bootstrap_subtheme file tree is the following.

 1. bootstrap_subtheme.info.yml
 2. bootstrap_subtheme.libraries.yml
 3. bootstrap_subtheme.theme
 4. config/install/bootstrap_subtheme.settings.yml
 5. config/schema/bootstrap_subtheme.schema.yml
 6. css/style.css

bootstrap_subtheme.info.yml

type: theme
base theme: bootstrap
core: 8.x
core_version_requirement: ^8 || ^9

name: 'bootstrap_subtheme'
description: 'A Drupal Bootstrap 3 based sub-theme.'
package: 'Bootstrap'

regions:
  navigation: 'Navigation'
  navigation_collapsible: 'Navigation (Collapsible)'
  header: 'Top Bar'
  highlighted: 'Highlighted'
  help: 'Help'
  content: 'Content'
  sidebar_first: 'Primary'
  sidebar_second: 'Secondary'
  footer: 'Footer'
  page_top: 'Page top'
  page_bottom: 'Page bottom'

libraries-extend:
  bootstrap/framework:
    - bootstrap_subtheme/framework

bootstrap_subtheme.libraries.yml

framework:
  css:
    theme:
      css/style.css: {}

bootstrap_subtheme.theme

.empty /null

###config/install/bootstrap_subtheme.settings.yml

schemas: ()

config/schema/bootstrap_subtheme.schema.yml

bootstrap_subtheme.settings:
  type: theme_settings
  label: 'bootstrap_subtheme settings'

css/style.css

.h1 { font-size: 200px; color:red; }
.h2 { font-size: 95px; }
label { font-weight: 100; }

I flushed the cache. The styling doesn’t take effect.
When inspecting a webpage element (with Firefox) the stylesheet that it is using, points to https://cdn.jsdelivr.net/npm/bootswatch@3.4.0/cyborg/bootstrap.min.css.

Further to this, I tried something else: I created a full HTML page in Drupal (published) and applied a style within it (.h1 {font-size:10px;}). The styling executes, and changes as it should.

Where is this going wrong?

The bottom line is that the css/style.css file (whose permissions are 744) is not read. Why?