import { defineConfig, presetWind } from "unocss";
import transformerVariantGroup from "@unocss/transformer-variant-group";
import transformerDirectives from "@unocss/transformer-directives";

export default defineConfig({
  presets: [presetWind()],
  theme: {
    colors: {
      primary: "var(--primary)",
      secondary: "var(--secondary)",
      accent: "var(--accent)",
      neutral: "var(--neutral)",
      info: "var(--info)",
      success: "var(--success)",
      warning: "var(--warning)",
      error: "var(--error)",
      base: {
        "100": "var(--base-100)",
        "200": "var(--base-200)",
        "300": "var(--base-300)",
      },
    },
    textShadow: {
      default: "0px 0px 1px rgb(0 0 0 / 20%), 0px 0px 1px rgb(1 0 5 / 10%)",
      sm: "1px 1px 3px rgb(36 37 47 / 25%)",
      md: "0px 1px 2px rgb(30 29 39 / 19%), 1px 2px 4px rgb(54 64 147 / 18%)",
      lg: "3px 3px 6px rgb(0 0 0 / 26%), 0 0 5px rgb(15 3 86 / 22%)",
      xl: "1px 1px 3px rgb(0 0 0 / 29%), 2px 4px 7px rgb(73 64 125 / 35%)",
      none: "none",
    },
  },
  shortcuts: [
    {
      btn: "inline-flex justify-center items-center font-bold rounded transition duration-300 ease-in-out",
    },
  ],
  transformers: [
    transformerVariantGroup(),
    transformerDirectives({
      applyVariable: ["--at-apply"],
    }),
  ],
});