/** @type {import('tailwindcss').Config} */

const colors = require('tailwindcss/colors');

export default {
    presets: [
        require("./vendor/wireui/wireui/tailwind.config.js"),
        require("./vendor/power-components/livewire-powergrid/tailwind.config.js"),
    ],
    content: [
        './resources/views/**/*.blade.php',
        './resources/js/**/*.js',

        './app/Livewire/**/*Table.php',
        './vendor/power-components/livewire-powergrid/resources/views/**/*.php',
        './vendor/power-components/livewire-powergrid/src/Themes/Tailwind.php',

        './vendor/wireui/wireui/src/*.php',
        './vendor/wireui/wireui/ts/**/*.ts',
        './vendor/wireui/wireui/src/WireUi/**/*.php',
        './vendor/wireui/wireui/src/Components/**/*.php',
    ],
    darkMode: 'class',
    theme: {
        extend: {
            colors: {
                primary: {
                    '50': '#fffbea',
                    '100': '#fff2c5',
                    '200': '#ffe685',
                    '300': '#ffd246',
                    '400': '#ffbd1b',
                    '500': '#ff9900',
                    '600': '#e27200',
                    '700': '#bb4d02',
                    '800': '#983b08',
                    '900': '#7c310b',
                    '950': '#481700',
                },
                secondary: colors.gray,
                positive: colors.emerald,
                negative: colors.red,
                warning: colors.amber,
                info: colors.blue,

                "pg-primary": {
                    50: "#F0F0F0",
                    100: "#E3E3E3",
                    200: "#C7C7C7",
                    300: "#A8A8A8",
                    400: "#8C8C8C",
                    500: "#707070",
                    600: "#545454",
                    700: "#383838",
                    800: "#1B1B1B",
                    900: "#0D0D0D",
                    950: "#080808"
                },
                gray: {
                    50: '#F9FAFB',
                    100: '#F3F4F6',
                    200: '#E5E7EB',
                    300: '#BFC4CD',
                    400: '#9CA3AF',
                    500: '#6B7280',
                    600: '#4B5563',
                    700: '#374151',
                    800: '#1F2937',
                    900: '#111827',
                    950: '#030712',
                },
                violet: {
                    50: '#F1EEFF',
                    100: '#E6E1FF',
                    200: '#D2CBFF',
                    300: '#B7ACFF',
                    400: '#9C8CFF',
                    500: '#8470FF',
                    600: '#755FF8',
                    700: '#5D47DE',
                    800: '#4634B1',
                    900: '#2F227C',
                    950: '#1C1357',
                },
                sky: {
                    50: '#E3F3FF',
                    100: '#D1ECFF',
                    200: '#B6E1FF',
                    300: '#A0D7FF',
                    400: '#7BC8FF',
                    500: '#67BFFF',
                    600: '#56B1F3',
                    700: '#3193DA',
                    800: '#1C71AE',
                    900: '#124D79',
                    950: '#0B324F',
                },
                green: {
                    50: '#D2FFE2',
                    100: '#B1FDCD',
                    200: '#8BF0B0',
                    300: '#67E294',
                    400: '#4BD37D',
                    500: '#3EC972',
                    600: '#34BD68',
                    700: '#239F52',
                    800: '#15773A',
                    900: '#0F5429',
                    950: '#0A3F1E',
                },
                red: {
                    50: '#FFE8E8',
                    100: '#FFD1D1',
                    200: '#FFB2B2',
                    300: '#FF9494',
                    400: '#FF7474',
                    500: '#FF5656',
                    600: '#FA4949',
                    700: '#E63939',
                    800: '#C52727',
                    900: '#941818',
                    950: '#600F0F',
                },
                yellow: {
                    50: '#FFF2C9',
                    100: '#FFE7A0',
                    200: '#FFE081',
                    300: '#FFD968',
                    400: '#F7CD4C',
                    500: '#F0BB33',
                    600: '#DFAD2B',
                    700: '#BC9021',
                    800: '#816316',
                    900: '#4F3D0E',
                    950: '#342809',
                },
            },
            fontFamily: {
                sans: [
                    'Inconsolata',
                    'sans-serif'
                ],
                mono: [
                    'Inconsolata',
                    'sans-serif'
                ],
                article: [
                    'Karla',
                    'sans-serif'
                ],
                inter: ['Inter', 'sans-serif'],
            },
            fontSize: {
                xs: ['0.75rem', {lineHeight: '1.5'}],
                sm: ['0.875rem', {lineHeight: '1.5715'}],
                base: ['1rem', {lineHeight: '1.5', letterSpacing: '-0.01em'}],
                lg: ['1.125rem', {lineHeight: '1.5', letterSpacing: '-0.01em'}],
                xl: ['1.25rem', {lineHeight: '1.5', letterSpacing: '-0.01em'}],
                '2xl': ['1.5rem', {lineHeight: '1.33', letterSpacing: '-0.01em'}],
                '3xl': ['1.88rem', {lineHeight: '1.33', letterSpacing: '-0.01em'}],
                '4xl': ['2.25rem', {lineHeight: '1.25', letterSpacing: '-0.02em'}],
                '5xl': ['3rem', {lineHeight: '1.25', letterSpacing: '-0.02em'}],
                '6xl': ['3.75rem', {lineHeight: '1.2', letterSpacing: '-0.02em'}],
            },
            screens: {
                xs: '480px',
            },
            borderWidth: {
                3: '3px',
            },
            minWidth: {
                36: '9rem',
                44: '11rem',
                56: '14rem',
                60: '15rem',
                72: '18rem',
                80: '20rem',
            },
            maxWidth: {
                '8xl': '88rem',
                '9xl': '96rem',
            },
            zIndex: {
                60: '60',
            },
        },
    },
    plugins: [
        require('@tailwindcss/forms'),
    ],
    safelist: [
        'w-96',
        'group',
        'aspect-h-7',
        'aspect-w-10',
        'pointer-events-none',
        'object-cover',
        'group-hover:opacity-75',
    ],
}