How to add a class with new styles css to v-dialog, vuetify? : <p>Good day. I am working with vuetify, using the following v-dialog in a component:</p>

<pre><code>&lt;template&gt;
  &lt;div&gt;
    &lt;!--Indicador--&gt;
      &lt;v-dialog class="vdialognew" v-model="mostrarIndicator" persistent&gt;
        &lt;v-content&gt;
          &lt;v-container fluid fill-height&gt;
            &lt;v-layout align-center justify-center&gt;
                &lt;cube-shadow class="spinnerRotate"&gt;&lt;/cube-shadow&gt;
            &lt;/v-layout&gt;
          &lt;/v-container&gt;
        &lt;/v-content&gt;
      &lt;/v-dialog&gt;
    &lt;!--------------&gt;
  &lt;/div&gt;
&lt;/template&gt;
&lt;style scoped&gt;
.vdialognew {
  box-shadow: none !important;
  max-width: 610px !important;
}
&lt;/style&gt;
</code></pre>

<p>As you will see in v-dialog I have added the vdialognew class, to apply those new styles, but when loading the content by checking in the browser console, I see that the vdialognew class does not apply to it, only. Similarly, if I use the style property inside the v-dialog tag, it does not work for me. How can I make such a change?</p>

<p>I am doing this modification to eliminate the box that is seen behind the green square:</p>

<p><a href="https://i.stack.imgur.com/WpV6n.png" rel="noreferrer"><img src="https://i.stack.imgur.com/WpV6n.png" alt="enter image description here"></a></p>

<p>Thank you very much in advance. Blessings</p>
