module.exports = {
  content: [
    './themes/**/layouts/**/*.html',
    './themes/**/assets/js/**/*.js',
    './layouts/**/*.html',
  ],
  theme: {
    extend: {
      screens: {
        'lg': '1060px',
      },
      colors: {
        bg: 'var(--bg)',
        'bg2': 'var(--bg2)',
        surface: 'var(--surface)',
        border: 'var(--border)',
        accent: 'var(--accent)',
        'accent2': 'var(--accent2)',
        'accent-glow': 'var(--accent-glow)',
        text: 'var(--text)',
        'text-dim': 'var(--text-dim)',
        muted: 'var(--muted)',
      },
      fontFamily: {
        body: ['IBM Plex Sans', 'sans-serif'],
        mono: ['JetBrains Mono', 'monospace'],
        oxanium: ['Oxanium', 'monospace'],
      },
      opacity: {
        80: '0.8',
      },
    },
  },
  plugins: [
    require('@tailwindcss/typography'),
  ],
}