Greetings @sandhyak ,

I guess there is a typo for the hover state in the CSS, it should be `nx-theme-button-2:hover` instead of ` .nx-theme-button-2 .hoover`.  In your case we just need to increase the CSS selector specificity  as mentioned in our CSS guideline, this article is referenced in the guideline and it explain how CSS selector specificity works in details.

With that in mind, I would suggest the following CSS:

"dir] .nx-theme-styles .nx-theme-form .nx-button-container button.nx-theme-button-1 { 
    background-color: #FFFFFF;
    color: #00763c;
    font-size: 16px;
    font-weight: 700; width: 100%;
    border: 2px solid #00763c; 
}

/dir] .nx-theme-styles .nx-theme-form .nx-button-container button.nx-theme-button-1:hover { 
    background-color : #00763c;
    color: #ffffff;
}

/dir] .nx-theme-styles .nx-theme-form .nx-theme-button-2 { 
    background-color: #FFFFFF; 
    color: #00763c; 
    font-size: 16px; 
    font-weight: 700; 
    width: 100%; 
    border: 2px solid #00763c; 
}

/dir] .nx-theme-styles .nx-theme-form .nx-button-container button.nx-theme-button-2:hover { 
    background-color : #00763c;
    color: #ffffff;
} 

/dir] .nx-theme-styles .nx-theme-form .nx-theme-label-1 .a { 
    color: #00763c; 
}

I assume that we want to change the button text color to white or any light color to have a good contrast with the green color when the button is on hover.

Let me know if the above CSS works. Thank you.