colors not working

[VamsiPunnaReddy]

const colorstyles = bg-${color} text-${color}-foreground hover:bg-${color}/${color === "secondary" ? "80" : "90"};

i made this to apply styles to my button component changing the shadcn default button styles and i can see that the classes are applying when i inspect and the .css file has all the required stuff

and i searched for 2 days still cant figure out what is going on

how to solve this issue