module.exports = {
  content: ["./src/**/*.{js,jsx,ts,tsx}"],
  theme: {
    extend: {},
    textColor: (theme) => ({
      ...theme("colors"),
      // used in ProductDesign Component
      discountPriceTitle: "#4ACA53",
      productTitle: "#246E8A",
      productContent: "#707070",
      productStar: "#F7FF00",
      productPrice: "#132F52",
      productBorderBtn: "FFF3F3",
      productTag: "#38A1B6",
      borderColor: "#dbdbdb",
      selectColor1: "#924EEB",
      selectColor2: "#89ECFF",
      selectColor3: "#FC5353",
      selectColor4: "#FCF653",
      lightBlueTextColor: "#06BACE",
      grayTextColor: "#646464",
      lightOrangeTextColor: "#F7B605",
      lightYellowTextColor: "#C8EE49",
      lightGreenTextColor: "#5DCE06",
      lightPurpleTextColor: "#A680FF",
      darkBlueTextColor: "#0615CE",
      darkRedTextColor: "#CE3B06",
    }),
    backgroundColor: (theme) => ({
      ...theme("colors"),
      // used in ProductDesign Component
      productTagBg: "#E1FAFF",
      likeBtnBg: "#FFF3F3",
      discountPriceBg: "#F0FFF1",
      counterBg: "#66B1EB",
      incrementDecrementBg: "#2E7AB5",
      darkGreenBg: "#038A99",
      midGrayBgColor: "#DBDBDB",
      lightOrangeBgColor: "#F7B60511",
      lightYellowBgColor: "#CEFE2D11", //opacity should be 10 % instead of 100%
      lightBlueBgColor: "#8891FC11", //opacity should be 10 % instead of 100%
      lightGreenBgColor: "#5DCE0611", //opacity should be 3 % instead of 100%
      lightPurpleBgColor: "#A680FF11", //opacity should be 8 % instead of 100%
      greenBookBg: "#5DA041",
    }),
    borderColor: (theme) => ({
      ...theme("colors"),
      // used in ProductDesign Component
      productDesignBorderColor: "#F3F3F3",
      lightBlueBorderColor: "#06BACE",
      grayBorderColor: "#C3C3C3",
      lightOrangeBorderColor: "#F7B605",
      lightYellowBorderColor: "#CFFF2D",
      lightGreenBorderColor: "#5DCE06",
      lightPurpleBorderColor: "#A680FF",
      darkBlueBorderColor: "#0615CE",
    }),
  },
  plugins: [],
};