/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./*.html"],
  darkMode: "class",
  theme: {
    extend: {
      colors: {
        primary: {
          DEFAULT: "#0060fe",
          hover: "#0052d6",
          light: "#e8f0ff",
        },
        ice: { 100: "#f0f6ff", 200: "#ddeeff" },
        silver: { 100: "#f1f5f9", 200: "#e2e8f0", 300: "#cbd5e1" },
      },
      fontFamily: {
        sans: ["Poppins", "sans-serif"],
        heading: ["Poppins", "sans-serif"],
        body: ["Roboto", "sans-serif"],
        serif: ["Playfair Display", "serif"],
      },
      boxShadow: {
        nav: "0 4px 24px -4px rgba(15,23,42,0.08)",
        card: "0 2px 16px rgba(15,23,42,0.06)",
        glow: "0 8px 32px rgba(0,96,254,0.22)",
        mega: "0 20px 60px -10px rgba(15,23,42,0.15)",
      },
      animation: {
        fadeIn: "fadeIn 0.2s ease-out",
        slideDown: "slideDown 0.25s ease-out",
      },
      keyframes: {
        fadeIn: { "0%": { opacity: "0" }, "100%": { opacity: "1" } },
        slideDown: {
          "0%": { opacity: "0", transform: "translateY(-8px)" },
          "100%": { opacity: "1", transform: "translateY(0)" },
        },
      },
    },
  },
  plugins: [],
}