Using v4 variables in typescript

[awais019]

Is there a way to use tailwind v4 in typescript like v3 config object. I want to style my stripe elements with my colors and font sizes but not able to import them in typescript file.
v3 example

import type { Appearance } from "@stripe/stripe-js";
import resolveConfig from "tailwindcss/resolveConfig";
import config from "~/tailwind.config";
const tailwindConfig = resolveConfig(config);

const stripElements: Appearance = {
  theme: "stripe",
  rules: {
    ".Input": {
      padding: tailwindConfig.theme.padding[4],
    },

  },

};

Edit: I found this way to use default theme but how can I use primary color that doesn't exist in default theme