/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./index.html', './src/**/*.{ts,tsx,js,jsx}'],
  prefix: 'ask-',
  theme: {
    extend: {
      colors: {
        background: 'rgb(var(--ask-color-background-rgb) / <alpha-value>)',
        surface: 'rgb(var(--ask-color-surface-rgb) / <alpha-value>)',
        surfaceAlt: 'rgb(var(--ask-color-surface-alt-rgb) / <alpha-value>)',
        surface2: 'rgb(var(--ask-color-surface-2-rgb) / <alpha-value>)',
        border: 'rgb(var(--ask-color-border-rgb) / <alpha-value>)',
        borderSubtle: 'rgb(var(--ask-color-border-subtle-rgb) / <alpha-value>)',
        borderStrong: 'rgb(var(--ask-color-border-strong-rgb) / <alpha-value>)',
        text: 'rgb(var(--ask-color-text-rgb) / <alpha-value>)',
        textMain: 'rgb(var(--ask-color-text-main-rgb) / <alpha-value>)',
        textMuted: 'rgb(var(--ask-color-text-muted-rgb) / <alpha-value>)',
        textStrong: 'rgb(var(--ask-color-text-strong-rgb) / <alpha-value>)',
        textSubtle: 'rgb(var(--ask-color-text-subtle-rgb) / <alpha-value>)',
        primary: 'rgb(var(--ask-color-primary-rgb) / <alpha-value>)',
        primarySoft: 'var(--ask-color-primary-soft)',
        accent: 'rgb(var(--ask-color-accent-rgb) / <alpha-value>)',
        success: 'rgb(var(--ask-color-success-rgb) / <alpha-value>)',
        warning: 'rgb(var(--ask-color-warning-rgb) / <alpha-value>)',
        danger: 'rgb(var(--ask-color-danger-rgb) / <alpha-value>)',
      },
      borderRadius: {
        xl: '0.9rem',
        '2xl': '1.2rem',
      },
      boxShadow: {
        soft: '0 18px 40px rgba(15, 23, 42, 0.12)',
      },
    },
  },
  plugins: [],
};
