/** @type {import('tailwindcss').Config} */
const { fontFamily } = require("tailwindcss/defaultTheme")
module.exports = {
  darkMode: ["class"],
  content: [
    "./pages/**/*.{ts,tsx}",
    "./components/**/*.{ts,tsx}",
    "./app/**/*.{ts,tsx}",
    "./src/**/*.{ts,tsx}",
  ],
  theme: {
    container: {
      center: true,
      padding: "2rem",
      screens: {
        "2xl": "1400px",
      },
    },
    extend: {
      colors: {
        border: "var(--border)",
        input: "var(--input)",
        ring: "var(--ring)",
        background: "var(--background)",
        foreground: "var(--foreground)",
        brand: {
          DEFAULT: "var(--brand)",
          foreground: "var(--brand-foreground)",
        },
        primary: {
          DEFAULT: "var(--primary)",
          foreground: "var(--primary-foreground)",
        },
        secondary: {
          DEFAULT: "var(--secondary)",
          foreground: "var(--secondary-foreground)",
        },
        muted: {
          DEFAULT: "var(--muted)",
          foreground: "var(--muted-foreground)",
        },
        accent: {
          DEFAULT: "var(--accent)",
          foreground: "var(--accent-foreground)",
          secondary: "var(--accent-secondary)",
          tertiary: "var(--accent-tertiary)",
          quaternary: "var(--accent-quaternary)",
        },
        popover: {
          DEFAULT: "var(--popover)",
          foreground: "var(--popover-foreground)",
        },
        card: {
          DEFAULT: "var(--card)",
          foreground: "var(--card-foreground)",
        },
        error: {
          DEFAULT: "var(--error)",
          foreground: "var(--error-foreground)",
          light: "var(--error-light)",
          lighter: "var(--error-lighter)",
          hover: "var(--error-hover)",
        },
        success: {
          DEFAULT: "var(--success)",
          foreground: "var(--success-foreground)",
          light: "var(--success-light)",
          lighter: "var(--success-lighter)",
          hover: "var(--success-hover)",
        },
        warning: {
          DEFAULT: "var(--warning)",
          foreground: "var(--warning-foreground)",
          light: "var(--warning-light)",
          lighter: "var(--warning-lighter)",
          hover: "var(--warning-hover)",
        },
        info: {
          DEFAULT: "var(--info)",
          foreground: "var(--info-foreground)",
          light: "var(--info-light)",
          lighter: "var(--info-lighter)",
          hover: "var(--info-hover)",
        },
        gray: {
          DEFAULT: "var(--gray1)",
          foreground: "var(--gray12)",
          "1": "var(--gray1)",
          "2": "var(--gray2)",
          "3": "var(--gray3)",
          "4": "var(--gray4)",
          "5": "var(--gray5)",
          "6": "var(--gray6)",
          "7": "var(--gray7)",
          "8": "var(--gray8)",
          "9": "var(--gray9)",
          "10": "var(--gray10)",
          "11": "var(--gray11)",
          "12": "var(--gray12)",
        },
        grass: {
          DEFAULT: "var(--grass1)",
          foreground: "var(--grass12)",
          "1": "var(--grass1)",
          "2": "var(--grass2)",
          "3": "var(--grass3)",
          "4": "var(--grass4)",
          "5": "var(--grass5)",
          "6": "var(--grass6)",
          "7": "var(--grass7)",
          "8": "var(--grass8)",
          "9": "var(--grass9)",
          "10": "var(--grass10)",
          "11": "var(--grass11)",
          "12": "var(--grass12)",
        },
        blue: {
          DEFAULT: "var(--blue1)",
          foreground: "var(--blue12)",
          "1": "var(--blue1)",
          "2": "var(--blue2)",
          "3": "var(--blue3)",
          "4": "var(--blue4)",
          "5": "var(--blue5)",
          "6": "var(--blue6)",
          "7": "var(--blue7)",
          "8": "var(--blue8)",
          "9": "var(--blue9)",
          "10": "var(--blue10)",
          "11": "var(--blue11)",
          "12": "var(--blue12)",
        },
        tomato: {
          DEFAULT: "var(--tomato1)",
          foreground: "var(--tomato12)",
          "1": "var(--tomato1)",
          "2": "var(--tomato2)",
          "3": "var(--tomato3)",
          "4": "var(--tomato4)",
          "5": "var(--tomato5)",
          "6": "var(--tomato6)",
          "7": "var(--tomato7)",
          "8": "var(--tomato8)",
          "9": "var(--tomato9)",
          "10": "var(--tomato10)",
          "11": "var(--tomato11)",
          "12": "var(--tomato12)",
        },
        amber: {
          DEFAULT: "var(--amber1)",
          foreground: "var(--amber12)",
          "1": "var(--amber1)",
          "2": "var(--amber2)",
          "3": "var(--amber3)",
          "4": "var(--amber4)",
          "5": "var(--amber5)",
          "6": "var(--amber6)",
          "7": "var(--amber7)",
          "8": "var(--amber8)",
          "9": "var(--amber9)",
          "10": "var(--amber10)",
          "11": "var(--amber11)",
          "12": "var(--amber12)",
        },
        cyan: {
          DEFAULT: "var(--cyan1)",
          foreground: "var(--cyan12)",
          "1": "var(--cyan1)",
          "2": "var(--cyan2)",
          "3": "var(--cyan3)",
          "4": "var(--cyan4)",
          "5": "var(--cyan5)",
          "6": "var(--cyan6)",
          "7": "var(--cyan7)",
          "8": "var(--cyan8)",
          "9": "var(--cyan9)",
          "10": "var(--cyan10)",
          "11": "var(--cyan11)",
          "12": "var(--cyan12)",
        },
        violet: {
          DEFAULT: "var(--violet1)",
          foreground: "var(--violet12)",
          "1": "var(--violet1)",
          "2": "var(--violet2)",
          "3": "var(--violet3)",
          "4": "var(--violet4)",
          "5": "var(--violet5)",
          "6": "var(--violet6)",
          "7": "var(--violet7)",
          "8": "var(--violet8)",
          "9": "var(--violet9)",
          "10": "var(--violet10)",
          "11": "var(--violet11)",
          "12": "var(--violet12)",
        },
        highlight: {
          blue: "var(--highlight-blue)",
          pink: "var(--highlight-pink)",
        },
      },
      borderRadius: {
        DEFAULT: "var(--radius)",
        sm: "var(--radius-small)",
        md: "var(--radius-medium)",
        lg: "var(--radius-large)",
        xl: "var(--radius-xlarge)",
      },
      fontFamily: {
        sans: ["var(--font-sans)", ...fontFamily.sans],
      },
      boxShadow: {
        border: "var(--shadow-border)",
        small: "var(--shadow-small)",
        "border-small": "var(--shadow-border-small)",
        medium: "var(--shadow-medium)",
        "border-medium": "var(--shadow-border-medium)",
        large: "var(--shadow-large)",
        "border-large": "var(--shadow-border-large)",
        tooltip: "var(--shadow-tooltip)",
        popover: "var(--shadow-dialog)",
        dialog: "var(--shadow-dialog)",
        fullscreen: "var(--shadow-fullscreen)",
      },
      opacity: {
        overlay: "var(--opacity-overlay)",
        disabled: "var(--opacity-disabled)",
      },
      keyframes: {
        "accordion-down": {
          from: { height: 0 },
          to: { height: "var(--radix-accordion-content-height)" },
        },
        "accordion-up": {
          from: { height: "var(--radix-accordion-content-height)" },
          to: { height: 0 },
        },
        slideRight: {
          from: { width: 0 },
          to: { width: "var(--radix-collapsible-content-width)" },
        },
        slideLeft: {
          from: { width: "var(--radix-collapsible-content-width)" },
          to: { width: 0 },
        },
      },
      animation: {
        "accordion-down": "accordion-down 0.2s ease-out",
        "accordion-up": "accordion-up 0.2s ease-out",
        slideR: "slideRight 0.3s ease-in-out",
        slideL: "slideLeft 0.3s ease-in-out",
      },
    },
  },
  plugins: [
    require("tailwindcss-animate"),
    require("@tailwindcss/aspect-ratio"),
    require("@tailwindcss/typography"),
    function ({ addUtilities }: { addUtilities: any }) {
      const newUtilities = {
        ".hide-scrollbar": {
          "::-webkit-scrollbar": {
            display: "none",
          },
          "-ms-overflow-style": "none",
          "scrollbar-width": "none",
        },
      }
      addUtilities(newUtilities, ["responsive", "hover"])
    },
  ],
}