My style does not work

[tatane616]

I use previewTemplate, and want to use some styles.
Inline CSS is work normally, but CSS in <style> block does not work.

<script>
...

data() {
    return {
        ...
      options: {
        previewTemplate: this.template(),
      }
    };
  },
  methods: {
    template() {
      return `
          <div class="preview__card">
            ...
          </div>
        `;
    },
  },
...
</script>

...

<style lang="scss" scoped>
.preview__card {
  background-color: red;
}

[tatane616]

This problem was due to scoped style.
It worked well without scope

[ajingopi-bridge]

@tatane616 This saved my day.

[RokasDie]

You can also use /deep/ before css class in scoped, like this:

<style lang="scss" scoped>
/deep/.dz-message {
  font-size: 20px;
}
</style>