/** @type {import('tailwindcss').Config} */
export default {
  content: [
    './index.html',
    './src/**/*.{js,ts,jsx,tsx}',
    './src/components/**/*.{js,ts,jsx,tsx}',
    './src/pages/**/*.{js,ts,jsx,tsx}',
    './src/layouts/**/*.{js,ts,jsx,tsx}',
    './src/App.tsx',
  ],
  theme: {
    extend: {
      fontFamily: {
        inter: ['Inter', 'ui-sans-serif', 'system-ui'],
      },
      backgroundImage: {
        brandGradient: 'linear-gradient(135deg, var(--c-boxes), var(--c-other))',
        brandGlass: 'linear-gradient(180deg, color-mix(in hsl, var(--c-background-light), transparent 30%), color-mix(in hsl, black, transparent 70%))'
      },
      colors: {
        brand: {
          bg: 'var(--c-background)',
          bgLight: 'var(--c-background-light)',
          boxes: 'var(--c-boxes)',
          lines: 'var(--c-lines)',
          text: 'var(--c-text)',
          accent: 'var(--c-other)',
        }
      },
      boxShadow: {
        glow: '0 0 24px -6px rgba(112,162,136,0.35)',
      }
    }
  },
  plugins: [],
};