Custom Tag Theme Won't Apply (v2)

[harol-rodriguez]

Description

When I try to modify the Tag theme, both background and color changes are not applied. I have checked the chakra code
[$color.variable]: badgeVars.color.reference, [$bg.variable]: badgeVars.bg.reference, [$shadow.variable]: badgeVars.shadow.reference,
https://github.com/chakra-ui/chakra-ui/blob/main/packages/theme/src/components/tag.ts

and they use badgeVars, I would like to modify all the properties to customize Tag in dark and light theme.

This is my custom theme for Tag:
`
import { tagAnatomy } from '@chakra-ui/anatomy'
import { createMultiStyleConfigHelpers, cssVar, defineStyle, useColorMode } from '@chakra-ui/react'
import { mode } from '@chakra-ui/theme-tools';

const { definePartsStyle, defineMultiStyleConfig } =
createMultiStyleConfigHelpers(tagAnatomy.keys)

const baseStyle = () => definePartsStyle({
container: {},
label: {
fontSize: '25px',
}
})

const defaultProps: any = {
variant: "solid",
}

const solid = defineStyle((props: any) => {
const { colorMode } = useColorMode();
const { colorScheme: c, theme } = props;

const backgroundColor = ${c}.${colorMode === 'light' ? 50 : 700} !important;
const color = ${c}.${colorMode === 'light' ? 700 : 500} !important;

const $bg = cssVar("tag-bg")
const $color = cssVar("tag-color")

return {

container: {
  px: '4',
  py: '2',
  borderRadius: 'full',
  bg: backgroundColor,
  color: color,
}

};
})

export const tagTheme = defineMultiStyleConfig<any, any, any>({
baseStyle,
defaultProps,
variants: {
solid
},
})

`

In addition to that, label changes do not apply as stated in the documentation.

Link to Reproduction

https://codesandbox.io/p/sandbox/strange-rgb-5vwf7m

Steps to reproduce

1. Go to '...'
2. Click on '...'
3. Scroll down to '...'
4. See error

Chakra UI Version

2.8.2

Browser

safari, chrome

Operating System

• macOS
• Windows
• Linux

Additional Information

No response