import type { Config } from "tailwindcss";

export default {
  darkMode: "class",
  content: [
    "./app.vue",
    "./error.vue",
    "./nuxt.config.ts",
    "./components/**/*.vue",
    "./layouts/**/*.vue",
    "./pages/**/*.vue",
    "./composables/**/*.ts",
  ],
  theme: {
    extend: {
      fontFamily: {
        sans: ["Vazirmatn", "system-ui", "-apple-system", "sans-serif"],
      },
      colors: {
        brand: {
          50: "#f0f6ff",
          100: "#e0effe",
          200: "#bae2fd",
          300: "#7ccbfd",
          400: "#38b2f8",
          500: "#007dfc",
          600: "#0062f5",
          700: "#0050d8",
          800: "#0642ad",
          900: "#0b3987",
        },
        deepNavy: "#0a192f",
      },
      boxShadow: {
        "soft-card": "0 12px 36px -8px rgba(15, 23, 42, 0.06), 0 4px 12px -2px rgba(15, 23, 42, 0.03)",
        "hover-card": "0 24px 50px -10px rgba(0, 98, 245, 0.15), 0 8px 24px -4px rgba(15, 23, 42, 0.06)",
        "device-3d": "0 45px 95px -20px rgba(15, 23, 42, 0.38), 0 20px 45px -15px rgba(0, 98, 245, 0.18)",
        "phone-3d": "0 35px 75px -15px rgba(15, 23, 42, 0.45), 0 15px 30px -10px rgba(0, 98, 245, 0.22)",
        "glow-cta": "0 18px 40px -8px rgba(0, 98, 245, 0.35)",
      },
    },
  },
} satisfies Config;