Sie können die CSS-Funktion light-dark() verwenden.
--variable-name: light-dark(#efedea, #223a2c);
Sie können beide auf dasselbe setzen.
Am :hover wurde im Kern nichts geändert. Sie müssen nur sicherstellen, dass Sie die Variable beim Hovern auf das gewünschte setzen.