
interface Spacing {
    space_2: number;
    space_4: number;
    space_8: number;
    space_10: number;
    space_12: number;
    space_15: number;
    space_16: number;
    space_18: number;
    space_20: number;
    space_24: number;
    space_28: number;
    space_30: number;
    space_32: number;
    space_36: number;
}

export const SPACING: Spacing = {
    space_2: 2,
    space_4: 4,
    space_8: 8,
    space_10: 10,
    space_12: 12,
    space_15: 15,
    space_16: 16,
    space_18: 18,
    space_20: 20,
    space_24: 24,
    space_28: 28,
    space_30: 30,
    space_32: 32,
    space_36: 36,
};

interface Color {
    backgroundErrorRed: string;
    borderErrorRed: string;
    backgroundSuccessGreen: string;
    borderSuccessGreen: string;
    primaryOrange: string;
    generalBackgroundBlack: string;
    primaryDarkGrey: string;
    secondaryDarkGrey: string;
    primaryGrey: string;
    secondaryGrey: string;
    primaryLightGrey: string;
    secondaryLightGrey: string;
    primaryWhite: string;
    primaryBlackRGBA: string;
    secondaryBlackRGBA: string;
    borderContainerGrayRGBA: string;
    backgroundInputGrayRGBA: string;
    backgroundErrorBackendContainerRGBA: string;
    borderErrorBackgroundBackendRed: string;
    requirementCompletedGreen: string;
    requirementUncompletedRed: string;
    backgroundButtonGreen: string;
    deleteButtonRed: string;
}


export const COLORS: Color = {
    backgroundErrorRed: '#d9534f',
    borderErrorRed: '#c9302c',
    backgroundSuccessGreen: '#5dc460',
    borderSuccessGreen: '#146c43',
    primaryOrange: '#D17842',
    generalBackgroundBlack: '#0C0F14',
    primaryDarkGrey: '#141921',
    secondaryDarkGrey: '#21262E',
    primaryGrey: '#252A32',
    secondaryGrey: '#252A32',
    primaryLightGrey: '#52555A',
    secondaryLightGrey: '#AEAEAE',
    primaryWhite: '#FFFFFF',
    primaryBlackRGBA: 'rgba(12,15,20,0.5)',
    secondaryBlackRGBA: 'rgba(0,0,0,0.7)',
    borderContainerGrayRGBA: 'rgba(255,255,255,0.3)',
    backgroundInputGrayRGBA: 'rgba(255,255,255,0.1)',
    backgroundErrorBackendContainerRGBA: 'rgba(255, 0, 0, 0.3)',
    borderErrorBackgroundBackendRed: '#ff0000',
    requirementCompletedGreen: '#77dd77',
    requirementUncompletedRed: '#ff6961',
    backgroundButtonGreen: '#94c58c',
    deleteButtonRed: '#ce2029',
};


interface FontSize {
    size_8: number;
    size_10: number;
    size_12: number;
    size_14: number;
    size_15: number;
    size_16: number;
    size_18: number;
    size_20: number;
    size_24: number;
    size_28: number;
    size_30: number;
}

export const FONTSIZE: FontSize = {
    size_8: 8,
    size_10: 10,
    size_12: 12,
    size_14: 14,
    size_15: 15,
    size_16: 16,
    size_18: 18,
    size_20: 20,
    size_24: 24,
    size_28: 28,
    size_30: 30,
};

interface BorderRadius {
    radius_4: number;
    radius_8: number;
    radius_10: number;
    radius_15: number;
    radius_20: number;
    radius_25: number;
}

export const BORDERRADIUS: BorderRadius = {
    radius_4: 4,
    radius_8: 8,
    radius_10: 10,
    radius_15: 15,
    radius_20: 20,
    radius_25: 25,
};
