import type { Config } from 'tailwindcss';

/*
 * MBtaller — sistema de diseño v1.0
 *
 * Varias escalas (radios, sombras, pesos tipográficos) se redefinen a propósito
 * en vez de extenderse. El código de las pantallas ya usa `rounded-3xl`,
 * `shadow-2xl` y `font-extrabold` en cientos de lugares; redefiniendo la escala
 * esos nombres siguen funcionando pero producen un resultado contenido, y no
 * hace falta tocar cada archivo. Si mañana alguien escribe `font-extrabold`
 * por costumbre, el resultado sigue siendo correcto.
 */
const config: Config = {
  darkMode: ['class'],
  content: [
    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    extend: {
      colors: {
        border: 'hsl(var(--border))',
        'border-strong': 'hsl(var(--border-strong))',
        input: 'hsl(var(--input))',
        ring: 'hsl(var(--ring))',
        background: 'hsl(var(--background))',
        foreground: 'hsl(var(--foreground))',
        surface: {
          DEFAULT: 'hsl(var(--surface))',
          sunken: 'hsl(var(--surface-sunken))',
        },
        'subtle-foreground': 'hsl(var(--subtle-foreground))',
        primary: {
          DEFAULT: 'hsl(var(--primary))',
          foreground: 'hsl(var(--primary-foreground))',
          soft: 'hsl(var(--primary-soft))',
        },
        secondary: {
          DEFAULT: 'hsl(var(--secondary))',
          foreground: 'hsl(var(--secondary-foreground))',
        },
        destructive: {
          DEFAULT: 'hsl(var(--destructive))',
          foreground: 'hsl(var(--destructive-foreground))',
          soft: 'hsl(var(--destructive-soft))',
        },
        success: {
          DEFAULT: 'hsl(var(--success))',
          foreground: 'hsl(var(--success-foreground))',
          soft: 'hsl(var(--success-soft))',
        },
        warning: {
          DEFAULT: 'hsl(var(--warning))',
          foreground: 'hsl(var(--warning-foreground))',
          soft: 'hsl(var(--warning-soft))',
        },
        muted: {
          DEFAULT: 'hsl(var(--muted))',
          foreground: 'hsl(var(--muted-foreground))',
        },
        accent: {
          DEFAULT: 'hsl(var(--accent))',
          foreground: 'hsl(var(--accent-foreground))',
        },
        popover: {
          DEFAULT: 'hsl(var(--popover))',
          foreground: 'hsl(var(--popover-foreground))',
        },
        card: {
          DEFAULT: 'hsl(var(--card))',
          foreground: 'hsl(var(--card-foreground))',
        },
        // Colores de estado de una OT. Es el único lugar donde el color carga
        // significado, así que sobrevive al rediseño monocromático.
        estado: {
          borrador: '#71717a',
          en_proceso: '#b45309',
          cotizada: '#6d28d9',
          aprobada: '#047857',
          terminada: '#0e7490',
          facturada: '#4338ca',
          entregada: '#15803d',
        },
      },

      /*
       * Tres radios reales: 8px para controles, 12px para tarjetas, 20px para
       * hojas y diálogos. Los alias mayores se aplanan para que `rounded-3xl`
       * no produzca la burbuja de 24px que traía el diseño anterior.
       */
      borderRadius: {
        none: '0px',
        sm: '6px',
        DEFAULT: '8px',
        md: '8px',
        lg: '12px',
        xl: '12px',
        '2xl': '16px',
        '3xl': '20px',
        full: '9999px',
      },

      /*
       * La profundidad la dan los bordes hairline, no las sombras. Se conserva
       * la escala completa de nombres, pero todas son suaves: `shadow-2xl` ya
       * no es una nube de 70px de desenfoque.
       */
      boxShadow: {
        none: 'none',
        sm: '0 1px 2px 0 rgb(16 24 40 / 0.04)',
        DEFAULT: '0 1px 3px 0 rgb(16 24 40 / 0.06), 0 1px 2px -1px rgb(16 24 40 / 0.04)',
        md: '0 2px 8px -2px rgb(16 24 40 / 0.08), 0 1px 2px -1px rgb(16 24 40 / 0.04)',
        lg: '0 8px 20px -6px rgb(16 24 40 / 0.10), 0 2px 6px -2px rgb(16 24 40 / 0.05)',
        xl: '0 12px 32px -10px rgb(16 24 40 / 0.12), 0 4px 8px -4px rgb(16 24 40 / 0.05)',
        '2xl': '0 20px 48px -16px rgb(16 24 40 / 0.16)',
        inner: 'inset 0 1px 2px 0 rgb(16 24 40 / 0.05)',
      },

      /*
       * Peso máximo 600 para texto y 700 para titulares. `font-extrabold` y
       * `font-black`, que aparecían 91 veces, dejan de gritar sin necesidad de
       * editar cada pantalla.
       */
      fontWeight: {
        normal: '400',
        medium: '500',
        semibold: '600',
        bold: '600',
        extrabold: '700',
        black: '700',
      },

      fontFamily: {
        sans: [
          'var(--font-sans)',
          '-apple-system',
          'BlinkMacSystemFont',
          'Segoe UI',
          'system-ui',
          'sans-serif',
        ],
      },

      fontSize: {
        // Escala corta y deliberada: 6 tamaños cubren todo el sistema.
        xs: ['0.75rem', { lineHeight: '1rem' }],
        sm: ['0.875rem', { lineHeight: '1.375rem' }],
        base: ['1rem', { lineHeight: '1.5rem' }],
        lg: ['1.0625rem', { lineHeight: '1.5rem' }],
        xl: ['1.25rem', { lineHeight: '1.75rem' }],
        '2xl': ['1.5rem', { lineHeight: '2rem' }],
        '3xl': ['1.875rem', { lineHeight: '2.25rem' }],
        '4xl': ['2.25rem', { lineHeight: '2.5rem' }],
      },

      transitionTimingFunction: {
        // Curva de salida al estilo de iOS: rápida al inicio, suave al final.
        out: 'cubic-bezier(0.16, 1, 0.3, 1)',
      },

      transitionDuration: {
        DEFAULT: '180ms',
      },

      keyframes: {
        'fade-in': {
          from: { opacity: '0' },
          to: { opacity: '1' },
        },
        'sheet-up': {
          from: { opacity: '0', transform: 'translateY(12px)' },
          to: { opacity: '1', transform: 'translateY(0)' },
        },
        shimmer: {
          from: { backgroundPosition: '150% 0' },
          to: { backgroundPosition: '-150% 0' },
        },
      },

      animation: {
        'fade-in': 'fade-in 180ms cubic-bezier(0.16, 1, 0.3, 1)',
        'sheet-up': 'sheet-up 220ms cubic-bezier(0.16, 1, 0.3, 1)',
        shimmer: 'shimmer 1.8s ease-in-out infinite',
      },
    },
  },
  plugins: [require('tailwindcss-animate')],
};

export default config;