import type { Config } from 'tailwindcss'

export default {
  content: ['./index.html', './src/**/*.{ts,tsx}'],
  darkMode: ['selector', '[data-mantine-color-scheme="dark"]'],
  theme: {
    extend: {
      colors: {
        app: {
          bg: 'var(--tc-color-app-bg)',
          'bg-strong': 'var(--tc-color-app-bg-strong)',
        },
        surface: {
          DEFAULT: 'var(--tc-color-surface)',
          raised: 'var(--tc-color-surface-raised)',
          subtle: 'var(--tc-color-surface-subtle)',
          inline: 'var(--tc-color-surface-inline)',
          'inline-weak': 'var(--tc-color-surface-inline-weak)',
        },
        border: {
          subtle: 'var(--tc-color-border-subtle)',
          strong: 'var(--tc-color-border-strong)',
        },
        text: {
          primary: 'var(--tc-color-text-primary)',
          secondary: 'var(--tc-color-text-secondary)',
          tertiary: 'var(--tc-color-text-tertiary)',
        },
        accent: {
          blue: 'var(--tc-color-accent-blue)',
          cyan: 'var(--tc-color-accent-cyan)',
        },
        success: 'var(--tc-color-success)',
        warning: 'var(--tc-color-warning)',
        danger: 'var(--tc-color-danger)',
        info: 'var(--tc-color-info)',
        nomi: {
          bg: 'var(--nomi-bg)',
          paper: 'var(--nomi-paper)',
          ink: 'var(--nomi-ink)',
          'ink-80': 'var(--nomi-ink-80)',
          'ink-60': 'var(--nomi-ink-60)',
          'ink-40': 'var(--nomi-ink-40)',
          'ink-30': 'var(--nomi-ink-30)',
          'ink-20': 'var(--nomi-ink-20)',
          'ink-10': 'var(--nomi-ink-10)',
          'ink-05': 'var(--nomi-ink-05)',
          line: 'var(--nomi-line)',
          'line-soft': 'var(--nomi-line-soft)',
          accent: 'var(--nomi-accent)',
          'accent-soft': 'var(--nomi-accent-soft)',
        },
        workbench: {
          bg: 'var(--workbench-bg)',
          surface: 'var(--workbench-surface)',
          'surface-solid': 'var(--workbench-surface-solid)',
          'surface-soft': 'var(--workbench-surface-soft)',
          border: 'var(--workbench-border)',
          'border-soft': 'var(--workbench-border-soft)',
          'border-strong': 'var(--workbench-border-strong)',
          ink: 'var(--workbench-ink)',
          muted: 'var(--workbench-muted)',
          'muted-soft': 'var(--workbench-muted-soft)',
          accent: 'var(--workbench-accent)',
          'accent-soft': 'var(--workbench-accent-soft)',
          success: 'var(--workbench-success)',
          danger: 'var(--workbench-danger)',
          hover: 'var(--workbench-hover)',
          pressed: 'var(--workbench-pressed)',
          overlay: 'var(--workbench-overlay)',
          backdrop: 'var(--workbench-backdrop)',
          focus: 'var(--workbench-focus)',
          'code-bg': 'var(--workbench-code-bg)',
          'code-ink': 'var(--workbench-code-ink)',
        },
        handle: {
          image: 'var(--handle-color-image)',
          audio: 'var(--handle-color-audio)',
          subtitle: 'var(--handle-color-subtitle)',
          video: 'var(--handle-color-video)',
          character: 'var(--handle-color-character)',
          any: 'var(--handle-color-any)',
          surface: 'var(--handle-surface)',
          border: 'var(--handle-border)',
        },
      },
      borderRadius: {
        sharp: 'var(--tc-radius-sharp)',
        field: 'var(--tc-radius-field)',
        panel: 'var(--tc-radius-panel)',
        modal: 'var(--tc-radius-modal)',
        pill: 'var(--tc-radius-pill)',
        nomi: 'var(--nomi-radius)',
        'nomi-sm': 'var(--nomi-radius-sm)',
        'nomi-lg': 'var(--nomi-radius-lg)',
        workbench: 'var(--workbench-radius)',
        'workbench-control': 'var(--workbench-control-radius)',
      },
      spacing: {
        'tc-1': 'var(--tc-space-1)',
        'tc-2': 'var(--tc-space-2)',
        'tc-3': 'var(--tc-space-3)',
        'tc-4': 'var(--tc-space-4)',
        'tc-5': 'var(--tc-space-5)',
        'tc-6': 'var(--tc-space-6)',
      },
      fontSize: {
        micro: 'var(--tc-font-size-micro)',
        body: 'var(--tc-font-size-body)',
        'body-sm': 'var(--tc-font-size-body-sm)',
        caption: 'var(--tc-font-size-caption)',
        title: 'var(--tc-font-size-title)',
      },
      fontFamily: {
        'nomi-sans': 'var(--nomi-font-sans)',
        'nomi-display': 'var(--nomi-font-display)',
        'nomi-mono': 'var(--nomi-font-mono)',
      },
      boxShadow: {
        'nomi-sm': 'var(--nomi-shadow-sm)',
        'nomi-md': 'var(--nomi-shadow-md)',
        'nomi-lg': 'var(--nomi-shadow-lg)',
        'workbench-sm': 'var(--workbench-shadow-sm)',
        'workbench-md': 'var(--workbench-shadow-md)',
        'workbench-pop': 'var(--workbench-shadow-pop)',
      },
      transitionTimingFunction: {
        'nomi-fast': 'var(--nomi-transition-fast)',
      },
      keyframes: {
        shimmer: {
          '100%': { transform: 'translateX(100%)' },
        },
        sheen: {
          '0%': { transform: 'translateX(-60%) rotate(12deg)', opacity: '0.35' },
          '50%': { transform: 'translateX(0%) rotate(12deg)', opacity: '0.55' },
          '100%': { transform: 'translateX(60%) rotate(12deg)', opacity: '0.35' },
        },
        'slide-right': {
          '0%': { left: '-30%' },
          '100%': { left: '100%' },
        },
        'fade-in-up': {
          from: { opacity: '0', transform: 'translateY(4px)' },
          to: { opacity: '1', transform: 'translateY(0)' },
        },
        'status-pulse': {
          '0%, 100%': { transform: 'scale(0.92)', opacity: '0.72' },
          '50%': { transform: 'scale(1.1)', opacity: '1' },
        },
        'aura-pulse': {
          '0%, 100%': { transform: 'scale(0.99) translate3d(-2px,-1px,0) rotate(-0.5deg)', filter: 'blur(32px) saturate(1.18) hue-rotate(-6deg)', opacity: '0.9' },
          '25%': { transform: 'scale(1.015) translate3d(2px,-1px,0) rotate(1deg)', filter: 'blur(35px) saturate(1.26) hue-rotate(10deg)', opacity: '0.86' },
          '50%': { transform: 'scale(1.01) translate3d(-1px,3px,0) rotate(-1deg)', filter: 'blur(34px) saturate(1.22) hue-rotate(-4deg)', opacity: '0.9' },
          '75%': { transform: 'scale(1.005) translate3d(1px,2px,0) rotate(0.5deg)', filter: 'blur(33px) saturate(1.2) hue-rotate(4deg)', opacity: '0.88' },
        },
        'thinking-breathe': {
          '0%, 100%': { opacity: '0.38', transform: 'translate3d(0,0,0) scale(0.96)' },
          '50%': { opacity: '0.78', transform: 'translate3d(10%,0,0) scale(1.08)' },
        },
        'bubble-breath': {
          '0%, 100%': { transform: 'scale(0.96)' },
          '50%': { transform: 'scale(1.04)' },
        },
        'bubble-halo': {
          '0%, 100%': { transform: 'scale(0.92)', opacity: '0.62' },
          '50%': { transform: 'scale(1.1)', opacity: '0.96' },
        },
      },
      animation: {
        shimmer: 'shimmer 1.2s ease-in-out infinite',
        sheen: 'sheen 1.2s ease-in-out infinite',
        'slide-right': 'slide-right 1.8s ease-in-out infinite',
        'fade-in-up': 'fade-in-up 260ms ease forwards',
        'status-pulse': 'status-pulse 1.6s ease-in-out infinite',
        'aura-pulse': 'aura-pulse 2.6s cubic-bezier(0.42,0,0.38,1) infinite',
        'thinking-breathe': 'thinking-breathe 2.8s ease-in-out infinite',
        'bubble-breath': 'bubble-breath 2.8s ease-in-out infinite',
        'bubble-halo': 'bubble-halo 2.8s ease-in-out infinite',
      },
    },
  },
  plugins: [],
} satisfies Config
