/**
 * Shared Tailwind theme configuration for solidtime
 * This configuration is used by both the main solidtime app and the desktop app
 *
 * Note: fontFamily is intentionally omitted here as it differs between apps:
 * - Main app uses 'Inter'
 * - Desktop app uses 'Outfit'
 * Each app should override the fontFamily in their own config.
 */
export const solidtimeTheme = {
    boxShadow: {
        card: 'var(--theme-shadow-card)',
        dropdown: 'var(--theme-shadow-dropdown)',
    },
    containers: {
        '2xs': '16rem',
    },
    fontSize: {
        '2xs': ['0.625rem', { lineHeight: '0.75rem' }],
        xs: ['0.75rem', { lineHeight: '1rem' }],
        sm: ['0.8125rem', { lineHeight: '1.125rem' }],
        base: ['0.9375rem', { lineHeight: '1.375rem' }],
        lg: ['1.125rem', { lineHeight: '1.5rem' }],
        xl: ['1.25rem', { lineHeight: '1.75rem' }],
        '2xl': ['1.5rem', { lineHeight: '2rem' }],
        '3xl': ['2.25rem', { lineHeight: '2.5rem' }],
    },
    colors: {
        ring: 'var(--ring)',
        primary: {
            DEFAULT: 'var(--primary)',
            foreground: 'var(--primary-foreground)',
        },
        secondary: {
            DEFAULT: 'var(--secondary)',
            foreground: 'hsl(var(--secondary-foreground))',
        },
        tertiary: 'var(--color-bg-tertiary)',
        quaternary: 'var(--color-bg-quaternary)',
        background: 'var(--background)',
        'text-primary': 'var(--color-text-primary)',
        'text-secondary': 'var(--color-text-secondary)',
        'text-tertiary': 'var(--color-text-tertiary)',
        'text-quaternary': 'var(--color-text-quaternary)',
        'border-primary': 'var(--color-border-primary)',
        'border-secondary': 'var(--color-border-secondary)',
        'border-tertiary': 'var(--color-border-tertiary)',
        'default-background': 'var(--theme-color-default-background)',
        'default-background-separator': 'var(--theme-color-default-background-separator)',
        'row-background': 'var(--theme-color-row-background)',
        'card-background': 'var(--theme-color-card-background)',
        'card-background-active': 'var(--theme-color-card-background-active)',
        'card-background-separator': 'var(--theme-color-card-background-separator)',
        'card-border': 'var(--theme-color-card-border)',
        'card-border-active': 'var(--theme-color-card-border-active)',
        muted: {
            DEFAULT: 'var(--muted)',
            foreground: 'var(--muted-foreground)',
        },
        'tab-background': 'var(--theme-color-tab-background)',
        'tab-background-active': 'var(--theme-color-tab-background-active)',
        'tab-border': 'var(--theme-color-tab-border)',
        'icon-default': 'var(--theme-color-icon-default)',
        'icon-active': 'var(--theme-color-icon-active)',
        'menu-active': 'var(--theme-color-menu-active)',
        'input-border': 'var(--theme-color-input-border)',
        'input-border-active': 'var(--color-input-border-active)',
        'input-background': 'var(--theme-color-input-background)',
        'button-secondary-background': 'var(--theme-button-secondary-background)',
        'button-secondary-background-hover': 'var(--theme-button-secondary-background-active)',
        'button-secondary-border': 'var(--theme-color-card-border)',
        'row-separator': 'var(--theme-color-row-separator-background)',
        'row-heading-background': 'var(--theme-color-row-heading-background)',
        'row-heading-border': 'var(--theme-color-row-heading-border)',
        accent: {
            '50': 'rgba(var(--color-accent-50), <alpha-value>)',
            '100': 'rgba(var(--color-accent-100), <alpha-value>)',
            '200': 'rgba(var(--color-accent-200), <alpha-value>)',
            '300': 'rgba(var(--color-accent-300), <alpha-value>)',
            '400': 'rgba(var(--color-accent-400), <alpha-value>)',
            '500': 'rgba(var(--color-accent-500), <alpha-value>)',
            '600': 'rgba(var(--color-accent-600), <alpha-value>)',
            '700': 'rgba(var(--color-accent-700), <alpha-value>)',
            '800': 'rgba(var(--color-accent-800), <alpha-value>)',
            '900': 'rgba(var(--color-accent-900), <alpha-value>)',
            '950': 'rgba(var(--color-accent-950), <alpha-value>)',
            DEFAULT: 'var(--accent)',
            foreground: 'var(--accent-foreground)',
        },
        'button-primary-background': 'var(--theme-color-button-primary-background)',
        'button-primary-background-hover': 'var(--theme-color-button-primary-background-hover)',
        'button-primary-border': 'var(--theme-color-button-primary-border)',
        'button-primary-text': 'var(--theme-color-button-primary-text)',
        'input-select-active': 'var(--theme-color-input-select-active)',
        'input-select-active-hover': 'var(--theme-color-input-select-active-hover)',
        foreground: 'var(--foreground)',
        card: {
            DEFAULT: 'var(--card))',
            foreground: 'var(--card-foreground))',
        },
        popover: {
            DEFAULT: 'var(--popover)',
            foreground: 'var(--popover-foreground)',
            border: 'var(--popover-border)',
        },
        destructive: {
            DEFAULT: 'hsl(var(--destructive))',
            foreground: 'var(--destructive-foreground)',
        },
        border: 'var(--border)',
        input: 'var(--input)',
        chart: {
            '1': 'hsl(var(--chart-1))',
            '2': 'hsl(var(--chart-2))',
            '3': 'hsl(var(--chart-3))',
            '4': 'hsl(var(--chart-4))',
            '5': 'hsl(var(--chart-5))',
        },
    },
    borderRadius: {
        lg: 'var(--radius)',
        md: 'calc(var(--radius) - 2px)',
        sm: 'calc(var(--radius) - 4px)',
    },
};
