Customize ant design theme on Nuxtjs3

Question

I have got a nuxtjs3 project with ant design and nuxtjs 3 I want to customize it but the new design seems not to work

Below are the nuxtjs3 project configurations

it compiles well but it still has ant default theme I want to use a custom theme

next config

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
devtools: { enabled: true },
ssr: false,
//@ts-ignore
 modules: [
'nuxt-sanctum-auth','@nuxtjs/tailwindcss'
],
tailwindcss: {
cssPath: '~/assets/css/tailwind.css',
configPath: 'tailwind.config',
exposeConfig: false,
exposeLevel: 2,
config: {},
injectPosition: 'first',
viewer: true,
},
css: [
'@/assets/variables.less'
],

webpack: {
loaders: {
  less: {
    lessOptions: {
      modifyVars: {
        'primary-color': '#f6b26b',
        'link-color': '#f6b26b',
        'border-radius-base': '10px',
      },
      javascriptEnabled: true,
      },
    },
  }
 },
 vite: {
  css: {
  preprocessorOptions: {
    less: {
      math: "always",
      relativeUrls: true,
      javascriptEnabled: true,
    },
   },
  },
},
build: {
analyze: true
},
plugins:['@/plugins/antd'],

})

package json

{
  "name": "nuxt-app",
  "private": true,
  "scripts": {
  "build": "nuxt build",
  "dev": "nuxt dev",
  "generate": "nuxt generate",
  "preview": "nuxt preview",
  "postinstall": "nuxt prepare"
 },
  "devDependencies": {
  "@nuxt/devtools": "latest",
  "@nuxtjs/tailwindcss": "^6.8.0",
  "@types/node": "^18",
  "nuxt": "^3.6.0",
  "typescript": "latest"
 },
  "dependencies": {
  "@ant-design/icons-vue": "^6.1.0",
  "ant-design-vue": "^3.2.20",
  "less": "^4.1.3",
  "less-loader": "^7.3.0",
  "nuxt-sanctum-auth": "^0.4.7"
 }

}

variables.less

@import 'ant-design-vue/dist/antd.less';
@primary-color: #f5222d; // primary color for all components
@link-color: #f5222d; // link color   
@success-color: #52c41a; // success state color
@warning-color: #faad14; // warning state color
@error-color: #f5222d; // error state color

antd plugin

import {defineNuxtPlugin} from "#app";
   import 'ant-design-vue/dist/antd.less';
   import Antd from 'ant-design-vue';

   export default defineNuxtPlugin((nuxtApp) => {
     nuxtApp.vueApp.use(Antd)
})

I hope to get an answer soon