tailwind stop working after add custom color to tailwind.config.js

im using tailwind in my Nextjs project. i decided to add my own color set to tailwind.config.js. then when i go back to my project i saw some tailwind classes for some elements not working and some of them works like before. the codes that should be in global css are there. @tailwind base;
@tailwind components;
@tailwind utilities;
and global css imported in layout. it was working fine whole the time. i changed nothing but just i said earlier. maybe its worth to know that im using experimental feature (appDir) in next.config.js.

its now my tailwind.config.js file:

module.exports = {
  content: [
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

portcss file:

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}

also has the tailwind in package.json: "tailwindcss": "^3.2.4"

i removed the color set but didnt fixed the problem. i tried npm run dev -- --no-cache
but didnt helped. deleting .next also not worked. even moved the folder but the problem exist. then i deleted all tailwind config files and reinstall them and not everything just messed up. there is no more tailwind classes working now.

Have You tried adding and

  content: [
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
    "./app/**/*.{js,ts,jsx,tsx}"
  ]