PurgeCss not working in Nextjs 13 version

Question

I am trying to reduce size of css in my Nextjs project. I am following https://purgecss.com/guides/next.html this guide.

following are the content of my style.css

@import url('/assets/css/bootstrap.min.css');
@import url('/assets/css/fonts.css');
@import url('/assets/css/flaticon.css');
@import url('/assets/css/font-awesome.css');
@import url('/assets/css/select2.min.css');
@import url('/assets/css/nice-select.css');
@import url('/assets/css/owl.carousel.css');
@import url('/assets/css/owl.theme.default.css');
@import url('/assets/css/reset.css');
@import url('/assets/css/style.css');
@import url('/assets/css/responsive.css');

Following are the version of nextjs I am using.

"next": "13.1.1",

I have created postcss.config.js file in my root directory.

  "plugins": [
    "postcss-flexbugs-fixes",
    [
      "postcss-preset-env",
      {
        "autoprefixer": {
          "flexbox": "no-2009"
        },
        "stage": 3,
        "features": {
          "custom-properties": false
        }
      }
    ],
    [
      '@fullhuman/postcss-purgecss',
      {
        content: [
            './pages/**/*.{js,jsx,ts,tsx}',
            './components/**/*.{js,jsx,ts,tsx}'
        ],
        defaultExtractor: content => content.match(/[\w-/:]+(?<!:)/g) || [],
        safelist: ["html", "body"]
      }
    ],
  ]
}

I tried npm run build && npm start. And when I tried to access my website it is still requesting for all these files nothing changed.

Do I need to use following:

const withPurgeCss = require("next-purgecss");

module.exports = withCss(withPurgeCss());

But in documentation it's given we need to change in next.config only for version < 9.3. I tried this also but it's also giving error.

Already tried solution in PurgeCSS does not remove unused CSS from NextJS project but not working.

Any suggestions?