How to make friends BEM, BEM modifiers, SCSS and cascading?

Question

Sass

Very often you need to change the state of the external unit.
For example, when we focus an element, disable it, make it read-only, etc.
If you apply the BEM methodology, you need to enter a modifier. So we add a modifier to the main element. But here's the problem, we have several nested elements. And they all need to change styles, not just the parent element.

Here, please tell me how to reconcile these BEM modifiers with cascading (with nested elements) and SCSS. Duplicate the parent's name is not the best solution.

<div class="my-select my-select_disabled">
    <div class="my-select__header">...</div>
    <div class="my-select__list">...</div>
</div>

.my-select {
    &__header {
        //...
    }

    &__list {
        //...
    }

    &_disabled {
        // Когда отключен весь селект
        // поменять цвет для my-select__header
        // поменять цвет для my-select__list
    }
}

Answer 1

The problem is writing to scss, right?
There are two options:

.my-select {
    &__header { }
    &__list { }

    &_disabled { }
    &_disabled &__header { }
    &_disabled &__list { }
}

.my-select {
    $this: &;
    &__header { }
    &__list { }

    &_disabled {
        #{$this}__header { }
        #{$this}__list { }
    }
}