/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        primary: {
          50: '#f0fcfc',
          100: '#ccf5f5',
          200: '#99ebeb',
          300: '#66e0e0',
          400: '#00A3A3', // Auxiliary Light
          500: '#008C8C', // Mars Green (Base)
          600: '#006666', // Auxiliary Dark
          700: '#004d4d',
          800: '#003333',
          900: '#001a1a',
        },
        mars: {
          50: '#f0fcfc',
          100: '#ccf5f5',
          200: '#99ebeb',
          300: '#66e0e0',
          400: '#00A3A3',
          500: '#008C8C',
          600: '#006666',
          700: '#004d4d',
          800: '#003333',
          900: '#001a1a',
        }
      },
      fontFamily: {
        sans: ['Inter', 'ui-sans-serif', 'system-ui', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Arial', 'Noto Sans', 'sans-serif', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'],
      },
      spacing: {
        // Ensuring 8px grid alignment (Tailwind defaults are already 4px based, so p-2=8px, p-4=16px)
      }
    },
  },
  plugins: [],
}