Bootstrap does not cascade correctly

I'm confused about the issue you are facing. sub-theme/node-module/bootstrap contains the actual version 5.3 bootstrap source files. It has nothing to do with radix, except of course that radix uses these file.

The style definition for a class like .btn is from bootstrap 5.3 itself. Radix does not override bootstrap SASS files, although you are certainly free to do so in your subtheme.

If you can ask a more specific question, I'd be glad to try to help.

Maybe I can illustrate better with an image.

In capture.png you can see the bootstrap 'sub-theme/node_modules/bootstrap/scss/_button.scss' style of .btn has more priority than my .btn in 'sub-theme/component/button/button.scss'

I do not know how to make my scss elements take more priority in my subtheme.

So these are CSS selectors of equal specificity. Without digging, I'm not sure Drupal guarantees the relative order of the stylesheet references for the theme's library (which references the main stylesheet build by webpack.mix.js) and those included by the components via core's Single Directory Components. I would not recommend relying on the order of equal-specificity selectors.

What I would recommend is that, instead of trying to override conflicting CSS properties of, say .btn, instead look at the bootstrap definition of .btn and instead override the variables that are used to define it. See /src/scss/base/_variables.scss.

Hope that helps.