/** @type {import('tailwindcss').Config} */
function rgb(v) { return `rgb(var(--${v}) / <alpha-value>)`; }

module.exports = {
  content: [
    './app/**/*.{js,jsx,ts,tsx}',
    './components/**/*.{js,jsx,ts,tsx}',
  ],
  theme: {
    extend: {
      colors: {
        bg:        rgb('bg'),
        surface:   rgb('surface'),
        surface2:  rgb('surface2'),
        border:    rgb('border'),
        text:      rgb('text'),
        accent:    rgb('accent'),
        accent2:   rgb('accent2'),
        // Совместимость со старыми классами — gray-* мапим на наши text-*
        gray: {
          100: rgb('text'),
          200: rgb('text-soft'),
          300: rgb('text-soft'),
          400: rgb('text-mute'),
          500: rgb('text-mute'),
          600: rgb('text-mute'),
          700: rgb('border'),
          800: rgb('surface2'),
          900: rgb('surface'),
        },
      },
      fontFamily: {
        sans: ['Inter', 'system-ui', 'sans-serif'],
      },
    },
  },
  plugins: [],
};