Support for nested at-rules

[elchininet]

This pull request implements the necessary algorith changes to the plugin to support nested at-rules.

Previously, the plugin expected that declaration could be contained only in a rule. But with the relatively new CSS Nesting Module it is possible to place declarations inside an at-rule. This is what MDM Documentation states:

Any at-rule whose body contains style rules can be nested inside another style rule using CSS nesting. Style rules nested inside at-rules take their nesting selector definition from the nearest ancestor style rule. Properties can be directly included inside a nested at-rule, acting as if they were nested in a & {...} block.

So, taking this CSS input:

@media (orientation: landscape) {
    .test-ok-1 {
        .test-ok-2 {
            grid-auto-flow: column;
        }
    }
    @media (min-width: 1024px) {
        .test-ok-1 {
            .test-ok-2 {
                position: relative;
                max-inline-size: 1024px;
                padding: 10px 5px 20px 2px;
            }
        }
    }
}

.test-ko-1 {
    .test-ko-2 {
        @media (orientation: landscape) {
            grid-auto-flow: column;
            @media (min-width: 1024px) {
                position: relative;
                max-inline-size: 1024px;
                padding: 10px 5px 20px 2px;
            }
        }
    }
}

This was the output before the changes contained in this pull request:

@media (orientation: landscape) {
    .test-ok-1 {
        .test-ok-2 {
            grid-auto-flow: column;
        }
    }

    @media (min-width: 1024px) {
        .test-ok-1 {
            .test-ok-2 {
                position: relative;
                max-inline-size: 1024px;
            }
        }

        [dir="ltr"] .test-ok-1 {
            .test-ok-2 {
                padding: 10px 5px 20px 2px;
            }
        }

        [dir="rtl"] .test-ok-1 {
            .test-ok-2 {
                padding: 10px 2px 20px 5px;
            }
        }
    }
}

.test-ko-1 {
    .test-ko-2 {
        @media (orientation: landscape) {
            grid-auto-flow: column;

            @media (min-width: 1024px) {
                position: relative;
                max-inline-size: 1024px;
                padding: 10px 5px 20px 2px;
            }
        }
    }
}

Note how the first block was processed correctly because all the declarations are placed inside rules, meanwhile the second block was completely ignored because the declarations are placed inside at-rules instead.

After the changes contained in this pull request, this will be the output of the previous input:

@media (orientation: landscape) {
    .test-ok-1 {
        .test-ok-2 {
            grid-auto-flow: column;
        }
    }

    @media (min-width: 1024px) {
        .test-ok-1 {
            .test-ok-2 {
                position: relative;
                max-inline-size: 1024px;
            }
        }

        [dir="ltr"] .test-ok-1 {
            .test-ok-2 {
                padding: 10px 5px 20px 2px;
            }
        }

        [dir="rtl"] .test-ok-1 {
            .test-ok-2 {
                padding: 10px 2px 20px 5px;
            }
        }
    }
}

.test-ko-1 {
    .test-ko-2 {
        @media (orientation: landscape) {
            grid-auto-flow: column;

            @media (min-width: 1024px) {
                position: relative;
                max-inline-size: 1024px;
            }
        }
    }
}

[dir="ltr"] .test-ko-1 {
    .test-ko-2 {
        @media (orientation: landscape) {
            @media (min-width: 1024px) {
                padding: 10px 5px 20px 2px;
            }
        }
    }
}

[dir="rtl"] .test-ko-1 {
    .test-ko-2 {
        @media (orientation: landscape) {
            @media (min-width: 1024px) {
                padding: 10px 2px 20px 5px;
            }
        }
    }
}

Closes: #324

[coveralls]

coverage: 100.0%. remained the same
when pulling e85c67e on support_for_nested_at_rules
into 6f4bed6 on master.