Plugin breaks complex values when `light-dark` is nested

[romainmenke]

.light-dark-function-mix-a {
    color: light-dark(color-mix(in oklch, red, light-dark(cyan, rgb(0, 0, 0))), blue);
}

becomes

@media (prefers-color-scheme:dark) {

    :where(html:not(.is-light)) .light-dark-function-mix-a {
        color: blue;
    }
}

:where(html.is-dark) .light-dark-function-mix-a {
    color: blue;
}

@media (prefers-color-scheme:light) {

    :where(html:not(.is-dark)) .light-dark-function-mix-a {
        color: color-mix(in oklch, red, cyan;
    }
}

:where(html.is-light) .light-dark-function-mix-a {
    color: color-mix(in oklch, red, cyan;
}

color: color-mix(in oklch, red, cyan;

---

Might be better to use a value parser for the value replacements :)

But as the title suggests, these are complex values that are unlikely to be used by authors.

[ai]

Can I ask you to do it? I am too busy on another project right now.

[romainmenke]

Equally too busy and not blocking for me personally :) This only surfaced because I was noticed the sourcemaps issue.

You can just leave the issue open. If someone needs it they can fix it and submit a patch.

[ai]

@VladBrok maybe you have a time for fix light-dark() by moving to postcss-value-parser?

[ai]

The both fixes was released in 1.2.3. Thanks to everyone.

[romainmenke]

Awesome! Super speedy fix @VladBrok 🚀