/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./index.html",
    "./src/**/*.{html,ts}"
  ],
  darkMode: "class",
  theme: {
    extend: {
      colors: {
        'obs-l-bg-main': '#f8fafc',
        'obs-d-bg-main': '#202123',
        'obs-l-bg-secondary': '#eef2ff',
        'obs-d-bg-secondary': '#2b2d46',
        'obs-l-text-main': '#0f172a',
        'obs-d-text-main': '#e2e8f0',
        'obs-l-text-muted': '#475569',
        'obs-d-text-muted': '#94a3b8',
        'obs-l-border': '#cbd5f5',
        'obs-d-border': '#3f455a',
        'obs-l-accent': '#6366f1',
        'obs-d-accent': '#22d3ee'
      },
      fontFamily: {
        sans: ['Inter', 'Segoe UI', 'system-ui', 'sans-serif'],
        mono: ['JetBrains Mono', 'Fira Code', 'SFMono-Regular', 'Consolas', 'monospace']
      },
      boxShadow: {
        'panel': '0 20px 45px -20px rgba(15, 23, 42, 0.35)'
      },
      backdropBlur: {
        xs: '2px'
      }
    }
  },
  plugins: [
    require('@tailwindcss/forms'),
    require('@tailwindcss/typography')
  ]
};