/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./src/views/**/*.ejs', './public/js/**/*.js'],
  theme: {
    extend: {
      colors: {
        ink: '#171717',
        body: '#4d4d4d',
        mute: '#888888',
        hairline: '#ebebeb',
        'hairline-strong': '#a1a1a1',
        canvas: '#ffffff',
        'canvas-soft': '#fafafa',
        'canvas-soft-2': '#f5f5f5',
        link: '#0070f3',
        'link-deep': '#0761d1',
        'link-bg-soft': '#d3e5ff',
        success: '#0070f3',
        error: '#ee0000',
        'error-soft': '#f7d4d6',
        'error-deep': '#c50000',
        warning: '#f5a623',
        'warning-soft': '#ffefcf',
        'warning-deep': '#ab570a',
      },
      fontFamily: {
        sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'],
        mono: ['JetBrains Mono', 'ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'monospace'],
      },
      borderRadius: {
        sm: '6px',
        md: '8px',
        lg: '12px',
        xl: '16px',
        pill: '100px',
      },
      boxShadow: {
        'level-1': 'inset 0 0 0 1px rgba(0,0,0,0.08)',
        'level-2': '0px 1px 1px rgba(0,0,0,0.02), 0px 2px 2px rgba(0,0,0,0.04), inset 0 0 0 1px rgba(0,0,0,0.08)',
        'level-3': '0px 2px 2px rgba(0,0,0,0.04), 0px 8px 8px -8px rgba(0,0,0,0.04), inset 0 0 0 1px rgba(0,0,0,0.08)',
        'level-4': '0px 2px 2px rgba(0,0,0,0.04), 0px 8px 16px -4px rgba(0,0,0,0.04), inset 0 0 0 1px rgba(0,0,0,0.08)',
      },
      spacing: {
        '4.5': '18px',
      },
    },
  },
  plugins: [],
};
